Changeset 359


Ignore:
Timestamp:
07/12/12 17:07:35 (13 years ago)
Author:
hendrikvanantwerpen
Message:

Application header is link to menu now.
Links in menu page are clickable now.
Added some logic to session page. Simple props can now be edited and saved.
Different actions for session templates and instances in sessions page.
Cleaner code in ObjectBox?. No special cases anymore, scope error fixed.
Fixed scope error in store.js.

Location:
Dev/branches/rest-dojo-ui/client
Files:
9 edited
2 copied

Legend:

Unmodified
Added
Removed

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

    r347 r359  
    1515        <div class="page" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'">
    1616            <div class="topbar" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
    17                 <h1>ResearchTool</h1>
     17                <a href="#!/index"><h1>ResearchTool</h1></a>
    1818                <div data-dojo-type="rft.ui.MainMenu"></div>
    1919                <div class="breadcrumbs">

  • Dev/branches/rest-dojo-ui/client/rft/pages/index.html

    r358 r359  
    1 <div>
     1<div data-dojo-type="rft.pages.index">
    22    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'" style="height: 600px;">
    33        <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
    … …  
    1414                    <span class="rftIcon rftIconSession"></span><span class="label">Sessions</span>
    1515                </div>
    16                 <button id="btnContentCreate" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconPlus'">Create and edit</button>
    17                 <button id="btnContentFacilitate" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconForward'">Facilitate</button>
     16                <button data-rft-attach-point="btnContentCreate" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconPlus'">Create and edit</button>
     17                <button data-rft-attach-point="btnContentFacilitate" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'green twoHeight', iconClass: 'rftIcon rftIconForward'">Facilitate</button>
    1818            </div>
    1919
    … …  
    2222                    <span class="rftIcon rftIconInspect"></span><span class="label">Content</span>
    2323                </div>
    24                 <button id="btnSurveys" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue oneHeight', iconClass: 'rftIcon rftIconSurvey'">Surveys</button>
    25                 <button id="btnQuestions" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'orange oneHeight', iconClass: 'rftIcon rftIconQuestion'">Questions</button>
    26                 <button id="btnApplications" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'purple oneHeight', iconClass: 'rftIcon rftIconApplication'">Applications</button>
    27                 <button id="btnDashboards" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'red oneHeight', iconClass: 'rftIcon rftIconDashboard'">Dashboards</button>
     24                <button data-rft-attach-point="btnSurveys" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue oneHeight', iconClass: 'rftIcon rftIconSurvey'">Surveys</button>
     25                <button data-rft-attach-point="btnQuestions" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'orange oneHeight', iconClass: 'rftIcon rftIconQuestion'">Questions</button>
     26                <button data-rft-attach-point="btnApplications" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'purple oneHeight', iconClass: 'rftIcon rftIconApplication'">Applications</button>
     27                <button data-rft-attach-point="btnDashboards" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'red oneHeight', iconClass: 'rftIcon rftIconDashboard'">Dashboards</button>
    2828            </div>
    2929
    … …  
    3232                    <span class="rftIcon rftIconGameData"></span><span class="label">Results</span>
    3333                </div>
    34                 <button id="btnResults" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue fourHeight', iconClass: 'rftIcon rftIconGameData'">Results</button>
     34                <button data-rft-attach-point="btnResults" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftIndexMenuButton', class: 'blue fourHeight', iconClass: 'rftIcon rftIconGameData'">Results</button>
    3535            </div>
    3636        </div>

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

    r358 r359  
    1 define(['dojo/_base/declare','dojo/_base/lang','rft/store','rft/content','rft/ui/_Page','rft/ui/ObjectBox'],
    2     function(declare,lang,store,content,_Page,ObjectBox){
    3         return declare('rft.pages.sessions',[_Page],{
     1define(['dojo/_base/declare','dojo/_base/lang','rft/content','rft/ui/_Page'],
     2    function(declare,lang,content,_Page){
     3        return declare('rft.pages.index',[_Page],{
    44            selectedObject: null,
    55            onVisit: function() {
    6                 this._refresh();
    7             },
    8             _refresh: function() {
    9                 this.containerTemplates.set('content','');
    10                 this.containerSessions.set('content','');
    11                 this._refreshByType('SessionTemplate',this.containerTemplates.domNode);
    12                 this._refreshByType('SessionInstance',this.containerSessions.domNode);
    13             },
    14             _refreshByType: function(type,container) {
    15                 store.query("_design/default/_view/by_type",{key:type})
    16                 .forEach(lang.hitch(this,function(obj){
    17                     var widget = new ObjectBox({
    18                         title: obj.title || "Untitled",
    19                         actions: {
    20                             "Edit": function(){alert('Custom edit code');},
    21                             "Delete": lang.hitch(this,function(){
    22                                 store.remove(store.getIdentity(obj),store.getRevision(obj))
    23                                 .then(lang.hitch(this,function(){
    24                                     this._refresh();
    25                                 }));
    26                             }),
    27                             "Custom function": function(){alert('newCommand');},
    28                             "Publish": lang.hitch(this,this._publishSession,obj)
    29                         }
    30                     });
    31                     widget.startup();
    32                     widget.placeAt(container, "last");
    33                 }));
    34             },
    35             onAddSessionTemplate: function(){
    36                 store.put({
    37                     type: 'SessionTemplate',
    38                     title: 'TeamUp Basic Template'
    39                 })
    40                 .then(lang.hitch(this,function(){
    41                     this._refresh();
    42                 }));
    43             },
    44             _publishSession: function(sessionTemplate) {
    45                 var publishDate = new Date();
    46                 var session = {
    47                     type: "SessionInstance",
    48                     title: sessionTemplate.title,
    49                     date: publishDate.getDate()+"-"+publishDate.getMonth()+"-"+publishDate.getFullYear(),
    50                     creator: "Igor Mayer"
    51                 };
    52                 store.add(session)
    53                 .then(lang.hitch(this,function(){
    54                     this._refresh();
    55                 }));
     6                this.btnContentCreate.on("click",function(){ content.goTo("sessions"); });
     7                this.btnContentFacilitate.on("click",function(){ content.goTo("run"); });
     8                this.btnSurveys.on("click",function(){ content.goTo("surveys"); });
     9                this.btnQuestions.on("click",function(){ content.goTo("questions"); });
     10                this.btnApplications.on("click",function(){ content.goTo("applications"); });
     11                this.btnDashboards.on("click",function(){ content.goTo("dashboards"); });
     12                this.btnResults.on("click",function(){ content.goTo("results"); });
    5613            }
    5714        });

  • Dev/branches/rest-dojo-ui/client/rft/pages/session.html

    r357 r359  
    1 <div>
     1<div data-dojo-type="rft.pages.session">
    22    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'" style="height: 500px;">
    33        <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
    44            <h2>
    55                <span class="rftIcon rftIconSurvey"></span>
    6                 <span class="headerText">Teamup Session 15-5-2012 [editing]</span>
     6                <span data-rft-attach-point="titleNode" class="headerText">Untitled</span><span class="headerText"> [editing]</span>
    77            </h2>
    88        </div>
    … …  
    1010            <div data-dojo-type="dijit.layout.TabContainer" class="green" data-dojo-props="tabPosition:'left-h',region:'center'">
    1111                <div data-dojo-type="dijit.layout.ContentPane" title="Properties">
    12                     <!--PROPERTIES-->
    13                     <h3>Basic</h3>
    14                     <fieldset class="align">
    15                         <label for="titleInput">Title:</label>
    16                         <input type="text" data-rft-attach-point="titleInput" data-dojo-type="dijit.form.TextBox" data-dojo-props="placeHolder: 'Enter title here'" />
    17                         <br/>
    18                         <label for="descriptionInput">Description:</label>
    19                         <textarea data-rft-attach-point="descriptionInput" rows="3" cols="54" data-dojo-type="dijit.form.SimpleTextarea" data-dojo-props="selectOnClick: true">This is the description in the info popups!</textarea>
    20                         <br/>
    21                         <label for="dateInput">Planned date:</label>
    22                         <input type="text" data-rft-attach-point="dateInput" data-dojo-type="dijit.form.DateTextBox" required="true" />
    23                     </fieldset>
     12                    <div data-dojo-type="dijit.form.Form" data-rft-attach-point="propertiesForm" data-rft-attach-event="onSubmit:onSave">
    2413
    25                     <h3>Accounts</h3>
    26                     <fieldset class="align">
    27                         <label for="accountsInput">Add new</label>
    28                         <input type="text" data-dojo-type="dijit.form.TextBox" data-dojo-props="placeHolder: 'Enter email address here...'" />
    29                         <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', class: 'green', iconClass: 'rftIcon rftIconPlus'">Invite</button>
    30                         <br/><br/>
    31                         <div data-dojo-type="rft.ui.List" data-dojo-props="region:'center'" style="width: 500px;">
    32                             <div data-dojo-type="rft.ui.LineWithActionsWidget" data-dojo-props="title:'a.bezuijen@tudelft.nl', modifiers: 'green', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
    33                             <div data-dojo-type="rft.ui.LineWithActionsWidget" data-dojo-props="title:'i.mayer@tudelft.nl', modifiers: 'green', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
    34                         </div>
    35                     </fieldset>
     14                        <h3>Basic</h3>
     15                        <fieldset class="align">
     16                            <label for="titleInput">Title</label>
     17                            <input type="text" name="title" data-dojo-type="dijit.form.TextBox" data-dojo-props="placeHolder: 'Enter title here'" />
     18                            <br/>
     19                            <label for="descriptionInput">Description</label>
     20                            <textarea name="description" rows="3" cols="54" data-dojo-type="dijit.form.SimpleTextarea" data-dojo-props="selectOnClick: true, placeHolder: 'Description shown in tooltips'"></textarea>
     21                            <br/>
     22                            <label for="dateInput">Planned date</label>
     23                            <input type="text" name="plannedDate" data-dojo-type="dijit.form.DateTextBox" required="required" />
     24                        </fieldset>
    3625
    37                     <button data-rft-attach-point="btnPropertiesDiscard" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconCancel'">Discard changes</button>
    38                     <button data-rft-attach-point="btnPropertiesSave" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconAccept'">Save changes</button>
     26                        <h3>Accounts</h3>
     27                        <fieldset class="align">
     28                            <label for="accountsInput">Add new</label>
     29                            <input type="text" data-dojo-type="dijit.form.TextBox" data-dojo-props="placeHolder: 'Enter email address here...'" />
     30                            <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', class: 'green', iconClass: 'rftIcon rftIconPlus'">Invite</button>
     31                            <br/><br/>
     32                            <div data-dojo-type="rft.ui.List" data-dojo-props="region:'center'" style="width: 500px;">
     33                                <div data-dojo-type="rft.ui.LineWithActionsWidget" data-dojo-props="title:'a.bezuijen@tudelft.nl', modifiers: 'green', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
     34                                <div data-dojo-type="rft.ui.LineWithActionsWidget" data-dojo-props="title:'i.mayer@tudelft.nl', modifiers: 'green', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
     35                            </div>
     36                        </fieldset>
    3937
     38                        <button data-rft-attach-point="btnPropertiesDiscard" data-dojo-type="dijit.form.Button" data-rft-attach-event="onClick:onDiscard" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconCancel'">Discard changes</button>
     39                        <button data-rft-attach-point="btnPropertiesSave" data-dojo-type="dijit.form.Button" data-rft-attach-event="onClick:onSave" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconAccept'">Save changes</button>
     40
     41                    </div>
    4042
    4143                </div>

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

    r358 r359  
    33        'dojo/_base/event',
    44        'dojo/_base/Deferred',
    5         'rft/ui/AccordionList',
    6         'rft/ui/LineWithActionsWidget',
    7         'rft/ui/SurveyListView',
    85        'rft/store',
    96        'rft/ui/_Page',
    10         'rft/api',
    11         'dijit/registry',
    12         'rft/content',
    13         'dojo/on',
    14         'dojo/query'],
    15         function(declare,lang,event,Deferred,AccordionList,LineWithActionsWidget,SurveyListView,store,_Page,api,registry,content, on, query){
    16                 return declare('rft.pages.survey',[_Page],{
    17                         object: null,
    18                         questions: null,
    19                         listView: null,
    20                        
     7        'rft/content'],
     8        function(declare,lang,event,Deferred,store,_Page,content){
     9                return declare('rft.pages.session',[_Page],{
     10                        session: null,
    2111                        onVisit: function() {
    22                                 if ( this.pageArgs.uid ) {      // Load survey
     12                                if ( this.pageArgs.uid ) {
    2313                                        Deferred.when(store.get(this.pageArgs.uid))
    2414                                        .then(lang.hitch(this,function(obj){
    25                                                 this.object = obj;
    26                                                 return Deferred.when( obj.creator && store.dereference(obj.creator) );
     15                                                this.session = obj;
     16                        this._refresh();
    2717                                        }));
    28 
    29                                         //this._createQuestionBrowser();        // Load questions database and create browser
    30                                         this.questions = new dojo.store.Memory({        // Create local copy store of questions database
    31                                                 data: [],
    32                                                 idProperty: "_id"
    33                                         });
    3418                                } else {
    3519                                        throw "No valid uid or survey passed!";
    3620                                }
    37                                 this._setupButtons(this);
    38                                 var testQuestion1 = {_id: "123", title: "How long have you worked here?", categories: ['Professional background'], topic: 'Work experience'};
    39                                 this.questions.add(testQuestion1);
    40                                 this._insertQuestion(testQuestion1);
    41                                 var testQuestion2 = {_id: "234", title: "How many years have you been employed here?", categories: ['Respondent personals','Professional background'], topic: 'Work experience'};
    42                                 this.questions.add(testQuestion2);
    43                                 this._insertQuestion(testQuestion2);
    44                                 var testQuestion3 = {_id: "345", title: "Have you worked here longer than 10 years?", categories: ['Respondent personals','Professional background'], topic: 'Work experience'};
    45                                 this.questions.add(testQuestion3);
    46                                 this._insertQuestion(testQuestion3);
    47                                 var testQuestion4 = {_id: "456", title: "Rate your experience at your current employer from 1 to 10.", categories: ['Respondent personals','Professional background'], topic: 'Work experience'};
    48                                 this.questions.add(testQuestion4);
    49                                 this._insertQuestion(testQuestion4);
    50                                
    51                                 this._createListView(this.questions);
    5221                        },
    5322                        onLeave: function() {
    5423                                this.inherited(arguments);
    5524                        },
    56                         onReset: function() {
    57                                 this.setFields(this.object);
    58                         },
    59                         onSave: function(evt) {
    60                                 /*lang.mixin(this.object,this.form.get('value'));
    61                                 Deferred.when( store.put(this.object) )
    62                                 .then(lang.hitch(this,function(obj){
    63                                 this.object = obj;
    64                                 this.setFields(obj);
    65                                 api.notify("Object saved");
    66                                 }),lang.hitch(this,function(){
    67                                 api.notify("Object save failed",'error');
    68                                 }));
    69                                 event.stop(evt);
    70                                 evt.stopPropagation();
    71                                 return false;
    72                                 */
    73                         },
    74                         _goToPreview: function() {
    75                                 content.goTo('surveyAdvanced', {uid: this.object._id});
    76                         },
    77                         _setupButtons: function() {
    78                                 // Setup button events
    79                                 registry.byId("btnSave").on("click", lang.hitch(this, function(){
    80                                         this.onSave(arguments);
    81                                 }));
    82                                 registry.byId("btnPreview").on("click", lang.hitch(this, function(){
    83                                         this._goToPreview();
    84                                 }));
    85                         },
    86                         /* Store code */
    87                         getQuestion: function(_id) {
    88                                 return this.questions.get(_id);
    89                         },
    90                         setQuestion: function(question) {
    91                                 return this.questions.put(question);
    92                         },
    93                         /* Browser code */
    94                         _createQuestionBrowser: function() { // TODO: Do all operations from the local store. Put querying routine in SyncStore()!
    95                                 var getQuestions = function(self){
    96                                         return questions = Deferred.when(store.query('_design/default/_view/by_type', {key:'Question'}), function(res){
    97                                                 self.questions.setData(res);    // Store queried questions in this.questions MemoryStore
    98                                                 return res;
    99                                         });
    100                                 };
    101 
    102                                 Deferred.when(getQuestions(this), lang.hitch(this, function(questions){
    103                                         questions.forEach(function(question){
    104                                                 this._insertQuestion(question)
    105                                         }, this);
    106                                 }), function(err){
    107                                         throw "Questions could not be fetched. No connection or null query!";
    108                                 });
    109                         },
    110                         _insertQuestion: function(question) {
    111                                 var tabs = registry.byId("tabList");
    112                                 for (var c in question.categories) {
    113                                         var cat = question.categories[c];
    114                                         var q = "div[data-category='"+cat+"']";
    115                                         var catPane = query(q, tabs.containerNode)[0];
    116                                         if (catPane) {
    117                                                 this._insertIntoCategory(question, catPane);
    118                                         } else {
    119                                                 catPane = this._createCategoryTab(cat);
    120                                                 if (catPane) {
    121                                                         this._insertIntoCategory(question, catPane);
    122                                                 } else {
    123                                                         throw "Error: could not find or create category pane!";
    124                                                 }
    125                                         }
    126                                 }
    127                         },
    128                         _createCategoryTab: function(category) {
    129                                 var tabs = registry.byId("tabList");
    130                                 var newCat = new dijit.layout.ContentPane({
    131                                         title: category,
    132                                         postCreate: function(){
    133                                                 this.domNode.dataset["category"] = category;
    134                                         }
    135                                 });
    136                                 newCat.domNode.id = "tab"+category;
    137                                 tabs.addChild(newCat);
    138                                 var q = "div[data-category='"+category+"']";
    139                                 var pane = query(q, tabs.containerNode)[0];
    140                                 return (pane) ? pane : false;
    141                         },
    142                         _insertIntoCategory: function(question, container) {
    143                                 var selector = query(".rftSelector[data-topic='"+question.topic+"']", container)[0];
    144                                 var selectorWidget;
    145                                 if (selector) {
    146                                         selectorWidget = registry.byNode(selector);
    147 
    148                                 } else {
    149                                         selectorWidget = new rft.ui.Selector({
    150                                                 topic: question.topic,
    151                                                 controller: this
    152                                         });
    153                                         selectorWidget.placeAt(container);
    154                                 }
    155                                 selectorWidget.addQuestion(question._id);
    156                         },
    157                         /* ListView code */
    158                         _createListView: function() {
    159                                 this.listView = new SurveyListView({
    160                                         controller: this
    161                                 }).placeAt("SurveyListViewNode");
    162                         },
    163                         IncludeQuestion: function(_id) {
    164                                 this.listView.insertItem(_id);
    165                         },
    166 
     25            _refresh: function() {
     26                this.titleNode.innerHTML = this.session.title || '';
     27                this.propertiesForm.set('value',this.session);
     28            },
     29            onSave: function(evt) {
     30                lang.mixin(this.session,this.propertiesForm.get('value'));
     31                store.put(this.session)
     32                .then(function(){
     33                    content.goTo('sessions');
     34                });
     35                event.stop(evt);
     36                return false;
     37            },
     38            onDiscard: function(evt) {
     39                this.propertiesForm.reset();
     40                event.stop(evt);
     41                content.goTo('sessions');
     42                return false;
     43            }
    16744                });
    16845});

  • Dev/branches/rest-dojo-ui/client/rft/pages/sessions.html

    r357 r359  
    88        </div>
    99        <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'">
    10             <div data-dojo-type="dijit.layout.TabContainer" class="green" data-dojo-props="tabPosition:'left-h',region:'center'">
    11                 <div data-dojo-type="dijit.layout.BorderContainer" title="Templates">
     10            <div data-rft-attach-point="tabContainer" data-dojo-type="dijit.layout.TabContainer" class="green" data-dojo-props="tabPosition:'left-h',region:'center'">
     11                <div data-dojo-type="dijit.layout.BorderContainer" title="Templates" data-rft-attach-point="templatesTab">
    1212                    <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'center'" data-rft-attach-point="containerTemplates">
    1313                    </div>
    … …  
    1616                    </div>
    1717                </div>
    18                 <div data-dojo-type="dijit.layout.ContentPane" title="Sessions">
     18                <div data-dojo-type="dijit.layout.ContentPane" title="Sessions" data-rft-attach-point="sessionsTab">
    1919                    <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'center'" data-rft-attach-point="containerSessions">
    2020                    </div>

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

    r353 r359  
    22    function(declare,lang,store,content,_Page,ObjectBox){
    33        return declare('rft.pages.sessions',[_Page],{
    4             selectedObject: null,
     4            templateActions: null,
     5            sessionActions: null,
    56            onVisit: function() {
     7                this.templateActions = {
     8                    "Edit": function(obj){
     9                        content.goTo('session',{uid:store.getIdentity(obj)});
     10                    },
     11                    "Delete": lang.hitch(this,function(obj){
     12                        store.remove(store.getIdentity(obj),store.getRevision(obj))
     13                        .then(lang.hitch(this,function(){
     14                            this._refresh();
     15                        }));
     16                    }),
     17                    "Publish": lang.hitch(this,this._publishSession)
     18                };
     19                this.sessionActions = {
     20                    "Facilitate": function(obj){
     21                        content.goTo('run',{uid:store.getIdentity(obj)});
     22                    },
     23                    "Delete": lang.hitch(this,function(obj){
     24                        store.remove(store.getIdentity(obj),store.getRevision(obj))
     25                        .then(lang.hitch(this,function(){
     26                            this._refresh();
     27                        }));
     28                    })
     29                };
    630                this._refresh();
    731            },
    … …  
    933                this.containerTemplates.set('content','');
    1034                this.containerSessions.set('content','');
    11                 this._refreshByType('SessionTemplate',this.containerTemplates.domNode);
    12                 this._refreshByType('SessionInstance',this.containerSessions.domNode);
     35                this._refreshByType('SessionTemplate',this.containerTemplates.domNode,this.templateActions);
     36                this._refreshByType('SessionInstance',this.containerSessions.domNode,this.sessionActions);
    1337            },
    14             _refreshByType: function(type,container) {
     38            _refreshByType: function(type,container,actions) {
    1539                store.query("_design/default/_view/by_type",{key:type})
    1640                .forEach(lang.hitch(this,function(obj){
    1741                    var widget = new ObjectBox({
    18                         title: obj.title || "Untitled",
    19                         actions: {
    20                             "Edit": function(){alert('Custom edit code');},
    21                             "Delete": lang.hitch(this,function(){
    22                                 store.remove(store.getIdentity(obj),store.getRevision(obj))
    23                                 .then(lang.hitch(this,function(){
    24                                     this._refresh();
    25                                 }));
    26                             }),
    27                             "Custom function": function(){alert('newCommand');},
    28                             "Publish": lang.hitch(this,this._publishSession,obj)
    29                         }
    30                     });
     42                        actions: actions
     43                    }).placeAt(container, "last");
    3144                    widget.startup();
    32                     widget.placeAt(container, "last");
     45                    widget.set('value',obj);
    3346                }));
    3447            },
    3548            onAddSessionTemplate: function(){
    3649                store.put({
    37                     type: 'SessionTemplate',
    38                     title: 'TeamUp Basic Template'
     50                    type: 'SessionTemplate'
    3951                })
    40                 .then(lang.hitch(this,function(){
    41                     this._refresh();
     52                .then(lang.hitch(this,function(obj){
     53                    content.goTo('session',{uid:store.getIdentity(obj)});
    4254                }));
    4355            },
    4456            _publishSession: function(sessionTemplate) {
    4557                var publishDate = new Date();
    46                 var session = {
    47                     type: "SessionInstance",
    48                     title: sessionTemplate.title,
    49                     date: publishDate.getDate()+"-"+publishDate.getMonth()+"-"+publishDate.getFullYear(),
    50                     creator: "Igor Mayer"
    51                 };
     58                var session = lang.clone(sessionTemplate);
     59                delete session[store.idProperty];
     60                delete session[store.revProperty];
     61                session.type = "SessionInstance";
     62                session.date = publishDate.getDate()+"-"+publishDate.getMonth()+"-"+publishDate.getFullYear();
     63                session.creator = "Igor Mayer";
    5264                store.add(session)
    5365                .then(lang.hitch(this,function(){
    5466                    this._refresh();
     67                    this.tabContainer.selectChild(this.sessionsTab);
    5568                }));
    5669            }

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

    r354 r359  
    4040   
    4141    // pages -> load dynamically?
     42    'rft/pages/index',
    4243    'rft/pages/questions',
     44    'rft/pages/session',
    4345    'rft/pages/sessions',
    4446    'rft/pages/surveys',

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

    r352 r359  
    5656                                            Accept: this.accepts
    5757                                    }
    58                             }).then(function(result){
     58                            }).then(lang.hitch(this,function(result){
    5959                    if ( result.error ) {
    6060                        dfd.reject(result.reason);
    … …  
    6464                        dfd.resolve(object);
    6565                    }
    66                 }, function(err){
     66                }), function(err){
    6767                    dfd.reject(err);
    6868                });

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

    r350 r359  
    1111            baseClass: "rftObjectBox",
    1212            templateString: template,
    13            
    14             constructor: function() {
    15                 this.title = "";
    16                 this.subTitle = "";
    17                 this.lowerTitle = "";
    18                 this.objectType = "SessionTemplate";
    19                 this.actions = {}
    20                
    21             },
    22             postCreate: function() {
     13            value: null,
     14            actions: null,
     15            startup: function() {
    2316                this.line1 = new LineWithActionsWidget({
    24                     title: this.title || "Untitled",
    2517                    modifiers: 'green',
    2618                    actions: {
    2719                        "inspectIcon": {
    28                             callback: lang.hitch(this, "_inspectObject"),
     20                            callback: lang.hitch(this, this._showInfoBox),
    2921                            properties: {
    3022                                blockButton: false,
    … …  
    3628                }).placeAt(this.line1Node);
    3729                this.line2 = new LineWithActionsWidget({
    38                     title: this.subTitle || "",
    39                     modifiers: 'green',
    40                     actions: {}
     30                    modifiers: 'green'
    4131                }).placeAt(this.line1Node);
    4232                var line3Actions = this._createLine3Actions();
    4333                this.line3 = new LineWithActionsWidget({
    44                     title: this.lowerTitle || "",
    4534                    modifiers: 'green',
    4635                    actions: line3Actions
    … …  
    5241            },
    5342            _createLine3Actions: function() {
    54                 var ac = {};
    55                 if (this.actions["edit"]) {
    56                     ac["edit"] = {
    57                         callback: lang.hitch(this, "_editObject", this.actions["edit"]),
    58                         properties: {
    59                             blockButton: true,
    60                             label: "Edit/View",
    61                             modifiers: "trans",
    62                             icon: "Edit"
    63                         }
    64                     };
    65                     delete this.actions["edit"];
    66                 }
    67                 if (this.actions["delete"]) {
    68                     ac["delete"] = {
    69                         callback: lang.hitch(this, "_deleteObject", this.actions["delete"]),
    70                         properties: {
    71                             blockButton: true,
    72                             label: "Delete",
    73                             modifiers: "trans",
    74                             icon: "Delete"
    75                         }
    76                     };
    77                     delete this.actions["delete"];
    78                 }
    79                 for (action in this.actions) {
    80                     ac[action] = {
    81                         callback: lang.hitch(this, this.actions[action]),
     43                var line3Actions = {};
     44                for (var action in this.actions) {
     45                    line3Actions[action] = {
     46                        callback: lang.hitch(this, function(callback){
     47                            this.value && callback(this.value);
     48                        }, this.actions[action]),
    8249                        properties: {
    8350                            blockButton: true,
    … …  
    8653                            icon: action.charAt(0).toUpperCase()+action.slice(1)
    8754                        }
    88                     }
     55                    };
    8956                }
    90                 return ac;
     57                return line3Actions;
    9158            },
    92            
    93             _setObjectReference: function(identifier) {
    94             // TODO: Set this ObjectBox to refer to a certain database object
    95         },
    96         _getObjectInfo: function() {
    97             // TODO: Query the database and retrieve a JSON array of object properties
    98         },
    99         _inspectObject: function() {
    100             // TODO: Get object information (or retrieve from cache), then display in popup
    101         },
    102         _editObject: function(customFunction) {
    103             // TODO: Pass an edit call to the page script, along with reference to the object contained in this ObjectBox
    104             alert("Default edit code");
    105             customFunction();
    106         },
    107         _deleteObject: function(customFunction) {
    108             // TODO: Pass a delete call to the page script, along with reference to the object contained in this ObjectBox
    109             customFunction();
    110         },
    111            
    112            
    113         _setTitleAttr: function(value) {
    114             this.title = value;
    115             if (this.line1 && this.line1.set) {
    116                 this.line1.set('title', this.title);
     59            _showInfoBox: function() {
     60                alert(this.value.description);
     61            },
     62            _setValueAttr: function(value) {
     63                this.value = value;
     64                this._refresh();
     65            },
     66            _getValueAttr: function(value) {
     67                this.value = value;
     68            },
     69            _refresh: function() {
     70                if ( this.value !== null ) {
     71                    this.iconNode.className = "rftIcon typeIcon rftIcon"+(this.value.type || '');
     72                    this.line1.set('title', this.value.title || '');
     73                    this.line2.set('title', this.value.subTitle || '');
     74                    this.line3.set('title', this.value.lowerTitle || '');
     75                }
    11776            }
    118         },
    119         _setSubTitleAttr: function(value) {
    120             this.subTitle = value;
    121             if (this.line2 && this.line2.set) {
    122                 this.line2.set('title', this.subTitle);
    123             }
    124         },
    125         _setLowerTitleAttr: function(value) {
    126             this.lowerTitle = value;
    127             if (this.line3 && this.line3.set) {
    128                 this.line3.set('title', this.lowerTitle);
    129             }
    130         },
    131         _setObjectTypeAttr: function(value) {
    132             this.objectType = value;
    133             this.iconNode.className = "rftIcon typeIcon rftIcon"+this.objectType;
    134         },
    135 
    136         /* This is an experiment to embed the creation function in the ObjectBox class itself. This method cannot be static, but can be called externally as such:
    137          * rft.ui.ObjectBox().CreateNew(args, ref, loc);
    138          * TODO: Check with Hendrik if I should do this or not!
    139          * */
    140          CreateNew: function(arguments, reference, location) {
    141             var newBox = new rft.ui.ObjectBox(arguments);
    142             newBox.startup();
    143             newBox.placeAt(reference, location);
    144         }
     77        });
    14578    });
    146 });

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

    r344 r359  
    11<div class="${baseClass}">
    2     <div class="rftIcon typeIcon rftIcon${objectType}" data-dojo-attach-point="iconNode"></div>
     2    <div data-dojo-attach-point="iconNode"></div>
    33    <div data-dojo-attach-point="line1Node"></div>
    44    <div data-dojo-attach-point="line2Node"></div>
Note: See TracChangeset for help on using the changeset viewer.