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>