source: Dev/branches/rest-dojo-ui/client/mSessions.html @ 345

Last change on this file since 345 was 344, checked in by tjcschipper, 13 years ago
  • mSessions.html is more or less done
  • mMenu.html is nearly done, still needs non-hover overlays on the menu boxes/buttons
  • Fixed theme dependency, style overrides now work on a stock copy of Dojo claro theme!
  • Improved iconset alignment somewhat, still needs pixel tweaks to rftIcons24.png and rftIcons16.png (Icons are sometimes 1px too wide!)
  • Fixed MainMenu? template and applied styling classes. Replaced markup version with rft.ui.MainMenu? version in all mockups.
  • Fixed colour settings/context on LineWithButtons?
File size: 6.8 KB
Line 
1<!DOCTYPE html>
2<html>
3    <head>
4        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
5        <title>Research Facilitator Tool</title>
6        <link rel="stylesheet" type="text/css" href="dojotoolkit/dijit/themes/claro/claro.css" />
7        <link rel="stylesheet" type="text/css" href="dojotoolkit/dojox/grid/resources/Grid.css" />
8        <link rel="stylesheet" type="text/css" href="dojotoolkit/dojox/grid/resources/claroGrid.css" />
9        <link rel="stylesheet" type="text/css" href="dojotoolkit/dojox/widget/Toaster/Toaster.css" />
10        <link rel="stylesheet" type="text/css" href="rft/css/main.css" />
11        <script type="text/javascript" src="dojotoolkit/dojo/dojo.js" data-dojo-config="async: true, parseOnLoad: false, tlmSiblingOfDojo: false, isDebug: true, baseUrl: '', packagePaths: {'dojotoolkit':['dojo','dijit', 'dojox'], '.':['rft']}"></script>
12        <script type="text/javascript">
13            require([
14                'dojo/parser',
15                'dojo/_base/array',
16                'dijit/DropDownMenu',
17                'dijit/layout/AccordionContainer',
18                'dijit/layout/BorderContainer',
19                'dijit/layout/ContentPane',
20                'dijit/layout/TabContainer',
21                'dijit/layout/SplitContainer',
22                'dijit/MenuBar',
23                'dijit/MenuBarItem',
24                'dijit/form/Button',
25                'dijit/form/ComboBox',
26                'dijit/form/Form',
27                'dijit/form/Select',
28                'dijit/form/SimpleTextarea',
29                'dijit/form/TextBox',
30                'dijit/form/Textarea',
31                'dijit/PopupMenuBarItem',
32                'dijit/TitlePane',
33                'dojox/grid/DataGrid',
34                'dojox/widget/TitleGroup',
35                'rft/ui/List',
36                'rft/ui/MainMenu',
37                'rft/ui/MenuBarLink',
38                'rft/ui/MenuLink',
39                'rft/ui/Notifications',
40                'rft/ui/LineWithActionsWidget',
41                'rft/ui/QuestionWidget',
42                'rft/ui/Selector',
43                'rft/ui/SelectorThijs',
44                'rft/ui/LineWithActionsWidgetThijs',
45                'rft/ui/ObjectBox',
46                'rft/ui/TitleGroup',
47                'dojo/domReady!'
48            ],function(parser){
49                parser.parse();
50            });
51        </script>
52        <script>
53            function createNew(){
54                debugger;
55                var newBox = new rft.ui.ObjectBox({
56                    title: 'TeamUp Basic Template',
57                    subTitle: '',
58                    lowerTitle: '',
59                    objectType: 'SessionTemplate',
60                    actions: {
61                        "edit": function() {},
62                        "delete": function() {}
63                    }
64                });
65                newBox.startup();
66                newBox.placeAt("containerTemplates", "last");
67            }
68           
69            function createInstance(args) {
70            // Create a template instance in the "Sessions" tab
71            debugger;
72            var args;
73            args.objectType = "Session";
74            var d = new Date();
75            var dateString = d.getDate()+"-"+d.getMonth()+"-"+d.getFullYear();
76            var creator = "Igor Mayer"; // Use currently logged in profile instead!
77            args.subTitle = "Created on "+dateString+" by "+creator;
78           
79            args.actions = {
80                        "edit": function() {},
81                        "delete": function() {}
82                    }
83            var newBox = new rft.ui.ObjectBox(args);
84            newBox.startup();
85            newBox.placeAt("containerSessions", "last");
86            // TODO: Then switch tabs to the Sessions tab!
87            }
88           
89           
90        </script>
91
92
93    </head>
94    <body class="dijitReset claro">
95        <div class="page" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'">
96            <!-- Top menu bar -->
97            <div class="topbar" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
98                <h1>ResearchTool</h1>
99                <div data-dojo-type="rft.ui.MainMenu"></div>
100                <div class="breadcrumbs">
101                    <span class="breadcrumb">User > </span>
102                    <span class="breadcrumbCurrent">Sessions</span>
103                </div>
104            </div>
105            <!-- Main content window -->
106            <div class="content" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'">
107                <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'" style="height: 500px;">
108                    <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
109                        <h2>
110                            <span class="rftIcon rftIconSession"></span>
111                            <span class="headerText">Sessions</span>
112                        </h2>
113                    </div>
114                    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'">
115                        <div data-dojo-type="dijit.layout.TabContainer" class="green" data-dojo-props="tabPosition:'left-h',region:'center'">
116                            <div data-dojo-type="dijit.layout.BorderContainer" title="Templates">
117                                <div id="containerTemplates" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'center'">
118                                    <div data-dojo-type="rft.ui.ObjectBox" data-dojo-props="actions: {'edit': function(){alert('Custom edit code');}, 'New Command': function(){alert('newCommand');}, 'publish': createInstance}"></div>
119                                </div>
120                                <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'bottom'" style="height: 40px;">
121                                    <div data-dojo-type="dijit.form.Button" data-dojo-props="region: 'bottom', baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconSession', onClick: createNew">Create new session</div>
122                                </div>
123                            </div>
124                            <div data-dojo-type="dijit.layout.ContentPane" title="Sessions">
125                                <div id="containerSessions" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'center'">
126                                   
127                                </div>
128                                <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'bottom'" style="height: 40px;">
129                                    <!-- Buttons? -->
130                                </div>
131                            </div>
132                        </div>
133                    </div>
134                </div>
135            </div>
136        </div>
137    </body>
138</html>
Note: See TracBrowser for help on using the repository browser.