Changes

m
no edit summary
Line 4: Line 4:     
     $(document).ready(function() {
 
     $(document).ready(function() {
 +
 +
console.log('DetailToggle v1.0.0');
    
         // custom hidable content and togglers supported by local storage
 
         // custom hidable content and togglers supported by local storage
Line 29: Line 31:  
                 property_anti = toggle_element.data("anti-target"),
 
                 property_anti = toggle_element.data("anti-target"),
 
                 property_default = toggle_element.data("default") || "show",
 
                 property_default = toggle_element.data("default") || "show",
 +
                property_classes = toggle_element.data("classes") && toggle_element.data("classes").split(' ').map(function (e) { return "toggle-class-" + e.trim() }).join(' '),
 
                 target = "toggle-target-" + property,
 
                 target = "toggle-target-" + property,
 
                 target_class = "." + target,
 
                 target_class = "." + target,
Line 44: Line 47:  
                 $(toggle_show_selector).show();
 
                 $(toggle_show_selector).show();
 
                 $(toggle_hide_selector).hide();
 
                 $(toggle_hide_selector).hide();
                 $(target_class).show();
+
                 if (property_classes) {
 +
                    $(target_class).addClass(property_classes);
 +
                } else {
 +
                    $(target_class).show();
 +
                }               
 
                 if (anti_target_class) {
 
                 if (anti_target_class) {
 
                     $(anti_target_class).hide();
 
                     $(anti_target_class).hide();
Line 51: Line 58:  
                 $(toggle_show_selector).hide();
 
                 $(toggle_show_selector).hide();
 
                 $(toggle_hide_selector).show();
 
                 $(toggle_hide_selector).show();
                 $(target_class).hide();
+
                 if (property_classes) {
 +
                    $(target_class).removeClass(property_classes);
 +
                } else {
 +
                    $(target_class).hide();                  
 +
                }
 
                 if (anti_target_class) {
 
                 if (anti_target_class) {
 
                     $(anti_target_class).show();
 
                     $(anti_target_class).show();
Line 77: Line 88:  
         }
 
         }
   −
         //Update a multi toggle. If selected is passed it is set as the state of the multi toggle. Pass false to selected to deselect when the multi toggle is a filter.
+
         //Update a multi toggle. If selected is passed it is set as the state of the multi toggle. Pass "none" to selected to deselect when the multi toggle is a filter.
 
         function multi_update(multi_toggle_element, selected) {
 
         function multi_update(multi_toggle_element, selected) {
 
             var property = multi_toggle_element.data("target") || "default",
 
             var property = multi_toggle_element.data("target") || "default",
 
                 property_states = multi_toggle_element.data("states"),
 
                 property_states = multi_toggle_element.data("states"),
                 property_default = multi_toggle_element.data("default") || false,
+
                 property_default = multi_toggle_element.data("default"),
 
                 property_filter = multi_toggle_element.data("filter") || false, //Whether or not the multi toggle is a filter
 
                 property_filter = multi_toggle_element.data("filter") || false, //Whether or not the multi toggle is a filter
                 target = "multi-toggle-target-" + property,
+
                property_base_colspan = multi_toggle_element.data("base-colspan"),
                multiToggleStorage = MultiToggleStorage(target, property_default);
+
                 target = "multi-toggle-target-" + property;
 
             //make sure the states are an array.
 
             //make sure the states are an array.
 
             if (!property_states || !Array.isArray(property_states) || property_states.length < 1) {
 
             if (!property_states || !Array.isArray(property_states) || property_states.length < 1) {
 
                 multi_toggle_element.hide();
 
                 multi_toggle_element.hide();
 
                 return;
 
                 return;
             } else if (property_filter) {
+
             } else if (property_filter && property_states[0] !== "none") {
                 property_states.splice(0, 0, false)
+
                 property_states.splice(0, 0, "none")
 
             }
 
             }
 
             //need to set default here rather than in the declaration above to ensure the states are valid.
 
             //need to set default here rather than in the declaration above to ensure the states are valid.
Line 96: Line 107:  
                 property_default = property_states[0];
 
                 property_default = property_states[0];
 
             }
 
             }
 +
            var multiToggleStorage = MultiToggleStorage(target, property_default);
 
             //set the new state of the multi toggle.
 
             //set the new state of the multi toggle.
             if ((selected || selected === false) && property_states.indexOf(selected) >= 0) {
+
             if (selected && property_states.indexOf(selected) >= 0) {
 +
                //If the selected filter was re-selected, that is a remove filter action.
 
                 if ((property_filter && multiToggleStorage.on(selected))) {
 
                 if ((property_filter && multiToggleStorage.on(selected))) {
                     multiToggleStorage.set(false);
+
                     selected = "none";
                } else {
  −
                    multiToggleStorage.set(selected);
   
                 }
 
                 }
 +
                multiToggleStorage.set(selected);
 
             } else {
 
             } else {
 +
                //No selection, so we are initializing the multi toggle.
 
                 selected = multiToggleStorage.get()
 
                 selected = multiToggleStorage.get()
 
             }
 
             }
 
             //Update non-selected states
 
             //Update non-selected states
 +
            var hide_selectors = [];
 +
            var show_selectors = [];
 
             property_states.forEach(function(state) {
 
             property_states.forEach(function(state) {
                 var toggle_show_selector = '.multi-toggle[data-target="' + property + '"] .multi-toggle-button[data-state="' + state + '"] .multi-toggle-active',
+
                 var toggle_active_selector = '.multi-toggle[data-target="' + property + '"] .multi-toggle-button[data-state="' + state + '"] .multi-toggle-active',
                     toggle_hide_selector = '.multi-toggle[data-target="' + property + '"] .multi-toggle-button[data-state="' + state + '"] .multi-toggle-inactive';
+
                     toggle_inactive_selector = '.multi-toggle[data-target="' + property + '"] .multi-toggle-button[data-state="' + state + '"] .multi-toggle-inactive';
                 if (!multiToggleStorage.on(state)) {
+
                 if (selected !== state) {
                     $(toggle_show_selector).hide();
+
                     $(toggle_active_selector).hide();
                     $(toggle_hide_selector).show();
+
                     $(toggle_inactive_selector).show();
                     if (selected === false) {
+
                     if (selected === "none") {
                         $("." + target + "-" + state).show();
+
                         show_selectors.push("." + target + "-" + state);
 
                     } else {
 
                     } else {
                         $("." + target + "-" + state).hide();
+
                         hide_selectors.push("." + target + "-" + state);
 
                     }
 
                     }
 +
                } else {
 +
                    $(toggle_active_selector).show();
 +
                    $(toggle_inactive_selector).hide();
 +
                    show_selectors.push("." + target + "-" + state);
 
                 }
 
                 }
 
             })
 
             })
 +
            $(hide_selectors.join(',')).hide();
 
             //Update selected state last
 
             //Update selected state last
             var toggle_show_selector = '.multi-toggle[data-target="' + property + '"] .multi-toggle-button[data-state="' + selected + '"] .multi-toggle-active',
+
             $(show_selectors.join(',')).show();
                 toggle_hide_selector = '.multi-toggle[data-target="' + property + '"] .multi-toggle-button[data-state="' + selected + '"] .multi-toggle-inactive';
+
            //Update colspan for custom rows.
            $(toggle_show_selector).show();
+
            if (property_filter) {
            $(toggle_hide_selector).hide();
+
                 if (selected === "none") {
            $("." + target + "-" + selected).show();
+
                    $(".custom-row." + target).attr("colSpan", property_base_colspan);
 +
                } else {
 +
                    $(".custom-row." + target).attr("colSpan", property_base_colspan - property_states.length + 2);
 +
                }
 +
            }
 
             //cleanup
 
             //cleanup
 
             $(window).trigger("WideTablesScan");
 
             $(window).trigger("WideTablesScan");
Line 136: Line 160:  
                 toggle_element.show();
 
                 toggle_element.show();
 
                 update(toggle_element);
 
                 update(toggle_element);
 +
                if (toggle_element.hasClass('toggle-passive')) {
 +
                    return;
 +
                }
 
                 toggle_element.off("click");
 
                 toggle_element.off("click");
 
                 toggle_element.click(function() {
 
                 toggle_element.click(function() {
Line 143: Line 170:     
             //Activate multi toggles.
 
             //Activate multi toggles.
 +
            var targets = {};
 
             $(".multi-toggle").each(function() {
 
             $(".multi-toggle").each(function() {
 
                 var multi_toggle_element = $(this),
 
                 var multi_toggle_element = $(this),
                     multi_toggle_buttons = multi_toggle_element.children(".multi-toggle-button");
+
                     multi_toggle_buttons = multi_toggle_element.children(".multi-toggle-button"),
 +
                    target = multi_toggle_element.data("target") || "default";
 
                 multi_toggle_element.show();
 
                 multi_toggle_element.show();
                 multi_update(multi_toggle_element);
+
                 if (!targets.hasOwnProperty(target))
 +
                    targets[target] = multi_toggle_element;
 
                 //Remove click event handlers from all multi toggle buttons
 
                 //Remove click event handlers from all multi toggle buttons
 
                 multi_toggle_buttons.off("click");
 
                 multi_toggle_buttons.off("click");
Line 155: Line 185:  
                 });
 
                 });
 
             });
 
             });
 +
            //call multi-update once for each target to allow multiple controls
 +
            //without horrible lag
 +
            Object.keys(targets).forEach(function (key) {multi_update(targets[key])});
    
             // .mw-collapsible togglers
 
             // .mw-collapsible togglers
cssedit, gkautomate
6,928

edits