Problem revealed in a scenario highlighted in https://github.com/clientside/amplesdk/issues#issue/31 where addEventListener was called in constructor which produced cascading amount of handlers.

I'm new at using github, so when I wanted to try out Ample SDK, I clicked on the "Download source" button on the project page, and started playing with the examples. The README file included in the archive did not warn that the example files need to be served from a server, and don't work when read by the browser right from the filesystem (i.e., I saw this: http://github.com/clientside/amplesdk/blob/master/README).

When I mentioned this on the mailing list, I was pointed to the following version: http://github.com/clientside/amplesdk/blob/master/ample/README. This contained helpful information, but as a beginner with github, I never would have found this file on my own.

I suggest you ensure that the version of the README with the helpful information about running from the server is included with source archive downloads, for the benefit of naive users like myself.

Although these are properties in XUL, we could only have them as attributes.

Class Variables

        // Source
        var Source = function(){
            this.observers = [];
        };
        Source.prototype = new AMLElement();
        Source.prototype.namespaceURI = 'http://www.finalstep.com.au/2010/sandbox';
        Source.prototype.localName = 'source';
        Source.prototype.registerObserver = function(oWidget) {
            this.observers.push(oWidget);
        };

        ample.extend(Source);

        // MoreSource
        var MoreSource = function(){
        };
        MoreSource.prototype = new Source();
        MoreSource.prototype.namespaceURI = 'http://www.finalstep.com.au/2010/sandbox';
        MoreSource.prototype.localName = 'moresource';

        ample.extend(MoreSource);

        })();

        window.checkw1 = function() {
            var w1 = ample.getElementById('w1');
            var w2 = ample.getElementById('w2');
            w1.registerObserver(document.body); // doesn't matter what is being registered
            if (w1.observers !== w2.observers) {
                alert('ok - observers is an instance variable so w1 and w2 have different arrays.');
            }
        }
        window.checkw3 = function() {
            var w3 = ample.getElementById('w3');
            var w4 = ample.getElementById('w4');
            w3.registerObserver(document.documentElement);  // doesn't matter what is being registered
            if (w3.observers === w4.observers) {
                alert('Fail - observers has been converted into a class variable through inheritance - tricky! ;-)');
            }
        }

    </script>

    <script type="application/ample+xml" 
        xmlns="http://www.w3.org/1999/xhtml" 
        xmlns:x="http://www.finalstep.com.au/2010/sandbox">

        <x:source id="w1" />
        <x:source id="w2" />

        <x:moresource id="w3" />
        <x:moresource id="w4" />

    </script>

        <button onclick="checkw1()">Add observer to Source element</button>
        <button onclick="checkw3()">Add observer to MoreSource element</button>

</body>

smil:animate некорректно поворачивает svg:image в IE. То же самое для Chrome работает корректно. svg:rect корректно поворачивается и в IE и в Chrome. Пример:

<svg:svg viewBox="0,0 600,250" width="600px" height="250px"
xmlns:smil="http://www.w3.org/2008/SMIL30/"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:svg="http://www.w3.org/2000/svg">
<svg:rect x="0" y="0" width="464" height="294" rx="10" ry="10">
<smil:animate begin="click" dur="2s" from="rotate(0, 232, 148)"
to="rotate(360, 232, 148)" attributeName="transform" />
/svg:rect
<svg:image xlink:href="http://www.amplesdk.com/design/img/ample-logo.gif"
x="100" y="100" width="264" height="94">
<smil:animate begin="click" dur="2s" from="rotate(0, 232, 148)"
to="rotate(360, 232, 148)" attributeName="transform" />
/svg:image
/svg:svg

If animate() was called with callback, it doesn't work when you call stop().

Also, implement missing screenX/screenY attributes.

It seems to me that the capture area for the down-arrow section of a
xul:toolbarbutton (type="menu-button") is too small - it seems to be
bounded by the GIF image (toolbarbutton_arrow.gif) instead of the
implied area of the divided section within the button. Unless I click
the image, or very close to it, the menu does not drop down.

You can see this behaviour in the XUL Toolbar demo code supplied with
Ample.

These are quite common in apps.

Is it possible to make inertial scrolling when proxying touch events into scroll ones on iPhone/iPad?

New parameter candidate: enable-validation

If you for instance have a code like this:

then, on the positive side, Internet Explorer 6-8 will display the embedded XHTML. But, on the negative side, it fails to rotate the embedded XHTML.

