jsdevelopmentscreen.js

echo3 很炫的ajax框架技术 js 演示demo ajax j2ee 里面有jsp演示代码

DemoApp.JSDevelopmentScreen = Core.extend(Echo.ContentPane, {

    $static: {
    
        HIERARCHAL_EXAMPLE:
                "var label;\n" +
                "var content = new Echo.ContentPane({\n" +
                "    children: [\n" +
                "        new Echo.SplitPane({ \n" +
                "            styleName: \"DefaultResizableLarge\",\n" +
                "            orientation: Echo.SplitPane.ORIENTATION_HORIZONTAL,\n" +
                "            children: [\n" +
                "                new Echo.Column({\n" +
                "                    layoutData: {\n" +
                "                        background: \"#4f4f5f\",\n" +
                "                        insets: 5\n" +
                "                    },\n" +
                "                    children: [\n" +
                "                        new Echo.Button({\n" +
                "                            styleName: \"Default\",\n" +
                "                            text: \"Alpha\",\n" +
                "                            events: {\n" +
                "                                action: function(e) {\n" +
                "                                    label.set(\"text\", \"A\");\n" +
                "                                }\n" +
                "                            }\n" +
                "                        }),\n" +
                "                        new Echo.Button({\n" +
                "                            styleName: \"Default\",\n" +
                "                            text: \"Bravo\",\n" +
                "                            events: {\n" +
                "                                action: function(e) {\n" +
                "                                    label.set(\"text\", \"B\");\n" +
                "                                }\n" +
                "                            }\n" +
                "                        })\n" +
                "                    ]\n" +
                "                }),\n" +
                "                label = new Echo.Label({\n" +
                "                    layoutData: {\n" +
                "                        alignment: \"center\"\n" +
                "                    },\n" +
                "                    font: { size: 200 },\n" +
                "                    text: \"?\"\n" +
                "                })\n" +
                "            ]\n" +
                "        })\n" +
                "    ]\n" +
                "});\n",
        LAZY_LOAD_EXAMPLE:
                "// Lazy-load modules, then execute code.\n" + 
                "Core.Web.Library.exec(\n" +
                "        [\"lib/Alpha.js\", \"lib/Beta.js\"],\n" +
                "    Core.method(this, function() {\n" +
                "        // The following code is executed\n" +
                "        // only after the specified\n" +
                "        // modules have been loaded:\n" +
                "        var x = Alpha.getX();\n" +
                "        this.beta = new Beta(x);\n" +
                "        beta.doSomething();\n" +
                "    })\n" +
                ");\n"
    },

    _msg: null,
    
    $construct: function() {
        this._msg = DemoApp.getMessages(null);
        
        var simpleCode = [
            this._code(["Example.Alpha", " = ", "Core.extend", "({"],
                    [this._msg["JSDevelopmentScreen.ClassNameAlpha"], null, this._msg["JSDevelopmentScreen.CoreExtend"]]),
            this._code(),
            this._code(["    _internalField", ": null,"],
                    [this._msg["JSDevelopmentScreen.InternalField"]]),
            this._code(),
            this._code(["    publicField", ": null,"],
                    [this._msg["JSDevelopmentScreen.PublicField"]]),
            this._code(),
            this._code(["    $construct", ": function(a) {"],
                    [this._msg["JSDevelopmentScreen.Constructor"]]),
            this._code(["        this._internalField = a;"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    _internalMethod", ": function(x, y) {"],
                    [this._msg["JSDevelopmentScreen.InternalMethod"]]),
            this._code(["        return x * y - 2;"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    publicMethod", ": function(x, y) {"],
                    [this._msg["JSDevelopmentScreen.PublicMethod"]]),
            this._code(["        return this._internalField * x / (y + 3);"]),
            this._code(["    }"]),
            this._code(["});"])
        ];
        
        var advancedCode = [
            this._code(["Example.Beta", " = ", "Core.extend", "(", "Example.Gamma", ", {"], 
                    [this._msg["JSDevelopmentScreen.ClassNameBeta"], null, this._msg["JSDevelopmentScreen.CoreExtend"], null, 
                    this._msg["JSDevelopmentScreen.BaseClass"]]),
            this._code(),
            this._code(["    $static", ": {"], [this._msg["JSDevelopmentScreen.StaticBlock"]]),
            this._code(),
            this._code(["        staticField", ": \"Foo\","], [this._msg["JSDevelopmentScreen.StaticField"]]),
            this._code(),
            this._code(["        staticMethod", ": function(x, y) {"], [this._msg["JSDevelopmentScreen.StaticMethod"]]),
            this._code(["            return this.staticField.length + x - y;"]),
            this._code(["        }"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    $load", ": function() {"], [this._msg["JSDevelopmentScreen.StaticInitializer"]]),
            this._code(["        this.staticField = this.staticField + \"ooo\";"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    $virtual", ": {"], [this._msg["JSDevelopmentScreen.VirtualBlock"]]),
            this._code(),
            this._code(["        virtualField", ": null,"], [this._msg["JSDevelopmentScreen.VirtualField"]]),
            this._code(),
            this._code(["        virtualMethod", ": function(x, y) {"], [this._msg["JSDevelopmentScreen.VirtualMethod"]]),
            this._code(["            return this._internalField + x - y;"]),
            this._code(["        }"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    $abstract", ": {"], [this._msg["JSDevelopmentScreen.AbstractBlock"]]),
            this._code(),
            this._code(["        abstractMethod", ": function(x, y) { }"], [this._msg["JSDevelopmentScreen.AbstractMethod"]]),
            this._code(["    },"]),
            this._code(),
            this._code(["    $include", ": [ Mixin1, Mixin2 ],"], [this._msg["JSDevelopmentScreen.IncludeBlock"]]),
            this._code(),
            this._code(["    _internalField", ": null,"], [this._msg["JSDevelopmentScreen.InternalField"]]),
            this._code(),
            this._code(["    publicField", ": null,"], [this._msg["JSDevelopmentScreen.PublicField"]]),
            this._code(),
            this._code(["    $construct", ": function(a, b) {"], [this._msg["JSDevelopmentScreen.Constructor"]]),
            this._code(["        Example.Gamma.call(this, a);"], [this._msg["JSDevelopmentScreen.SuperConstructorCall"]]),
            this._code(["        this._internalField = a + b;"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    _internalMethod", ": function(x, y) {"], [this._msg["JSDevelopmentScreen.InternalMethod"]]),
            this._code(["        return x * y - 2;"]),
            this._code(["    },"]),
            this._code(),
            this._code(["    publicMethod", ": function(x, y) {"], [this._msg["JSDevelopmentScreen.PublicMethod"]]),
            this._code(["        return this._internalField * x / (y + 3);"]),
            this._code(["    }"]),
            this._code(["});"])
        ];
        
        Echo.ContentPane.call(this, {
            backgroundImage: {
                url: "image/bgpictures/Moonlight.jpg",
                x: "50%",
                y: "50%"
            },
            children: [
                new Extras.TabPane({
                    borderType: Extras.TabPane.BORDER_TYPE_SURROUND,
                    tabPosition: Extras.TabPane.TAB_POSITION_BOTTOM,
                    insets: 20,
                    tabInset: 30,
                    tabActiveBorder: "1px inset #3b67b4",
                    tabInactiveBorder: "1px inset #819488",
                    tabActiveBackground: "#0f0f1f",
                    tabActiveForeground: "#ffdfaf",
                    tabInactiveBackground: "#0f0f0f",
                    tabInactiveForeground: "#af7f6f",
                    children: [
                        new Echo.ContentPane({
                            background: "#0f0f1f",
                            layoutData: {
                                title: this._msg["JSDevelopmentScreen.Tab.CoreJS"]
                            },
                            children: [
                                new Echo.SplitPane({
                                    orientation: Echo.SplitPane.ORIENTATION_HORIZONTAL_RIGHT_LEFT,
                                    separatorPosition: "35%",
                                    children: [
                                        new Echo.Column({
                                            insets: 20,
                                            cellSpacing: 10,
                                            children: [
                                                new Echo.Label({ 
                                                    layoutData: {
                                                        insets: "15px 15px",
                                                        background: "#000000"
                                                    },
                                                    foreground: "#00ff00",
                                                    font: {