sandbox/yui/yui.html

	yui.html revision 1b298c6f0ef597aa4ab0b8bcb25430b6c9a87749
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>YUI 3.0</title>
<script type="text/javascript" src="/build/yui.js"></script>
<script type="text/javascript">

////////////////////////////////////////////////////////////////////////////

(function() {

    var Mod = function(Y) {
        Y.example.B = function() {
            this.Super.apply(this, arguments);
            this.b = "b";
            Y.log("'B' constructor called: " + Array.prototype.splice.call(arguments, 0));
        };
        console.log('plugging B ' + Y.id);
        Y.extend(Y.example.B, Y.example.A, {
            test: function() {
                this.Super('test', 'differentparams');
                Y.log("'B' test called: " + Array.prototype.splice.call(arguments, 0));
            }
        });
    };

    YUI.add("b", Mod, "3.0.0");

})();


////////////////////////////////////////////////////////////////////////////

(function() {

    var Mod = function(Y) {

        Y.example.A = function() {
            this.a = "a"; this.b = "a"; this.c = "a";
            // merge the prototype // wonder if this technique would speed inheritance since it // would eliminate lookups in the prototype chain.
            //YUI.augment(this, A.prototype);
            Y.log("'A' constructor called: " + Array.prototype.splice.call(arguments, 0));
        };

        Y.example.A.prototype = {
            d: function() { return "foo"; },
            toString: function() { return [this.a, this.b, this.c, this.d].join(', '); },
            test: function() {
                Y.log("'A' test called: " + Array.prototype.splice.call(arguments, 0));
            }
        };

        console.log('plugging A ' + Y.id);
    };

    YUI.add("a", Mod, "3.0.0");

})();

////////////////////////////////////////////////////////////////////////////

(function() {

    var Mod = function(Y) {

        Y.example.C = function() {
            // this.Super();
            this.Super.apply(this, arguments);
            this.a = "c"; this.b = "c"; this.c = "c";
            Y.log("'C' constructor called: " + Array.prototype.splice.call(arguments, 0));
        };

        console.log('plugging C ' + Y.id);
    };

    YUI.add("c", Mod, "3.0.0");

})();


////////////////////////////////////////////////////////////////////////////

(function() {

    // YUI.use('b', 'a'); // order matters in stating deps unless add informs about deps
    // YUI.use('a', 'b');

    var y1 = YUI().use('a', 'c');

    var b = new .example.B(1, 2);

    b.test(1, '2');


    // shouldn't work
    // var c = new YUI.example.C();

    // shouldn't work
    // var b = new y1.example.B();

    var a1 = new YUI.example.A();
    a1.b = "a1 change";

    var a2 = new y1.example.A();
    a2.c = "a2 change";

    // add a new version of A, change a prototype function
    (function() {

        var Mod = function(Y) {

            Y.example.A = function() {
                this.a = "a"; this.b = "a"; this.c = "a";
                Y.log("'New A' constructor called");
                // merge the prototype // wonder if this technique would speed inheritance since it // would eliminate lookups in the prototype chain.
                //YUI.augment(this, A.prototype);
            };

            Y.example.A.prototype = {
                d: function() { return "bar"; },
                toString: function() { return [this.a, this.b, this.c, this.d].join(', '); }
            };

            console.log('plugging A ' + Y.id);
        };

        YUI.add("a", Mod, "3.0.0");

    })();

    var y2 = YUI().use('a');

    var a3 = new y2.example.A();

    console.log('Prototype protected? ' + a2.d() + ", " + a3.d() + " - " + (a2.d() != a3.d()));

    y2.example.A.prototype.d = function() {
        return "changed_d";
    };

    console.log('Prototype protected? ' + a2.d() + ", " + a3.d() + " - " + (a2.d() != a3.d()));


})();

</script>
<body>

<input id="addButton" type="button" value="Add link" />

</body>

</html>