[Laszlo-dev] Detecting classes

[Rami Ojares / AMG]

Below is the debug output.
At the bottom is the result of clicking one of the "<Pane>" objects in 
the debugger.
So from that I draw the following conclusions.

The argument c (the child) is an object with attributes
- attrs, children (might be missing), class

attrs seems to be an object (curly braces)
children seems to be an array (brackets)
class seems to be something special ( less-than, greater-than) I would 
assume this is class (sorry but I don't know exactly what is the 
distinction between class and object in javascript).

So far so good.
The childClass seems to be always something of the form <...> (ie. class)
Like it was supposed to.

Then I execute the crucial line
childClass.prototype is lz.Pane

But it always returns false...damn.

- rami

DEBUG: c = {attrs: {…, axis: 'x'}, class: <simplelayout>}
DEBUG: childClass = <simplelayout>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 16761035, visible: false}, children: 
[{attrs: {title: 'CALENDAR'}, children: [{attrs: {bgcolor: 8388608, 
width: 50}, children: [{attrs: {font: 'Verdana,Vera,sans-serif', 
fontsize: 12, fontstyle: 'plain', text: $always{parent.width}}, class: 
<anonymous extends='text'>}], class: <view>}], class: <PaneTab>}], 
class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 32896}, children: [{attrs: {title: 'EDIT'}, 
class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 8388608}, children: [{attrs: {title: 
'TEST'}, class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 128}, children: [{attrs: {title: '1'}, 
class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 32896, fixed: true, initWidth: 600}, 
children: [{attrs: {title: '2'}, class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 8388608}, children: [{attrs: {title: '3'}, 
class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 128, visible: false}, children: [{attrs: 
{title: '4'}, class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 32896}, children: [{attrs: {title: '5'}, 
class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: c = {attrs: {bgcolor: 8388608, initWidth: 400}, children: 
[{attrs: {title: '6'}, class: <PaneTab>}], class: <Pane>}
DEBUG: childClass = <Pane>
DEBUG: returning false
DEBUG: parent = /anonymous
DEBUG: parent.panes = []
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[1]/PaneTab]
ERROR @rojares/SplitPane/Pane.lzx≈71: TypeError: Error #1010
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[2]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[3]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2], 
/anonymous/Pane[3]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[4]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2], 
/anonymous/Pane[3], /anonymous/Pane[4]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[5]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2], 
/anonymous/Pane[3], /anonymous/Pane[4], /anonymous/Pane[5]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[6]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2], 
/anonymous/Pane[3], /anonymous/Pane[4], /anonymous/Pane[5], 
/anonymous/Pane[6]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[7]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2], 
/anonymous/Pane[3], /anonymous/Pane[4], /anonymous/Pane[5], 
/anonymous/Pane[6], /anonymous/Pane[7]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[8]/PaneTab]
DEBUG: parent = /anonymous
DEBUG: parent.panes = [/anonymous/Pane[1], /anonymous/Pane[2], 
/anonymous/Pane[3], /anonymous/Pane[4], /anonymous/Pane[5], 
/anonymous/Pane[6], /anonymous/Pane[7], /anonymous/Pane[8]]
DEBUG: parent.dividers = []
DEBUG: this.subviews = [/anonymous/Pane[9]/PaneTab]
lzx> Debug.inspect(<Pane>)
«Class#21» {
  attributes: {…, fixed: false, height: $always{parent.height}, 
initWidth: -1, minWidth: 0, …, selectedTab: null}
  tagname: 'Pane'
}
«Class#21| <Pane>»
lzx>

P T Withington kirjoitti:
> Could we see an example of your debug output?  That might give an 
> insight.
>
> Also, it seems the subclass test could be simplified to:
>
>   childClass.prototype is lz.Pane
>
> The 'is' operator understands mixins, whereas 'isPrototypeOf' does not.
>
> On Jan 17, 2010, at 23:21, Rami Ojares / AMG <rami.ojares at archon.fi> 
> wrote:
>
>> Hi Tucker,
>> When 4.7 was released the restructuring of tagname etc. forced me to 
>> detect Pane tags as per your suggestion.
>> Currently I can´t get it to work.
>>
>> Here's the situation:
>>
>> I have a createChildren method overridden in SplitPane class
>> And from there I am calling the method you said would detect Pane 
>> classes
>> (I only changed c.class to c['class'] because compiler told me to. 
>> And I put the declaration
>> of variable outside of if statement)
>>
>> Now the isPane seems to return false everytime.
>> Since I don't really understand what is going on in here I ask for 
>> your guidance and assistance.
>> <method name="createChildren" args="children"><![CDATA[
>>      var splitpaneChildren = [];
>>   var paneCount = 0;
>>      for(var i=0; i<children.length; i++) {
>>              var pane = children[i];
>>       var divider;
>>              if (isPane(pane)) {
>>                      divider = {
>>               'class': lz.Divider,
>>               attrs: {
>>                   width: this.dividerWidth,
>>                   index: paneCount
>>               }
>>           };
>>                      // add index attribute also to Pane
>>           pane.attrs.index = paneCount;
>>                      splitpaneChildren.push(divider);
>>           splitpaneChildren.push(pane);
>>           paneCount++;
>>       }
>>       else splitpaneChildren.push(pane);
>>          }
>>   super.createChildren(splitpaneChildren);
>>   ]]></method>
>>
>> <method name="isPane" args="c"><![CDATA[
>>   Debug.debug("c = %w", c);
>>      var childClass;
>>   if (c.name) childClass = lz[c.name];
>>   else childClass = c['class'];
>>      Debug.debug("childClass = %w", childClass);
>>      var ret = lz['Pane'].prototype.isPrototypeOf(childClass.prototype);
>>   Debug.debug("returning %w", ret);
>>   return ret;
>> ]]></method>
>>
>> - rami
>>> If you are trying to detect instances of <Pane> (even anonymous 
>>> ones, which would be subclasses), the recommended approach would be 
>>> to use the `is` operator as above.  But I see where your problem 
>>> lies, you are trying to sort the child "specifications" before they 
>>> have been instantiated.  To be totally accurate, that means you 
>>> would have to look for `name` _or_ `class`, and that you would need 
>>> to know if the tag or class is a subclass of the tag's class you are 
>>> sorting on.
>>>
>>> Something like:
>>>
>>> function isPane(c) {
>>>  if (c.name) {
>>>    var childClass = lz[c.name];
>>>  } else {
>>>    var childClass = c.class;
>>>  }
>>>  return lz['Pane'].prototype.isPrototypeOf(childClass.prototype);
>>> }
>>>
>>> [That last line is pretty obscure, we should probably offer a 
>>> built-in `extends` or `isSubclassOf` predicate.]
>>