Add on_update and associated demo.

akoprow · Mar 1, 2012 · 255bdfd · 255bdfd
1 parent f5ce475
commit 255bdfd
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 3 deletions.
diff --git a/jquery-ui-demo.opa b/jquery-ui-demo.opa
@@ -9,6 +9,7 @@ module Sortable {
     { name: "Sortable"
     , pages:
         [ {name: "Default functionality", show: default_functionality }
+         ,{name: "on_update"            , show: on_update_demo }
         ]
     }
 
@@ -20,9 +21,33 @@ module Sortable {
       jQueryUI.Sortable.mk_sortable(#sortable)
       jQueryUI.Sortable.disable_selection(#sortable)
     }
-    <ul id=sortable onready={mk_sortable}>
-      {List.init(mk_entry, 7)}
-    </ul>
+    <div>
+      <ul id=sortable onready={mk_sortable}>
+        {List.init(mk_entry, 7)}
+      </ul>
+    </div>
+  }
+
+  client function on_update_demo() {
+    function mk_entry(i) {
+      <li id={i}><div class="alert alert-info">Item #{i}</></>
+    }
+    function on_update() {
+      children = Dom.split(Dom.select_children(#sortable))
+      l = List.map( function(d) { Dom.get_id(d) }, children)
+      #sorting = "sorting is: " ^ String.concat(", ", l)
+    }
+    function mk_sortable(_) {
+      jQueryUI.Sortable.mk_sortable(#sortable)
+      jQueryUI.Sortable.disable_selection(#sortable)
+      jQueryUI.Sortable.on_update(#sortable, on_update)
+    }
+    <div>
+      <span id=sorting/>
+      <ul id=sortable onready={mk_sortable}>
+        {List.init(mk_entry, 7)}
+      </ul>
+    </div>
   }
 
 }

diff --git a/packages/jQueryUI/jQueryUI.opa b/packages/jQueryUI/jQueryUI.opa
@@ -14,6 +14,11 @@ module jQueryUI {
       %%JQueryUI.disable_selection%%(elt)
     }
 
+    function void on_update(dom, f) {
+      elt = Dom.of_selection(dom)
+      %%JQueryUI.sortable_on_update%%(elt,f)
+    }
+
   }
 
 }
diff --git a/packages/jQueryUI/jQueryUI/jQueryUI.js b/packages/jQueryUI/jQueryUI/jQueryUI.js
@@ -13,3 +13,10 @@
     dom.disableSelection();
     return js_void;
 }
+
+##register sortable_on_update : Dom.private.element, ( -> void) -> void
+##args(dom, on_update)
+{
+return dom.bind( "sortupdate", function(event, ui) { on_update(); } );
+}
+