User:Canadabonk/common.js: Difference between revisions

m
no edit summary
No edit summary
mNo edit summary
(19 intermediate revisions by the same user not shown)
Line 1:
/*
importScript('User:Canadabonk/sandbox.js');
canada's cosmostweaks
last updated: 22 june 2024
 
refer to [[CosmosTweaks]] on dev.miraheze.org
*/
 
// sidetools
enableTOC = true;
enableEditButton = true;
enableFullwide = true;
defaultFullwide = false;
 
// dark mode
enableDarkMode = true;
defaultDarkMode = false;
 
// misc
enableFullwide = true;
enableBannerNav = true;
defaultFullwide = false;
enableBackToTop = true;
enableHideRail = true;
 
//-------------------------------------------------
Line 17 ⟶ 29:
 
if (localStorage.ctDarkMode == 'true') {
$htmldocument.addClassdocumentElement.classList.add('cosmostweaks-darkmode');
}
if (localStorage.ctFullwide == 'true') {
$htmldocument.addClassdocumentElement.classList.add('fullwide');
}
if (localStorage.ctRailHidden == 'true') {
$('.cosmos-articleContainer').addClass('ct-railhidden');
}
if (!enableDarkMode) {
localStorage.removeItem('ctDarkMode');
}
if (!enableFullwide) {
localStorage.removeItem('ctFullwide');
}
 
