Ignore:
Timestamp:
06/22/12 19:06:49 (13 years ago)
Author:
tjcschipper
Message:
  • Made mSession.html Session Editor for demo.
  • Matching stylesheet
  • Changes to all screens resulting from feedback and/or demonstration purposes.
  • global goToPage() function included in all mockups is temporary! Do not use this for actual production code.
Location:
Dev/branches/rest-dojo-ui/client
Files:
2 added
7 edited

Legend:

Unmodified
Added
Removed

  • Dev/branches/rest-dojo-ui/client/mMenu.html

    r345 r346  
    4848            });
    4949        </script>
     50
     51        <script>
     52            function goToPage(name) {
     53                window.location = "http://localhost/RESEARCHTOOL/Dev/branches/rest-dojo-ui/client/"+name+".html";
     54            }
     55        </script>
    5056    </head>
    5157    <body class="dijitReset claro">
    … …  
    7581                                <span class="rftIcon rftIconSession"></span><span class="label">Sessions</span>
    7682                            </div>
    77                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconPlus'">Create and edit</div>
    78                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconForward'">Facilitate</div>
     83                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconPlus'" onClick="goToPage('mSessions');">Create and edit</button>
     84                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconForward'" onClick="goToPage('mSessions');">Facilitate</button>
    7985                        </div>
    8086
    … …  
    8389                                <span class="rftIcon rftIconInspect"></span><span class="label">Content</span>
    8490                            </div>
    85                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue oneHeight', iconClass: 'rftIcon rftIconSurvey'">Surveys</div>
    86                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'orange oneHeight', iconClass: 'rftIcon rftIconQuestion'">Questions</div>
    87                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'purple oneHeight', iconClass: 'rftIcon rftIconApplication'">Applications</div>
    88                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'red oneHeight', iconClass: 'rftIcon rftIconDashboard'">Dashboards</div>
     91                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue oneHeight', iconClass: 'rftIcon rftIconSurvey'" onClick="goToPage('mSurveys');">Surveys</button>
     92                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'orange oneHeight', iconClass: 'rftIcon rftIconQuestion'" onClick="goToPage('mQuestions');">Questions</button>
     93                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'purple oneHeight', iconClass: 'rftIcon rftIconApplication'" onClick="goToPage('mApplications');">Applications</button>
     94                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'red oneHeight', iconClass: 'rftIcon rftIconDashboard'" onClick="goToPage('mDashboards');">Dashboards</button>
    8995
    9096                        </div>
    9197
    9298                        <div class="rftIndexMenuBlock">
    93                             <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue fourHeight', iconClass: 'rftIcon rftIconGameData'">Results</div>
     99                            <div data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue fourHeight', iconClass: 'rftIcon rftIconGameData'" onClick="goToPage('mResults')">Results</div>
    94100                        </div>
    95101                    </div>

  • Dev/branches/rest-dojo-ui/client/mSessions.html

    r344 r346  
    6868           
    6969            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;
     70                // Create a template instance in the "Sessions" tab
     71                var args;
     72                args.objectType = "Session";
     73                var d = new Date();
     74                var dateString = d.getDate()+"-"+d.getMonth()+"-"+d.getFullYear();
     75                var creator = "Igor Mayer"; // Use currently logged in profile instead!
     76                args.subTitle = "Created on "+dateString+" by "+creator;
    7877           
    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!
     78                args.actions = {
     79                    "edit": function() {},
     80                    "delete": function() {}
     81                }
     82                var newBox = new rft.ui.ObjectBox(args);
     83                newBox.startup();
     84                newBox.placeAt("containerSessions", "last");
     85                debugger;
     86
     87                // TODO: Then switch tabs to the Sessions tab!
     88                var sess = dijit.byId("dijit_layout_ContentPane_5");
     89                dijit.byId("tabs").selectChild(sess);
    8790            }
    8891           
    8992           
     93        </script>
     94        <script>
     95            function goToPage(name) {
     96                window.location = "http://localhost/RESEARCHTOOL/Dev/branches/rest-dojo-ui/client/"+name+".html";
     97            }
    9098        </script>
    9199
    … …  
    113121                    </div>
    114122                    <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'">
     123                        <div data-dojo-type="dijit.layout.TabContainer" class="green" data-dojo-props="tabPosition:'left-h',region:'center'" id="tabs">
    116124                            <div data-dojo-type="dijit.layout.BorderContainer" title="Templates">
    117125                                <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>
     126                                    <!--TODO: These don't allow for custom icon settings yet! -->
     127                                    <div data-dojo-type="rft.ui.ObjectBox" data-dojo-props="actions: {'edit': function(){alert('Custom edit code');}, 'delete':function(){}, 'Custom function': function(){alert('newCommand');}, 'publish': createInstance}"></div>
    119128                                </div>
    120129                                <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>
     130                                    <div data-dojo-type="dijit.form.Button" data-dojo-props="region: 'bottom', baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconSessionTemplate', onClick: createNew">Create new template</div>
    122131                                </div>
    123132                            </div>
    124133                            <div data-dojo-type="dijit.layout.ContentPane" title="Sessions">
    125134                                <div id="containerSessions" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'center'">
    126                                    
     135
    127136                                </div>
    128137                                <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'bottom'" style="height: 40px;">

  • Dev/branches/rest-dojo-ui/client/mSurvey.html

    r344 r346  
    4848            });
    4949        </script>
     50        <script>
     51            function goToPage(name) {
     52                window.location = "http://localhost/RESEARCHTOOL/Dev/branches/rest-dojo-ui/client/"+name+".html";
     53            }
     54        </script>
    5055    </head>
    5156    <body class="dijitReset claro">
    … …  
    96101                                <div data-dojo-type="rft.ui.SelectorThijs" data-dojo-props="Title:'Subcat three'"></div>
    97102                                <div data-dojo-type="rft.ui.SelectorThijs" data-dojo-props="Title:'Subcat four'"></div>
    98 
    99                                 <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass:'rftIcon rftIconSettings'">Properties</button>
    100                                 <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass:'rftIcon rftIconPreview'">Preview</button>
    101                                 <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass:'rftIcon rftIconCancel'">Cancel</button>
    102                                 <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass:'rftIcon rftIconAccept'">Accept changes</button>
    103103                            </div>
    104104                        </div>
    … …  
    114114                            <div data-dojo-type="rft.ui.LineWithActionsWidgetThijs" data-dojo-props="title:'Question two', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
    115115                        </div>
     116                        <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'bottom'">
     117                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconSettings'">Settings</button>
     118                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconAccept'">Save Changes</button>
     119                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconCancel'">Discard changes</button>
     120                                                        <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconPreview'">Preview</button>
     121
     122                        </div>
    116123                    </div>
    117124                </div>

  • Dev/branches/rest-dojo-ui/client/rft/css/layout.css

    r345 r346  
    261261}
    262262
     263
     264/* Inputs */
     265fieldset {
     266    border: none;
     267}
     268fieldset.align input,
     269fieldset.align .dijitTextBox,
     270fieldset.align textarea {
     271    margin-left: 0;
     272}
     273fieldset.align label {
     274    display: inline-block;
     275    width: 100px !important;
     276}

  • Dev/branches/rest-dojo-ui/client/rft/css/main.css

    r344 r346  
    99@import url('rftSelector.css');
    1010@import url('rftObjectBox.css');
     11@import url('sessionEditor.css');

  • Dev/branches/rest-dojo-ui/client/rft/css/rftButtons.css

    r345 r346  
    238238    height: 100px;
    239239}
    240 .claro .oneHeight .dijitButtonContents {
     240.claro .oneHeight .dijitButtonNode {
    241241    margin: 34px 0 0 0;
    242242}
    … …  
    244244    height: 200px;
    245245}
    246 .claro .twoHeight .dijitButtonContents {
     246.claro .twoHeight .dijitButtonNode {
    247247    margin: 82px 0 0 0;
    248248}
    … …  
    250250    height: 400px;
    251251}
    252 .claro .fourHeight .dijitButtonContents {
     252.claro .fourHeight .dijitButtonNode {
    253253    margin: 184px 0 0 0;
    254254}

  • Dev/branches/rest-dojo-ui/client/rft/ui/ObjectBox.js

    r344 r346  
    1616                this.subTitle = "";
    1717                this.lowerTitle = "";
    18                 this.objectType = "SessionActive";
     18                this.objectType = "SessionTemplate";
    1919                this.actions = {}
    2020               
Note: See TracChangeset for help on using the changeset viewer.