I don't know how to implement this in VML. May be (A) through re-intepreting HTML elements as if the were VML elements? Or (B) making use of MS filters:
http://www.useragentman.com/blog/2010/04/05/cross-browser-animated-css-transforms-even-in-ie/
http://samuli.hakoniemi.net/cross-browser-rotation-transformation-with-css/

parse error displayed http://www.amplesdk.com/examples/markup/xul/views/

We have $hoverable and $selectable which are frequently useful.
I find myself adding a _press class manually in many widgets (button, checkbox, radio options, slider, lists, etc)
_press is added on mousedown and removed on mouseup and also removed on mouseleave

Do you think its a useful enhancement?

With FirebugLite (latest version) installed, I noticed that ample.ajax failed in IE6.
With async == true, the error and complete callbacks executed immediately, and of course the responseText was undefined. The second argument to the callbacks was "error".

With async == false, the call completed ok, but no callbacks executed (success, error, complete).

My test page below: add FirebugLite and change async.

Ajax Test

Cannot use tab key to move focus between focusable elements. Problem resides in Ample runtime(-dev).js file.

Platform(s) : Firefox 3.6.3 and IE 7.0.6000.xxxx, Win Vista SP1, AmpleSDK 0.9.3a

See: http://groups.google.com/group/amplesdk/browse_thread/thread/911bc0e5817bf1c5

Reported here: http://groups.google.com/group/amplesdk/browse_thread/thread/f96155be6f949200

Some do have support however.

This looks to be very recent addition to the specification. See http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html#events-FocusEvent

$isAccessible has been implemented in XUL and XHTML in this way:
return !this.attributes["disabled"];

While this disables the immediate element, it does not disable descendants, which is highly desirable. If an element checks recursively for a disabled parent, we can ensure that all descendants are also disabled.

    StandardWidget.prototype.$isAccessible = function() {
        // fixme: to work, this same logic must be applied to XHTML elements!
        var oParent = this.parentNode;
        if (!oParent || oParent === ample.lastChild) {
            return(true);
        }
        if (!oParent.$isAccessible()) {
            return(false);
        }
        return(this.getAttribute('disabled') != 'true');    
    };

Similar code may be added to each language (XUL, XHTML).
If it is not added, then wrapping in a DIV would re-enable the DIV's descendants.

Could this ancestor-checking logic instead be added to AMLElement so that it is the default behavior for all languages?

A useful link http://developer.apple.com/library/safari/#codinghowtos/Mobile/UserExperience/index.html

Being not standard they are very useful.

when modal window (dialog, wizard) is closed the button that caused dialog to appear will persist its :hover or :active state until you hover it again.

A must have feature.

This behaviour seems to be common for multiple GUI toolkits.

In IE an error thrown about argument missing if not specified. As described in http://www.w3.org/TR/XMLHttpRequest/#the-open-method it should be assumed as true then.

Ample SDK 0.9.3a18

List of failing elements found (there may be more):
xul:rows
xul:textbox
xul:label
xul:grid
xul:groupbox

Code sample:

<xul:command id="cmd_navigate_message" oncommand="alert('cmd_navigate_message')"/>
<xul:toolbarbutton label="Compose Mail" command="cmd_navigate_message"/>

Type error thrown

How about moving the 35 AML classes from the global namespace under the ample object?
It would tidy up the global namespace and looks like it might require only minor changes to the languages.
from
cXULElement = new AMLElement();
to
cXULElement = new ample.AMLElement();

Low priority

As discussed at length here:
http://groups.google.com/group/amplesdk/browse_thread/thread/2175c0fe52f1a201
Although, the discussion seems to have wandered off the main point: MAXWIDTH fails to have any effect AFAICT.

If I place 10 widgets of the same type on a page and tab from one to the next, I see a blur event on the activeWidget 10 times.
If I have 100 widgets on the page, I see 100 of the same blur events.

If dialog is not modal, focus manager will not reach the active content in dialog and only tab through buttons again.

    <div id="parent" style="background-color: pink">
        <div id="child1" style="background-color: lightyellow;">1</div>
        <div id="child2" style="background-color: lightgreen;">2</div>
        <div id="child3" style="background-color: lightblue;">3</div>
    </div>

var parent = ample.getElementById("parent"),
child1 = ample.getElementById("child1"),
child2 = ample.getElementById("child2"),
child3 = ample.getElementById("child3");
parent.insertBefore(child1, child3);
console.log(parent.toXML());

the output is wrong: 2, 3, 1, visually is right: 2, 1, 3

I have several widgets which inherit, so I've published the ancestor widget classes:
ample.publish(TextFieldBase, 'TextFieldBase', fs);
No problem.
Input.prototype = new fs.TextFieldBase();
No problem.

