PC v MAC webdialog populate

TIG

To recap:
When using checkboxes and radio button toggles in your webdialog html code you can set an item's value attribute to ' true' or ' false' when they are clicked by using a callback e.g.
onclick="if(this.checked)(window.location='skp:itemx@true');else(window.location='skp:itemx@false')
and in the ruby def itemx(checked) you say

if checked=="true"
  js=("document.getElementById(\"itemx\").setAttribute(\"value\",\"true\");")
  @dlg.execute_script(js)
else
  js=("document.getElementById(\"itemx\").setAttribute(\"value\",\"false\");")
  @dlg.execute_script(js)
end
### etc

then when you close the dialog/tool your def deactivate() gets all of the values for the items [using values={} #loop through the list of items...# values[id]=@dlg.get_element_value(id) - it's often better to hash it for later use] and puts them into model [or SUp] as attributes so they are used the next time you open the tool...
You can use the html's onclick= or onChange= to save values from textboxes or the state of 'toggles' like this.
These toggles should be boolean = true/false BUT they behave oddly on different platforms/browsers
The problem arises when you want to auto-set checkboxes and radio buttons at launch, or when some other toggle is changed - e.g. some checkboxes are auto-checked if the parent one has been checked too etc.
Your html should start with all checkboxes unchecked - i.e NO checkbox= property at all in field.
Your code then adds something like
js=("document.getElementById(\"itemx\").setAttribute(\"checked\",\"checked\");") @dlg.execute_script(js) if it's to be checked [this works on all platforms] BUT if it's to be unchecked then for a PC you should use
js=("document.getElementById(\"itemx\").setAttribute(\"checked\",null);") @dlg.execute_script(js) unfortunately on a MAC this get read as true and it'll stay checked! So you need to add the extra line after this
[ruby:1pgs0rem]js=("document.getElementById("itemx").removeAttribute("checked");")
@dlg.execute_script(js)[/ruby:1pgs0rem] this will work on a MAC but fail on most PCs - this way you make it unchecked one way or another !!!
Similarly if you have fields that are disabledif certain toggles are met then you'd expect something similar - it's not quite the same [start with NO [ruby:1pgs0rem]disabled=[/ruby:1pgs0rem] property for any field]...
[ruby:1pgs0rem]js=("document.getElementById("itemx").setAttribute("disabled","disabled");")
@dlg.execute_script(js)[/ruby:1pgs0rem] if it's to be disabled [this works on ALL platforms] BUT if it's to be enabled then for a PC OR a MAC you should use
[ruby:1pgs0rem]js=("document.getElementById("itemx").removeAttribute("disabled");")
@dlg.execute_script(js)[/ruby:1pgs0rem] which works for both platforms this time
So to recap the recap - for toggled settings [ruby:1pgs0rem]checked/radio/disabled[/ruby:1pgs0rem] to become [ruby:1pgs0rem]inactive[/ruby:1pgs0rem] you should use
[ruby:1pgs0rem].setAttribute("checked",null)...[/ruby:1pgs0rem] then [ruby:1pgs0rem].removeAttribute("checked")[/ruby:1pgs0rem] for checkbox or radio
[ruby:1pgs0rem].removeAttribute("disabled")[/ruby:1pgs0rem] for any item - for cross-platform compatibility...
and to enable them [perversely 'disabled' needs to be 'enabled' !!] use
[ruby:1pgs0rem].setAttribute("checked","checked") or .setAttribute("disabled","disabled")[/ruby:1pgs0rem]
for all platforms - the values like "checked" or "disabled" ensure suitability on all platforms and for XHTML too.

Dan Rathbun

Sounds like it's time for a revsion to the "Lost Manual"

@tig said:

To recap:
When using checkboxes and radio button toggles in your webdialog html code you can set an item's value attribute to ' true' or ' false' when they are clicked by using a callback e.g.

onclick="if(this.checked)(window.location='skp:itemx@true');else(window.location='skp:itemx@false')"

why a callback?

I do this all in Js:
%(#8000BF)[onclick="if(this.checked){this.value='1'}else{this.value='0'};"]
or whatever values you want to set them to be (I like logic 0|1 myself.)

I mean if your not going to poll all the control values until a user click's the OK or Close button, it seems to me that the callbacks are added work.

TIG

I appreciate that if the only thing you want to do is 'set' a value [or 'remove' it] you can do it directly in js, BUT I do the callback when it does lots of other things to do too, then the value setting is just part of it - the sample if/else code is a pared down version...

Also I've found that even using =1/=0 for true/false goes wrong in some setups, but "checked"/removing_the_attribute for true/false then works instead...

thomthom

Yes - that is what I do as well - I use the JS onclick event to set the checkbox value to reflect the state of the checkbox.

And this is a great example for using frameworks - with jQuery I just make a live onclick event so all checkboxes created will behave like this. http://api.jquery.com/live/

(untested - didn't have my reference code at hand)
$('input[type=checkbox]').live('click', function() { $( this ).val( $(this).is(':checked').toString() ); });

Not sure if that catches state change caused by keyboard though.

If you don't need continuous update of the checkbox values, but rather at a single event, this works as well:
// Set Checkbox values to reflect checked state so SU Ruby's $('input[type=checkbox]').val( function(index,value){ return $(this).is(':checked').toString() } );

TIG

The question is can you get it to have a checkbox that when it is checked/unchecked [true/false] controls 4 other checkboxes, so that they are all set to be unchecked and disabled if it is unchecked, and if it is checked then they all become enabled and the first one is also ticked by default. I got this working fine on a PC with true/false etc but the MAC version refused to work when resetting from the SKP's attributes on a load etc - that is where I found the checked=null PLUS a follow up remove_checked_attribute and remove_disabled_attribute worked across all platforms...

Dan Rathbun

A few Safari questions:

Does Safari automatically keep it's WebKit up to date?

Did you ask your testers what WebKit version their Safari was using?

Still wondering if this behaviour is a WebKit bug...

TIG

They are such a varied and clueless bunch they almost certainly won't know - I can't press it as they have helped above and beyond the call of duty already.

thomthom

I'll have a look over the weekend. I have access to both PC and Mac.

Dan Rathbun

Well, the next alternative is to post in the WebKit Bugzilla, and see if they fix it or tell you it's the way they want it to work.

Dan Rathbun

@thomthom said:

I'll have a look over the weekend. I have access to both PC and Mac.

ThomThom do me a favour, please.

On the Mac.. check the console output of:
RUBY_VERSION
%(#BF0000)[RUBY_PATCHLEVEL
RUBY_RELEASE_DATE]
RUBY_DESCRIPTION

I wish to know what their output is for the "out-of-the-box" OSX Sketchup.
Also wonder if they changed between ver 6.x and 7.x SU ??

thomthom

@dan rathbun said:

On the Mac.. check the console output of:
RUBY_VERSION
%(#BF0000)[RUBY_PATCHLEVEL
RUBY_RELEASE_DATE]
RUBY_DESCRIPTION

Mac Mini Intel - OSX 10.5
` > PLATFORM
i686-darwin8.10.1

RUBY_VERSION
1.8.5
RUBY_PATCHLEVEL
Error: #<NameError: (eval): uninitialized constant RUBY_PATCHLEVEL>
(eval)
RUBY_RELEASE_DATE
2006-08-25
RUBY_DESCRIPTION
Error: #<NameError: (eval): uninitialized constant RUBY_DESCRIPTION>
(eval)`

thomthom

TIG: I I tried with a simple sample file. This works on both Explorer and Webkit:


<html>
<head>
  <title>Checkbox Test</title>
  <script type="text/javascript">

window.onload = init;

function $(id)
{
  return document.getElementById(id);
}

function init()
{
  $('ch1').onclick = function()
  {
    $('ch2').checked = this.checked;
    $('ch3').checked = this.checked;
    $('ch4').checked = this.checked;
    
    $('ch2').disabled = !this.checked;
    $('ch3').disabled = !this.checked;
    $('ch4').disabled = !this.checked;
  };
}

  </script>
</head>
<body>

<p>
<label for="ch1">Checkbox 1</label>
<input type="checkbox" id="ch1" />
</p>

<fieldset>
  
  <p>
  <label for="ch2">Checkbox 2</label>
  <input type="checkbox" id="ch2" disabled="disabled" />
  </p>
  
  <p>
  <label for="ch3">Checkbox 3</label>
  <input type="checkbox" id="ch3" disabled="disabled" />
  </p>
  
  <p>
  <label for="ch4">Checkbox 4</label>
  <input type="checkbox" id="ch4" disabled="disabled" />
  </p>
  
</fieldset>

</body>
</html>

I tested on PC IE8 and OSX 10.5 SU7.1 Webkit

Zipped HTML test file

TIG

Thomthom - thanks for the example - so it appears that the embedded js solution works consistently but the ruby run-script with .setAttribute() etc doesn't - it's weird ?
I have tested it on my PC and it needed a tweak to do what I actually wanted - here's a version that sets only the first nested checkbox checked when the main one is checked [they all become enabled] - the other two nested checkboxes remain unchecked until you click on them - on unchecking the main one all of the nested ones are unchecked and disabled as required...

<html>
<head>
  <title>Checkbox Test</title>
  <script type="text/javascript">

window.onload = init;

function $(id)
{
  return document.getElementById(id);
}

function init()
{
  $('ch1').onclick = function()
  {
    $('ch2').checked = this.checked;
    if (!this.checked)
      val = this.checked
    else
      val = !this.checked
    $('ch3').checked = val;
    $('ch4').checked = val;
    $('ch2').disabled = !this.checked;
    $('ch3').disabled = !this.checked;
    $('ch4').disabled = !this.checked;
  };
}

  </script>
</head>
<body>

<p>
<label for="ch1">Checkbox 1</label>
<input type="checkbox" id="ch1" />
</p>

<fieldset>
 
  <p>
  <label for="ch2">Checkbox 2</label>
  <input type="checkbox" id="ch2" disabled="disabled" />
  </p>
 
  <p>
  <label for="ch3">Checkbox 3</label>
  <input type="checkbox" id="ch3" disabled="disabled" />
  </p>
 
  <p>
  <label for="ch4">Checkbox 4</label>
  <input type="checkbox" id="ch4" disabled="disabled" />
  </p>
 
</fieldset>

</body>
</html>

All it needs now is some auto-value setting when a checkbox is changed so that these can be read out into Sketchup when needed...

thomthom

@tig said:

Thomthom - thanks for the example - so it appears that the embedded js solution works consistently but the ruby run-script with .setAttribute() etc doesn't - it's weird ?

Your Ruby script calls a JS method that use setAttribute?
Why not just .checked ? I didn't try setAttribute at all, as checked seemed to work on all platforms.

thomthom

@tig said:

All it needs now is some auto-value setting when a checkbox is changed so that these can be read out into Sketchup when needed...


  // Make all checkbox's values reflect their checked state.
  var inputs = document.getElementsByTagName('input');
  for ( i=0; i < inputs.length; i++ )
  {
    input = inputs[i];
    if ( input.getAttribute('type') == 'checkbox' )
    {
      input.onchange = update_checkbox;
      input.onclick = update_checkbox; // for IE
      input.onkeyup = update_checkbox; // for IE
    }
  }
}

function update_checkbox()
{
  this.value = this.checked.toString();
  this.title = this.checked.toString();
}

thomthom

hm.... that did not work under IE...

thomthom

Updated the post.

That should work.

NOTE! the onChange event triggers in IE when the input looses focus - so I attached the same event handler to onClick and onKeyUp to force immediate update. But if you use the this snippet with the other example the two onClick events will override each other and only one will trigger. You'd need to attach the event instead to make both event handlers work.