Usability
authorsenator <lebbeous@esilibrary.com>
Wed, 13 Apr 2011 21:12:47 +0000 (17:12 -0400)
committersenator <lebbeous@esilibrary.com>
Wed, 13 Apr 2011 21:12:47 +0000 (17:12 -0400)
1) the tree editor will only let bool_op nodes have children

2) you can't put the unset "dummy" node from the leftside onto the tree

incidentally, gave fm objects a toString method that identifies their
classname hint, as an aid to debugging in general

Open-ILS/web/js/dojo/fieldmapper/Fieldmapper.js
Open-ILS/web/js/dojo/openils/vandelay/TreeDndSource.js
Open-ILS/web/js/dojo/openils/vandelay/TreeStoreModel.js
Open-ILS/web/js/dojo/openils/vandelay/nls/match_set.js [new file with mode: 0644]
Open-ILS/web/js/ui/default/vandelay/match_set.js
Open-ILS/web/templates/default/vandelay/match_set.tt2

index bb369c6..df8b73b 100644 (file)
@@ -87,6 +87,14 @@ if(!dojo._hasResource["fieldmapper.Fieldmapper"]){
                 return true;
             }
             return;
+        },
+
+        toString : function() {
+            /* ever so slightly aid debugging */
+            if (this.classname)
+                return "[object fieldmapper." + this.classname + "]";
+            else
+                return Object.prototype.toString();
         }
 
     });
index 9043884..6438132 100644 (file)
@@ -1,16 +1,29 @@
 dojo.provide("openils.vandelay.TreeDndSource");
 dojo.require("dijit._tree.dndSource");
 
+/* This class specifically serves the eg/vandelay/match_set interface
+ * for editing Vandelay Match Set trees.  It should probably  have a more
+ * specific name that reflects that.
+ */
 dojo.declare(
     "openils.vandelay.TreeDndSource", dijit._tree.dndSource, {
         "checkItemAcceptance": function(target, source, position) {
-            /* Here we'll return false if source has no fm object in the right place */
-            console.log(
-                "target: " + dijit.getEnclosingWidget(target).item.name +
-                " source: " + source +
-                " position: " + position
+            return (
+                source._ready && (
+                    position != "over" ||
+                    this.tree.model.mayHaveChildren(
+                        dijit.getEnclosingWidget(target).item
+                    )
+                )
             );
-            return true;
+            /* code in match_set.js makes sure that source._ready gets set true
+             * only when we want the item to be draggable */
+        },
+        "itemCreator": function(nodes) {
+            var default_items = this.inherited(arguments);
+            for (var i = 0; i < default_items.length; i++)
+                default_items[i].match_point = nodes[i].match_point;
+            return default_items;
         }
     }
 );
index 72261eb..61d2821 100644 (file)
@@ -1,11 +1,18 @@
 dojo.provide("openils.vandelay.TreeStoreModel");
 dojo.require("dijit.tree.TreeStoreModel");
+dojo.require("openils.Util");
+
+/* This class specifically serves the eg/vandelay/match_set interface
+ * for editing Vandelay Match Set trees.  It should probably  have a more
+ * specific name that reflects that.
+ */
 
 function _simple_item(model, item) {
     /* Instead of model.getLabel(), could do
      * model.store.getValue(item, "blah") or something like that ... */
     return {
         "label": model.getLabel(item),
+        "match_point": String(model.store.getValue(item, "match_point")),
         "children": {}
     };
 }
@@ -32,6 +39,17 @@ dojo.declare(
                     }
                 );
             }
+        },
+        "mayHaveChildren": function(item) {
+            var match_point = this.store.getValue(item, "match_point");
+            if (match_point)
+                return openils.Util.isTrue(match_point.bool_op());
+            else
+                return true;
         }
+//        "newItem": function(args, parent) {
+//            if (!this.mayHaveChildren(parent)) return;
+//            return this.inherited(arguments);
+//        }
     }
 );
diff --git a/Open-ILS/web/js/dojo/openils/vandelay/nls/match_set.js b/Open-ILS/web/js/dojo/openils/vandelay/nls/match_set.js
new file mode 100644 (file)
index 0000000..1b9f01b
--- /dev/null
@@ -0,0 +1,3 @@
+{
+    "DEFINE_MP": "Define this match point using the above fields, then drag me to the tree on the right."
+}
index 1e51b1a..7d6a74f 100644 (file)
@@ -1,9 +1,9 @@
-dojo.require("dojo.data.ItemFileWriteStore");
 dojo.require("dijit.Tree");
 dojo.require("dijit.form.Button");