I have been using ample.extend for the Input class (an enhanced text field) with no problem.
But now I have a widget which subclasses Input, so I want to publish it.
ample.publish(Input, 'Input', fs);
results in an error message: The definition for s:input is not found in the namespace 'http://www.finalstep.com.au/2010/standard'

The namespace is correctly specified - all works fine with extend().
Tried renaming from Input (in case it collided with a reserved name) to ABC.
ample.publish(ABC, 'ABC', fs)
No good.
Tried changing the locaName from input to 'notinput'.
No good.

So I'm a bit puzzled as to why this particular class causes a problem for publish().

My workaround is to simply define the class as a property of the global fs.
fs.Input = function() {};
This appears to work ok.

So two questions:
(1) any idea why a class might be extended ok but not get published?
(2) what am I losing if I define my classes directly under the global fs?

The success clause at
https://github.com/clientside/amplesdk/blob/master/ample/runtime/modules/ajax.js#L28-32
calls the success callback even when Gecko returns a parsererror because the XML is not well-formed.
Could it add a check?
if(oRequest.responseXML.documentElement && oRequest.responseXML.documentElement.tagName == "parsererror") {
// treat as error
}

Getter works though.

Two problems:
1 - Mouse: only the scrollbar "thumb" appears to respond to the mouse; track, left/right/up/down buttons are ignored.
2 - Keyboard: no response at all that I can find.

I scraped this from Firebug:
div class="xul-treebody--area" style="height: 100%; width: 100%; overflow: scroll; position: relative;" onscroll="return ample.$instance(this)._onScroll(event)"

Tested in Firefox 3.6.2

Subsequent animation doesn't work in Opera 10.63 build 3516 (but still work in Opera 10.00 build 1750).

Here is a sample:

Try to test subsequent animation via:

• press "animate"
• press "reset"
• press "animate"
• press "reset"
• press "animate"
• press "reset"
• press "animate"
• press "reset"
• press "animate"

It looks like this may be due to a typo on line #24 here:

http://github.com/clientside/amplesdk/blob/master/ample/languages/xul/elements/caption.js#L24

i.e. oElement is not defined

Animating left is incorrect in FF3, animating width seems to be incorrect in all browsers but IE.

Code:

<xul:page style="background-color:lightblue">

<xul:hbox flex="1">
<xul:tree treelines="true" width="500" height="200">
  <xul:treecols>

    <xul:treecol label="0" Xminwidth="230" flex="1" />
    <xul:treecol label="1" Xminwidth="230" flex="1" />
    <xul:treecol label="2" maxwidth="20" Xflex="1" />
    <xul:treecol label="3" maxwidth="20" Xflex="1" />
  </xul:treecols>
  <xul:treebody tfs_notes="required non-standard element defined by AmpleSDK">
    <xul:treechildren>
      <xul:treeitem>
        <xul:treerow>

          <xul:treecell label="This" />
          <xul:treecell label="is" />
          <xul:treecell label="r" />
          <xul:treecell label="0" />
        </xul:treerow>
      </xul:treeitem>
      <xul:treeitem>
        <xul:treerow>
          <xul:treecell label="This" />

          <xul:treecell label="is" />
          <xul:treecell label="r" />
          <xul:treecell label="1" />
        </xul:treerow>
      </xul:treeitem>
    </xul:treechildren>
  </xul:treebody>
</xul:tree>
<xul:hbox flex="1" debug="true"><xul:label value="just a spacer"/></xul:hbox>

</xul:hbox>

/xul:page

console.log(ample.querySelector("")) returns ample
should be null

Seen in W3C_SVG_11_FullTestSuite/htmlEmbedHarness/full-render-elems-03-t.html

Not sure what is the right behavior, do consult spec

It seems that appending an empty xul:treerow will cause a blank TD to be inserted into the underlying DOM. See this post on the Amp0le SDK forum:

http://groups.google.com/group/amplesdk/t/ccfbdfa8a0da30e3

Note: I'm guessing at the cause!

Should assume px as default unit

xul:listbox is a useful control but performance is disastrous when loading large numbers of records (>3000 in my case). The browser becomes unresponsive when attempting to scroll the listbox or sort a column. I have had to switch to jqGrid for better performance.

It seems that inline handlers are only effective on original markup.
If an element is created dynamically, it dos no good to add an onclick attribute before appending it to the ample tree.
Instead, an event listener needs to be added.

Is this the desired behavior? or should inline handlers work for dynamically inserted elements?