$(document).ready(function () {
// desktop/tablet only
if ($(window).width() > 850 && $bodymw.isconfig.get('.skin-cosmos') == 'cosmos') {
 
//add sidetools wrapper
$('#mw-content').prepend('<div class="ct-sidetools-wrapper"><div class="ct-sidetools"></div></div>');
const sidetools = $('.ct-sidetools');
$(window).resize(function(){
if ($(window).width() < 850) {
sidetools.hide();
} else {
sidetools.show();
}
});
 
// toc start ------------------------------------------------------------------------------------------------------
// if toc exists, add toc to sidetools
if ($('#toc').length && enableTOC) {
//add button html
Line 39 ⟶ 69:
// add fontawesome list ul icon to toc button
const tocbutton = $('.ct-toc').find('.ct-sidetools-button');
const faListUllistIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M64 144a48 48 0 1 0 0-96 48 48 0 1 0 0 96zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM64 464a48 48 0 1 0 0-96 48 48 0 1 0 0 96zm48-208a48 48 0 1 0 -96 0 48 48 0 1 0 96 0z"/></svg>';
tocbutton.html(faListUllistIcon);
tocbutton.attr('title', 'Contents');
 
Line 86 ⟶ 116:
}
});
} //end toc ------------------------------------------------------------------------------------------------------
} //end toc
//edit button begin
Line 92 ⟶ 122:
sidetools.append('<div class="ct-edit"><a class="ct-sidetools-button"></a></div>');
const
EditButtonIconpencilIcon = '<svg class="cosmos-button-icon" viewBox="0 0 28 28"><path d="M 20 2 L 26 8 L 8 26 L 2 26 L 2 20 Z M 16 6 L 22 12"></path></svg>',
faViewSourcelockIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M144 144v48H304V144c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 192V144C80 64.5 144.5 0 224 0s144 64.5 144 144v48h16c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V256c0-35.3 28.7-64 64-64H80z"/></svg>',
cosmosEditButton = $('.cosmos-actions-edit').first(),
editButtonHref = cosmosEditButton.parent().attr('href'),
Line 105 ⟶ 135:
if (cosmosEditButton.attr('id') == 'ca-viewsource') {
sidetoolsEditButton.html(faViewSourcelockIcon);
} else {
sidetoolsEditButton.html(EditButtonIconpencilIcon);
}
} // end edit button ------------------------------------------------------------------------------------------------------
} // end edit button
//fullwide button begin
Line 121 ⟶ 151:
if (defaultFullwide && localStorage.ctFullwide == null) {
localStorage.ctFullwide = true;
$html.addClass('fullwide');
}
fullwideButton.click(function(){
$bodyhtml.addClass('fullwide-animate').toggleClass('fullwide');
if ($bodyhtml.is('.fullwide')) {
localStorage.ctFullwide = true;
} else {
Line 131 ⟶ 162:
}
});
} // end fullwide button ------------------------------------------------------------------------------------------------------
}
// banner navigation
} //end desktop
if (enableBannerNav) {
$('#p-cosmos-navigation').clone().prependTo('#cosmos-banner-content');
$('#cosmos-banner-content #p-cosmos-navigation').attr('id', 'ct-bannernav');
const bannerNav = $('#ct-bannernav');
bannerNav.css('transform', 'translateY(-100%)');
$(window).scroll(function(){
if (window.scrollY > 200) {
bannerNav.css('transform', 'unset');
} else {
bannerNav.css('transform', 'translateY(-100%)');
}
});
}// end banner navigation ------------------------------------------------------------------------------------------------------
// back to top button
if (enableBackToTop) {
$('#mw-content-container').append('<div class="ct-top"><div class="ct-top-arrow"></div></div>');
const backToTop = $('.ct-top');
backToTop.attr('title', 'Back to top');
backToTop.click(function(){
window.scrollTo(0,0);
});
backToTop.hide().css({
'opacity': '0',
'transform': 'translateY(100%)'
});
$(window).scroll(function(){
if (window.scrollY > 200) {
backToTop.show().css({
'opacity': 'unset',
'transform': 'unset'
});
} else {
backToTop.css({
'opacity': '0',
'transform': 'translateY(100%)'
});
backToTop.hide("slow");
}
});
} // end back to top------------------------------------------------------------------------------------------------------
if (enableHideRail) {
$('#CosmosRailWrapper').prepend('<div class="ct-railtoggle"></div>');
const railToggle = $('.ct-railtoggle');
railToggle.click(function(){
$('.cosmos-articleContainer').toggleClass('ct-railhidden');
if ($('.cosmos-articleContainer').is('.ct-railhidden')) {
localStorage.ctRailHidden = true;
} else {
localStorage.removeItem('ctRailHidden');
$('#CosmosRail').css('display', 'none').fadeIn(500);
}
});
} // end hide rail ------------------------------------------------------------------------------------------------------
} //end desktop ------------------------------------------------------------------------------------------------------
// dark mode
Line 141 ⟶ 236:
sunIcon = '<svg fill="white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"> <path d="M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"></path> </svg>';
drkmodebtn = document.createElement('a');
$('.cosmos-header__wiki-buttons > .wds-button').last().after('<a class="wds-button wds-is-secondary" id="ct-darkmode"></a>');
constdrkmodebtn.classList.add('wds-button', darkModeButton'wds-is-secondary', = $('#ct-darkmode');
drkmodebtn.id = 'ct-darkmode';
const dropdown = document.getElementById('p-more');
const buttonGroup = document.getElementsByClassName('cosmos-header__wiki-buttons')[0];
buttonGroup.insertBefore(drkmodebtn, dropdown);
$('#cosmos-notifsButton-icon').append('<li><a id="ct-darkmode" class="ct-darkmode"></a></li>');
 
const darkModeButton = $('.ct-darkmode');
if (defaultDarkMode && localStorage.ctDarkMode == null) {
Line 150 ⟶ 253:
darkModeButton.click(function(){
$bodyhtml.toggleClass('cosmostweaks-darkmode');
darkModeIconToggle();
if ($bodyhtml.is('.cosmostweaks-darkmode')) {
localStorage.ctDarkMode = true;
} else {
Line 159 ⟶ 262:
});
function darkModeIconToggle() {
if ($bodyhtml.is('.cosmostweaks-darkmode')) {
darkModeButton.html(sunIcon);
darkModeButton.attr('title', 'Switch to light mode');
Line 168 ⟶ 271:
}
}
}// end dark mode ------------------------------------------------------------------------------------------------------
}// end dark mode
function hideOnClickOutside(container, hiddenitem) {
Line 180 ⟶ 283:
 
}); //end document ready
 
mw.loader.load("https://publictestwiki.com/wiki/User:Canadabonk/sandbox.js?action=raw&ctype=text/javascript");
246

edits