+dojo.require("dojo.data.ItemFileWriteStore");
+//dojo.require("openils.vandelay.DndSource");
 dojo.require("dojo.dnd.Source");
-dojo.require("dijit._tree.dndSource");
-//dojo.require("openils.vandelay.TreeDndSource");
+dojo.require("openils.vandelay.TreeDndSource");
 dojo.require("openils.vandelay.TreeStoreModel");
 dojo.require("openils.CGI");
 dojo.require("openils.User");
@@ -11,6 +11,7 @@ dojo.require("openils.Util");
 dojo.require("openils.PermaCrud");
 dojo.require("openils.widget.ProgressDialog");
 
+var localeStrings;
 var node_editor;
 var _crads;
 var CGI;
@@ -128,14 +129,14 @@ function NodeEditor() {
 
     this.update_draggable = function(draggable) {
         var s = "";
-        draggable.data = {"match_point": new vmsp()};
+        draggable.match_point = new vmsp();
         var had_op = false;
         dojo.query("[fmfield]", this.node_editor_container).forEach(
             function(control) {
                 var used_svf = null;
                 var field = dojo.attr(control, "fmfield");
                 var value = _simple_value_getter(control);
-                draggable.data.match_point[field](value);
+                draggable.match_point[field](value);
 
                 if (field == "subfield")
                     s += " \u2021";
@@ -165,6 +166,7 @@ function NodeEditor() {
             }
         );
         dojo.attr(draggable, "innerHTML", s);
+        this.dnd_source._ready = true;
     };
 
     this._add_consistent_controls = function(tgt) {
@@ -187,10 +189,7 @@ function NodeEditor() {
         /* a representation, not the editing widgets, but will also carry
          * the fieldmapper object when dragged to the tree */
         var draggable = dojo.create(
-            "li", {
-                "innerHTML": "Define your match point and drag me<br/>" +
-                    "to the tree on the right"
-            }
+            "li", {"innerHTML": localeStrings.DEFINE_MP}
         );
 
         /* these are the editing widgets */
@@ -214,6 +213,7 @@ function NodeEditor() {
         dojo.place(table, this.node_editor_container, "only");
         /* XXX around here attach other data structures to the node */
         this.dnd_source.insertNodes(false, [draggable]);
+        this.dnd_source._ready = false;
     };
 
     this._init.apply(this, arguments);
@@ -281,6 +281,9 @@ function dojoize_match_set_tree(point, refgen) {
 function init_test() {
     progress_dialog.show(true);
 
+    dojo.requireLocalization("openils.vandelay", "match_set");
+    localeStrings = dojo.i18n.getLocalization("openils.vandelay", "match_set");
+
     CGI = new openils.CGI();
 
     /* XXX No-one should have hundreds of these or anything, but theoretically
@@ -319,20 +322,21 @@ function init_test() {
         store: store, "query": {"id": "root"}
     });
 
+    var src = new dojo.dnd.Source("src_here");
     var tree = new dijit.Tree(
         {
             "model": treeModel,
-            "dndController": dijit._tree.dndSource,
+            "dndController": openils.vandelay.TreeDndSource,
             "dragThreshold": 8,
             "betweenThreshold": 5,
             "persist": false
-        }, "treeOne"
+        }, "tree_here"
     );
 
-    node_editor = new NodeEditor(mysrc, "node-editor-container");
+    node_editor = new NodeEditor(src, "node-editor-container");
 
     dojo.connect(
-        mysrc, "onDndDrop", null,
+        src, "onDndDrop", null,
         function(source, nodes, copy, target) {
             if (source == this) {
                 var model = target.tree.model;
@@ -345,7 +349,7 @@ function init_test() {
                 );
                 node_editor.clear();  /* because otherwise this acts like a copy! */
             } else {
-                alert("XXX [mysrc] nodes length is " + nodes.length); /* XXX DEBUG */
+                alert("XXX [src] nodes length is " + nodes.length); /* XXX DEBUG */
             }
         }
     );
index 7883cf4..fe5def0 100644 (file)
         <div>
             <form id="node-editor-container" onsubmit="return false;"></form>
         </div>
-        <ul dojoType="dojo.dnd.Source" jsId="mysrc"></ul>
+        <ul id="src_here"></ul>
     </div>
 
     <div style="float: right; width: 50%">
         <div><big>Your Expression</big></div>
-        <div id="treeOne"></div>
+        <div id="tree_here"></div>
     </div>
 </div>
 <div jsId="progress_dialog" dojoType="openils.widget.ProgressDialog"></div>