MediaWiki:Common.js: Difference between revisions
Appearance
SuperAdmin1 (talk | contribs) Added 3D rotating tag cloud implementation for Main Page |
SuperAdmin1 (talk | contribs) Updated 3D cloud to show CEO articles with traffic-based sizing and Wikipedia fonts |
||
| Line 13: | Line 13: | ||
}); | }); | ||
/* 3D Tag Cloud for Main Page */ | /* 3D CEO Tag Cloud for Main Page - Wikipedia Style */ | ||
$(document).ready(function() { | $(document).ready(function() { | ||
var placeholder = document.getElementById('ceocloud-placeholder'); | var placeholder = document.getElementById('ceocloud-placeholder'); | ||
if (!placeholder) return; | if (!placeholder) return; | ||
// CEO | // Get CEO data from the parser function | ||
var | var ceoDataEl = document.getElementById('ceo-data'); | ||
if (!ceoDataEl) return; | |||
var ceoDataJson = ceoDataEl.getAttribute('data-ceos'); | |||
if (!ceoDataJson) return; | |||
var tags = JSON.parse(ceoDataJson); | |||
if (!tags || tags.length === 0) return; | |||
// Create cloud container | // Create cloud container | ||
| Line 69: | Line 57: | ||
link.style.textDecoration = 'none'; | link.style.textDecoration = 'none'; | ||
link.style.fontSize = tag.size + 'px'; | link.style.fontSize = tag.size + 'px'; | ||
link.style.fontWeight = ' | link.style.fontWeight = '400'; | ||
link.style.fontFamily = 'Georgia, "Times New Roman", Times, serif'; // Wikipedia-style serif font | |||
link.style.whiteSpace = 'nowrap'; | link.style.whiteSpace = 'nowrap'; | ||
link.style.transition = 'all 0.3s'; | link.style.transition = 'all 0.3s'; | ||
| Line 84: | Line 73: | ||
link.addEventListener('mouseenter', function() { | link.addEventListener('mouseenter', function() { | ||
this.style.color = '#fbbf24'; | this.style.color = '#fbbf24'; | ||
this.style.fontWeight = '700'; | |||
this.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px) scale(1.2)'; | this.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px) scale(1.2)'; | ||
}); | }); | ||
| Line 89: | Line 79: | ||
link.addEventListener('mouseleave', function() { | link.addEventListener('mouseleave', function() { | ||
this.style.color = '#ffffff'; | this.style.color = '#ffffff'; | ||
this.style.fontWeight = '400'; | |||
this.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px)'; | this.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px)'; | ||
}); | }); | ||
Revision as of 02:54, 22 October 2025
/* Common.js - Site-wide JavaScript */
/* Add copyright footer at the very bottom of page - single occurrence only */
$(document).ready(function() {
// Remove any existing copyright footers first to prevent duplicates
$('#footer-info-copyright, .ceo-copyright-footer').remove();
// Create the copyright footer
var copyright = '<div class="ceo-copyright-footer" id="footer-info-copyright" style="text-align: center; padding: 20px; background: #f8f9fa; border-top: 1px solid #ddd; margin-top: 40px; font-size: 0.85em; line-height: 1.6;">Text is available under the <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="nofollow">Creative Commons Attribution-ShareAlike 4.0 License</a>; additional terms may apply. By using this site, you agree to the <a href="/wiki/CEO.wiki:Terms_of_Use">Terms of Use</a>, <a href="/wiki/CEO.wiki:Privacy_Policy">Privacy Policy</a>, and all <a href="/wiki/CEO.wiki:General_disclaimer">disclaimers</a>. CEO.wiki is operated as an independent collaborative encyclopedia project and is not affiliated with Wikipedia or the Wikimedia Foundation. See our <a href="/wiki/CEO.wiki:Takedown_Request_Policy">Takedown Request Policy</a> for content concerns.</div>';
// Append to the very bottom of the body
$('body').append(copyright);
});
/* 3D CEO Tag Cloud for Main Page - Wikipedia Style */
$(document).ready(function() {
var placeholder = document.getElementById('ceocloud-placeholder');
if (!placeholder) return;
// Get CEO data from the parser function
var ceoDataEl = document.getElementById('ceo-data');
if (!ceoDataEl) return;
var ceoDataJson = ceoDataEl.getAttribute('data-ceos');
if (!ceoDataJson) return;
var tags = JSON.parse(ceoDataJson);
if (!tags || tags.length === 0) return;
// Create cloud container
var cloud = document.createElement('div');
cloud.style.position = 'relative';
cloud.style.width = '100%';
cloud.style.height = '400px';
cloud.style.perspective = '1000px';
var sphere = document.createElement('div');
sphere.style.position = 'absolute';
sphere.style.width = '100%';
sphere.style.height = '100%';
sphere.style.transformStyle = 'preserve-3d';
sphere.style.transition = 'transform 0.1s';
// Create tags in 3D space
var radius = 180;
var angleStep = (Math.PI * 2) / tags.length;
tags.forEach(function(tag, i) {
var angle = angleStep * i;
var vAngle = (Math.random() - 0.5) * Math.PI;
var link = document.createElement('a');
link.href = tag.url;
link.textContent = tag.text;
link.style.position = 'absolute';
link.style.color = '#ffffff';
link.style.textDecoration = 'none';
link.style.fontSize = tag.size + 'px';
link.style.fontWeight = '400';
link.style.fontFamily = 'Georgia, "Times New Roman", Times, serif'; // Wikipedia-style serif font
link.style.whiteSpace = 'nowrap';
link.style.transition = 'all 0.3s';
link.style.textShadow = '0 2px 4px rgba(0,0,0,0.5)';
var x = radius * Math.cos(angle) * Math.cos(vAngle);
var y = radius * Math.sin(vAngle);
var z = radius * Math.sin(angle) * Math.cos(vAngle);
link.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px)';
link.style.left = '50%';
link.style.top = '50%';
link.addEventListener('mouseenter', function() {
this.style.color = '#fbbf24';
this.style.fontWeight = '700';
this.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px) scale(1.2)';
});
link.addEventListener('mouseleave', function() {
this.style.color = '#ffffff';
this.style.fontWeight = '400';
this.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px)';
});
sphere.appendChild(link);
});
cloud.appendChild(sphere);
placeholder.appendChild(cloud);
// Rotation animation
var angleX = 0;
var angleY = 0;
var autoRotate = true;
function animate() {
if (autoRotate) {
angleY += 0.3;
angleX += 0.1;
}
sphere.style.transform = 'rotateX(' + angleX + 'deg) rotateY(' + angleY + 'deg)';
requestAnimationFrame(animate);
}
animate();
// Pause rotation on hover
cloud.addEventListener('mouseenter', function() {
autoRotate = false;
});
cloud.addEventListener('mouseleave', function() {
autoRotate = true;
});
});