Ticket #9102: efficient-filters.diff

django/contrib/admin/media/js/SelectFilter2.js

@@ -59 +59 @@
         var selector_filter = quickElement('p', selector_chosen, gettext('Select your choice(s) and click '));
         selector_filter.className = 'selector-filter';
         quickElement('img', selector_filter, '', 'src', admin_media_prefix + (is_stacked ? 'img/admin/selector_stacked-add.gif':'img/admin/selector-add.gif'), 'alt', 'Add');
+        // clone the box to avoid redisplay issues
         var to_box = quickElement('select', selector_chosen, '', 'id', field_id + '_to', 'multiple', 'multiple', 'size', from_box.size, 'name', from_box.getAttribute('name'));
         to_box.className = 'filtered';
+        var node;
+        for (var i = 0; (node = from_box.options[i]); i++) {
+            var option = new Option(node.text, node.value, false, false);
+            option.style.display = 'none';
+            to_box.options[to_box.options.length] = option;
+        }
         var clear_all = quickElement('a', selector_chosen, gettext('Clear all'), 'href', 'javascript: (function() { SelectBox.move_all("' + field_id + '_to", "' + field_id + '_from");})()');
         clear_all.className = 'selector-clearall';
 

django/contrib/admin/media/js/SelectBox.js

@@ -3 +3 @@
     init: function(id) {
         var box = document.getElementById(id);
         var node;
-        SelectBox.cache[id] = new Array();
+        SelectBox.cache[id] = new Object();
         var cache = SelectBox.cache[id];
         for (var i = 0; (node = box.options[i]); i++) {
-            cache.push({value: node.value, text: node.text, displayed: 1});
+            cache[node.value] = node;
         }
     },
-    redisplay: function(id) {
-        // Repopulate HTML select box from cache
-        var box = document.getElementById(id);
-        box.options.length = 0; // clear all options
-        for (var i = 0, j = SelectBox.cache[id].length; i < j; i++) {
-            var node = SelectBox.cache[id][i];
-            if (node.displayed) {
-                box.options[box.options.length] = new Option(node.text, node.value, false, false);
-            }
-        }
-    },
     filter: function(id, text) {
         // Redisplay the HTML select box, displaying only the choices containing ALL
         // the words in text. (It's an AND search.)
         var tokens = text.toLowerCase().split(/\s+/);
+        var box = document.getElementById(id);
         var node, token;
-        for (var i = 0; (node = SelectBox.cache[id][i]); i++) {
+        for (var i = 0; (node = box[i]); i++) {
             node.displayed = 1;
             for (var j = 0; (token = tokens[j]); j++) {
                 if (node.text.toLowerCase().indexOf(token) == -1) {
-                    node.displayed = 0;
+                    node.style.display = 'none';
+                } else {
+                    node.style.display = 'block';
                 }
             }
         }
-        SelectBox.redisplay(id);
     },
-    delete_from_cache: function(id, value) {
-        var node, delete_index = null;
-        for (var i = 0; (node = SelectBox.cache[id][i]); i++) {
-            if (node.value == value) {
-                delete_index = i;
-                break;
-            }
-        }
-        var j = SelectBox.cache[id].length - 1;
-        for (var i = delete_index; i < j; i++) {
-            SelectBox.cache[id][i] = SelectBox.cache[id][i+1];
-        }
-        SelectBox.cache[id].length--;
+    hide_option: function(id, value) {
+        SelectBox.cache[id][value].style.display = 'none';
     },
-    add_to_cache: function(id, option) {
-        SelectBox.cache[id].push({value: option.value, text: option.text, displayed: 1});
+    show_option: function(id, value) {
+        SelectBox.cache[id][value].style.display = 'block';
     },
-    cache_contains: function(id, value) {
-        // Check if an item is contained in the cache
-        var node;
-        for (var i = 0; (node = SelectBox.cache[id][i]); i++) {
-            if (node.value == value) {
-                return true;
-            }
-        }
-        return false;
-    },
     move: function(from, to) {
         var from_box = document.getElementById(from);
         var to_box = document.getElementById(to);
         var option;
         for (var i = 0; (option = from_box.options[i]); i++) {
-            if (option.selected && SelectBox.cache_contains(from, option.value)) {
-                SelectBox.add_to_cache(to, {value: option.value, text: option.text, displayed: 1});
-                SelectBox.delete_from_cache(from, option.value);
+            if (option.selected) {
+                SelectBox.show_option(to, option.value);
+                SelectBox.hide_option(from, option.value);
             }
         }
-        SelectBox.redisplay(from);
-        SelectBox.redisplay(to);
     },
     move_all: function(from, to) {
         var from_box = document.getElementById(from);
         var to_box = document.getElementById(to);
         var option;
         for (var i = 0; (option = from_box.options[i]); i++) {
-            if (SelectBox.cache_contains(from, option.value)) {
-                SelectBox.add_to_cache(to, {value: option.value, text: option.text, displayed: 1});
-                SelectBox.delete_from_cache(from, option.value);
-            }
+            SelectBox.show_option(to, option.value);
+            SelectBox.hide_option(from, option.value);
         }
-        SelectBox.redisplay(from);
-        SelectBox.redisplay(to);
     },
-    sort: function(id) {
-        SelectBox.cache[id].sort( function(a, b) {
-            a = a.text.toLowerCase();
-            b = b.text.toLowerCase();
-            try {
-                if (a > b) return 1;
-                if (a < b) return -1;
-            }
-            catch (e) {
-                // silently fail on IE 'unknown' exception
-            }
-            return 0;
-        } );
-    },
     select_all: function(id) {
         var box = document.getElementById(id);
         for (var i = 0; i < box.options.length; i++) {