add context menu to xul list column headers
authorJason Etheridge <jason@esilibrary.com>
Fri, 30 Mar 2012 17:06:44 +0000 (13:06 -0400)
committerMike Rylander <mrylander@gmail.com>
Mon, 2 Apr 2012 16:43:41 +0000 (12:43 -0400)
for multi-sort options.  Also fix ascending vs descending internally (since the
distinction is now exposed via labels)

Signed-off-by: Jason Etheridge <jason@esilibrary.com>
Signed-off-by: Jason Stephenson <jstephenson@mvlc.org>
Signed-off-by: Mike Rylander <mrylander@gmail.com>
Open-ILS/web/opac/locale/en-US/lang.dtd
Open-ILS/xul/staff_client/chrome/content/util/list.js
Open-ILS/xul/staff_client/chrome/content/util/sort.js [new file with mode: 0644]
Open-ILS/xul/staff_client/server/OpenILS/util_overlay.xul

index e42c1a1..bffcaee 100644 (file)
 <!ENTITY common.textbox.delete "Delete">
 <!ENTITY common.textbox.select_all "Select All">
 
+<!ENTITY common.sort.first.ascending "Sort First (Ascending)">
+<!ENTITY common.sort.first.descending "Sort First (Descending)">
+<!ENTITY common.sort.next.ascending "Sort Next (Ascending)">
+<!ENTITY common.sort.next.descending "Sort Next (Descending)">
+
 <!ENTITY ilsevent.1000 "Login failed.  The username or password entered was incorrect.">
 <!ENTITY ilsevent.1001 "Login session has timed out or does not exist">
 <!ENTITY ilsevent.1002 "User was not found in the database">
index 2083ef5..b366579 100644 (file)
@@ -25,6 +25,7 @@ util.list = function (id) {
     JSAN.use('OpenILS.data'); this.data = new OpenILS.data(); this.data.stash_retrieve();
 
     JSAN.use('util.functional');
+    JSAN.use('util.widgets');
 
     return this;
 };
