User:Arkondi/showhide.js

/* * Copyright © 2009, Daniel Friesen * All rights reserved. * * Redistribution and use in source and binary forms, with or without * modification, are permitted provided that the following conditions are met: *    * Redistributions of source code must retain the above copyright *      notice, this list of conditions and the following disclaimer. *    * Redistributions in binary form must reproduce the above copyright *      notice, this list of conditions and the following disclaimer in the *      documentation and/or other materials provided with the distribution. *    * Neither the name of the script nor the *      names of its contributors may be used to endorse or promote products *      derived from this software without specific prior written permission. * * THIS SOFTWARE IS PROVIDED BY DANIEL FRIESEN AS IS AND ANY * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE * DISCLAIMED. IN NO EVENT SHALL DANIEL FRIESEN BE LIABLE FOR ANY * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. */

/* * modified version by User:Arkondi * - translation inspired by the way User:Lunarity implemented it in HideRail/code.js * - functionality for NavPic * - collapsed NavFrame in collapsed table working correct * - substituted NavVisible with collapsed */ $(function { // CONFIG  var myShowHideConfig = $.extend({ autoCollapse: 200, userLang: true, brackets: '[]', linkBefore: false, duration: 500 }, myShowHideConfig); var translation = $.extend({ // Bulgarian bg: { show: "Покажи", hide: "Скрий", showAll: "Покажи всички", hideAll: "Скрий всички" },   // German de: { show: "anzeigen", hide: "verbergen", showAll: "alle anzeigen", hideAll: "alle verbergen" },   // English en: { show: "show", hide: "hide", showAll: "show all", hideAll: "hide all" },   // Spanish es: { show: "Mostrar", hide: "Ocultar", showAll: "Mostrar todo", hideAll: "Ocultar todo" },   // French fr: { show: "afficher", hide: "masquer", showAll: "tout afficher", hideAll: "tout masquer" },   // Hungarian hu: { show: "kibontás", hide: "elrejtés", showAll: "összes kibontása", hideAll: "összes elrejtése" },   // Italian it: { show: "Mostra", hide: "Nascondi", showAll: "Mostra tutti", hideAll: "Nascondi tutti" },   // Japanese ja: { show: "表示", hide: "非表示", showAll: "すべて表示", hideAll: "すべて非表示" },   // Korean ko: { show: "보이기", hide: "숨기기", showAll: "모두 보이기", hideAll: "모두 숨기기" },   // Dutch nl: { show: "tonen", hide: "verbergen", showAll: "alles tonen", hideAll: "alles verbergen" },   // Polish pl: { show: "Pokaż", hide: "Ukryj", showAll: "Pokaż wszystko", hideAll: "Ukryj wszystko" },   // Portuguese pt: { show: "Mostrar", hide: "Esconder", showAll: "Expandir Todos", hideAll: "Esconder Todos" },   // Brazilian Portuguese 'pt-br': { show: "Mostrar", hide: "Esconder", showAll: "Expandir Todos", hideAll: "Esconder Todos" },   // Russian ru: { show: "Открыть", hide: "Скрыть", showAll: "Открыть все", hideAll: "Скрыть все" },   // Chinese zh: { show: "显示", hide: "隐藏", showAll: "全部显示", hideAll: "全部隐藏" } // Make a post on the talkpage if you have translation updates }, translation); if (!myShowHideConfig.userLang) {    translation = translation.en;  } else {    if (mw.config.get('wgUserLanguage') in translation) {      translation = translation[mw.config.get('wgUserLanguage')];    } else {      if (mw.config.get('wgContentLanguage') in translation) {        translation = translation[mw.config.get('wgContentLanguage')];      } else {        translation = translation.en;      }    }  }  // common  $.fn.onLink = function(fn) {    return this.bind( 'click keypress', function(e) { if (e.type === 'click' || (e.type === 'keypress' && (e.keyCode === 13 || e.charCode === 32 ))) { fn.call(this, e); }   });  };  // ensure compatibility with old version  $('.NavFrame')   .filter(function { return ($(this).children('.NavContent').length > 1); })  .each(function { $(this).children('.NavContent').first.removeClass('NavContent').addClass('smallPic').css('display', 'block'); $(this).children('.NavContent').removeClass('NavContent').addClass('bigPic').css('display', 'none'); var toMove = $(this).children.not('.NavHead').detach; $(this).children('.NavHead').removeClass('NavHead').addClass('NavPic').append(toMove).unwrap.append($(' ').text('New version! Please use ').append('NavPic')); }); /**   * Collapsible tables using jQuery   * Description: Allows tables to be collapsed, showing only the header.   */  createCollapseButtons;  function createCollapseButtons {    var NavigationBoxes = [];    $('.collapsible').each(function  { NavigationBoxes.push(this); var buttonLink = $(' ') .text(translation.hide) .css('cursor', 'pointer') .onLink(function {                          collapseTable($(this).closest('.collapsible'));                         }); var button = $(' ') .css({'float': 'right',                          'text-align': 'right',                           'font-weight': 'normal',                           'width': '6em',                           'margin-left': '-100%'}) .append(myShowHideConfig.brackets.substr(0, myShowHideConfig.brackets.length/2),                            buttonLink,                             myShowHideConfig.brackets.substr(myShowHideConfig.brackets.length/2)); $(this).find('tr:first > th:last').prepend(button); });   // if more Navigation Bars found than Default: hide all    if ($(NavigationBoxes).filter('.autocollapse').length >= myShowHideConfig.autoCollapse) {      $(NavigationBoxes).filter('.autocollapse' ).each(function { collapseTable(this, true); });    }    $(NavigationBoxes).filter('.collapsed').each(function { collapseTable(this, true); });  };  function collapseTable(table, doCollapse) {    var button = $(table).find('.collapseLink').first;    var visible = doCollapse || !$(table).hasClass('collapsed');    if (!$(table).length || !button.length) {      return;    }    $(table).children.first.children.not(':first').not('.nocollapse')[visible ? "hide" : "show"](myShowHideConfig.duration);    button.text(translation[visible ? 'show' : 'hide']);   visible ? $(table).addClass('collapsed') : $(table).removeClass('collapsed');  }

/**  * Dynamic Navigation Bars with jQuery * Base Description: See Wikipedia:Wikipedia:NavFrame. */ createNavigationBarToggleButton; // adds show/hide-button to navigation bars function createNavigationBarToggleButton { var NavFrames = []; $('.NavFrame').each(function {          NavFrames.push(this);      var buttonLink = $(' ')                        .text(translation.hide)                        .onLink(function { toggleNavigationBar($(this).closest('.NavFrame')); });     var button = $(' ')                    .append(myShowHideConfig.brackets.substr(0, myShowHideConfig.brackets.length/2), buttonLink, myShowHideConfig.brackets.substr(myShowHideConfig.brackets.length/2));     $(this).children('.NavHead')[myShowHideConfig.linkBefore?"prepend":"append"](button);    }); // if more Navigation Bars found than Default: hide all if ($(NavFrames).length >= myShowHideConfig.autoCollapse ) { $(NavFrames).not('.noautocollapse').each(function { toggleNavigationBar(this, true); }); } else { $(NavFrames).filter('.collapsed').each(function { toggleNavigationBar(this, true); }); } }  // shows and hides content of navigation bars function toggleNavigationBar(navFrame, doCollapse) { var button = $(navFrame).find('.collapseLink').first; var visible = doCollapse || !$(navFrame).hasClass('collapsed'); if (!$(navFrame).length || !button.length) { return; }   $(navFrame).children('.NavContent')[visible ? 'hide' : 'show'](myShowHideConfig.duration); button.text(translation[visible ? 'show' : 'hide']); visible ? $(navFrame).addClass('collapsed') : $(navFrame).removeClass('collapsed'); } // create buttons for show/hide all NavFrames $('.NavGlobal').each(function {   $(' ')      .append(document.createTextNode( '[' ), $(' ')               .text(translation.showAll) .onLink(function {                 $('.NavFrame').each(function { if ($(this).hasClass('collapsed')) { toggleNavigationBar(this); }                 });                }),              ']')      .appendTo(this);    $(this).append(' ');    $(' ')      .append(document.createTextNode('['), $(' ')               .text(translation.hideAll) .onLink(function {                 $('.NavFrame').each(function { if (!$(this).hasClass('collapsed')) { toggleNavigationBar(this); }                 });                }),            ']')      .appendTo(this);  }); /**  * Magnify pictures without leaving the page */ createPicButtons; function createPicButtons { var NavPics = $('.NavPic'); NavPics.each(function {     var buttonLink = $(' ')                        .text(translation.show)                        .onLink(function { toggleNavPics($(this).closest('.NavPic')); });     var button = $(' ')                    .append(myShowHideConfig.brackets.substr(0, myShowHideConfig.brackets.length/2), buttonLink, myShowHideConfig.brackets.substr(myShowHideConfig.brackets.length/2));     $(this)[myShowHideConfig.linkBefore?'prepend':'append'](button);    });

} function toggleNavPics(navPic) { var button = $(navPic).find('.collapseLink'); var toToggle = $(navPic).children('div'); if (!$(navPic).length || !button.length) { return; }   toToggle.slideToggle; $(navPic).toggleClass('collapsed'); if ($(navPic).hasClass('collapsed')) { button.text(translation.hide); } else { button.text(translation.show); } }  // remove doubled buttons $('.collapseButton').nextAll('.collapseButton').remove; });