MediaWiki:Common.js: Difference between revisions
No edit summary |
No edit summary Tag: Manual revert |
||
| Line 140: | Line 140: | ||
function updateStickyHeader() { | function updateStickyHeader() { | ||
var header = document.querySelector('.vector-header-container'); | var header = document.querySelector('.vector-header-container'); | ||
var pageContainer = document.querySelector('.mw-page-container'); | |||
if (!header || !pageContainer) { | if (!header || !pageContainer) { | ||
Revision as of 06:31, 13 October 2025
$(document).ready(function() {
$('input#searchInput').attr('placeholder', 'Search for Transight Wiki');
});
// Open all external links in a new tab
$(document).ready(function () {
$("a.external").attr("target", "_blank");
});
mw.loader.using('mediawiki.util', function () {
// Force small text
document.documentElement.classList.remove('vector-feature-custom-font-size-standard', 'vector-feature-custom-font-size-large');
document.documentElement.classList.add('vector-feature-custom-font-size-small');
// Force wide layout
document.documentElement.classList.remove('vector-feature-limited-width');
document.documentElement.classList.add('vector-feature-wide-width');
});
/* === Transight site-wide footer (robust body-append) === */
mw.loader.using(['mediawiki.util']).then(function () {
function injectTsFooter() {
if (document.getElementById('ts-footer')) return; // avoid duplicates
var html = '\
<div id="ts-footer" class="ts-footer">\
<div class="ts-footer__container">\
<nav class="ts-footer__sitemap">\
<ul class="ts-footer__col">\
<li class="ts-footer__title">USE CASES</li>\
<li><a href="https://transight.com/solutions/fleet-management/">Fleet Telematics</a></li>\
<li><a href="https://transight.com/solutions/remote-management-system/">Remote Monitoring System</a></li>\
<li><a href="https://transight.com/solutions/automation/">Automation</a></li>\
<li><a href="https://transight.com/solutions/asset-tracking/">Asset Tracking</a></li>\
<li><a href="https://transight.com/transforming-battery-management-for-ev/">Advanced EV Telematics</a></li>\
</ul>\
<ul class="ts-footer__col">\
<li class="ts-footer__title">PRODUCTS</li>\
<li><a href="https://telematics.transight.com/Trackers">Trackers</a></li>\
<li><a href="https://telematics.transight.com/Accessories">Accessories</a></li>\
<li><a href="https://transight.com/products/cloud-iot-platform/">Cloud IoT Solutions</a></li>\
</ul>\
<ul class="ts-footer__col">\
<li class="ts-footer__title">SUPPORT</li>\
<li><a href="https://transight.com/client-support/">Product Support</a></li>\
<li><a href="/wiki/WIKI_KNOWLEDGE_BASE">Wiki Knowledge Base</a></li>\
<li><a href="/wiki/RMA_Guidelines">Warranty & Repair</a></li>\
</ul>\
<ul class="ts-footer__col">\
<li class="ts-footer__title">ABOUT US</li>\
<li><a href="https://transight.com/about/">Mission, Vision</a></li>\
<li><a href="/wiki/Career">Career</a></li>\
<li><a href="https://transight.com/contact/">Contacts</a></li>\
</ul>\
</nav>\
<div class="ts-footer__bottom">\
<p class="ts-footer__legal">© 2024, Transight | <a href="/wiki/Privacy">Privacy</a> | <a href="/wiki/Cookies">Cookies</a> | <a href="/wiki/Policies">All Policies</a></p>\
<p class="ts-footer__social"><a href="https://facebook.com">Facebook</a> <a href="https://www.linkedin.com/company/transight/">LinkedIn</a> <a href="https://x.com/transight_iot?s=21">X</a> <a href="https://youtube.com/@transightsystems">YouTube</a> <a href="https://www.instagram.com/transightsystems/">Instagram</a></p>\
</div>\
</div>\
</div>';
// Always append at the very end of <body> so no page element can constrain width
document.body.insertAdjacentHTML('beforeend', html);
// Hide any built-in wiki footers
document.querySelectorAll('footer.mw-footer, .mw-footer, #mw-footer, .mw-footer-container')
.forEach(function (el) { el.style.display = 'none'; });
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', injectTsFooter);
} else {
injectTsFooter();
}
});
/* === Inject floating buttons: "Go to our web" & "Go to Top" === */
mw.loader.using(['mediawiki.util']).then(function () {
// Prevent duplicate injection
if (!document.getElementById('ts-webfab')) {
var webUrl = 'https://transight.com/';
var htmlWeb = ''
+ '<div id="ts-webfab" class="ts-fab">'
+ ' <a class="ts-fab__btn" href="' + webUrl + '" target="_blank" rel="noopener" aria-label="Go to our website"></a>'
+ ' <span class="ts-fab__bubble">Go to our web</span>'
+ '</div>';
document.body.insertAdjacentHTML('beforeend', htmlWeb);
}
if (!document.getElementById('ts-topfab')) {
var htmlTop = ''
+ '<div id="ts-topfab" class="ts-fab">'
+ ' <a class="ts-fab__btn" href="javascript:void(0);" aria-label="Go to top"></a>'
+ ' <span class="ts-fab__bubble">Go to Top</span>'
+ '</div>';
document.body.insertAdjacentHTML('beforeend', htmlTop);
// Smooth scroll to top
document.querySelector('#ts-topfab .ts-fab__btn').addEventListener('click', function() {
window.scrollTo({ top: 0, behavior: 'smooth' });
});
}
});
/* === Transightee: Sticky header helper ===
Place in MediaWiki:Common.js
Vanilla JS, updates on load/resize and when header content changes. */
( function () {
if ( window.transighteeStickyHeaderInit ) return;
window.transighteeStickyHeaderInit = true;
function getTopFixedElementsHeight(excludeEl) {
// find fixed-position elements at the very top (likely toolbars) and sum their heights
var all = document.getElementsByTagName('*');
var sum = 0;
for (var i = 0; i < all.length; i++) {
var el = all[i];
if (el === excludeEl) continue;
var cs = window.getComputedStyle(el);
if (cs.position === 'fixed' && cs.display !== 'none' && el.offsetHeight > 0) {
var rect = el.getBoundingClientRect();
// consider elements whose top is near the top of viewport
if (rect.top >= -2 && rect.top <= 10) {
sum += el.offsetHeight;
}
}
}
return sum;
}
function updateStickyHeader() {
var header = document.querySelector('.vector-header-container');
var pageContainer = document.querySelector('.mw-page-container');
if (!header || !pageContainer) {
// If header or container not present yet, keep trying later
return;
}
// Ensure header has a stable background so it doesn't appear transparent after becoming fixed
try {
var comp = getComputedStyle(header);
if (!header.style.background && comp.backgroundColor && comp.backgroundColor !== 'rgba(0, 0, 0, 0)') {
header.style.backgroundColor = comp.backgroundColor;
}
} catch (e) {
// ignore
}
// Detect any other fixed elements at the top (toolbars) and position header below them
var topOffset = getTopFixedElementsHeight(header);
header.style.top = topOffset + 'px';
// measure header height AFTER top is applied
// force reflow to get accurate size
var height = header.offsetHeight;
// total vertical space header occupies (top offset + header height) = required padding
var totalSpace = topOffset + height;
document.documentElement.style.setProperty('--trans-header-height', totalSpace + 'px');
// add body class to enable CSS that uses the variable
document.body.classList.add('transightee-has-sticky-header');
}
// debounce helper for resize events
var resizeTimer = null;
function scheduleUpdate() {
if (resizeTimer) clearTimeout(resizeTimer);
resizeTimer = setTimeout(function () {
updateStickyHeader();
resizeTimer = null;
}, 120);
}
document.addEventListener('DOMContentLoaded', function () {
// initial attempt
updateStickyHeader();
// update when all resources loaded (images, fonts can change header height)
window.addEventListener('load', updateStickyHeader);
// keep updated on resize
window.addEventListener('resize', scheduleUpdate);
// Observe mutations inside header (e.g. buttons collapsing/expanding) and update padding
var header = document.querySelector('.vector-header-container');
if (header && window.MutationObserver) {
var mo = new MutationObserver(function () {
scheduleUpdate();
});
mo.observe(header, { attributes: true, childList: true, subtree: true, characterData: true });
// keep reference to avoid GC in some environments
window._transighteeStickyMO = mo;
}
});
// Also try a periodic update a couple of times in case skin scripts alter header after load
var tries = 0;
var intId = setInterval(function () {
updateStickyHeader();
tries++;
if (tries > 6) clearInterval(intId);
}, 300);
}() );