diff options
| author | mensonge <mensonge@b3834d28-1941-0410-a4f8-b48e95affb8f> | 2008-11-13 09:49:11 +0000 |
|---|---|---|
| committer | mensonge <mensonge@b3834d28-1941-0410-a4f8-b48e95affb8f> | 2008-11-13 09:49:11 +0000 |
| commit | e44a7e37b6c7b5961adaffc62b9042b8d442938e (patch) | |
| tree | 95b67c356e93163467db2451f2b8cce84ed5d582 /includes/js/dijit/tests/test_instantiate.html | |
| parent | a62b9742ee5e28bcec6872d88f50f25b820914f6 (diff) | |
| download | semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.gz semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.bz2 | |
New feature: basic Ajax suggestion for tags and implementation of Dojo toolkit
git-svn-id: https://semanticscuttle.svn.sourceforge.net/svnroot/semanticscuttle/trunk@151 b3834d28-1941-0410-a4f8-b48e95affb8f
Diffstat (limited to 'includes/js/dijit/tests/test_instantiate.html')
| -rw-r--r-- | includes/js/dijit/tests/test_instantiate.html | 111 |
1 files changed, 111 insertions, 0 deletions
diff --git a/includes/js/dijit/tests/test_instantiate.html b/includes/js/dijit/tests/test_instantiate.html new file mode 100644 index 0000000..ffc39a4 --- /dev/null +++ b/includes/js/dijit/tests/test_instantiate.html @@ -0,0 +1,111 @@ +<html> + <head> + <title>dojo.NodeList.instantiate() tests</title> + + <style type="text/css"> + @import "../../dojo/resources/dojo.css"; + @import "css/dijitTests.css"; + #container { height:200px; } + </style> + + <script type="text/javascript" src="../../dojo/dojo.js" + djConfig="parseOnLoad: true, isDebug: true"></script> + <script type="text/javascript" src="_testCommon.js"></script> + + <script type="text/javascript"> + dojo.require("dijit._Widget"); + dojo.require("dojo.parser"); + dojo.require("dijit.form.Button"); + dojo.require("dijit.layout.TabContainer"); + dojo.require("dijit.layout.ContentPane"); + dojo.require("dijit.layout.LinkPane"); + + // declare a simple widget to use as a base test: + dojo.declare("test._Widget",dijit._Widget,{ + message:"", + postCreate:function(){ + this.inherited(arguments); + this.connect(this.domNode,"onclick","workit"); + dojo.style(this.domNode,{ + cursor:"pointer", + color:"#333" + }); + this.domNode.innerHTML += this.message +" ("+this.id +")"; + console.log('created',this.id); + }, + workit:function(){ + dojo.place(this.domNode,this.domNode.parentNode,"end"); + } + }); + + var init = function(){ + dojo.byId("status").innerHTML = "after."; + + // test widgeting + dojo.query("#testList li").instantiate(test._Widget,{}).connect("onclick",console.log); + + // make a tab container from some div, and all it's children div's + dojo.query("#container") + .forEach(function(n){ + dojo.query("div",n) + // create contentpanes from the children and style them + .instantiate(dijit.layout.ContentPane,{}) + .forEach(function(wn,idx){ + dojo.mixin(dijit.byNode(wn),{ title:"tab" + (idx + 1) }) + }) + ; + }) + .instantiate(dijit.layout.TabContainer,{}) + ; + // should we add auto-startup calling? + dijit.byId("container").startup(); + //dijit.byId("container").layout(); + + // another test widget example + dojo.query("#altList li").instantiate(test._Widget,{ message:"woot" }); + + // bunches of buttons, use you imagination on how to relate them to something + dojo.query("#buttonTest").forEach(function(n){ + dojo.query("button",n).instantiate(dijit.form.Button,{ + onClick:function(){ + console.log('clicked:',this.domNode); + } + }); + }); + }; + dojo.addOnLoad(init) + //dojo.addOnLoad(function(){ + // setTimeout(init,25); + //}); + </script> + </head> + <body> + + <h1>dojo.NodeList.instantiate() tests: <span id="status">before</span></h1> + + <h2>Some simple widgets:</h2> + <ul id="testList"> + <li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li> + </ul> + <ul id="altList"> + <li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li><li>inner</li> + </ul> + + <h2>A TabContainer:</h2> + <div id="container"> + <div>pane1</div> + <div>pane2</div> + <div>pane3</div> + </div> + + <h2>Some Buttons</h2> + <div id="buttonTest"> + <button>button 1</button> + <button>button 2</button> + <button>button 3</button> + <button>button 4</button> + <button>button 5</button> + </div> + + </body> +</html> |