- Timestamp:
- 07/30/12 00:19:37 (13 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
Dev/branches/rest-dojo-ui/client/rft/ui/QuestionEditorToolkit.js
r384 r387 1 1 define([ 2 'dojo/_base/declare', 3 'dojo/_base/lang', 4 'dojo/_base/array', 5 'dijit/_WidgetBase', 6 'dijit/_Container', 7 'dojo/dom-construct', 8 'rft/store', 9 'rft/ui/QuestionEditorPreviewItem', 10 'rft/ui/CategoryListView', 11 'dijit/_TemplatedMixin', 12 'dijit/_WidgetsInTemplateMixin', 13 'dijit/form/ComboBox', 14 'dojo/text!./templates/QuestionEditorToolkit.html' 15 ], function(declare, lang, baseArray, _WidgetBase, _Container, domConstruct, store, QuestionEditorPreviewItem, CategoryListView, _TemplatedMixin, _WidgetsInTemplateMixin, ComboBox, template) { 16 return declare("rft.ui.QuestionEditorToolkit", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _Container], { 2 'dojo/_base/declare', 3 'dojo/_base/lang', 4 'dojo/dnd/Source', 5 'dojo/dom-construct', 6 'dojo/store/Memory', 7 'dijit/_Container', 8 'dijit/_TemplatedMixin', 9 'dijit/_WidgetBase', 10 'dijit/_WidgetsInTemplateMixin', 11 'dijit/form/Button', 12 'dijit/form/ComboBox', 13 'rft/store', 14 'rft/ui/CategoryListView', 15 'dojo/text!./templates/QuestionEditorToolkit.html' 16 ], function(declare, lang, Source, domConstruct, Memory, _Container, _TemplatedMixin, _WidgetBase, _WidgetsInTemplateMixin, Button, ComboBox, store, CategoryListView, template) { 17 return declare("rft.ui.QuestionEditorToolkit", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _Container], { 17 18 18 19 20 21 22 23 24 19 templateString: template, 20 _list: null, 21 _categorySelect: null, 22 _categoryStore: null, 23 _topicSelect: null, 24 _topicStore: null, 25 _categories : null, 25 26 26 // constructor: function() { 27 // lang.mixin(this, arguments); 28 // }, 27 _contentItems: [{ 28 label: "Header", 29 content: { 30 type: "Header" 31 }, 32 icon: "Header" 33 },{ 34 label: "Text", 35 content: { 36 type: "Text" 37 }, 38 icon: "TextBox" 39 },{ 40 label: "Image", 41 content: { 42 type: "Image" 43 }, 44 icon: "Image" 45 },{ 46 label: "External media", 47 content: { 48 type: "ExternalMedia" 49 }, 50 icon: "External" 51 },{ 52 label: "Divider", 53 content: { 54 type: "Divider" 55 }, 56 icon: "Divider" 57 }], 58 _inputsItems: [{ 59 label: "Free text", 60 content: { 61 type: "FreeTextInput" 62 }, 63 icon: "Text" 64 },{ 65 label: "Integer", 66 content: { 67 type: "IntegerInput" 68 }, 69 icon: "Integer" 70 },{ 71 label: "Scale", 72 content: { 73 type: "ScaleInput" 74 }, 75 icon: "Scale" 76 },{ 77 label: "Cards", 78 content: { 79 type: "CardsInput" 80 }, 81 icon: "Cards" 82 },{ 83 label: "Multiple Choice", 84 content: { 85 type: "MultipleChoiceInput" 86 }, 87 icon: "MultipleChoice" 88 }], 29 89 30 postCreate: function(){ 31 this.contentSource = new dojo.dnd.Source(this.ToolkitContentSourceNode, { 32 accept: [], 33 horizontal: false, 34 withHandles: false, 35 copyOnly: true, 36 selfCopy: false, 37 selfAccept: false, 38 singular: true, 39 creator: this._creator 40 }); 41 this.inputsSource = new dojo.dnd.Source(this.ToolkitInputsSourceNode, { 42 accept: [], 43 horizontal: false, 44 withHandles: false, 45 copyOnly: true, 46 selfCopy: false, 47 selfAccept: false, 48 singular: true, 49 creator: this._creator 50 }); 51 var contentItems = this._contentItems(); 52 var inputsItems = this._inputsItems(); 53 this.contentSource.insertNodes(false, contentItems); 54 this.inputsSource.insertNodes(false, inputsItems); 55 }, 56 loadQuestion: function(question) { 57 this.propertiesForm.set('value', question); 58 this._categories = question.categories; 59 this._setupListView(); 60 this._setupCategories(); 61 this._setupTopic(question.topic); 62 }, 63 onCategoryAdd: function() { 64 this._addCategory(this._categorySelect.get('displayedValue')); 65 this._categorySelect.reset(); 66 }, 67 _creator: function(item, hint) { 68 var node; 69 if (hint == "avatar") { 70 node = document.createElement("span"); 71 node.innerHTML = item.widgetType; 72 return {node: node, data: item, type: "ToolkitItem"}; 73 } else { 74 var w = new dijit.form.Button({ 75 baseClass: "rftLargeButton", 76 iconClass: "rftIcon rftIcon"+item.icon, 77 label: item.label, 78 showLabel: true, 79 class: "newline" 80 }); 81 return {node: w.domNode, data: item.objectData, type: "ToolkitItem"}; 82 } 83 }, 84 _setupListView: function() { 85 this._list = new CategoryListView( { 86 removeCallback: lang.hitch(this, this._removeCategory) 87 }).placeAt(this.listNode); 88 for (var category in this._categories) { 89 this._list.appendItem(this._categories[category]); 90 } 91 this._list.startup(); 92 }, 93 _setupCategories: function() { 94 this._categoryStore = new dojo.store.Memory({data: [] }); 95 store.query("_design/default/_view/questions", {reduce:true, group:false, group_level:1}) 96 .forPairs(lang.hitch(this, function(value, key) { 97 this._categoryStore.put({ id: key[0] }); 98 })); 99 this._categorySelect = new ComboBox( { 100 id: "categoriesBox", 101 name: "categories", 102 store: this._categoryStore, 103 searchAttr: "id" 104 }, "categoriesBox"); 105 this._supportingWidgets.push(this._categorySelect); 90 postCreate: function(){ 91 this.inherited(arguments); 92 this.contentSource = new Source(this.ToolkitContentSourceNode, { 93 accept: [], 94 copyOnly: true, 95 selfAccept: false, 96 singular: true, 97 creator: this._creator 98 }); 99 this.inputsSource = new Source(this.ToolkitInputsSourceNode, { 100 accept: [], 101 copyOnly: true, 102 selfAccept: false, 103 singular: true, 104 creator: this._creator 105 }); 106 this.contentSource.insertNodes(false, this._contentItems); 107 this.inputsSource.insertNodes(false, this._inputsItems); 108 }, 109 loadQuestion: function(question) { 110 this.propertiesForm.set('value', question); 111 this._categories = question.categories; 112 this._setupListView(); 113 this._setupCategories(); 114 this._setupTopic(question.topic); 115 }, 116 onCategoryAdd: function() { 117 this._addCategory(this._categorySelect.get('displayedValue')); 118 this._categorySelect.reset(); 119 }, 120 _creator: function(item, hint) { 121 var node; 122 if (hint == "avatar") { 123 node = domConstruct.create('span',{ 124 innerHTML: item.label 125 }); 126 } else { 127 var w = new Button({ 128 baseClass: "rftLargeButton", 129 iconClass: "rftIcon rftIcon"+item.icon, 130 label: item.label, 131 showLabel: true, 132 'class': "newline" 133 }); 134 node = w.domNode; 135 } 136 return {node: node, data: item, type: ["questionContent"]}; 137 }, 138 _setupListView: function() { 139 this._list = new CategoryListView( { 140 removeCallback: lang.hitch(this, this._removeCategory) 141 }).placeAt(this.listNode); 142 for (var category in this._categories) { 143 this._list.appendItem(this._categories[category]); 144 } 145 this._list.startup(); 146 }, 147 _setupCategories: function() { 148 this._categoryStore = new Memory({data: [] }); 149 store.query("_design/default/_view/questions", {reduce:true, group:false, group_level:1}) 150 .forPairs(lang.hitch(this, function(value, key) { 151 this._categoryStore.put({ id: key[0] }); 152 })); 153 this._categorySelect = new ComboBox( { 154 id: "categoriesBox", 155 name: "categories", 156 store: this._categoryStore, 157 searchAttr: "id" 158 }, "categoriesBox"); 159 this._supportingWidgets.push(this._categorySelect); 106 160 107 161 }, 108 162 _setupTopic: function(topic) { 109 this._topicStore = new dojo.store.Memory( {data: [] });110 111 112 113 114 115 116 117 118 119 120 121 163 this._topicStore = new Memory( {data: [] }); 164 store.query("_design/default/_view/topics", {reduce:true, group:true}) 165 .forPairs(lang.hitch(this, function(value, key) { 166 this._topicStore.put({ id: key }); 167 })); 168 this._topicSelect = new ComboBox( { 169 id: "topicBox", 170 name: "topic", 171 store: this._topicStore, 172 searchAttr: "id", 173 value: topic 174 }, "topicBox"); 175 this._supportingWidgets.push(this._topicSelect); 122 176 }, 123 _addCategory: function(item) { 124 this._categories.push(item); 125 this._list.appendItem(item); 126 }, 127 _removeCategory: function(item) { 128 this._categories.splice(this._categories.indexOf(item), 1); 129 }, 130 _contentItems: function() { 131 // Returns an array of objects, from which to generate buttons to populate the ToolkitContentSource list. 132 return [ 133 { 134 label: "Header", 135 objectData: { 136 widgetType: "Header", 137 }, 138 icon: "Header" 139 }, 140 { 141 label: "Text", 142 objectData: { 143 widgetType: "Text", 144 }, 145 icon: "TextBox" 146 }, 147 { 148 label: "Image", 149 objectData: { 150 widgetType: "Image", 151 }, 152 icon: "Image" 153 }, 154 { 155 label: "External media", 156 objectData: { 157 widgetType: "ExternalMedia", 158 }, 159 icon: "External" 160 }, 161 { 162 label: "Divider", 163 objectData: { 164 widgetType: "Divider", 165 }, 166 icon: "Divider" 167 }]; 168 }, 169 _inputsItems: function() { 170 // Returns an array of objects, from which to generate buttons to populate the ToolkitInputsSource list. 171 return [ 172 { 173 label: "Free text", 174 objectData: { 175 widgetType: "FreeTextInput", 176 }, 177 icon: "Text" 178 }, 179 { 180 label: "Integer", 181 objectData: { 182 _id: null, 183 widgetType: "IntegerInput", 184 widgetProps: {} 185 }, 186 icon: "Integer" 187 }, 188 { 189 label: "Scale", 190 objectData: { 191 _id: null, 192 widgetType: "ScaleInput", 193 widgetProps: {} 194 }, 195 icon: "Scale" 196 }, 197 { 198 label: "Cards", 199 objectData: { 200 _id: null, 201 widgetType: "CardsInput", 202 widgetProps: {} 203 }, 204 icon: "Cards" 205 }, 206 { 207 label: "Multiple Choice", 208 objectData: { 209 _id: null, 210 widgetType: "MultipleChoiceInput", 211 widgetProps: {} 212 }, 213 icon: "MultipleChoice" 214 } 215 ]; 216 } 177 _addCategory: function(item) { 178 this._categories.push(item); 179 this._list.appendItem(item); 180 }, 181 _removeCategory: function(item) { 182 this._categories.splice(this._categories.indexOf(item), 1); 183 } 217 184 218 219 });185 }); 186 });
Note: See TracChangeset
for help on using the changeset viewer.
