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

6 files changed, 373 insertions, 0 deletions

diff --git a/includes/js/dijit/demos/mail/icons.gif b/includes/js/dijit/demos/mail/icons.gif
new file mode 100644
index 0000000..d0b1760
--- /dev/null
+++ b/includes/js/dijit/demos/mail/icons.gif
diff --git a/includes/js/dijit/demos/mail/icons.png b/includes/js/dijit/demos/mail/icons.png
new file mode 100644
index 0000000..f333fbe
--- /dev/null
+++ b/includes/js/dijit/demos/mail/icons.png
diff --git a/includes/js/dijit/demos/mail/mail.css b/includes/js/dijit/demos/mail/mail.css
new file mode 100644
index 0000000..13474c4
--- /dev/null
+++ b/includes/js/dijit/demos/mail/mail.css
@@ -0,0 +1,133 @@
+html, body, #main{	
+	width: 100%;	
+	height: 100%;
+	overflow: hidden;	
+	padding: 0 0 0 0;
+	margin: 0 0 0 0;
+	font: 10pt Arial,Myriad,Tahoma,Verdana,sans-serif;
+}
+#banner, #footer {
+background-color: #ededff; 
+color: #333;
+padding:3px; 
+}
+#banner { text-align:right; } 
+#listPane tr:hover, #listPane td:hover, .dijitTreeContent:hover {
+	background-color: #ededed;
+	color: #333;
+	cursor: pointer;
+}
+#listPane tr, #listPane td { cursor: pointer; }
+table.demoTable {
+	border-collapse: collapse;	
+}
+th {
+	background-color: #4f8ce5; 
+	color: #666; 
+	font-weight:: bold !important;
+	margin:0;
+	padding:3px; 
+	background-image:url('../../themes/soria/images/titleBar.png');
+	background-position:0px -1px; 
+}
+.dijitRtl caption,
+.dijitRtl th {
+	text-align:right;
+}
+th .arrowNode { 
+	position:relative; 
+	float:left;
+	top:4px;
+	left:4px; 
+	width:16px;
+	height:16px;
+}
+.dijitRtl th .arrowNode{
+	float:right;	
+}
+th.arrowUp .arrowNode {
+	margin-right: 5px;
+	margin-top: -4px;
+	margin-bottom: 5px;
+	width: 15px;
+	height:15px;
+	background:transparent url("../../themes/soria/images/spriteRoundedIconsSmall.png") -45px top no-repeat;
+}
+th.arrowDown .arrowNode {
+	margin-right: 5px;
+	margin-top: -4px;
+	margin-bottom: 5px;
+	width: 15px;
+	height:15px;
+	background:transparent url("../../themes/soria/images/spriteRoundedIconsSmall.png") -15px top no-repeat;
+}
+.demoTable td { padding:3px; } 
+.demoTable {
+	border-spacing:0; 
+	padding:0; margin:0; 
+	width:98%;
+	
+}
+.oddRow {
+	background-color: #f2f5f9;
+}
+#message {
+	padding: 8px;
+}
+.subject {
+	background: gray;
+	width: 100%;
+	padding-top: 5px;
+	padding-bottom: 10px;
+}
+.message {
+	border: black 2px;
+}
+.messageHeader {
+	font:12pt Arial,sans-serif;
+	font-weight:bold;
+	color:#333; 
+}
+body .dojoSplitPane {
+	background: #ededff;
+	overflow: auto;
+}
+.mailIconCancel,
+.mailIconOptions,
+.mailIconFolderDocuments,
+.mailIconFolderInbox,
+.mailIconFolderSent,
+.mailIconGetMail,
+.mailIconNewMessage,
+.mailIconMailbox,
+.mailIconOk,
+.mailIconTrashcanFull {
+	background-image: url('icons.png'); 
+	background-repeat: no-repeat; 
+	width: 16px;
+	height: 16px;
+	text-align: center;
+	padding-right:4px; 
+}
+.dj_ie6 .mailIconCancel,
+.dj_ie6 .mailIconOptions,
+.dj_ie6 .mailIconFolderDocuments,
+.dj_ie6 .mailIconFolderInbox,
+.dj_ie6 .mailIconFolderSent,
+.dj_ie6 .mailIconGetMail,
+.dj_ie6 .mailIconNewMessage,
+.dj_ie6 .mailIconMailbox,
+.dj_ie6 .mailIconOk,
+.dj_ie6 .mailIconTrashcanFull {
+	background-image: url('icons.gif');
+}
+.mailIconCancel { background-position: 0px; }
+.mailIconOptions { background-position: -22px; }
+.mailIconFolderDocuments { background-position: -44px; }
+.mailIconFolderInbox { background-position: -66px; }
+.mailIconFolderSent { background-position: -88px; }
+.mailIconGetMail { background-position: -110px; }
+.mailIconNewMessage { background-position: -132px; }
+.mailIconMailbox { background-position: -154px; }
+.mailIconOk { background-position: -176px; }
+.mailIconTrashcanFull { background-position: -198px; }
diff --git a/includes/js/dijit/demos/mail/mail.css.commented.css b/includes/js/dijit/demos/mail/mail.css.commented.css
new file mode 100644
index 0000000..02e2635
--- /dev/null
+++ b/includes/js/dijit/demos/mail/mail.css.commented.css
@@ -0,0 +1,157 @@
+html, body, #main{	
+	width: 100%;	/* make the body expand to fill the visible window */
+	height: 100%;
+	overflow: hidden;	/* erase window level scrollbars */
+	padding: 0 0 0 0;
+	margin: 0 0 0 0;
+	font: 10pt Arial,Myriad,Tahoma,Verdana,sans-serif;
+}
+
+#banner, #footer {
+background-color: #ededff; 
+color: #333;
+padding:3px; 
+}
+#banner { text-align:right; } 
+
+/* list of messages
+TODO: If i add the rules below as a plain tr/td it seems to mess up accordion, tree, etc. ???
+*/
+#listPane tr:hover, #listPane td:hover, .dijitTreeContent:hover {
+	background-color: #ededed;
+	color: #333;
+	cursor: pointer;
+}
+#listPane tr, #listPane td { cursor: pointer; }
+
+table.demoTable {
+	border-collapse: collapse;	
+}
+
+th {
+	background-color: #4f8ce5; 
+	color: #666; 
+	font-weight:: bold !important;
+	margin:0;
+	padding:3px; 
+	background-image:url('../../themes/soria/images/titleBar.png');
+	background-position:0px -1px; 
+}
+
+.dijitRtl caption,
+.dijitRtl th {
+	text-align:right;
+}
+
+th .arrowNode { 
+	position:relative; 
+	float:left;
+	top:4px;
+	left:4px; 
+	width:16px;
+	height:16px;
+}
+
+.dijitRtl th .arrowNode{
+	float:right;	
+}
+
+th.arrowUp .arrowNode {
+	margin-right: 5px;
+	margin-top: -4px;
+	margin-bottom: 5px;
+	width: 15px;
+	height:15px;
+	background:transparent url("../../themes/soria/images/spriteRoundedIconsSmall.png") -45px top no-repeat;
+}
+
+th.arrowDown .arrowNode {
+	margin-right: 5px;
+	margin-top: -4px;
+	margin-bottom: 5px;
+	width: 15px;
+	height:15px;
+	background:transparent url("../../themes/soria/images/spriteRoundedIconsSmall.png") -15px top no-repeat;
+}
+
+.demoTable td { padding:3px; } 
+.demoTable {
+	border-spacing:0; 
+	padding:0; margin:0; 
+	width:98%;
+	
+}
+.oddRow {
+	background-color: #f2f5f9;
+}
+
+#message {
+	padding: 8px;
+}
+
+/* Stuff for new messages */
+
+.subject {
+	background: gray;
+	width: 100%;
+	padding-top: 5px;
+	padding-bottom: 10px;
+}
+
+.message {
+	border: black 2px;
+}
+.messageHeader {
+	font:12pt Arial,sans-serif;
+	font-weight:bold;
+	color:#333; 
+}
+body .dojoSplitPane {
+	background: #ededff;
+	overflow: auto;
+}
+
+/* Icons */
+
+.mailIconCancel,
+.mailIconOptions,
+.mailIconFolderDocuments,
+.mailIconFolderInbox,
+.mailIconFolderSent,
+.mailIconGetMail,
+.mailIconNewMessage,
+.mailIconMailbox,
+.mailIconOk,
+.mailIconTrashcanFull {
+	background-image: url('icons.png'); /* mail icons sprite image */
+	background-repeat: no-repeat; 
+	width: 16px;
+	height: 16px;
+	text-align: center;
+	padding-right:4px; 
+}
+
+.dj_ie6 .mailIconCancel,
+.dj_ie6 .mailIconOptions,
+.dj_ie6 .mailIconFolderDocuments,
+.dj_ie6 .mailIconFolderInbox,
+.dj_ie6 .mailIconFolderSent,
+.dj_ie6 .mailIconGetMail,
+.dj_ie6 .mailIconNewMessage,
+.dj_ie6 .mailIconMailbox,
+.dj_ie6 .mailIconOk,
+.dj_ie6 .mailIconTrashcanFull {
+	background-image: url('icons.gif');
+}
+
+
+.mailIconCancel { background-position: 0px; }
+.mailIconOptions { background-position: -22px; }
+.mailIconFolderDocuments { background-position: -44px; }
+.mailIconFolderInbox { background-position: -66px; }
+.mailIconFolderSent { background-position: -88px; }
+.mailIconGetMail { background-position: -110px; }
+.mailIconNewMessage { background-position: -132px; }
+.mailIconMailbox { background-position: -154px; }
+.mailIconOk { background-position: -176px; }
+.mailIconTrashcanFull { background-position: -198px; }
diff --git a/includes/js/dijit/demos/mail/mail.json b/includes/js/dijit/demos/mail/mail.json
new file mode 100644
index 0000000..67f1a04
--- /dev/null
+++ b/includes/js/dijit/demos/mail/mail.json
@@ -0,0 +1,75 @@
+{ 
+	identifier: 'id',
+	label: 'label',
+	items: [
+
+		// Hierarchy of folders
+		{ type: 'folder', id: 'inbox', label:'Inbox', icon:'mailIconFolderInbox' },
+		{ type: 'folder', id: 'deleted', label:'Trash', icon:'mailIconTrashcanFull' },
+		{ type: 'folder', id: 'save', label:'Save',  folders:[
+			{ id: 'work', label:'stuff for work'},
+			{ id: 'fun', label:'stuff for fun'}
+		]},
+
+		// Address book (list of people that have sent me messages)
+		{ type: 'address', id: 'adam', label: "Adam Arlen" },
+		{ type: 'address', id: 'bob', label: "Bob Baxter" },
+		{ type: 'address', id: 'carrie', label: "Carrie Crow" },
+
+		// Flat list of messages (each message lists it's folder)
+
+		{ type: 'message', id: 'node1.1', folder: 'inbox', label: "today's meeting", sender: "Adam Arlen", sent: "2005-12-19",
+			text: "Today's meeting is cancelled.<br>Let's do it tomorrow instead.<br><br>Adam" },
+		{ type: 'message', id: 'node1.2', folder: 'inbox', label: "remaining work", sender: "Bob Baxter", sent: "2005-12-18",
+			text:
+				"<p>Hey, we need to talk about who's gonna do all the left over work.  Pick a day you want to meet: <div dojoType='dijit._Calendar'></div></p>"
+		},
+		{ type: 'message', id: 'node1.3', folder: 'inbox', label: "Hey, look!", sender: "Carrey Crown", sent: "2005-12-17", text:
+				"This is our new simple mail app. What do you think? <br><br>You can navigate around this demo with arrows and tabs ... <br><br>Regards,<br>Carrey"
+		},
+		{ type: 'message', id: 'node1.4', folder: 'inbox', label: "paint", sender: "David Davis", sent: "2005-12-16", text:
+			"<p>what color is good for the new office?</p><div dojoType='dijit.ColorPalette'></div><p>Let me know soon</p>"
+		},
+		{ type: 'message', id: 'node2.1', folder: 'deleted', label: "today's meeting", sender: "Madam Marlen", sent: "2005-12-19",
+			text: "Today's meeting is cancelled.<br>Let's do it tomorrow instead.<br><br>Madam" },
+		{ type: 'message', id: 'node2.2', folder: 'deleted', label: "congratulations", sender: "Rob Raxter", sent: "2005-12-18", text: " Good job on that project! " },
+		{ type: 'message', id: 'node2.3', folder: 'deleted', label: "schedule", sender: "Carrie Crow", sent: "2005-12-17", text: " Are we still on schedule?<br>The deadline is next Friday. " },
+		{ type: 'message', id: 'node2.4', folder: 'deleted', label: "paint", sender: "Daniel Dooey", sent: "2005-12-16", text:
+			"<p>what color is good for the new office?</p><div dojoType='dijit.ColorPalette'></div><p>Let me know soon</p>"
+		},
+		{ type: 'message', id: 'node3.1', folder: 'work', label: "today's meeting", sender: "Bob Baxter", sent: "2005-12-19",
+			text: "Today's meeting is cancelled.<br>Unnecessary.<br><br>Bob" },
+		{ type: 'message', id: 'node3.2', folder: 'work', label: "remaining work", sender: "Bob Baxter", sent: "2005-12-18", text: " Are we still on schedule?<br>The deadline is next Friday. " },
+		{ type: 'message', id: 'node3.3', folder: 'work', label: "lunch", sender: "Bob Baxter", sent: "2005-12-17", text:
+				"Where do you want to go for lunch?<br><br><ul><li>Fresh Choice<li>Starbucks<li>Dominos</ul><br><br>Let me know..."
+		},
+		{ type: 'message', id: 'node3.4', folder: 'work', label: "paint", sender: "Bob Baxter", sent: "2005-12-16", text:
+			"<p>what color is good for the new office?</p><div dojoType='dijit.ColorPalette'></div><p>Let me know soon</p>"
+		},
+		{ type: 'message', id: 'node4.1', folder: 'fun', label: "today's meeting", sender: "Jack Jackson", sent: "2005-12-19",
+			text: "Today's meeting is cancelled.<br>Let's do it friday instead.<br><br>Joe" },
+		{ type: 'message', id: 'node4.2', folder: 'fun', label: "remaining work", sender: "Jack Jackson", sent: "2005-12-18",
+			text:
+				"<p>Hey, we need to talk about who's gonna do all the left over work.  Pick a day you want to meet: <div dojoType='dijit._Calendar'></div></p>"
+		},
+		{ type: 'message', id: 'node4.3', folder: 'fun', label: "lunch", sender: "Jack Jackson", sent: "2005-12-17", text:
+				"Where do you want to go for lunch?<br><br><ul><li>Indian<li>Mexican<li>Chinese<li>Japanese<li>Pizza</ul><br><br>Let me know..."
+		},
+		{ type: 'message', id: 'node4.4', folder: 'fun', label: "paint", sender: "Jack Jackson", sent: "2005-12-16", text:
+			"<p>what color is good for the new office?</p><div dojoType='dijit.ColorPalette'></div><p>Let me know soon</p>"
+		},
+
+		{ type: 'message', id: 'node5.1', folder: 'deleted', label: "today's meeting", sender: "Jill Jones", sent: "2005-12-19",
+			text: "Today's meeting is cancelled.<br>Let's do it thursday instead.<br><br>Jill" },
+		{ type: 'message', id: 'node5.2', folder: 'deleted', label: "remaining work", sender: "Jill Jones", sent: "2005-12-18",
+			text:
+				"<p>Hey, we need to talk about who's gonna do all the left over work.  Pick a day you want to meet: <div dojoType='dijit._Calendar'></div></p>"
+		},
+		{ type: 'message', id: 'node5.3', folder: 'deleted', label: "lunch", sender: "Jill Jones", sent: "2005-12-17", text:
+				"Where do you want to go for lunch?<br><br><ul><li>McDonalds<li>Burger King<li>KFC</ul><br><br>Let me know..."
+		},
+		{ type: 'message', id: 'node5.4', folder: 'deleted', label: "paint", sender: "Jill Jones", sent: "2005-12-16", text:
+			"<p>what color is good for the new office?</p><div dojoType='dijit.ColorPalette'></div><p>Let me know soon</p>"
+		}
+	]
+}
diff --git a/includes/js/dijit/demos/mail/newMail.html b/includes/js/dijit/demos/mail/newMail.html
new file mode 100644
index 0000000..f269ad3
--- /dev/null
+++ b/includes/js/dijit/demos/mail/newMail.html
@@ -0,0 +1,8 @@
+<textarea dojoType="dijit.Editor" style="overflow:auto"
+	extraPlugins="[{name:'dijit._editor.plugins.LinkDialog'}]"
+
+>
+<i> This is just a sample message. There is email-address auto-complete in the to: field.
+<br><br> give it a whirl.
+</i>
+</textarea>