Changeset 376 for Dev/branches/rest-dojo-ui/client/rft/ui/QuestionEditorPreviewItem.js

Timestamp:

07/25/12 16:04:02 (13 years ago)

Author:

jkraaijeveld

Message:

Started the QuestionEditorPreview? bit - now works with headers and texts, fully stores and restores this in order properly.

Note: there must be a better way for this, but seeing as all content pieces can differ greatly I couldn't think of a way to make it properly generic. @Hendrik: need discussion about this.

Note2: Currently I don't use any internal events in the question editor. Not sure if it would be a lot better we would.

File:

• Dev/branches/rest-dojo-ui/client/rft/ui/QuestionEditorPreviewItem.js (modified) (4 diffs)

Dev/branches/rest-dojo-ui/client/rft/ui/QuestionEditorPreviewItem.js

@@ -9 +9 @@
         'dijit/_WidgetsInTemplateMixin',
         'dijit/form/TextBox',
+        'rft/ui/PreviewWidgets/HeaderItem',
+        'rft/ui/PreviewWidgets/TextItem',
         'dojo/text!./templates/QuestionEditorPreviewItem.html',
-        ], function(declare, fx, _WidgetBase, domClass, lang, on, _TemplatedMixin, _WidgetsInTemplateMixin, TextBox, templateFull) {
+        ], function(declare, fx, _WidgetBase, domClass, lang, on, _TemplatedMixin, _WidgetsInTemplateMixin, TextBox, HeaderItem, TextItem, templateFull) {
                 return declare("rft.ui.QuestionEditorPreviewItem", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin], {
 
@@ -20 +22 @@
                         foldDuration: [250, 250],
                         animation: null,
-                        
+                        _editing: false,
+
                         postCreate: function() {
                                 this.foldButtonNode.onClick = lang.hitch(this, this.toggleFold);
+                                this.removeButtonNode.onClick = lang.hitch(this, this.removeObject);
+                                this.editButtonNode.onClick = lang.hitch(this, this.toggleEdit);
                                 if (this.item) {
                                         this._createInnerWidget();
@@ -32 +37 @@
                                         this.titleNode.innerHTML = title;
                                 });
+                        },
+                        toggleEdit: function() {
+                                if(this._editing) {
+                                        this.editButtonNode.iconNode.className = this.editButtonNode.iconNode.className.replace("rftIconAccept", "rftIconEdit");
+                                        this.editButtonNode.set("label", "Edit");
+                                        this.innerWidget.save();
+                                }
+                                else {
+                                        this.editButtonNode.iconNode.className = this.editButtonNode.iconNode.className.replace("rftIconEdit", "rftIconAccept");
+                                        this.editButtonNode.set("label", "Save");
+                                        this.innerWidget.edit();
+                                }
+                                this._editing = !this._editing;
                         },
                         toggleFold: function() {
@@ -65 +83 @@
                                 }
                         },
+                        getContent: function() {
+                                return {        data: this.innerWidget.getContent(),
+                                                        type: this.item.type };
+                        },
+                        removeObject: function(widget) {
+                                this.destroyRecursive();
+                        },
                         _createInnerWidget: function() {
                                 // This always creates a textbox as innerwidget pending creation of actual innerWidgets.
                                 // Introduce a better way to create these widgets than a switch statement, based on item.widgetType? Perhaps "new eval(item.widgetType)({});" ?
+                                this.innerWidget = eval("new "+ this.item.type + "({ disabled: true });");
+                                this.innerWidget.setContent(this.item.data);
+                                this.titleNode.innerHTML = this.item.type;
+                                /*
                                 switch (this.item.widgetType) {
                                         default:
-                                        this.innerWidget = new TextBox();
+                                        this.innerWidget = new HeaderItem({ disabled: true });
+                                        this.titleNode.innerHTML = "Header";
                                         break;
-                                }
+                                }*/
                                 this.innerWidget.placeAt(this.containerNode);
                         }