MediaWiki:Common.js: Difference between revisions
From Luminys WIKI
Techsupport (talk | contribs) No edit summary Tag: Reverted |
Techsupport (talk | contribs) No edit summary Tag: Reverted |
||
| Line 58: | Line 58: | ||
document.addEventListener('DOMContentLoaded', function () { | |||
// Create the modal HTML structure dynamically | |||
var modal = document.createElement('div'); | |||
modal.id = 'image-modal'; | |||
modal.style.display = 'none'; | |||
modal.style.position = 'fixed'; | |||
modal.style.zIndex = '1000'; | |||
modal.style.left = '0'; | |||
modal.style.top = '0'; | |||
modal.style.width = '100%'; | |||
modal.style.height = '100%'; | |||
modal.style.backgroundColor = 'rgba(0, 0, 0, 0.8)'; | |||
modal.innerHTML = '<img id="modal-image" style="display: block; margin: auto; max-width: 90%; max-height: 90%; border-radius: 8px;">'; | |||
document.body.appendChild(modal); | |||
// Close modal on clicking outside the image | |||
modal.addEventListener('click', function () { | |||
modal.style.display = 'none'; | |||
}); | |||
// Add click event to all images with the class `enlargeable-image` | |||
document.querySelectorAll('.enlargeable-image').forEach(function (img) { | |||
img.addEventListener('click', function () { | |||
var modalImage = document.getElementById('modal-image'); | |||
modalImage.src = this.src; | |||
modal.style.display = 'block'; | |||
}); | }); | ||
}); | }); | ||
}); | }); | ||
Revision as of 15:59, 22 November 2024
// http://mediawiki.i.donnie.fun:8085/MediaWiki:Common.js
/* Any JavaScript here will be loaded for all users on every page load. */
let getCookie = function(name) {
let cookie = {};
document.cookie.split(';').forEach(function(el) {
let split = el.split('=');
cookie[split[0].trim()] = split.slice(1).join("=");
})
return cookie[name];
}
let Run = function(){
let title = $("#firstHeading").text()
if(title == "Main Page") title = "Luminys Knowledge Base (Wiki)"
if(title.indexOf('/') >= 0) title = title.replace("/", "<br/>")
$("#mw-header-container").prepend("<div id='mw-header-lm-title'><div>"+title+"</div></div>")
$("#mw-header-container").prepend(`
<div style="background:white;position: absolute;top: 0;width: 100%;">
<div style="display:flex; flex-direction:row; align-content: center; align-items:baseline;align-self: center; margin: 0 auto; width: 1280px">
<!--<div style="width:14em;"></div>-->
<a href="/" style="height:66px;margin-right:10px"><img src="https://blog.luminyscorp.com/content/images/2024/07/luminys-logo-1.png" style="height:26px;margin:20px 20px 20px 0;" alt="Luminys Logo"> </a>
<div class="">
<div class="hidden md:block ml-6 font-medium w-full lg:flex lg:w-auto ">
<ul id="lm-header">
<li><a href='/Main_Page'>Home</a></li>
<li><a href="/Main_Page#How-to_Instructions">Instructions</a></li>
<li><a href="/Main_Page#Data_Sheets_&_Downloads">Product Support</a></li>
<li><a href="/Main_Page#How-to_Videos">Videos</a></li>
</ul>
</div>
</div>
</div>
</div>
`);
if(window.mediaWiki && window.mediaWiki.user && window.mediaWiki.user.getName){
//let logined = getCookie('my_wikiUserID');
let logined = !!window.mediaWiki.user.getName()
if(logined){
$("#mw-page-header-links ").show();
$("#mw-site-navigation ").show();
$("#mw-related-navigation").show();
}
}
if($(".lm-banner img").length > 0){
$("#mw-header-container").css("background", "url("+ $(".lm-banner img").attr('src') +")").
css("background-size", "cover").css('background-repeat', 'no-repeat').
css('background-position','top 66px right 0')
}
}
$(function () {
Run();
});
document.addEventListener('DOMContentLoaded', function () {
// Create the modal HTML structure dynamically
var modal = document.createElement('div');
modal.id = 'image-modal';
modal.style.display = 'none';
modal.style.position = 'fixed';
modal.style.zIndex = '1000';
modal.style.left = '0';
modal.style.top = '0';
modal.style.width = '100%';
modal.style.height = '100%';
modal.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
modal.innerHTML = '<img id="modal-image" style="display: block; margin: auto; max-width: 90%; max-height: 90%; border-radius: 8px;">';
document.body.appendChild(modal);
// Close modal on clicking outside the image
modal.addEventListener('click', function () {
modal.style.display = 'none';
});
// Add click event to all images with the class `enlargeable-image`
document.querySelectorAll('.enlargeable-image').forEach(function (img) {
img.addEventListener('click', function () {
var modalImage = document.getElementById('modal-image');
modalImage.src = this.src;
modal.style.display = 'block';
});
});
});