@@ -100,6 +101,9 @@ util.list.prototype = {
             var treecols = document.createElement('treecols');
             this.node.appendChild(treecols);
             this.treecols = treecols;
+            if (document.getElementById('column_sort_menu')) {
+                treecols.setAttribute('context','column_sort_menu');
+            }
 
             var check_for_id_collisions = {};
             for (var i = 0; i < this.columns.length; i++) {
@@ -122,6 +126,7 @@ util.list.prototype = {
                     treecol.setAttribute(j,value);
                 }
                 treecols.appendChild(treecol);
+
                 if (this.columns[i].type == 'checkbox') {
                     treecol.addEventListener(
                         'click',
@@ -139,49 +144,137 @@ util.list.prototype = {
                     );
                 } else {
                     treecol.addEventListener(
+                        'sort_first_asc',
+                        function(ev) {
+                            dump('sort_first_asc\n');
+                            ev.target.setAttribute('sortDir','asc');
+                            obj.first_sort = {
+                                'target' : ev.target,
+                                'sortDir' : 'asc'
+                            };
+                            obj.sub_sorts = [];
+                            util.widgets.dispatch('sort',ev.target);
+                        },
+                        false
+                    );
+                    treecol.addEventListener(
+                        'sort_first_desc',
+                        function(ev) {
+                            dump('sort_first_desc\n');
+                            ev.target.setAttribute('sortDir','desc');
+                            obj.first_sort = {
+                                'target' : ev.target,
+                                'sortDir' : 'desc'
+                            };
+                            obj.sub_sorts = [];
+                            util.widgets.dispatch('sort',ev.target);
+                        },
+                        false
+                    );
+                    treecol.addEventListener(
+                        'sort_next_asc',
+                        function(ev) {
+                            dump('sort_next_asc\n');
+                            ev.target.setAttribute('sortDir','asc');
+                            obj.sub_sorts.push({
+                                'target' : ev.target,
+                                'sortDir' : 'asc'
+                            });
+                            util.widgets.dispatch('sort',ev.target);
+                        },
+                        false
+                    );
+                    treecol.addEventListener(
+                        'sort_next_desc',
+                        function(ev) {
+                            dump('sort_next_desc\n');
+                            ev.target.setAttribute('sortDir','desc');
+                            obj.sub_sorts.push({
+                                'target' : ev.target,
+                                'sortDir' : 'desc'
+                            });
+                            util.widgets.dispatch('sort',ev.target);
+                        },
+                        false
+                    );
+
+                    treecol.addEventListener(
                         'click', 
                         function(ev) {
-                            if (ev.target.getAttribute('no_sort')) {
+                            dump('click\n');
+                            if (ev.button == 2 /* context menu click */ || ev.target.getAttribute('no_sort')) {
+                                return;
+                            }
+                            if (document.popupNode
+                                && document.popupNode.nodeName == 'treecol'
+                                && document.popupNode.hasAttribute('locked')
+                            ) {
                                 return;
                             }
+                            dump('click2\n');
 
-                            function do_it() {
-                                if (ev.ctrlKey) { // sub sort
-                                    var sortDir = 'asc';
-                                    if (ev.shiftKey) {
-                                        sortDir = 'desc';
-                                    }
-                                    obj.sub_sorts.push({
-                                        'target' : ev.target,
-                                        'sortDir' : sortDir
-                                    });
-                                } else { // first sort
-                                    var sortDir = ev.target.getAttribute('sortDir') || 'desc';
-                                    if (sortDir == 'desc') sortDir = 'asc'; else sortDir = 'desc';
-                                    if (ev.shiftKey) {
-                                        sortDir = 'desc';
-                                    }
-                                    ev.target.setAttribute('sortDir',sortDir);
-                                    obj.first_sort = {
-                                        'target' : ev.target,
-                                        'sortDir' : sortDir
-                                    };
-                                    obj.sub_sorts = [];
+                            if (ev.ctrlKey) { // sub sort
+                                dump('click3\n');
+                                var sortDir = 'asc';
+                                if (ev.shiftKey) {
+                                    sortDir = 'desc';
                                 }
-                                if (obj.first_sort) {
-                                    obj._sort_tree();
+                                ev.target.setAttribute('sortDir',sortDir);
+                                obj.sub_sorts.push({
+                                    'target' : ev.target,
+                                    'sortDir' : sortDir
+                                });
+                            } else { // first sort
+                                dump('click4\n');
+                                var sortDir = ev.target.getAttribute('sortDir') || 'desc';
+                                if (sortDir == 'desc') sortDir = 'asc'; else sortDir = 'desc';
+                                if (ev.shiftKey) {
+                                    sortDir = 'desc';
                                 }
+                                ev.target.setAttribute('sortDir',sortDir);
+                                obj.first_sort = {
+                                    'target' : ev.target,
+                                    'sortDir' : sortDir
+                                };
+                                obj.sub_sorts = [];
+                            }
+                            util.widgets.dispatch('sort',ev.target);
+                        },
+                        false
+                    );
+
+                    treecol.addEventListener(
+                        'sort',
+                        function(ev) {
+                            dump('sort\n');
+                            if (!obj.first_sort) {
+                                return;
+                            }
+                            dump('sort2\n');
+
+                            function do_it() {
+                                dump('sort3\n');
+                                obj._sort_tree();
                             }
 
-                            if (obj.row_count.total != obj.row_count.fleshed && (obj.row_count.total - obj.row_count.fleshed) > 50) {
-                                var r = window.confirm(document.getElementById('offlineStrings').getFormattedString('list.row_fetch_warning',[obj.row_count.fleshed,obj.row_count.total]));
+                            if (obj.row_count.total != obj.row_count.fleshed
+                                && (obj.row_count.total - obj.row_count.fleshed) > 50
+                            ) {
+                                var r = window.confirm(
+                                    document.getElementById('offlineStrings').getFormattedString(
+                                        'list.row_fetch_warning',
+                                        [obj.row_count.fleshed,obj.row_count.total]
+                                    )
+                                );
 
                                 if (r) {
                                     setTimeout( do_it, 0 );
                                 }
+
                             } else {
                                     setTimeout( do_it, 0 );
                             }
+
                         },
                         false
                     );
@@ -1706,14 +1799,14 @@ util.list.prototype = {
                                 var values;
                                 if (sorts[i].sortDir == 'asc') {
                                     values = normalize(
-                                        B['values'][i]['value'],
                                         A['values'][i]['value'],
+                                        B['values'][i]['value'],
                                         A['values'][i]['position']
                                     );
                                 } else {
                                     values = normalize(
-                                        A['values'][i]['value'],
                                         B['values'][i]['value'],
+                                        A['values'][i]['value'],
                                         A['values'][i]['position']
                                     );
                                 }
diff --git a/Open-ILS/xul/staff_client/chrome/content/util/sort.js b/Open-ILS/xul/staff_client/chrome/content/util/sort.js
new file mode 100644 (file)
index 0000000..083c243
--- /dev/null
@@ -0,0 +1,21 @@
+dump('entering util/sort.js\n');
+
+if (typeof util == 'undefined') var util = {};
+util.sort = {};
+
+util.sort.EXPORT_OK    = [ 
+    'dispatch'
+];
+util.sort.EXPORT_TAGS    = { ':all' : util.sort.EXPORT_OK };
+
+util.sort.dispatch = function(what,sortDir) {
+    try {
+        dump('util.sort.dispatch('+what+','+sortDir+');\n');
+        JSAN.use('util.widgets');
+        util.widgets.dispatch('sort_'+what+'_'+sortDir, document.popupNode);
+    } catch(E) {
+        alert(E);
+    }
+}
+
+dump('exiting util/sort.js\n');
index 323971f..3192a90 100644 (file)
@@ -57,6 +57,7 @@
         <script type="text/javascript" src="/xul/server/util/mozilla.js" />
         <script type="text/javascript" src="/xul/server/util/network.js" />
         <script type="text/javascript" src="/xul/server/util/print.js" />
+        <script type="text/javascript" src="/xul/server/util/sort.js" />
         <script type="text/javascript" src="/xul/server/util/sound.js" />
         <script type="text/javascript" src="/xul/server/util/text.js" />
         <script type="text/javascript" src="/xul/server/util/widgets.js" />
             <menuitem label="&common.textbox.delete;" oncommand="document.popupNode.value = ''" />
             <menuitem label="&common.textbox.select_all;" oncommand="document.popupNode.select()" />
         </menupopup>
+        <popup id="column_sort_menu">
+            <menuitem label="&common.sort.first.ascending;" oncommand="util.sort.dispatch('first','asc');"/>
+            <menuitem label="&common.sort.first.descending;" oncommand="util.sort.dispatch('first','desc');"/>
+            <menuitem label="&common.sort.next.ascending;" oncommand="util.sort.dispatch('next','asc');"/>
+            <menuitem label="&common.sort.next.descending;" oncommand="util.sort.dispatch('next','desc');"/>
+        </popup>
         <messagecatalog id="commonStrings" src='/xul/server/locale/<!--#echo var="locale"-->/common.properties'/>
         <messagecatalog id="offlineStrings" src='/xul/server/locale/<!--#echo var="locale"-->/offline.properties'/>
         <messagecatalog id="authStrings" src='/xul/server/locale/<!--#echo var="locale"-->/auth.properties'/>