Changeset 379 for Dev/branches/rest-dojo-ui/client/rft/pages

Timestamp:

07/26/12 21:57:20 (13 years ago)

Author:

hendrikvanantwerpen

Message:

Changed SurveyListView? to more general OrderedDndList?.
Survey page has rudimentary properties dialog and saves included questions.
Fixed bug in store for null question.

Location:

Dev/branches/rest-dojo-ui/client/rft/pages

Files:

• survey.html (modified) (2 diffs)
• survey.js (modified) (5 diffs)

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

@@ -5 +5 @@
             <h2>
                 <span class="rftIcon rftIconSurvey"></span>
-                <span class="headerText" data-dojo-attach-point="header">Survey A [editing]</span>
+                <span class="headerText" data-rft-attach-point="titleNode">Survey Editor</span>
             </h2>
         </div>
@@ -18 +18 @@
 
             <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'bottom'">
-                <button data-rft-attach-point="btnProperties" data-dojo-type="dijit.form.Button" data-rft-attach-event="onClick:onProperties" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconProperties'">Properties</button>
-                <button data-rft-attach-point="btnSave" data-dojo-type="dijit.form.Button" data-rft-attach-event="onClick:onSave" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconAccept'">Save Changes</button>
-                <button data-rft-attach-point="btnDiscard" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconCancel'">Discard changes</button>
-                <button data-rft-attach-point="btnPreview" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconPreview'">Preview</button>
+                <button data-dojo-type="dijit.form.Button"
+                        data-rft-attach-event="onClick:_onShowProperties"
+                        data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconProperties'">
+                    Properties</button>
+                <button data-dojo-type="dijit.form.Button"
+                        data-rft-attach-event="onClick:_onSave"
+                        data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconAccept'">
+                    Save Changes</button>
+                <button data-dojo-type="dijit.form.Button"
+                        data-rft-attach-event="onClick:_onDiscard"
+                        data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconCancel'">
+                    Discard changes</button>
+                <button data-dojo-type="dijit.form.Button"
+                        data-rft-attach-event="onClick:_onShowPreview"
+                        data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconPreview'">
+                    Preview</button>
             </div>
         </div>
     </div>
+
+    <div data-dojo-type="dijit.Dialog"
+         title="Survey properties"
+         data-rft-attach-point="propertiesDialog"
+         data-rft-attach-event="onSubmit:_onPropertiesOk">
+
+        <form data-dojo-type="dijit.form.Form"
+              data-rft-attach-point="propertiesForm">
+            <label for="title">Title</label>
+            <input data-dojo-type="dijit.form.TextBox" name="title"/>
+        </form>
+            
+        <div>
+            <button data-dojo-type="dijit.form.Button"
+                    type="submit"
+                    data-rft-attach-event="onClick:_onPropertiesOk">
+                OK</button>
+            <button data-dojo-type="dijit.form.Button"
+                    type="button"
+                    data-rft-attach-event="onClick:_onPropertiesCancel">
+                Cancel</button>
+        </div>
+    </div>
+
 </div>

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

@@ -1 +1 @@
 define([
+    'dojo/_base/array',
     'dojo/_base/declare',
     'dojo/_base/Deferred',
@@ -7 +8 @@
     'rft/store',
     'rft/ui/_Page',
-    'rft/ui/SurveyListView',
+    'rft/ui/OrderedDndList',
     'rft/ui/TabbedQuestionBrowser'
     ],
-    function(declare,Deferred,event,lang,content,store,_Page,SurveyListView,TabbedQuestionBrowser){
+    function(array,declare,Deferred,event,lang,content,store,_Page,
+             OrderedDndList,TabbedQuestionBrowser){
         return declare('rft.pages.survey',[_Page],{
-            object: null,
-            listView: null,
+            survey: null,
+            questionList: null,
             _dataMap: null,
             constructor: function(){
@@ -20 +22 @@
             onVisit: function() {
                 if ( this.pageArgs.uid ) {
+                    this._setupQuestionBrowser();
+                    this._setupListView();
                     Deferred.when(store.get(this.pageArgs.uid))
                     .then(lang.hitch(this,function(obj){
-                        this.object = obj;
-                        return Deferred.when( obj.creator && store.dereference(obj.creator) );
+                        this.survey = obj;
+                        this.refresh();
                     }));
-                    this._setupQuestionBrowser();
-                    this._setupListView();
                 } else {
                     throw "No valid uid or survey passed!";
                 }
-            },
-            onProperties: function(evt) {
-
-            },
-            onSave: function(evt) {
-//                lang.mixin(this.object, this.propertiesForm.get('value'));
-                store.put(this.object)
-                .then(function() { 
-                    content.goTo('surveys');
-                });
-                event.stop(evt);
-                return false;
-            },
-            _goToPreview: function() {
-                content.goTo('surveyAdvanced', {uid: this.object._id});
             },
             _setupQuestionBrowser: function() {
@@ -52 +39 @@
                     selectedActions: {
                         "Include": {
-                            callback: lang.hitch(this,this.includeQuestion),
+                            callback: lang.hitch(this,this._includeQuestion),
                             icon: "Accept",
                             description: "Include in survey"
@@ -67 +54 @@
                 this.questionBrowser.startup();
             },
-            /* ListView code */
-            includeQuestion: function(question) {
-                var item = this.listView.insertItem(question);
+            _includeQuestion: function(question) {
+                this.questionList.insertItem(question);
             },
             _setupListView: function() {
-                this.listView = new SurveyListView({
-                    controller: this
+                this.questionList = new OrderedDndList({
+                    type: 'question',
+                    region: 'center'
                 }).placeAt(this.surveyListViewNode);
-                this.listView.startup();
+                this.questionList.startup();
+            },
+            refresh: function() {
+                this.titleNode.innerHTML = this.survey.title || "(set title in properties)";
+                this.propertiesForm.set('value',this.survey);
+                store.query(null,{keys:this.survey.questions,include_docs:true})
+                .forEach(lang.hitch(this.questionList,'appendItem'));
+            },
+            _onShowProperties: function(evt) {
+                this.propertiesDialog.show();
+            },
+            _onPropertiesOk: function(evt) {
+                this.propertiesDialog.hide();
+                lang.mixin(this.survey, this.propertiesForm.get('value'));
+                this.refresh();
+                event.stop(evt);
+                return false;
+            },
+            _onPropertiesCancel: function(evt) {
+                this.propertiesDialog.hide();
+                this.propertiesForm.set('value',this.survey);
+                event.stop(evt);
+                return false;
+            },
+            _onSave: function(evt) {
+                this.survey.questions = array.map(this.questionList.getItems(),function(item){
+                    return store.getIdentity(item);
+                });
+                store.put(this.survey)
+                .then(function() { 
+                    content.goTo('surveys');
+                });
+                event.stop(evt);
+                return false;
+            },
+            _onDiscard: function(evt) {
+            },
+            _onShowPreview: function() {
+                content.goTo('surveyAdvanced', {uid: store.getIdentity(this.survey)});
             }
         });