Mediawiki:common.js
| Строка 2221: | Строка 2221: | ||
}; | }; | ||
var | var AprilPrankSlideModule = { | ||
overlay: null, | overlay: null, | ||
audio: null, | audio: null, | ||
stopAudioTimer: null, | |||
started: false, | |||
isAnimating: false, | |||
init: function () { | init: function () { | ||
| Строка 2232: | Строка 2232: | ||
this.started = true; | this.started = true; | ||
if (!window.mw || !mw.config || !mw.config.get('wgIsMainPage')) | if (!window.mw || !mw.config || !mw.config.get('wgIsMainPage')) return; | ||
var params = new URLSearchParams(window.location.search); | var params = new URLSearchParams(window.location.search); | ||
var | var isPrankMode = params.has('prank'); | ||
var now = new Date(); | |||
var isAprilFirst = now.getMonth() === 3 && now.getDate() === 1; | |||
if (!isPrankMode && !isAprilFirst) return; | |||
if (! | if (!isPrankMode && sessionStorage.getItem('april-prank-shown') === '1') return; | ||
if (!isPrankMode) { | |||
sessionStorage.setItem('april-prank-shown', '1'); | |||
} | } | ||
this.injectStyles(); | this.injectStyles(); | ||
this.createOverlay(); | this.createOverlay(); | ||
}, | }, | ||
injectStyles: function () { | injectStyles: function () { | ||
if (document.getElementById('april- | if (document.getElementById('april-prank-slide-styles')) return; | ||
var style = document.createElement('style'); | var style = document.createElement('style'); | ||
style.id = 'april- | style.id = 'april-prank-slide-styles'; | ||
style.textContent = | style.textContent = | ||
'#april | '#april-prank-overlay{' + | ||
'position:fixed;' + | 'position:fixed;' + | ||
'inset:0;' + | 'inset:0;' + | ||
'z-index:2147483647;' + | 'z-index:2147483647;' + | ||
'background:#000;' + | 'background:#000;' + | ||
'overflow | 'overflow:hidden;' + | ||
'transform:translateY(0);' + | 'transform:translateY(0);' + | ||
'transition:transform | 'transition:transform 5000ms linear;' + | ||
'}' + | '}' + | ||
'#april | '#april-prank-overlay.april-prank-hide{' + | ||
'transform:translateY(-100%);' + | 'transform:translateY(-100%);' + | ||
'}' + | '}' + | ||
'#april- | '#april-prank-overlay .april-prank-scroll{' + | ||
'width:100%;' + | |||
'height:100%;' + | |||
'overflow:auto;' + | |||
'cursor:pointer;' + | |||
'-webkit-overflow-scrolling:touch;' + | |||
'}' + | |||
'#april-prank-overlay .april-prank-scroll img{' + | |||
'display:block;' + | 'display:block;' + | ||
'width: | 'width:100%;' + | ||
'height:auto;' + | 'height:auto;' + | ||
' | 'max-width:none;' + | ||
' | 'user-select:none;' + | ||
'-webkit-user-drag:none;' + | |||
'pointer-events:none;' + | |||
'}'; | '}'; | ||
document.head.appendChild(style); | document.head.appendChild(style); | ||
| Строка 2283: | Строка 2290: | ||
createOverlay: function () { | createOverlay: function () { | ||
var overlay = document.createElement('div'); | var overlay = document.createElement('div'); | ||
overlay.id = 'april | overlay.id = 'april-prank-overlay'; | ||
var | var scroller = document.createElement('div'); | ||
scroller.className = 'april-prank-scroll'; | |||
overlay.appendChild( | var image = document.createElement('img'); | ||
image.src = 'https://upload.wikimedia.org/wikipedia/commons/d/d4/2019_Screenshot_of_English_Wikipedia_homepage.png'; | |||
image.alt = 'Wikipedia homepage prank'; | |||
scroller.appendChild(image); | |||
overlay.appendChild(scroller); | |||
document.body.appendChild(overlay); | document.body.appendChild(overlay); | ||
this.overlay = overlay; | this.overlay = overlay; | ||
var self = this; | var self = this; | ||
scroller.addEventListener('click', function () { | |||
self. | self.startSlideOut(); | ||
}); | |||
}, | }, | ||
startSlideOut: function () { | |||
if (this. | if (!this.overlay || this.isAnimating) return; | ||
this. | this.isAnimating = true; | ||
this.playSoundStrict5s(); | |||
this.overlay.classList.add(' | var self = this; | ||
this.overlay.classList.add('april-prank-hide'); | |||
this.overlay.addEventListener('transitionend', function handleTransitionEnd(e) { | |||
this.overlay.addEventListener('transitionend', function | |||
if (e.propertyName !== 'transform') return; | if (e.propertyName !== 'transform') return; | ||
self.overlay.removeEventListener('transitionend', | self.overlay.removeEventListener('transitionend', handleTransitionEnd); | ||
self. | self.stopSoundNow(); | ||
if (self.overlay && self.overlay.parentNode) { | if (self.overlay && self.overlay.parentNode) { | ||
self.overlay.parentNode.removeChild(self.overlay); | self.overlay.parentNode.removeChild(self.overlay); | ||
| Строка 2328: | Строка 2331: | ||
}, | }, | ||
playSoundStrict5s: function () { | |||
this.stopSoundNow(); | |||
var audio = new Audio('https://zvukogram.com/mp3/40/stone-plate.mp3'); | |||
audio.preload = 'auto'; | |||
audio.loop = false; | |||
audio.volume = 1; | |||
this.audio = audio; | |||
var self = this; | |||
audio.play().catch(function () { | |||
// Браузер мог заблокировать автозвук; по клику обычно воспроизводится. | |||
}); | |||
this.stopAudioTimer = setTimeout(function () { | |||
self.stopSoundNow(); | |||
}, 5000); | |||
}, | }, | ||
stopSoundNow: function () { | |||
if (this.stopAudioTimer) { | |||
clearTimeout(this.stopAudioTimer); | |||
this.stopAudioTimer = null; | |||
} | |||
if (this.audio) { | |||
try { | |||
this.audio.pause(); | |||
this.audio.currentTime = 0; | |||
this.audio.removeAttribute('src'); | |||
this.audio.load(); | |||
} catch (e) {} | |||
this.audio = null; | |||
} | |||
} | } | ||
}; | }; | ||
function initAllModules() { | function initAllModules() { | ||
SidebarModule.init(); | SidebarModule.init(); | ||