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
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/dojox/grid/tests/test_subgrid.html
parent: a62b9742ee5e28bcec6872d88f50f25b820914f6 (diff)
download: semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.gz
semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.bz2
1 files changed, 179 insertions, 0 deletions
diff --git a/includes/js/dojox/grid/tests/test_subgrid.html b/includes/js/dojox/grid/tests/test_subgrid.html
new file mode 100644
index 0000000..4e5b8cd
--- /dev/null
+++ b/includes/js/dojox/grid/tests/test_subgrid.html
@@ -0,0 +1,179 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<head>
+<title>dojox.Grid Subgrid Test</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+</meta>
+<style>
+		@import "../../../dojo/resources/dojo.css";
+		@import "../_grid/tundraGrid.css";
+		
+		body { font-size: 1.0em; }
+		#grid {
+			height: 400px;
+			border: 1px solid silver;
+		}
+		.text-oneline {
+			white-space: nowrap;
+			overflow: hidden;
+			text-overflow: ellipsis;
+		}
+		.text-scrolling {
+			height: 4em;
+			overflow: auto;
+		}
+		.text-scrolling {
+			width: 21.5em;
+		}
+	</style>
+	
+	<script type="text/javascript" src="../../../dojo/dojo.js" 
+		djConfig="isDebug:true, debugAtAllCosts: false, parseOnLoad: true"></script>
+	<script type="text/javascript">
+		dojo.require("dojox.grid.Grid");
+		dojo.require("dojo.parser");
+	</script>
+	<script type="text/javascript">
+		data = [ 
+			[ '3 stars', 'Averagia', 'Averagia', 8.99, 'An authentic experience defined by the intense layer of frothy, real facts. This combination package includes special T DISCS that work with your system to produce a perfectly serene experience. $8.99 per package. Please choose Regular (#NS1) or Decaffeinated (#NS4).' ],
+		 	[ '2 stars', 'Cheapy', 'Cheapy', 6.29, 'Power and subtlety intersect for an experience with real character. Imported from Europe just for you. 16 T DISCS per package. $6.29 per package. #NJ4.' ],
+		 	[ '4 stars', 'Luxuria', 'Luxuria', 6.49, 'A bold statement from the respected European brand Luxuria, topped with delicate zanthum. Imported exclusively for you. 18 T DISCS per package. $6.49 per package. #N42.</div>' ],
+		 	[ '5 stars', 'Ultimo', 'Ultimo', 4.59, "A rich sensation of delicious experience, brought to you by one of Europe's oldest brands. A pure indulgence. 8 T DISCS per package. $4.59 per package. #NJ0." ]
+		];		 
+
+		getDetailData = function(inRowIndex) {
+			var row = data[this.grid.dataRow % data.length];
+			switch (this.index) {
+				case 0:
+					return row[0]; //'<img src="images/sample/' + row[0] + '" width="109" height="75">';
+				case 1:
+					return (100000000 + this.grid.dataRow).toString().slice(1);
+				case 2:
+					return row[3];
+				case 3:
+					return row[1];
+				case 4:
+					return row[2];
+				case 5:
+					return row[4];
+				default: 
+					return row[this.index];
+			}
+		}		 
+		
+		getName = function(inRowIndex) {
+			var row = data[inRowIndex % data.length];
+			return row[2];
+		}		 
+		
+		// Main grid structure 
+		var gridCells = [
+			{ type: 'dojox.GridRowView', width: '20px' }, 
+			{ 
+				onBeforeRow: function(inDataIndex, inSubRows) {
+					inSubRows[1].hidden = !detailRows[inDataIndex];
+				},
+				cells: [[
+					{ name: '', width: 3, get: getCheck, styles: 'text-align: center;' }, { name: 'Name', get: getName, width: 40 },
+				], [
+					{ name: '', get: getDetail, colSpan: 2, styles: 'padding: 0; margin: 0;'}
+				]]
+			}
+		];
+		
+		// html for the +/- cell
+		function getCheck(inRowIndex) { 
+			var image = (detailRows[inRowIndex] ? 'open.gif' : 'closed.gif');
+			var show = (detailRows[inRowIndex] ? 'false' : 'true')
+			return '<img height="11" width="11" src="images/' + image + '" onclick="toggleDetail(' + inRowIndex + ', ' + show + ')">';
+		}
+		
+		// provide html for the Detail cell in the master grid		
+		function getDetail(inRowIndex) {
+			var cell = this;
+			// we can affect styles and content here, but we have to wait to access actual nodes
+			setTimeout(function() { buildSubgrid(inRowIndex, cell); }, 1);
+			// look for a subgrid
+			var subGrid = dijit.byId(makeSubgridId(inRowIndex));
+			var h = (subGrid ? subGrid.cacheHeight : "120") + "px";
+			// insert a placeholder
+			return '<div style="height: ' + h + '; background-color: white;"></div>';
+		}
+		
+		// the Detail cell contains a subgrid which we set up below
+		
+			var subGridCells = [{
+				noscroll: true,
+				cells: [
+					[{ name: "Rating", rowSpan: 2, width: 10, noresize: true, styles: 'text-align:center;' }, 
+							{ name: "Sku" }, 
+							{ name: "Price" }, 
+							{ name: "Vendor" }, 
+							{ name: "Name", width: "auto" }], 
+					[{ name: "Description", colSpan: 4 }]
+				]}];
+
+			var subGridProps = {
+				structure: subGridCells, 
+				rowCount: 1, 
+				autoHeight: true, 
+				autoRender: false,
+				"get": getDetailData
+			};
+	
+			// identify subgrids by their row indices
+			function makeSubgridId(inRowIndex) {
+				return grid.widgetId + "_subGrid_" + inRowIndex;
+			}
+	
+			// if a subgrid exists at inRowIndex, detach it from the DOM
+			function detachSubgrid(inRowIndex) {
+				var subGrid = dijit.byId(makeSubgridId(inRowIndex));
+				if (subGrid)
+					dojox.grid.removeNode(subGrid.domNode);
+			}
+			
+			// render a subgrid into inCell at inRowIndex
+			function buildSubgrid(inRowIndex, inCell) {
+				var n = inCell.getNode(inRowIndex).firstChild;
+				var id = makeSubgridId(inRowIndex);
+				var subGrid = dijit.byId(id);
+				if (subGrid) {
+					n.appendChild(subGrid.domNode);
+				} else {
+					subGridProps.dataRow = inRowIndex;
+					subGridProps.widgetId = id;
+					subGrid = new dojox.VirtualGrid(subGridProps, n);
+				}
+				if (subGrid) {
+					subGrid.render();
+					subGrid.cacheHeight = subGrid.domNode.offsetHeight;
+					inCell.grid.rowHeightChanged(inRowIndex);
+				}	
+			}
+					
+			// destroy subgrid at inRowIndex
+			function destroySubgrid(inRowIndex) {
+				var subGrid = dijit.byId(makeSubgridId(inRowIndex));
+				if (subGrid) subGrid.destroy();
+			}
+		
+		// when user clicks the +/-
+		detailRows = [];
+		function toggleDetail(inIndex, inShow) {
+			if (!inShow) detachSubgrid(inIndex);
+			detailRows[inIndex] = inShow;
+			grid.updateRow(inIndex);
+		}
+		
+		dojo.addOnLoad(function() {
+			window["grid"] = dijit.byId("grid");
+			dojo.connect(grid, 'rowRemoved', destroySubgrid);
+		});
+	</script>
+</head>
+<body class="tundra">
+	<div style="font-weight: bold; padding-bottom: 0.25em;">dojox.Grid showing sub-grid.</div>
+	<div id="grid" dojoType="dojox.VirtualGrid" structure="gridCells" rowCount="100000" autoWidth="true"></div>
+</body>
+</html>
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/dojox/grid/tests/test_subgrid.html
parent	a62b9742ee5e28bcec6872d88f50f25b820914f6 (diff)
download	semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.gz semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.bz2