From 59b2370b1a416328d14066ca2a677ac5f6bca65a Mon Sep 17 00:00:00 2001 From: Patrick Tsai Date: Mon, 14 Dec 2015 15:20:55 -0500 Subject: [PATCH] More refactoring --- dist/jquery.tree-multiselect.min.js | 2 +- src/jquery.tree-multiselect.js | 133 +++++++++++++++------------- 2 files changed, 71 insertions(+), 64 deletions(-) diff --git a/dist/jquery.tree-multiselect.min.js b/dist/jquery.tree-multiselect.min.js index e9f6ac0..b47e609 100644 --- a/dist/jquery.tree-multiselect.min.js +++ b/dist/jquery.tree-multiselect.min.js @@ -1,2 +1,2 @@ /* jQuery Tree Multiselect v1.15.3 | (c) Patrick Tsai et al. | MIT Licensed */ -!function(a){"use strict";function b(b){var c={allowBatchSelection:!0,sortable:!1,collapsible:!0,freeze:!1,hideSidePanel:!1,onlyBatchSelection:!1,sectionDelimiter:"/",showSectionOnSelected:!0,startCollapsed:!1};return a.extend({},c,b)}function c(b,c,e){function f(b,c){for(var d=g,e=0;e option").each(function(){var b=a(this).attr("data-section").split(e.sectionDelimiter),c=a(this).val(),d=a(this).text(),g=a(this).attr("data-description"),h=a(this).attr("data-index"),i=new r(c,d,g,h);f(b,i)}),d(c,g)}function d(b,c){function e(b,c){var d=document.createElement("div");d.className="section";var e=document.createElement("div");return e.className="title",e.innerHTML=c,a(d).append(e),b.append(d),d}function f(b,c){var d=c.text,e=c.value,f=c.description,g=c.index,h=document.createElement("div");h.className="item",a(h).text(d||e).attr({"data-value":e,"data-description":f,"data-index":g}),b.append(h)}if(c.constructor==r)f(b,c);else if(a.isArray(c))for(var g=0;g?"),d=b.find("div.item[data-description!=''][data-description]");c.prependTo(d),a("div.item > span.description").unbind().mouseenter(function(){var b=a(this).parent(),c=b.attr("data-description"),d=document.createElement("div");d.className="temp-description-popup",d.innerHTML=c,d.style.position="absolute",b.append(d)}).mouseleave(function(){a(this).parent().find("div.temp-description-popup").remove()})}function f(b,c){var d=a("",{type:"checkbox"});c.freeze&&d.attr("disabled","disabled");var e=null;e=c.onlyBatchSelection?b.find("div.title"):c.allowBatchSelection?b.find("div.title, div.item"):b.find("div.item"),d.prependTo(e),b.find("input[type=checkbox]").click(function(a){a.stopPropagation()})}function g(b,c){var d=b.val();if(d){var e=c.find("div.item").filter(function(){var b=a(this);return-1!==d.indexOf(b.attr("data-value"))});a(e).find("> input[type=checkbox]").prop("checked",!0)}}function h(b){var c=b.find("div.title > input[type=checkbox]");c.change(function(){var b=a(this).closest("div.section"),c=b.find("input[type=checkbox]"),d=a(this).is(":checked");c.prop("checked",d)})}function i(b){var c=b.find("input[type=checkbox]");c.change(function(){if(!a(this).is(":checked")){var c=a(this).parentsUntil(b,"div.section");c.find("> div.title > input[type=checkbox]").prop("checked",!1)}})}function j(b){function c(){var c=b.find("div.section");c.each(function(){var b=a(this),c=b.find("div.item"),d=c.filter(function(){var b=a(this).find("> input[type=checkbox]");return!b.is(":checked")});if(0===d.length){var e=a(this).find("> div.title > input[type=checkbox]");e.prop("checked",!0)}})}o(b,c)}function k(b){function c(){var c=b.find("div.section");c.each(function(){var b=a(this),c=b.find("div.item"),d=c.filter(function(){var b=a(this);return b.find("> input[type=checkbox]").prop("checked")}).length,e=a(this).find("> div.title > input[type=checkbox]"),f=0!==d&&d!==c.length;e.prop("indeterminate",f)})}o(b,c)}function l(b,c){var d="-",e="+",f=b.find("div.title"),g=document.createElement("span");g.className="collapse-section",c.startCollapsed?(a(g).text(e),f.siblings().toggle()):a(g).text(d),f.prepend(g),a("span.collapse-section").unbind().click(function(b){b.stopPropagation();var c=a(this).text();a(this).text(c==d?e:d);var f=a(this).parent();f.siblings().toggle()}),f.click(function(){a(this).find("> span.collapse-section").trigger("click")})}function m(b,c,d,e){function f(b){var d=b.text,f=b.value,g=b.sectionName,h=document.createElement("div");h.className="item",h.innerHTML=d,e.showSectionOnSelected&&a(h).append(""+g+""),e.freeze||a(h).prepend("×"),a(h).attr("data-value",f).appendTo(c)}function g(d){var e=[];c.find("div.item").each(function(){e.push(a(this).attr("data-value"))});var g=d.filter(function(a){return-1==e.indexOf(a.value)});g.forEach(function(a){f(a)}),n(b,c)}function h(b){var d=[];b.forEach(function(a){d.push(a.value)}),c.find("div.item").each(function(){var b=a(this).attr("data-value");-1==d.indexOf(b)&&a(this).remove()})}function i(){var b=[];c.find("div.item").each(function(){b.push(a(this).attr("data-value"))}),d.val(b).change(),d.html(d.find("option").sort(function(c,d){var e=b.indexOf(a(c).attr("value")),f=b.indexOf(a(d).attr("value"));return e>f?1:f>e?-1:0}))}function j(){var d=b.find("div.item").has("> input[type=checkbox]:checked"),f=[];d.each(function(c){var d=p(this),g=a(this).attr("data-value"),h=a(this).attr("data-index");a(this).attr("data-index",void 0);var i=a.map(a(this).parentsUntil(b,"div.section").get().reverse(),function(b){return p(a(b).find("> div.title"))}).join(e.sectionDelimiter);f.push({text:d,value:g,index:h,sectionName:i})}),f.sort(function(a,b){var c=parseInt(a.index),d=parseInt(b.index);return c>d?1:d>c?-1:0}),g(f),h(f),i(),e.sortable&&!e.freeze&&c.sortable({update:function(a,b){i()}})}o(b,j)}function n(b,c){c.find("span.remove-selected").unbind().click(function(){var c=a(this).parent().attr("data-value"),d=b.find("div.item[data-value='"+c+"']"),e=d.find("> input[type=checkbox]");e.prop("checked",!1),e.change()})}function o(a,b){var c=a.find("input[type=checkbox]");c.change(function(){b()}),b()}function p(b){return a(b).clone().children().remove().end().text()}a.fn.treeMultiselect=function(d){var o=b(d);return this.each(function(){var b=a(this);b.attr("multiple","").css("display","none");var d=new q;d.build(b,o.hideSidePanel);var p=a(d.selections);c(b,p,o),e(p,o),f(p,o),g(b,p,o),o.allowBatchSelection&&(h(p,o),i(p,o),j(p,o),k(p,o)),o.collapsible&&l(p,o);var r=a(d.selected);m(p,r,b,o),n(p,r,o)}),this};var q=function(){};q.prototype.build=function(b,c){var d=document.createElement("div");d.className="tree-multiselect",a(b).after(d);var e=document.createElement("div");e.className="selections",c&&(e.className+=" no-border"),a(d).append(e);var f=document.createElement("div");f.className="selected",c||a(d).append(f),this.tree=d,this.selections=e,this.selected=f};var r=function(a,b,c,d){this.value=a,this.text=b,this.description=c,this.index=d}}(jQuery); \ No newline at end of file +!function(a){"use strict";function b(b){var c={allowBatchSelection:!0,sortable:!1,collapsible:!0,freeze:!1,hideSidePanel:!1,onlyBatchSelection:!1,sectionDelimiter:"/",showSectionOnSelected:!0,startCollapsed:!1};return a.extend({},c,b)}function c(b,c,e){function f(b,c){for(var d=g,e=0;e option").each(function(){var b=a(this),c=b.attr("data-section").split(e.sectionDelimiter),d=b.val(),g=b.text(),h=b.attr("data-description"),i=b.attr("data-index"),j=new r(d,g,h,i);f(c,j)}),d(c,g)}function d(b,c){function e(b,c){var d=document.createElement("div");d.className="section";var e=document.createElement("div");return e.className="title",e.innerHTML=c,a(d).append(e),b.append(d),d}function f(b,c){var d=c.text,e=c.value,f=c.description,g=c.index,h=document.createElement("div");return h.className="item",a(h).text(d||e).attr({"data-value":e,"data-description":f,"data-index":g}),b.append(h),h}if(c.constructor==r)f(b,c);else if(a.isArray(c))for(var g=0;g?"),d=b.find("div.item[data-description!=''][data-description]");c.prependTo(d),a("div.item > span.description").unbind().mouseenter(function(){var b=a(this).parent(),c=b.attr("data-description"),d=document.createElement("div");d.className="temp-description-popup",d.innerHTML=c,d.style.position="absolute",b.append(d)}).mouseleave(function(){var b=a(this).parent();b.find("div.temp-description-popup").remove()})}function f(b,c){var d=a("",{type:"checkbox"});c.freeze&&d.attr("disabled","disabled");var e=null;e=c.onlyBatchSelection?b.find("div.title"):c.allowBatchSelection?b.find("div.title, div.item"):b.find("div.item"),d.prependTo(e),b.find("input[type=checkbox]").click(function(a){a.stopPropagation()})}function g(b,c){var d=b.val();if(d){var e=c.find("div.item").filter(function(){var b=a(this);return-1!==d.indexOf(b.attr("data-value"))});e.find("> input[type=checkbox]").prop("checked",!0)}}function h(b){var c=b.find("div.title > input[type=checkbox]");c.change(function(){var b=a(this),c=b.closest("div.section"),d=c.find("input[type=checkbox]"),e=b.is(":checked");d.prop("checked",e)})}function i(b){var c=b.find("input[type=checkbox]");c.change(function(){var c=a(this);if(!c.is(":checked")){var d=c.parentsUntil(b,"div.section");d.find("> div.title > input[type=checkbox]").prop("checked",!1)}})}function j(b){function c(){var c=b.find("div.section");c.each(function(){var b=a(this),c=b.find("div.item"),d=c.filter(function(){var b=a(this).find("> input[type=checkbox]");return!b.is(":checked")});if(0===d.length){var e=a(this).find("> div.title > input[type=checkbox]");e.prop("checked",!0)}})}o(b,c)}function k(b){function c(){var c=b.find("div.section");c.each(function(){var b=a(this),c=b.find("div.item"),d=c.filter(function(){var b=a(this);return b.find("> input[type=checkbox]").prop("checked")}).length,e=b.find("> div.title > input[type=checkbox]"),f=0!==d&&d!==c.length;e.prop("indeterminate",f)})}o(b,c)}function l(b,c){var d="-",e="+",f=b.find("div.title"),g=document.createElement("span");g.className="collapse-section",c.startCollapsed?(a(g).text(e),f.siblings().toggle()):a(g).text(d),f.prepend(g),a("span.collapse-section").unbind().click(function(b){b.stopPropagation();var c=a(this),f=c.text();c.text(f==d?e:d);var g=c.parent();g.siblings().toggle()}),f.click(function(){a(this).find("> span.collapse-section").trigger("click")})}function m(b,c,d,e){function f(b){var d=b.text,f=b.value,g=b.sectionName,h=document.createElement("div");h.className="item",h.innerHTML=d,e.showSectionOnSelected&&a(h).append(""+g+""),e.freeze||a(h).prepend("×"),a(h).attr("data-value",f).appendTo(c)}function g(d){var e=[];c.find("div.item").each(function(){e.push(a(this).attr("data-value"))});var g=d.filter(function(a){return-1==e.indexOf(a.value)});g.forEach(function(a){f(a)}),n(b,c)}function h(b){var d=[];b.forEach(function(a){d.push(a.value)}),c.find("div.item").each(function(){var b=a(this),c=b.attr("data-value");-1==d.indexOf(c)&&b.remove()})}function i(){var b=[];c.find("div.item").each(function(){b.push(a(this).attr("data-value"))}),d.val(b).change(),d.html(d.find("option").sort(function(c,d){var e=b.indexOf(a(c).attr("value")),f=b.indexOf(a(d).attr("value"));return e>f?1:f>e?-1:0}))}function j(){var d=b.find("div.item").has("> input[type=checkbox]:checked"),f=[];d.each(function(c){var d=p(this),g=a(this).attr("data-value"),h=a(this).attr("data-index");a(this).attr("data-index",void 0);var i=a.map(a(this).parentsUntil(b,"div.section").get().reverse(),function(b){return p(a(b).find("> div.title"))}).join(e.sectionDelimiter);f.push({text:d,value:g,index:h,sectionName:i})}),f.sort(function(a,b){var c=parseInt(a.index),d=parseInt(b.index);return c>d?1:d>c?-1:0}),g(f),h(f),i(),e.sortable&&!e.freeze&&c.sortable({update:function(a,b){i()}})}o(b,j)}function n(b,c){c.find("span.remove-selected").unbind().click(function(){var c=a(this).parent().attr("data-value"),d=b.find("div.item[data-value='"+c+"']"),e=d.find("> input[type=checkbox]");e.prop("checked",!1),e.change()})}function o(a,b){var c=a.find("input[type=checkbox]");c.change(function(){b()}),b()}function p(b){return a(b).clone().children().remove().end().text()}a.fn.treeMultiselect=function(d){var o=b(d);return this.each(function(){var b=a(this);b.attr("multiple","").css("display","none");var d=new q;d.build(b,o.hideSidePanel);var p=a(d.selections);c(b,p,o),e(p,o),f(p,o),g(b,p,o),o.allowBatchSelection&&(h(p,o),i(p,o),j(p,o),k(p,o)),o.collapsible&&l(p,o);var r=a(d.selected);m(p,r,b,o),n(p,r,o)}),this};var q=function(){};q.prototype.build=function(b,c){var d=document.createElement("div");d.className="tree-multiselect",a(b).after(d);var e=document.createElement("div");e.className="selections",c&&(e.className+=" no-border"),a(d).append(e);var f=document.createElement("div");f.className="selected",c||a(d).append(f),this.tree=d,this.selections=e,this.selected=f};var r=function(a,b,c,d){this.value=a,this.text=b,this.description=c,this.index=d}}(jQuery); \ No newline at end of file diff --git a/src/jquery.tree-multiselect.js b/src/jquery.tree-multiselect.js index 611667f..f9e5b1a 100644 --- a/src/jquery.tree-multiselect.js +++ b/src/jquery.tree-multiselect.js @@ -94,11 +94,13 @@ } $originalSelect.find("> option").each(function() { - var path = $(this).attr('data-section').split(options.sectionDelimiter); - var optionValue = $(this).val(); - var optionName = $(this).text(); - var optionDescription = $(this).attr('data-description'); - var optionIndex = $(this).attr('data-index'); + var $option = $(this); + var path = $option.attr('data-section').split(options.sectionDelimiter); + + var optionValue = $option.val(); + var optionName = $option.text(); + var optionDescription = $option.attr('data-description'); + var optionIndex = $option.attr('data-index'); var option = new Option(optionValue, optionName, optionDescription, optionIndex); insertOption(path, option); }); @@ -120,7 +122,7 @@ return section; } - function createItem($itemContainer, option) { + function createSelection($itemContainer, option) { var text = option.text; var value = option.value; var description = option.description; @@ -134,10 +136,11 @@ 'data-index': index }); $itemContainer.append(selection); + return selection; } if (data.constructor == Option) { - createItem($selectionContainer, data); + createSelection($selectionContainer, data); } else if ($.isArray(data)) { for (var i = 0; i < data.length; ++i) { fillSelections($selectionContainer, data[i]); @@ -152,14 +155,13 @@ } function addDescriptionHover($selectionContainer) { - var description = $("?"); + var $description = $("?"); var targets = $selectionContainer.find("div.item[data-description!=''][data-description]"); - description.prependTo(targets); + $description.prependTo(targets); - $("div.item > span.description").unbind() - .mouseenter(function() { - var item = $(this).parent(); - var description = item.attr('data-description'); + $("div.item > span.description").unbind().mouseenter(function() { + var $item = $(this).parent(); + var description = $item.attr('data-description'); var descriptionDiv = document.createElement('div'); descriptionDiv.className = "temp-description-popup"; @@ -167,28 +169,29 @@ descriptionDiv.style.position = 'absolute'; - item.append(descriptionDiv); + $item.append(descriptionDiv); }).mouseleave(function() { - $(this).parent().find("div.temp-description-popup").remove(); + var $item = $(this).parent(); + $item.find("div.temp-description-popup").remove(); }); } function addCheckboxes($selectionContainer, options) { - var checkbox = $('', { type: 'checkbox' }); + var $checkbox = $('', { type: 'checkbox' }); if (options.freeze) { - checkbox.attr('disabled', 'disabled'); + $checkbox.attr('disabled', 'disabled'); } - var targets = null; + var $targets = null; if (options.onlyBatchSelection) { - targets = $selectionContainer.find("div.title"); + $targets = $selectionContainer.find("div.title"); } else if (options.allowBatchSelection) { - targets = $selectionContainer.find("div.title, div.item"); + $targets = $selectionContainer.find("div.title, div.item"); } else { - targets = $selectionContainer.find("div.item"); + $targets = $selectionContainer.find("div.item"); } - checkbox.prependTo(targets); + $checkbox.prependTo($targets); $selectionContainer.find('input[type=checkbox]').click(function(e) { e.stopPropagation(); }); @@ -198,29 +201,31 @@ var selectedOptions = $originalSelect.val(); if (!selectedOptions) return; - var selectedOptionDivs = $selectionContainer.find("div.item").filter(function() { + var $selectedOptionDivs = $selectionContainer.find("div.item").filter(function() { var item = $(this); return selectedOptions.indexOf(item.attr('data-value')) !== -1; }); - $(selectedOptionDivs).find("> input[type=checkbox]").prop('checked', true); + $selectedOptionDivs.find("> input[type=checkbox]").prop('checked', true); } function armTitleCheckboxes($selectionContainer) { - var titleCheckboxes = $selectionContainer.find("div.title > input[type=checkbox]"); - titleCheckboxes.change(function() { - var section = $(this).closest("div.section"); - var checkboxesToBeChanged = section.find("input[type=checkbox]"); - var checked = $(this).is(':checked'); - checkboxesToBeChanged.prop('checked', checked); + var $titleCheckboxes = $selectionContainer.find("div.title > input[type=checkbox]"); + $titleCheckboxes.change(function() { + var $titleCheckbox = $(this); + var $section = $titleCheckbox.closest("div.section"); + var $checkboxesToBeChanged = $section.find("input[type=checkbox]"); + var checked = $titleCheckbox.is(':checked'); + $checkboxesToBeChanged.prop('checked', checked); }); } function uncheckParentsOnUnselect($selectionContainer) { - var checkboxes = $selectionContainer.find("input[type=checkbox]"); - checkboxes.change(function() { - if ($(this).is(":checked")) return; - var sectionParents = $(this).parentsUntil($selectionContainer, "div.section"); - sectionParents.find("> div.title > input[type=checkbox]").prop('checked', false); + var $checkboxes = $selectionContainer.find("input[type=checkbox]"); + $checkboxes.change(function() { + var $checkbox = $(this); + if ($checkbox.is(":checked")) return; + var $sectionParents = $checkbox.parentsUntil($selectionContainer, "div.section"); + $sectionParents.find("> div.title > input[type=checkbox]").prop('checked', false); }); } @@ -228,13 +233,13 @@ function check() { var sections = $selectionContainer.find("div.section"); sections.each(function() { - var section = $(this); - var sectionItems = section.find("div.item"); - var unselectedItems = sectionItems.filter(function() { - var checkbox = $(this).find("> input[type=checkbox]"); - return !(checkbox.is(":checked")); + var $section = $(this); + var $sectionItems = $section.find("div.item"); + var $unselectedItems = $sectionItems.filter(function() { + var $checkbox = $(this).find("> input[type=checkbox]"); + return !($checkbox.is(":checked")); }); - if (unselectedItems.length === 0) { + if ($unselectedItems.length === 0) { var sectionCheckbox = $(this).find("> div.title > input[type=checkbox]"); sectionCheckbox.prop('checked', true); } @@ -248,16 +253,16 @@ function check() { var sections = $selectionContainer.find("div.section"); sections.each(function() { - var section = $(this); - var items = section.find("div.item"); - var numSelected = items.filter(function() { + var $section = $(this); + var $items = $section.find("div.item"); + var numSelected = $items.filter(function() { var item = $(this); return item.find("> input[type=checkbox]").prop('checked'); }).length; - var sectionCheckbox = $(this).find("> div.title > input[type=checkbox]"); - var isIndeterminate = (numSelected !== 0 && numSelected !== items.length); - sectionCheckbox.prop('indeterminate', isIndeterminate); + var $sectionCheckbox = $section.find("> div.title > input[type=checkbox]"); + var isIndeterminate = (numSelected !== 0 && numSelected !== $items.length); + $sectionCheckbox.prop('indeterminate', isIndeterminate); }); } @@ -268,27 +273,28 @@ var hideIndicator = "-"; var expandIndicator = "+"; - var titleDivs = $selectionContainer.find("div.title"); + var $titleDivs = $selectionContainer.find("div.title"); var collapseDiv = document.createElement('span'); collapseDiv.className = "collapse-section"; if (options.startCollapsed) { $(collapseDiv).text(expandIndicator); - titleDivs.siblings().toggle(); + $titleDivs.siblings().toggle(); } else { $(collapseDiv).text(hideIndicator); } - titleDivs.prepend(collapseDiv); + $titleDivs.prepend(collapseDiv); $("span.collapse-section").unbind().click(function(e) { e.stopPropagation(); - var indicator = $(this).text(); - $(this).text(indicator == hideIndicator ? expandIndicator : hideIndicator); - var $title = $(this).parent(); + var $collapseSection = $(this); + var indicator = $collapseSection.text(); + $collapseSection.text(indicator == hideIndicator ? expandIndicator : hideIndicator); + var $title = $collapseSection.parent(); $title.siblings().toggle(); }); - titleDivs.click(function() { + $titleDivs.click(function() { $(this).find("> span.collapse-section").trigger('click'); }); } @@ -339,9 +345,10 @@ }); $selectedContainer.find("div.item").each(function() { - var selection = $(this).attr('data-value'); - if (selectionTexts.indexOf(selection) == -1) { - $(this).remove(); + var $item = $(this); + var value = $item.attr('data-value'); + if (selectionTexts.indexOf(value) == -1) { + $item.remove(); } }); } @@ -365,9 +372,9 @@ } function update() { - var selectedBoxes = $selectionContainer.find("div.item").has("> input[type=checkbox]:checked"); + var $selectedBoxes = $selectionContainer.find("div.item").has("> input[type=checkbox]:checked"); var selections = []; - selectedBoxes.each(function(box) { + $selectedBoxes.each(function(box) { var text = textOf(this); var value = $(this).attr('data-value'); var index = $(this).attr('data-index'); @@ -404,10 +411,10 @@ function armRemoveSelectedOnClick($selectionContainer, $selectedContainer) { $selectedContainer.find("span.remove-selected").unbind().click(function() { var value = $(this).parent().attr('data-value'); - var matchingSelection = $selectionContainer.find("div.item[data-value='" + value + "']"); - var matchingCheckbox = matchingSelection.find("> input[type=checkbox]"); - matchingCheckbox.prop('checked', false); - matchingCheckbox.change(); + var $matchingSelection = $selectionContainer.find("div.item[data-value='" + value + "']"); + var $matchingCheckbox = $matchingSelection.find("> input[type=checkbox]"); + $matchingCheckbox.prop('checked', false); + $matchingCheckbox.change(); }); }