aboutsummaryrefslogtreecommitdiff
path: root/includes/js/dijit/demos/mail
diff options
context:
space:
mode:
Diffstat (limited to 'includes/js/dijit/demos/mail')
-rw-r--r--includes/js/dijit/demos/mail/icons.gifbin0 -> 1757 bytes
-rw-r--r--includes/js/dijit/demos/mail/icons.pngbin0 -> 2908 bytes
-rw-r--r--includes/js/dijit/demos/mail/mail.css133
-rw-r--r--includes/js/dijit/demos/mail/mail.css.commented.css157
-rw-r--r--includes/js/dijit/demos/mail/mail.json75
-rw-r--r--includes/js/dijit/demos/mail/newMail.html8
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
Binary files differ
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
Binary files differ
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>