145 lines
		
	
	
		
			5.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
			
		
		
	
	
			145 lines
		
	
	
		
			5.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
| (function($) {
 | |
|     'use strict';
 | |
|     var SelectBox = {
 | |
|         cache: {},
 | |
|         init: function(id) {
 | |
|             var box = document.getElementById(id);
 | |
|             var node;
 | |
|             SelectBox.cache[id] = [];
 | |
|             var cache = SelectBox.cache[id];
 | |
|             var boxOptions = box.options;
 | |
|             var boxOptionsLength = boxOptions.length;
 | |
|             for (var i = 0, j = boxOptionsLength; i < j; i++) {
 | |
|                 node = boxOptions[i];
 | |
|                 cache.push({value: node.value, text: node.text, displayed: 1});
 | |
|             }
 | |
|         },
 | |
|         redisplay: function(id) {
 | |
|             // Repopulate HTML select box from cache
 | |
|             var box = document.getElementById(id);
 | |
|             var node;
 | |
|             $(box).empty(); // clear all options
 | |
|             var new_options = box.outerHTML.slice(0, -9); // grab just the opening tag
 | |
|             var cache = SelectBox.cache[id];
 | |
|             for (var i = 0, j = cache.length; i < j; i++) {
 | |
|                 node = cache[i];
 | |
|                 if (node.displayed) {
 | |
|                     var new_option = new Option(node.text, node.value, false, false);
 | |
|                     // Shows a tooltip when hovering over the option
 | |
|                     new_option.setAttribute("title", node.text);
 | |
|                     new_options += new_option.outerHTML;
 | |
|                 }
 | |
|             }
 | |
|             new_options += '</select>';
 | |
|             box.outerHTML = new_options;
 | |
|         },
 | |
|         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 node, token;
 | |
|             var cache = SelectBox.cache[id];
 | |
|             for (var i = 0, j = cache.length; i < j; i++) {
 | |
|                 node = cache[i];
 | |
|                 node.displayed = 1;
 | |
|                 var node_text = node.text.toLowerCase();
 | |
|                 var numTokens = tokens.length;
 | |
|                 for (var k = 0; k < numTokens; k++) {
 | |
|                     token = tokens[k];
 | |
|                     if (node_text.indexOf(token) === -1) {
 | |
|                         node.displayed = 0;
 | |
|                         break; // Once the first token isn't found we're done
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|             SelectBox.redisplay(id);
 | |
|         },
 | |
|         delete_from_cache: function(id, value) {
 | |
|             var node, delete_index = null;
 | |
|             var cache = SelectBox.cache[id];
 | |
|             for (var i = 0, j = cache.length; i < j; i++) {
 | |
|                 node = cache[i];
 | |
|                 if (node.value === value) {
 | |
|                     delete_index = i;
 | |
|                     break;
 | |
|                 }
 | |
|             }
 | |
|             cache.splice(delete_index, 1);
 | |
|         },
 | |
|         add_to_cache: function(id, option) {
 | |
|             SelectBox.cache[id].push({value: option.value, text: option.text, displayed: 1});
 | |
|         },
 | |
|         cache_contains: function(id, value) {
 | |
|             // Check if an item is contained in the cache
 | |
|             var node;
 | |
|             var cache = SelectBox.cache[id];
 | |
|             for (var i = 0, j = cache.length; i < j; i++) {
 | |
|                 node = cache[i];
 | |
|                 if (node.value === value) {
 | |
|                     return true;
 | |
|                 }
 | |
|             }
 | |
|             return false;
 | |
|         },
 | |
|         move: function(from, to) {
 | |
|             var from_box = document.getElementById(from);
 | |
|             var option;
 | |
|             var boxOptions = from_box.options;
 | |
|             var boxOptionsLength = boxOptions.length;
 | |
|             for (var i = 0, j = boxOptionsLength; i < j; i++) {
 | |
|                 option = boxOptions[i];
 | |
|                 var option_value = option.value;
 | |
|                 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);
 | |
|                 }
 | |
|             }
 | |
|             SelectBox.redisplay(from);
 | |
|             SelectBox.redisplay(to);
 | |
|         },
 | |
|         move_all: function(from, to) {
 | |
|             var from_box = document.getElementById(from);
 | |
|             var option;
 | |
|             var boxOptions = from_box.options;
 | |
|             var boxOptionsLength = boxOptions.length;
 | |
|             for (var i = 0, j = boxOptionsLength; i < j; i++) {
 | |
|                 option = boxOptions[i];
 | |
|                 var option_value = option.value;
 | |
|                 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.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);
 | |
|             var boxOptions = box.options;
 | |
|             var boxOptionsLength = boxOptions.length;
 | |
|             for (var i = 0; i < boxOptionsLength; i++) {
 | |
|                 boxOptions[i].selected = 'selected';
 | |
|             }
 | |
|         }
 | |
|     };
 | |
|     window.SelectBox = SelectBox;
 | |
| })(django.jQuery);
 |