Участник:Infovarius/Gadget-VisibilityToggle.js
Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.
- Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
- Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
- Internet Explorer / Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
- Opera: Нажмите Ctrl+F5.
// DOM creation
/**
* Create a new DOM node for the current document.
* Basic usage: var mySpan = newNode('span', "Hello World!")
* Supports attributes and event handlers*: var mySpan = newNode('span', {style:"color: red", focus: function(){alert(this)}, id:"hello"}, "World, Hello!")
* Also allows nesting to create trees: var myPar = newNode('p', newNode('b',{style:"color: blue"},"Hello"), mySpan)
*
* *event handlers, there are some issues with IE6 not registering event handlers on some nodes that are not yet attached to the DOM,
* it may be safer to add event handlers later manually.
**/
function newNode(tagname){
var node = document.createElement(tagname);
for( var i=1;i<arguments.length;i++ ){
if(typeof arguments[i] == 'string'){ //Text
node.appendChild( document.createTextNode(arguments[i]) );
}else if(typeof arguments[i] == 'object'){
if(arguments[i].nodeName){ //If it is a DOM Node
node.appendChild(arguments[i]);
}else{ //Attributes (hopefully)
for(var j in arguments[i]){
if(j == 'class'){ //Classname different because...
node.className = arguments[i][j];
}else if(j == 'style'){ //Style is special
node.style.cssText = arguments[i][j];
}else if(typeof arguments[i][j] == 'function'){ //Basic event handlers
try{ node.addEventListener(j,arguments[i][j],false); //W3C
}catch(e){try{ node.attachEvent('on'+j,arguments[i][j],"Language"); //MSIE
}catch(e){ node['on'+j]=arguments[i][j]; }}; //Legacy
}else{
node.setAttribute(j,arguments[i][j]); //Normal attributes
}
}
}
}
}
return node;
}
var VisibilityToggles = {
// toggles[category] = [[show, hide],...]; statuses[category] = [true, false,...]; buttons = <li>
toggles: {}, statuses: {}, buttons: null,
// Add a new toggle, adds a Show/Hide category button in the toolbar,
// and will call show_function and hide_function once on register, and every alternate click.
register: function (category, show_function, hide_function) {
var id = 0;
if (!this.toggles[category]) {
this.toggles[category] = [];
this.statuses[category] = [];
} else {
id = this.toggles[category].length;
}
this.toggles[category].push([show_function, hide_function]);
this.statuses[category].push(this.currentStatus(category));
this.addGlobalToggle(category);
(this.statuses[category][id] ? show_function : hide_function)();
return function () {
var statuses = VisibilityToggles.statuses[category];
statuses[id] = !statuses[id]
VisibilityToggles.checkGlobalToggle(category);
return (statuses[id] ? show_function : hide_function)();
}
},
// Add a new global toggle to the side bar
addGlobalToggle: function(category) {
if (document.getElementById('p-visibility-'+category))
return;
if (!this.buttons) {
this.buttons = newNode('ul');
var toolbox = newNode('div', {'class': "portal portlet collapsed", 'id': 'p-visibility'},
newNode('h5', 'Visibility'),
newNode('div', {'class': "pBody body"}, this.buttons)
);
var sidebar = document.getElementById('mw-panel') || document.getElementById('column-one');
var insert = null;
if (insert = (document.getElementById('p-lang') || document.getElementById('p-feedback')))
sidebar.insertBefore(toolbox, insert);
else
sidebar.appendChild(toolbox);
}
var status = this.currentStatus(category);
var newToggle = newNode('li', newNode('a', {
id: 'p-visibility-' + category,
style: 'cursor: pointer',
href: '#visibility-' + category,
click: function(e)
{
VisibilityToggles.toggleGlobal(category);
if (e && e.preventDefault)
e.preventDefault();
else
window.event.returnValue = false;
return false;
}},
(status ? 'Hide ' : 'Show ') + category));
for (var i=0; i < this.buttons.childNodes.length; i++) {
if (this.buttons.childNodes[i].id < newToggle.id) {
this.buttons.insertBefore(newToggle, this.buttons.childNodes[i]);
return;
}
}
this.buttons.appendChild(newToggle);
},
// Update the toggle-all buttons when all things are toggled one way
checkGlobalToggle: function(category) {
var statuses = this.statuses[category];
var status = statuses[0];
for (var i = 1; i < statuses.length; i++) {
if (status != statuses[i])
return;
}
document.getElementById('p-visibility-' + category).innerHTML = (status ? 'Hide ' : 'Show ') + category;
},
// Toggle all un-toggled elements when the global button is clicked
toggleGlobal: function(category) {
var status = document.getElementById('p-visibility-' + category).innerHTML.indexOf('Show ') == 0;
for (var i = 0; i < this.toggles[category].length; i++ ) {
if (this.statuses[category][i] != status) {
this.toggles[category][i][status ? 0 : 1]();
this.statuses[category][i] = status;
}
}
document.getElementById('p-visibility-' + category).innerHTML = (status ? 'Hide ' : 'Show ') + category;
var current = getCookie('Visibility');
if (!current)
current = ";";
current = current.replace(';' + category + ';', ';');
if (status)
current = current + category + ";";
setCookie('Visibility', current);
},
currentStatus: function(category) {
if (getCookie('WiktionaryPreferencesShowNav') == 'true')
return true;
else if (getCookie('Visibility').indexOf(';' + category + ';') >= 0)
return true;
return false; // TODO load this from category specific cookies
}
};
/*</pre>
=== NavBars ===
<pre>*/
var NavigationBarHide = 'hide ▲';
var NavigationBarShow = 'show ▼';
function NavToggleCategory(navFrame)
{
var table = navFrame.getElementsByTagName('table')[0];
if (table && table.className == "translations")
return "translations";
var heading = navFrame.previousSibling;
while (heading) {
if (/[hH][4-6]/.test(heading.nodeName)) {
if (heading.getElementsByTagName('span')[1]) {
return heading.getElementsByTagName('span')[1].innerHTML.toLowerCase();
}
else {
return heading.getElementsByTagName('span')[0].innerHTML.toLowerCase();
}
}
else if (/[hH][1-3]/.test(heading.nodeName))
break;
heading = heading.previousSibling;
}
return "other boxes";
};
function createNavToggle(navFrame){
var navHead, navToggle, navContent;
for (var j=0; j < navFrame.childNodes.length; j++) {
var div = navFrame.childNodes[j];
switch (div.className) {
case 'NavHead':
navHead = div;
break;
case 'NavContent':
navContent = div;
break;
}
}
if (!navHead || !navContent)
return;
// Step 1, don't react when a subitem is clicked.
for (var i=0; i<navHead.childNodes.length; i++) {
var child = navHead.childNodes[i];
if (child.nodeType == 1) {
child.onclick = function (e)
{
if (e && e.stopPropagation)
e.stopPropagation();
else
window.event.cancelBubble = true;
}
}
}
// Step 2, toggle visibility when bar is clicked.
// NOTE This function was chosen due to some funny behaviour in Safari.
navToggle = newNode('a', {href: 'javascript:(function(){})()'}, '');
navHead.insertBefore(newNode('span', {'class': 'NavToggle'}, '[', navToggle, ']'), navHead.firstChild);
navHead.style.cursor = "pointer";
navHead.onclick = VisibilityToggles.register(NavToggleCategory(navFrame),
function show() {
navToggle.innerHTML = NavigationBarHide;
if (navContent)
navContent.style.display = "block";
},
function hide() {
navToggle.innerHTML = NavigationBarShow;
if (navContent)
navContent.style.display = "none";
});
};
$( function ()
{
var divs;
if (document.getElementsByClassName)
divs = document.getElementsByClassName('NavFrame');
else
divs = document.getElementsByTagName('div');
for (var i=0; i<divs.length; i++) {
// NOTE: some templates use a class of NavFrame for the style, but for legacy reasons, are not NavFrames
if (divs[i].className == "NavFrame") {
createNavToggle(divs[i]);
}
}
});
/*</pre>
===Hidden Quotes===
<pre>*/
function setupHiddenQuotes(li)
{
var HQToggle, liComp;
var HQShow = 'quotations ▼';
var HQHide = 'quotations ▲';
for (var k = 0; k < li.childNodes.length; k++) {
// Look at each component of the definition.
liComp = li.childNodes[k];
// If we find a ul or dl, we have quotes or example sentences, and thus need a button.
if (/^(ul|UL)$/.test(liComp.nodeName)) {
HQToggle = newNode('a', {href: 'javascript:(function(){})()'}, '');
li.insertBefore(newNode('span', {'class': 'HQToggle', 'style': 'font-size:0.65em'}, ' [', HQToggle, ']'), liComp);
HQToggle.onclick = VisibilityToggles.register('quotations',
function show() {
HQToggle.innerHTML = HQHide;
for (var child = li.firstChild; child != null; child = child.nextSibling) {
if (/^(ul|UL)$/.test(child.nodeName)) {
child.style.display = 'block';
}
}
},
function hide() {
HQToggle.innerHTML = HQShow;
for (var child = li.firstChild; child != null; child = child.nextSibling) {
if (/^(ul|UL)$/.test(child.nodeName)) {
child.style.display = 'none';
}
}
});
break;
}
}
}
$( function ()
{
if (wgNamespaceNumber == 0) {
var ols, lis, li;
// First, find all the ordered lists, i.e. all the series of definitions.
var ols = document.getElementsByTagName('ol');
for(var i = 0; i < ols.length; i++) {
// Then, for every set, find all the individual definitions.
for (var j = 0; j < ols[i].childNodes.length; j++) {
li = ols[i].childNodes[j];
if (li.nodeName.toUpperCase() == 'LI') {
setupHiddenQuotes(li);
}
}
}
}
});
mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Yair_rand/TabbedLanguages.js&action=raw&ctype=text/javascript')