root / trunk / demos / widget / Mail.html

Revision 7193, 4.5 kB (checked in by becky, 2 years ago)

updated to use TreeV3 instead of Tree

Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2<html>
3<head>
4<title>Mail</title>
5
6<script type="text/javascript">
7        var djConfig = {isDebug: true};
8        //djConfig.debugAtAllCosts = true;
9</script>
10<script type="text/javascript" src="../../dojo.js"></script>
11<script language="JavaScript" type="text/javascript">
12        dojo.require("dojo.widget.*");
13</script>
14
15<link rel=stylesheet href="Mail/mail.css" type="text/css">
16
17<script type="text/javascript" src="Mail/mail.js"></script>
18
19</head>
20<body>
21<div dojoType="TreeBasicControllerV3" widgetId="treePaneController"></div>
22<div dojoType="TreeDocIconExtension" widgetId="treePaneIcons"></div>
23<div dojoType="TreeSelectorV3" widgetId="treePaneSelector"></div>
24<div dojoType="TreeEmphasizeOnSelect" selector="treePaneSelector"></div>
25<div dojoType="LayoutContainer"
26        layoutChildPriority='top-bottom'
27        id="main"
28>
29        <div id="topMenu" dojoType="ContentPane" layoutAlign="top" class="header"
30         style="padding-bottom: 5px;">
31                <div style="float: left; margin-right: 10px;">
32                        <button dojoType="Button" onclick="alert('pretending to download new mail');">
33                                <img src="Mail/mail_get.gif" height=18 width=18>
34                                Get Mail
35                        </button>
36                </div>
37                <div style="float: left;">
38                        <button dojoType="Button" onclick='open("Mail/NewMessage.html",null,"height=500,width=600,status=yes,toolbar=no,menubar=no,location=no");'>
39                                <img src="Mail/mail_new.gif" height=18 width=18>
40                                New Message
41                        </button>
42                </div>
43                <div style="float: right;">
44                        <button dojoType="Button" onclick="dojo.widget.byId('options').show()">
45                                <img src="Mail/checkmark.gif" height=18 width=18>
46                                Options
47                        </button>
48                </div>
49                <div align=center>My mailbox</div>
50               
51        </div>
52
53        <div dojoType="SplitContainer"
54                orientation="horizontal"
55                sizerWidth="5"
56                activeSizing="0"
57                layoutAlign="client"
58        >
59                <div id="treePane" dojoType="TreeV3" toggle="wipe" toggleDuration="500" listeners="treePaneController;treePaneIcons;treePaneSelector" sizeMin="20" sizeShare="15">
60                        <div dojoType="TreeNodeV3" title="Mail Account" nodeDocType="FolderMailbox">
61                                <div dojoType="TreeNodeV3" title="Inbox" nodeDocType="FolderInbox"></div>
62                                <div dojoType="TreeNodeV3" title="Sent Mail" nodeDocType="FolderSentMail"></div>
63                                <div dojoType="TreeNodeV3" title="Deleted" nodeDocType="FolderDeleted"></div>
64                                <div dojoType="TreeNodeV3" title="Saved Mail" nodeDocType="FolderDocuments">
65                                        <div dojoType="TreeNodeV3" title="Friends" nodeDocType="FolderDocuments">
66                                                <div dojoType="TreeNodeV3" title="Bob" nodeDocType="FolderDocuments"></div>
67                                                <div dojoType="TreeNodeV3" title="Jack" nodeDocType="FolderDocuments"></div>
68                                        </div>
69                                        <div dojoType="TreeNodeV3" title="Work" nodeDocType="FolderDocuments"></div>
70                                </div>
71                        </div>
72                </div>
73
74                <div dojoType="SplitContainer"
75                        orientation="vertical"
76                        sizerWidth="5"
77                        activeSizing="0"
78                        style="width: 100%; height: 100%;"
79                        sizeMin="50" sizeShare="85"
80                >
81                        <div id="listPane" dojoType="ContentPane" sizeMin="20" sizeShare="20" style="padding: 5px">
82                        </div>
83                        <div id="contentPane" dojoType="ContentPane" sizeMin="20" sizeShare="80" href="Mail/MailAccount.html" style="padding: 5px">
84                        </div>
85                </div>
86</div>
87
88<div id="options" dojoType="FloatingPane" title="Options"
89        style="width: 300px; height: 200px; left: 300px; top: 100px; display: none;"
90        hasShadow="true" resizable="true">
91        <div dojoType="TabContainer" layoutAlign="client">
92                <div dojoType="ContentPane" label="Sending/Receiving">
93                        Transport type
94                        <select>
95                                <option>POP3</option>
96                                <option>IMAP</option>
97                        </select>
98                        <br>
99                        Server: <input type="text">
100                </div>
101                <div dojoType="ContentPane" label="Composition">
102                        <input type="checkbox" name="cb1" id="cb1" dojoType="Checkbox" /> <label for="cb1">hello world</label><br />
103                        <input type="checkbox" name="cb2" id="cb2" dojoType="Checkbox" /> <label for="cb2">foo bar baz</label><br />
104                        <input type="checkbox" name="cb3" id="cb3" dojoType="Checkbox" /> <label for="cb3">woo yay hoopla</label><br />         
105                </div>
106        </div>
107        <div dojoType="ContentPane" layoutAlign="bottom" style="height: 25px; padding-top: 5px;">
108                <div class="box">
109                        <button dojoType="Button" onclick="dojo.widget.byId('options').hide();">
110                                <img src="Mail/cancel.gif" height=18 width=18>
111                                Cancel
112                        </button>
113                        <button dojoType="Button" onclick="dojo.widget.byId('options').hide();">
114                                <img src="Mail/ok.gif" height=18 width=18>
115                                OK
116                        </button>
117                </div>
118        </div>
119</div>
120
121</body>
122</html>
Note: See TracBrowser for help on using the browser.