MediaWiki:Gadget-skinTogglesNew-prompt.js: Difference between revisions

Jump to navigation Jump to search

MediaWiki:Gadget-skinTogglesNew-prompt.js (view source)

Revision as of 12:06, 20 October 2024

84 bytes removed ,  20 October
no edit summary
(Created page with "→‎* * Prompts that dark mode color scheme is available. * * @author Elessar2 * @author Gaz Lloyd * @author JaydenKieran * @author TehKittyCat * * Positioning logic adapted from [[MediaWiki:Gadget-rsnews.js]].: var $portletLink = $('#pt-skin-toggles'), $prompt function init() { $prompt = $('<div>').addClass('rsw-color-scheme-prompt').css( 'display', 'none' ).append( $('<p>').css({ 'font-size': '0.75em' }).html('Your device...")
 
No edit summary
 
Line 1:
"use strict";
 
/**
* Prompts that dark mode color scheme is available.
Line 10 ⟶ 12:
*/
var $portletLink = $('#pt-skin-toggles'),
$prompt;
 
function init() {
$prompt = $('<div>').addClass('rsw-color-scheme-prompt').css( 'display', 'none' ).append($('<p>').css({
'font-size': '0.75em'▼
$('<p>').css({▼
}).html('Your device is using dark mode. You can click here to enable the wiki\'s dark mode!<br><a id="rsw-color-scheme-opt-out" href="#">Don\'t show this again</a>'));▼
▲ 'font-size': '0.75em'
$('body').append($prompt);▼
▲ }).html('Your device is using dark mode. You can click here to enable the wiki\'s dark mode!<br><a id="rsw-color-scheme-opt-out" href="#">Don\'t show this again</a>')
)▼
▲ $('body').append($prompt)
 
// Set initial position before showing the prompt.
resizeEvent();
$prompt.show();
 
// Reposition prompt on window resize.
$(window).resize(resizeEvent);
 
// Close prompt when anywhere is clicked.
$(document).click(function () {
$prompt.hide();
});
 
// Set localStorage key so we don't prompt them again.
$( '#rsw-color-scheme-opt-out' ).click( function () {
localStorage.setItem('dark_prompt', 'true');
$prompt.hide();
} );
}
 
function resizeEvent() {
var offset = $portletLink.offset(),
height = $portletLink.outerHeight(),
width = $portletLink.outerWidth(),
pwidth = $prompt.outerWidth(),
wheight = $(window).height(),
ptop = offset.top + height + 15;
▲ $('<p>')prompt.css({
 
top: ptop + 'px',
$prompt.css({
left: offset.left + width top:/ 2 - pwidth / ptop2 + 'px',
left'max-height': (offset.leftwheight +- width/2ptop - pwidth/2)7 + 'px',
▲ });
'max-height': (wheight - ptop - 7) + 'px'
})
}
 
// Wait for #pt-skin-toggles's position to be finalised.
if ( document.readyState === 'complete' ) {
init();
} else {
window.addEventListener('load', init );
}
Retrieved from "https://wiki2.runerealm.org/w/Special:MobileDiff/42214"

Navigation menu