Changeset 428

Timestamp:

04/10/13 20:08:44 (12 years ago)

Author:

hendrikvanantwerpen

Message:

Allow Selector to be a drag source.

Location:

Dev/trunk/client/qed

Files:

• css/layout.less (modified) (1 diff)
• css/main.css (modified) (1 diff)
• model/widgets/QuestionEditorToolkit.js (modified) (1 diff)
• model/widgets/TabbedQuestionBrowser.js (modified) (2 diffs)
• widgets/Selector.js (modified) (6 diffs)
• widgets/list/List.js (modified) (1 diff)

Dev/trunk/client/qed/css/layout.less

@@ -273 +273 @@
 
                 .rftLineListView {
-                        max-width: 200px;
+                        max-width: 300px;
                         max-height: 500px;
                         

Dev/trunk/client/qed/css/main.css

@@ -466 +466 @@
 }
 #rft.claro .rftLineListView {
-  max-width: 200px;
+  max-width: 300px;
   max-height: 500px;
 }

Dev/trunk/client/qed/model/widgets/QuestionEditorToolkit.js

@@ -118 +118 @@
                 node = w.domNode;
             }
-            return {node: node, data: item, type: ["questionContent"]};
+            return {
+                node: node,
+                data: item,
+                type: ["questionContent"]
+            };
         },
         _setupListView: function() {

Dev/trunk/client/qed/model/widgets/TabbedQuestionBrowser.js

@@ -7 +7 @@
     'dojox/widget/Standby',
     '../../store',
-    '../../widgets/Selector',
-    'dojo/domReady!'
+    '../../widgets/Selector'
 ],function(declare,lang,win,ContentPane,TabContainer,Standby,store,Selector){
     return declare([TabContainer],{
@@ -75 +74 @@
                     __category: category,
                     __topic: topic,
+                    dndType: "question",
                     title: (topic || '[No topic]')+" ("+count+")",
                     selectedActions: this.selectedActions,

Dev/trunk/client/qed/widgets/Selector.js

@@ -1 +1 @@
 define([
-    'dojo/_base/array',
-    'dojo/_base/declare',
-    'dojo/_base/event',
-    'dojo/_base/lang',
-    'dojo/dom-class',
-    'dojo/fx',
-    'dojo/query',
-    'dijit/_Container',
-    'dijit/_TemplatedMixin',
-    'dijit/_WidgetBase',
-    'dijit/_WidgetsInTemplateMixin',
-    'dijit/registry',
-    './LineWithActionsWidget',
-    'dojo/text!./templates/Selector.html'
-],function(
-    baseArray,
-    declare,
-    event,
-    lang,
-    domClass,
-    fx,
-    query,
-    _Container,
-    _TemplatedMixin,
-    _WidgetBase,
-    _WidgetsInTemplateMixin,
-    registry,
-    LineWithActionsWidget,
-    templateString
-){
+    "./LineWithActionsWidget",
+    "dijit/_Container",
+    "dijit/_TemplatedMixin",
+    "dijit/_WidgetBase",
+    "dijit/_WidgetsInTemplateMixin",
+    "dijit/registry",
+    "dojo/_base/array",
+    "dojo/_base/declare",
+    "dojo/_base/event",
+    "dojo/_base/lang",
+    "dojo/dnd/Source",
+    "dojo/dom-class",
+    "dojo/dom-construct",
+    "dojo/fx",
+    "dojo/query",
+    "dojo/text!./templates/Selector.html"
+], function(LineWithActionsWidget, _Container, _TemplatedMixin, _WidgetBase, _WidgetsInTemplateMixin, registry, baseArray, declare, event, lang, Source, domClass, domConstruct, fx, query, templateString) {
+
     return declare([_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_Container],{
         templateString: templateString,
@@ -41 +29 @@
         //    description:
         //    icon:
-
+        dndType: null,
+
+        _source: null,
         _folded: true,
         _titleLine: null,
@@ -54 +44 @@
             this._createTitleLine();
             this._createSelectorLine();
+            if (this.dndType) {
+                this._createSource();
+            }
 
             fx.wipeOut({
@@ -103 +96 @@
             this._selectorLine.on('click',lang.hitch(this, this.onToggle));
         },
+        _createSource: function() {
+            this._source = new Source(this.optionsNode, {
+                singular: true,
+                delay: 5,
+                selfAccept: false,
+                copyOnly: true,
+                withHandles: this.withHandles,
+                creator: lang.hitch(this, "_createNode")
+            });
+        },
         _onSelect: function(item, widget) {
             this._selectedItem = item;
@@ -149 +152 @@
         },
 
-        addItem: function(item,displayTitle) {
+        addItem: function(item) {
+            if ( this._source ) {
+                this._source.insertNodes(false,[item]);
+            } else {
+                var node = this._createLineNode(item);
+                domConstruct.place(node, this.optionsNode, "last");
+            }
+        },
+        _createNode: function(item, hint) {
+            var node = hint === "avatar" ?
+                    this._createAvatarNode(item) : this._createLineNode(item);
+            return node && {
+                node: node,
+                data: lang.clone(item),
+                type: [this.dndType]
+            };
+        },
+        _createAvatarNode: function(item) {
+            return domConstruct.create("div",{
+                'class': 'dragAvatar',
+                innerHTML: item.title
+            });
+        },
+        _createLineNode: function(item) {
             var actions = {};
             var action;
@@ -167 +193 @@
             }
             var w = new LineWithActionsWidget({
-                title: displayTitle || item.title,
+                title: item.title,
                 actions: actions
-            }).placeAt(this.optionsNode);
+            });
             w.startup();
             w.on("click", lang.hitch(this, this._onSelect, item, w));
+            return w.domNode;
         },
 

Dev/trunk/client/qed/widgets/list/List.js

@@ -49 +49 @@
                 node: node,
                 data: item,
-                type: this.type
+                type: [this.type]
             };
         },