Content deleted Content added
mNo edit summary |
m vote button shenanigans |
||
(28 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* All JavaScript here will be loaded for users of the Cosmos skin */ |
/* All JavaScript here will be loaded for users of the Cosmos skin */ |
||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
} else { |
|||
html.classList.remove('client-darkmode'); |
|||
} |
|||
var docTitle = document.title; |
|||
title = docTitle.replace(' - ',' :: '); |
|||
⚫ | |||
document.title = docTitle; |
|||
⚫ | document.getElementById("discordwidget").innerHTML = '<iframe src="https://discord.com/widget?id=461483989463597057&theme=dark" class="railModule module interface-module" width="100%" height="400px" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>'; |
||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
}); |
|||
$(document).ready(function () { |
|||
//dark mode |
|||
/*/Site notice noexcerpt /* |
|||
$(window).on('load', function() { |
|||
if ($('#siteNotice').length > 0) { |
|||
var html = document.getElementsByTagName('html')[0]; |
|||
var siteNotice = document.getElementById('siteNotice'); |
|||
⚫ | |||
siteNotice.classList.add('noexcerpt'); |
|||
⚫ | |||
//empty paragraphs noexcerpt |
|||
if ($('.mw-empty-elt').length > 0) { |
|||
var emptyP = document.getElementsByClassName('mw-empty-elt'); |
|||
for (var i = 0; i < emptyP.length; i++) { |
|||
emptyP[i].classList.add('noexcerpt'); |
|||
} |
|||
}*/ |
|||
//end noexcerpt class-adds |
|||
//ADD ... TO SEARCH BAR |
|||
document.getElementsByName('search')[0].placeholder = "Search WT Wiki..."; |
|||
//ACTIVATING DARK MODE |
|||
⚫ | |||
var dropdown = document.getElementById('p-more'); |
var dropdown = document.getElementById('p-more'); |
||
var buttonGroup = |
var buttonGroup = document.getElementsByClassName('cosmos-header__wiki-buttons')[0]; |
||
// Create & Place darkmode button |
|||
var darkModeButton = document.createElement(' |
var darkModeButton = document.createElement('a'); |
||
darkModeButton.classList.add('wds-button', 'wds-is-secondary', 'dusty-darkmode-button'); |
darkModeButton.classList.add('wds-button', 'wds-is-secondary', 'dusty-darkmode-button'); |
||
darkModeButton.title = 'Switch to Dark Mode'; |
darkModeButton.title = 'Switch to Dark Mode'; |
||
var moonSVG = '<svg style="color: white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon wds-icon-small wds-icon-darkmode" id="wds-icons-darkmode-small" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"></path> </svg>'; |
var moonSVG = '<svg style="color: white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon wds-icon-small wds-icon-darkmode" id="wds-icons-darkmode-small" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"></path> </svg>';//little moon icon |
||
var sunSVG = '<svg style="color: white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-sun wds-icon-small wds-icon-lightmode" id="wds-icons-lightmode-small" 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" fill="white"></path> </svg>'; |
var sunSVG = '<svg style="color: white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-sun wds-icon-small wds-icon-lightmode" id="wds-icons-lightmode-small" 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" fill="white"></path> </svg>';//little sun icon |
||
//sneak it intp the button group |
|||
⚫ | |||
buttonGroup.insertBefore(darkModeButton, dropdown); |
buttonGroup.insertBefore(darkModeButton, dropdown); |
||
console.log('this works?'); |
console.log('this works?'); |
||
//sneaking vote button in article header actions |
|||
⚫ | |||
if (document.querySelectorAll("#page-vote").length > 0) { |
|||
document.getElementById("cosmos-articleHeader-actions").prepend(document.getElementById("page-vote")); |
|||
console.log('weeee') |
|||
} |
|||
//changing the button |
|||
if (html.classList.contains('client-darkmode')) { |
if (html.classList.contains('client-darkmode')) { |
||
darkModeButton.innerHTML = sunSVG; |
darkModeButton.innerHTML = sunSVG;//if dark mode, make button sun |
||
} else { |
} else { |
||
darkModeButton.innerHTML = moonSVG; |
darkModeButton.innerHTML = moonSVG;//if light mode, make button moon |
||
} |
} |
||
//when u click on dark mode button |
|||
darkModeButton.onclick = function () { |
darkModeButton.onclick = function () { |
||
//add darkmode class to html element |
//add darkmode class to html element |
||
html.classList.toggle('client-darkmode'); |
html.classList.toggle('client-darkmode'); |
||
//make browser remember |
//make browser remember & change buttons again |
||
if (darkModeButton.innerHTML == sunSVG) { |
if (darkModeButton.innerHTML === sunSVG) { |
||
darkModeButton.innerHTML = moonSVG; |
darkModeButton.innerHTML = moonSVG; |
||
darkModeButton.title = 'Switch to Light Mode'; |
darkModeButton.title = 'Switch to Light Mode'; |
||
console.log('switching to light mode!'); |
console.log('switching to light mode!'); |
||
//saving light mode setting |
//saving light mode setting |
||
localStorage.setItem('dusty-darkmode','light'); |
localStorage.setItem('dusty-darkmode', 'light'); |
||
} else { |
} else { |
||
darkModeButton.innerHTML = sunSVG; |
darkModeButton.innerHTML = sunSVG; |
||
Line 49: | Line 70: | ||
console.log('switching to dark mode!'); |
console.log('switching to dark mode!'); |
||
//saving dark mode setting |
//saving dark mode setting |
||
localStorage.setItem('dusty-darkmode','dark'); |
localStorage.setItem('dusty-darkmode', 'dark'); |
||
} |
} |
||
}; |
};//end darkmode function |
||
}); |
|||
//check if discord widget exists (presence of Cosmos Rail) |
|||
if ($('#discordwidget').length > 0) { |
|||
⚫ | |||
⚫ | document.getElementById("discordwidget").innerHTML = '<iframe src="https://discord.com/widget?id=461483989463597057&theme=dark" class="railModule module interface-module" width="100%" height="400px" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>'; |
||
⚫ | |||
});//end document ready |
Latest revision as of 21:35, April 19, 2024
/* All JavaScript here will be loaded for users of the Cosmos skin */
//check localStorage for darkmode
var html = document.getElementsByTagName('html')[0];
if (localStorage.getItem('dusty-darkmode') === 'dark') {
html.classList.add('client-darkmode');
} else {
html.classList.remove('client-darkmode');
}
var docTitle = document.title;
title = docTitle.replace(' - ',' :: ');
document.title = docTitle;
$(document).ready(function () {
/*/Site notice noexcerpt /*
if ($('#siteNotice').length > 0) {
var siteNotice = document.getElementById('siteNotice');
siteNotice.classList.add('noexcerpt');
}
//empty paragraphs noexcerpt
if ($('.mw-empty-elt').length > 0) {
var emptyP = document.getElementsByClassName('mw-empty-elt');
for (var i = 0; i < emptyP.length; i++) {
emptyP[i].classList.add('noexcerpt');
}
}*/
//end noexcerpt class-adds
//ADD ... TO SEARCH BAR
document.getElementsByName('search')[0].placeholder = "Search WT Wiki...";
//ACTIVATING DARK MODE
//target the icon area
var dropdown = document.getElementById('p-more');
var buttonGroup = document.getElementsByClassName('cosmos-header__wiki-buttons')[0];
// Create & Place darkmode button
var darkModeButton = document.createElement('a');
darkModeButton.classList.add('wds-button', 'wds-is-secondary', 'dusty-darkmode-button');
darkModeButton.title = 'Switch to Dark Mode';
var moonSVG = '<svg style="color: white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon wds-icon-small wds-icon-darkmode" id="wds-icons-darkmode-small" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"></path> </svg>';//little moon icon
var sunSVG = '<svg style="color: white" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-sun wds-icon-small wds-icon-lightmode" id="wds-icons-lightmode-small" 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" fill="white"></path> </svg>';//little sun icon
//sneak it intp the button group
buttonGroup.insertBefore(darkModeButton, dropdown);
console.log('this works?');
//sneaking vote button in article header actions
if (document.querySelectorAll("#page-vote").length > 0) {
document.getElementById("cosmos-articleHeader-actions").prepend(document.getElementById("page-vote"));
console.log('weeee')
}
//changing the button
if (html.classList.contains('client-darkmode')) {
darkModeButton.innerHTML = sunSVG;//if dark mode, make button sun
} else {
darkModeButton.innerHTML = moonSVG;//if light mode, make button moon
}
//when u click on dark mode button
darkModeButton.onclick = function () {
//add darkmode class to html element
html.classList.toggle('client-darkmode');
//make browser remember & change buttons again
if (darkModeButton.innerHTML === sunSVG) {
darkModeButton.innerHTML = moonSVG;
darkModeButton.title = 'Switch to Light Mode';
console.log('switching to light mode!');
//saving light mode setting
localStorage.setItem('dusty-darkmode', 'light');
} else {
darkModeButton.innerHTML = sunSVG;
darkModeButton.title = 'Switch to Dark Mode';
console.log('switching to dark mode!');
//saving dark mode setting
localStorage.setItem('dusty-darkmode', 'dark');
}
};//end darkmode function
//check if discord widget exists (presence of Cosmos Rail)
if ($('#discordwidget').length > 0) {
//place discord widget
document.getElementById("discordwidget").innerHTML = '<iframe src="https://discord.com/widget?id=461483989463597057&theme=dark" class="railModule module interface-module" width="100%" height="400px" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>';
}
});//end document ready