source: Dev/branches/rest-dojo-ui/client/rft/ui/QuestionEditorToolkit.js @ 389

Last change on this file since 389 was 389, checked in by hendrikvanantwerpen, 13 years ago
File size: 7.3 KB
Line 
1define([
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    '../store',
14    './lists/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], {
18
19            templateString: template,
20            _list: null,
21            _categorySelect: null,
22            _categoryStore: null,
23            _topicSelect: null,
24            _topicStore: null,
25            _categories : null,
26
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                }],
89
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            _setValueAttr: 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            _getValueAttr: function() {
117                var value = this.propertiesForm.get('value');
118                value.categories = this._categories;
119                return value;
120            },
121            onCategoryAdd: function() {
122                this._addCategory(this._categorySelect.get('displayedValue'));
123                this._categorySelect.reset();
124            },
125            _creator: function(item, hint) {
126                var node;
127                if (hint == "avatar") {
128                    node = domConstruct.create('span',{
129                        innerHTML: item.label
130                    });
131                } else {
132                    var w = new Button({
133                        baseClass: "rftLargeButton",
134                        iconClass: "rftIcon rftIcon"+item.icon,
135                        label: item.label,
136                        showLabel: true,
137                        'class': "newline"
138                    });
139                    node = w.domNode;
140                }
141                return {node: node, data: item.content, type: ["questionContent"]};
142            },
143            _setupListView: function() {
144                this._list = new CategoryListView( {
145                    removeCallback: lang.hitch(this, this._removeCategory)
146                }).placeAt(this.listNode);
147                for (var category in this._categories) {
148                    this._list.appendItem(this._categories[category]);
149                }   
150                this._list.startup();
151            },
152            _setupCategories: function() {
153                this._categoryStore = new Memory({data: [] });
154                store.query("_design/default/_view/questions", {reduce:true, group:false, group_level:1})
155                .forPairs(lang.hitch(this, function(value, key) {
156                    this._categoryStore.put({ id: key[0] });
157                }));
158                this._categorySelect = new ComboBox( {
159                    id: "categoriesBox",
160                    name: "categories",
161                    store: this._categoryStore,
162                    searchAttr: "id"
163                }, "categoriesBox");
164                this._supportingWidgets.push(this._categorySelect);
165
166            },
167            _setupTopic: function(topic) {
168                this._topicStore = new Memory( {data: [] });
169                store.query("_design/default/_view/topics", {reduce:true, group:true})
170                .forPairs(lang.hitch(this, function(value, key) {
171                    this._topicStore.put({ id: key });
172                }));
173                this._topicSelect = new ComboBox( {
174                    id: "topicBox",
175                    name: "topic",
176                    store: this._topicStore,
177                    searchAttr: "id",
178                    value: topic
179                }, "topicBox");
180                this._supportingWidgets.push(this._topicSelect);
181            },
182            _addCategory: function(item) {
183                this._categories.push(item);
184                this._list.appendItem(item);
185            },
186            _removeCategory: function(item) {
187                this._categories.splice(this._categories.indexOf(item), 1);
188            }
189
190        });
191    });
Note: See TracBrowser for help on using the repository browser.