Ekatra Foundation

MediaWiki:Common.js: Difference between revisions

MediaWiki:Common.js (view source)

Revision as of 06:10, 17 December 2025

389 bytes removed ,  17 December
no edit summary
(Replace zoom img)
Tag: Reverted
No edit summary
Tag: Reverted
Line 263: Line 263:




$( function(){
$(function () {
// toggled by toggle button. also determines which toggle button image to use
var useCustom = false;
var useCustom = false;
// toggleImgs[0] to switch to custom, toggleImgs[1] to revert to default
var zoomInSVG = `
<svg width="22" height="22" viewBox="0 0 24 24">
  <path d="M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L20 21.5 21.5 20z
          M10 14a4 4 0 1 1 0-8 4 4 0 0 1 0 8z
          M11 7H9v2H7v2h2v2h2v-2h2V9h-2z"/>
</svg>`;


var zoomOutSVG = `
var zoomInSVG =
<svg width="22" height="22" viewBox="0 0 24 24">
'<svg width="22" height="22" viewBox="0 0 24 24">' +
  <path d="M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L20 21.5 21.5 20z
'<path d="M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L20 21.5 21.5 20z ' +
          M7 9h6v2H7z"/>
'M10 14a4 4 0 1 1 0-8 4 4 0 0 1 0 8z ' +
</svg>`;
'M11 7H9v2H7v2h2v2h2v-2h2V9h-2z"/>' +
'</svg>';


var toggleSVG = `
var zoomOutSVG =
<svg width="22" height="22" viewBox="0 0 24 24">
'<svg width="22" height="22" viewBox="0 0 24 24">' +
  <path d="M5 4h14v2H5zm4 4h6l-2 12h-2z"/>
'<path d="M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L20 21.5 21.5 20z ' +
</svg>`;
'M7 9h6v2H7z"/>' +
'</svg>';
 
var toggleSVG =
'<svg width="22" height="22" viewBox="0 0 24 24">' +
'<path d="M5 4h14v2H5zm4 4h6l-2 12h-2z"/>' +
'</svg>';
 
$('#content').prepend(
'<div id="zoomButtons" style="z-index:9999; float:right; display:flex; gap:8px; cursor:pointer;">' +
'<span id="zoomInIcon">' + zoomInSVG + '</span>' +
'<span id="zoomOutIcon">' + zoomOutSVG + '</span>' +
'<span id="toggleButton">' + toggleSVG + '</span>' +
'</div>'
);


// create DOM elements
$('#content').prepend(`
<div id="zoomButtons" style="z-index:9999; float:right; display:flex; gap:8px; cursor:pointer;">
  <span id="zoomInIcon">${zoomInSVG}</span>
  <span id="zoomOutIcon">${zoomOutSVG}</span>
  <span id="toggleButton">${toggleSVG}</span>
</div>
`);
// find DOM elements used later
var $bodyContent = $('.mw-body-content');
var $bodyContent = $('.mw-body-content');
var $toggleButton = $('#toggleButton');
 
var sizes = [parseFloat($bodyContent.css('font-size'))];
// sizes[0] is default, sizes[1] is custom
var sizes = [parseFloat($('.mw-body-content').css('font-size'))];
// default custom zoom of 2
sizes[1] = sizes[0] + 2;
sizes[1] = sizes[0] + 2;
 
// the + converts bool to 0 or 1 to use as array index
function updateSize() {
function updateSize() {
$bodyContent.css({'font-size':(sizes[+ useCustom] + 'pt')});
$bodyContent.css('font-size', sizes[+useCustom] + 'pt');
}
}
function toggle() {
function toggle() {
useCustom = !useCustom;
useCustom = !useCustom;
updateSize();
updateSize();
}
}
function zoom(dif) {
function zoom(dif) {
sizes[1] += dif;
sizes[1] += dif;
Line 320: Line 314:
}
}
}
}
 
$( '#zoomInIcon' ).on( 'click', function(){
$('#zoomInIcon').on('click', function () {
console.log("Zoom +");
zoom(1);
zoom(1);
});
});
 
$( '#zoomOutIcon' ).on( 'click', function(){
$('#zoomOutIcon').on('click', function () {
console.log("Zoom -");
zoom(-1);
zoom(-1);
});
});
 
$( '#toggleButton' ).on( 'click', toggle );
$('#toggleButton').on('click', toggle);
});
});




Retrieved from "https://wiki.ekatrafoundation.org/wiki/Special:MobileDiff/104882"