MediaWiki:Common.js: Difference between revisions

From Survival Servers
Jump to navigation Jump to search
No edit summary
 
No edit summary
Line 3: Line 3:
  * Shows game-specific banners OR generic banner on all wiki pages
  * Shows game-specific banners OR generic banner on all wiki pages
  * Includes affiliate tracking: trckaff=3881, trckit=WIKI<PageName>
  * Includes affiliate tracking: trckaff=3881, trckit=WIKI<PageName>
*
* Usage:
* - Auto-detects game from page title
* - Manual override: Add <!-- SSGAME:valheim --> anywhere in page
* - Manual override: Add <div data-ss-game="valheim"></div> to page
* - Generic banner shown on pages without game detection
  */
  */
(function() {
(function() {
     'use strict';
     'use strict';


    // Tracking configuration
     var TRACK_AFF_ID = '3881';
     var TRACK_AFF_ID = '3881';
    var MAX_TRCKIT_LENGTH = 41;
      
      
    // Game configuration - maps keywords to game info
     var gameConfig = {
     var gameConfig = {
         'valheim': { name: 'Valheim', slug: 'valheim', color: '#1a472a' },
         'valheim': { name: 'Valheim', slug: 'valheim' },
         'ark': { name: 'ARK: Survival Evolved', slug: 'ark', color: '#2d5a27' },
         'ark': { name: 'ARK: Survival Evolved', slug: 'ark' },
         'arksurvivalascended': { name: 'ARK: Survival Ascended', slug: 'arksurvivalascended', color: '#ff6b00' },
         'arksurvivalascended': { name: 'ARK: Survival Ascended', slug: 'arksurvivalascended' },
         'asa': { name: 'ARK: Survival Ascended', slug: 'arksurvivalascended', color: '#ff6b00' },
         'asa': { name: 'ARK: Survival Ascended', slug: 'arksurvivalascended' },
         'rust': { name: 'Rust', slug: 'rust', color: '#cd412b' },
         'rust': { name: 'Rust', slug: 'rust' },
         'minecraft': { name: 'Minecraft', slug: 'minecraft', color: '#62a851' },
         'minecraft': { name: 'Minecraft', slug: 'minecraft' },
         'palworld': { name: 'Palworld', slug: 'palworld', color: '#4a90d9' },
         'palworld': { name: 'Palworld', slug: 'palworld' },
         'dayz': { name: 'DayZ', slug: 'dayz', color: '#1a1a1a' },
         'dayz': { name: 'DayZ', slug: 'dayz' },
         'conan': { name: 'Conan Exiles', slug: 'conanexiles', color: '#8b4513' },
         'conan': { name: 'Conan Exiles', slug: 'conanexiles' },
         '7daystodie': { name: '7 Days to Die', slug: '7daystodie', color: '#5c3d2e' },
         '7daystodie': { name: '7 Days to Die', slug: '7daystodie' },
         '7days': { name: '7 Days to Die', slug: '7daystodie', color: '#5c3d2e' },
         '7days': { name: '7 Days to Die', slug: '7daystodie' },
         'theforest': { name: 'The Forest', slug: 'theforest', color: '#2d4a2d' },
         'theforest': { name: 'The Forest', slug: 'theforest' },
         'forest': { name: 'The Forest', slug: 'theforest', color: '#2d4a2d' },
         'forest': { name: 'The Forest', slug: 'theforest' },
         'sonsoftheforest': { name: 'Sons of the Forest', slug: 'sonsoftheforest', color: '#1e3d1e' },
         'sonsoftheforest': { name: 'Sons of the Forest', slug: 'sonsoftheforest' },
         'sons of the forest': { name: 'Sons of the Forest', slug: 'sonsoftheforest', color: '#1e3d1e' },
         'sons of the forest': { name: 'Sons of the Forest', slug: 'sonsoftheforest' },
         'terraria': { name: 'Terraria', slug: 'terraria', color: '#4a8c4a' },
         'terraria': { name: 'Terraria', slug: 'terraria' },
         'projectzomboid': { name: 'Project Zomboid', slug: 'projectzomboid', color: '#3d5c3d' },
         'projectzomboid': { name: 'Project Zomboid', slug: 'projectzomboid' },
         'zomboid': { name: 'Project Zomboid', slug: 'projectzomboid', color: '#3d5c3d' },
         'zomboid': { name: 'Project Zomboid', slug: 'projectzomboid' },
         'enshrouded': { name: 'Enshrouded', slug: 'enshrouded', color: '#6b4423' },
         'enshrouded': { name: 'Enshrouded', slug: 'enshrouded' },
         'satisfactory': { name: 'Satisfactory', slug: 'satisfactory', color: '#d97c2b' },
         'satisfactory': { name: 'Satisfactory', slug: 'satisfactory' },
         'v rising': { name: 'V Rising', slug: 'vrising', color: '#8b0000' },
         'v rising': { name: 'V Rising', slug: 'vrising' },
         'vrising': { name: 'V Rising', slug: 'vrising', color: '#8b0000' },
         'vrising': { name: 'V Rising', slug: 'vrising' },
         'aska': { name: 'ASKA', slug: 'aska', color: '#4a6b8a' },
         'aska': { name: 'ASKA', slug: 'aska' },
         'unturned': { name: 'Unturned', slug: 'unturned', color: '#6b8e23' },
         'unturned': { name: 'Unturned', slug: 'unturned' },
         'factorio': { name: 'Factorio', slug: 'factorio', color: '#ff7b00' },
         'factorio': { name: 'Factorio', slug: 'factorio' },
         'csgo': { name: 'CS2', slug: 'csgo', color: '#de9b35' },
         'csgo': { name: 'CS2', slug: 'csgo' },
         'cs2': { name: 'CS2', slug: 'csgo', color: '#de9b35' },
         'cs2': { name: 'CS2', slug: 'csgo' },
         'counterstrike': { name: 'CS2', slug: 'csgo', color: '#de9b35' },
         'counterstrike': { name: 'CS2', slug: 'csgo' },
         'counter-strike': { name: 'CS2', slug: 'csgo', color: '#de9b35' },
         'theisle': { name: 'The Isle', slug: 'theisle' },
         'theisle': { name: 'The Isle', slug: 'theisle', color: '#2e4a2e' },
         'isle': { name: 'The Isle', slug: 'theisle' },
         'isle': { name: 'The Isle', slug: 'theisle', color: '#2e4a2e' },
         'squad': { name: 'Squad', slug: 'squad' },
         'squad': { name: 'Squad', slug: 'squad', color: '#5a5a3d' },
         'arma': { name: 'Arma 3', slug: 'arma3' },
         'arma': { name: 'Arma 3', slug: 'arma3', color: '#4a4a2d' },
         'starbound': { name: 'Starbound', slug: 'starbound' },
         'starbound': { name: 'Starbound', slug: 'starbound', color: '#1a3d5c' },
         'empyrion': { name: 'Empyrion', slug: 'empyrion' },
         'empyrion': { name: 'Empyrion', slug: 'empyrion', color: '#1a4a6b' },
         'pixark': { name: 'PixARK', slug: 'pixark' },
         'pixark': { name: 'PixARK', slug: 'pixark', color: '#4a7a4a' },
         'dontstarve': { name: "Don't Starve Together", slug: 'dontstarve' },
         'dontstarve': { name: "Don't Starve Together", slug: 'dontstarve', color: '#3d3d3d' },
         "don't starve": { name: "Don't Starve Together", slug: 'dontstarve' },
         "don't starve": { name: "Don't Starve Together", slug: 'dontstarve', color: '#3d3d3d' },
         'scum': { name: 'SCUM', slug: 'scum' },
        'starve': { name: "Don't Starve Together", slug: 'dontstarve', color: '#3d3d3d' },
         'barotrauma': { name: 'Barotrauma', slug: 'barotrauma' },
        'scum': { name: 'SCUM', slug: 'scum', color: '#5c4a2d' },
         'corekeeper': { name: 'Core Keeper', slug: 'corekeeper' },
         'barotrauma': { name: 'Barotrauma', slug: 'barotrauma', color: '#1a3d5c' },
         'core keeper': { name: 'Core Keeper', slug: 'corekeeper' },
         'corekeeper': { name: 'Core Keeper', slug: 'corekeeper', color: '#6b4a23' },
         'stationeers': { name: 'Stationeers', slug: 'stationeers' },
         'core keeper': { name: 'Core Keeper', slug: 'corekeeper', color: '#6b4a23' },
         'icarus': { name: 'Icarus', slug: 'icarus' },
         'stationeers': { name: 'Stationeers', slug: 'stationeers', color: '#2d4a5c' },
         'avorion': { name: 'Avorion', slug: 'avorion' },
         'icarus': { name: 'Icarus', slug: 'icarus', color: '#4a6b8a' },
         'spaceengineers': { name: 'Space Engineers', slug: 'spaceengineers' },
         'avorion': { name: 'Avorion', slug: 'avorion', color: '#2d5a6b' },
         'space engineers': { name: 'Space Engineers', slug: 'spaceengineers' },
         'spaceengineers': { name: 'Space Engineers', slug: 'spaceengineers', color: '#1a2a4a' },
         'mordhau': { name: 'Mordhau', slug: 'mordhau' },
         'space engineers': { name: 'Space Engineers', slug: 'spaceengineers', color: '#1a2a4a' },
         'hurtworld': { name: 'Hurtworld', slug: 'hurtworld' },
         'mordhau': { name: 'Mordhau', slug: 'mordhau', color: '#5c3d2d' },
         'miscreated': { name: 'Miscreated', slug: 'miscreated' },
         'hurtworld': { name: 'Hurtworld', slug: 'hurtworld', color: '#8b5a2b' },
         'fivem': { name: 'FiveM', slug: 'fivem' },
         'miscreated': { name: 'Miscreated', slug: 'miscreated', color: '#3d4a3d' },
         'redm': { name: 'RedM', slug: 'redm' },
         'fivem': { name: 'FiveM', slug: 'fivem', color: '#f26419' },
         'assettocorsa': { name: 'Assetto Corsa', slug: 'assettocorsa' },
         'redm': { name: 'RedM', slug: 'redm', color: '#8b2500' },
         'assetto': { name: 'Assetto Corsa', slug: 'assettocorsa' },
         'assettocorsa': { name: 'Assetto Corsa', slug: 'assettocorsa', color: '#cc0000' },
         'renown': { name: 'Renown', slug: 'renown' },
        'assetto corsa': { name: 'Assetto Corsa', slug: 'assettocorsa', color: '#cc0000' },
         'brickadia': { name: 'Brickadia', slug: 'brickadia' },
         'assetto': { name: 'Assetto Corsa', slug: 'assettocorsa', color: '#cc0000' },
         'holdfast': { name: 'Holdfast: Nations At War', slug: 'holdfast' },
         'renown': { name: 'Renown', slug: 'renown', color: '#4a3d6b' },
         'left4dead': { name: 'Left 4 Dead 2', slug: 'left4dead2' },
         'brickadia': { name: 'Brickadia', slug: 'brickadia', color: '#e74c3c' },
         'l4d2': { name: 'Left 4 Dead 2', slug: 'left4dead2' },
         'holdfast': { name: 'Holdfast: Nations At War', slug: 'holdfast', color: '#8b4513' },
         'deadmatter': { name: 'Dead Matter', slug: 'deadmatter' },
        'left4dead2': { name: 'Left 4 Dead 2', slug: 'left4dead2', color: '#8b0000' },
         'soulmask': { name: 'Soulmask', slug: 'soulmask' },
         'left 4 dead': { name: 'Left 4 Dead 2', slug: 'left4dead2', color: '#8b0000' },
         'nightingale': { name: 'Nightingale', slug: 'nightingale' }
         'l4d2': { name: 'Left 4 Dead 2', slug: 'left4dead2', color: '#8b0000' },
         'deadmatter': { name: 'Dead Matter', slug: 'deadmatter', color: '#2d3d2d' },
        'dead matter': { name: 'Dead Matter', slug: 'deadmatter', color: '#2d3d2d' },
         'soulmask': { name: 'Soulmask', slug: 'soulmask', color: '#4a5a3d' },
         'nightingale': { name: 'Nightingale', slug: 'nightingale', color: '#5c4a6b' }
     };
     };


     function getPageName() {
     function getPageName() {
        // Get page name from URL or title, sanitized for tracking
         var urlParams = new URLSearchParams(window.location.search);
         var urlParams = new URLSearchParams(window.location.search);
         var title = urlParams.get('title');
         var title = urlParams.get('title');
       
         if (!title) {
         if (!title) {
            // Try to get from URL path
             var path = window.location.pathname;
             var path = window.location.pathname;
             var match = path.match(/\/wiki\/(.+)$/);
             var match = path.match(/\/wiki\/(.+)$/);
             if (match) {
             if (match) title = decodeURIComponent(match[1]);
                title = decodeURIComponent(match[1]);
            }
         }
         }
       
         if (!title) {
         if (!title) {
            // Fall back to page title element
             var heading = document.getElementById('firstHeading');
             var heading = document.getElementById('firstHeading');
             if (heading) {
             if (heading) title = heading.textContent;
                title = heading.textContent;
            }
         }
         }
       
        // Sanitize: replace spaces/special chars with underscores, limit length
         if (title) {
         if (title) {
             title = title.replace(/[^a-zA-Z0-9]/g, '_').replace(/_+/g, '_').substring(0, 50);
             title = title.replace(/[^a-zA-Z0-9]/g, '_').replace(/_+/g, '_').substring(0, MAX_TRCKIT_LENGTH);
         }
         }
       
         return title || 'Unknown';
         return title || 'Unknown';
     }
     }
Line 125: Line 101:
         var bodyContent = document.getElementById('bodyContent');
         var bodyContent = document.getElementById('bodyContent');
          
          
        // Check for manual game specification via data attribute
         var manualGame = document.querySelector('[data-ss-game]');
         var manualGame = document.querySelector('[data-ss-game]');
         if (manualGame) {
         if (manualGame) return manualGame.getAttribute('data-ss-game').toLowerCase();
            return manualGame.getAttribute('data-ss-game').toLowerCase();
        }
          
          
        // Check for special comment/marker in page content
         var content = bodyContent ? bodyContent.innerHTML : '';
         var content = bodyContent ? bodyContent.innerHTML : '';
         var markerMatch = content.match(/<!--\s*SSGAME:\s*(\w+)\s*-->/i);
         var markerMatch = content.match(/<!--\s*SSGAME:\s*(\w+)\s*-->/i);
         if (markerMatch) {
         if (markerMatch) return markerMatch[1].toLowerCase();
            return markerMatch[1].toLowerCase();
        }
       
        // Auto-detect from page title - check longer keywords first
        var keywords = Object.keys(gameConfig).sort(function(a, b) {
            return b.length - a.length;
        });
          
          
        var keywords = Object.keys(gameConfig).sort(function(a, b) { return b.length - a.length; });
         for (var i = 0; i < keywords.length; i++) {
         for (var i = 0; i < keywords.length; i++) {
             if (pageTitle.indexOf(keywords[i]) !== -1) {
             if (pageTitle.indexOf(keywords[i]) !== -1) return keywords[i];
                return keywords[i];
            }
         }
         }
       
         return null;
         return null;
     }
     }
Line 155: Line 118:
         var game = gameConfig[gameKey];
         var game = gameConfig[gameKey];
         if (!game) return null;
         if (!game) return null;
         var trackingUrl = buildTrackingUrl('https://www.survivalservers.com/services/game_servers/' + game.slug + '/', pageName);
         var trackingUrl = buildTrackingUrl('https://www.survivalservers.com/services/game_servers/' + game.slug + '/', pageName);


         var banner = document.createElement('div');
         var banner = document.createElement('div');
         banner.id = 'ss-game-banner';
         banner.id = 'ss-game-banner';
         banner.style.cssText = 'background: linear-gradient(135deg, ' + game.color + ' 0%, ' + adjustColor(game.color, -30) + ' 100%); border-radius: 12px; padding: 20px 30px; margin: 0 0 25px 0; box-shadow: 0 4px 20px rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 15px;';
         banner.innerHTML = '\
       
<div style="background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); border-radius: 8px; padding: 0; margin: 0 0 20px 0; box-shadow: 0 4px 15px rgba(0,0,0,0.4); overflow: hidden; border: 1px solid #2a2a4a;">\
         banner.innerHTML =
    <div style="background: linear-gradient(90deg, #ff6b35 0%, #f7931e 100%); padding: 8px 20px; display: flex; align-items: center; gap: 10px;">\
            '<div style="display: flex; align-items: center; gap: 20px; flex: 1; min-width: 280px;">' +
         <span style="color: white; font-weight: 700; font-size: 14px; letter-spacing: 0.5px;">SURVIVAL<span style="color: #1a1a2e;">●</span>SERVERS</span>\
                '<div style="width: 60px; height: 60px; background: rgba(255,255,255,0.15); border-radius: 12px; display: flex; align-items: center; justify-content: center;">' +
        <span style="color: rgba(255,255,255,0.9); font-size: 12px;">— Trusted Game Server Hosting Since 2012</span>\
                    '<svg width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>' +
    </div>\
                '</div>' +
    <div style="padding: 20px 25px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px;">\
                '<div>' +
        <div style="flex: 1; min-width: 300px;">\
                    '<div style="color: rgba(255,255,255,0.85); font-size: 13px; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 4px; font-weight: 500;">Premium Game Server Hosting</div>' +
            <div style="color: #ff6b35; font-size: 12px; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 6px; font-weight: 600;">Deploy Your ' + game.name + ' Server</div>\
                    '<div style="color: white; font-size: 22px; font-weight: 700;">' + game.name + ' Servers</div>' +
            <div style="color: white; font-size: 24px; font-weight: 700; margin-bottom: 10px;">' + game.name + ' Game Server Hosting</div>\
                    '<div style="color: rgba(255,255,255,0.9); font-size: 14px; margin-top: 4px;">⚡ Instant Setup • 🌍 Global Locations • 🛡️ DDoS Protection • 💬 24/7 Support</div>' +
            <div style="display: flex; flex-wrap: wrap; gap: 15px; color: rgba(255,255,255,0.85); font-size: 13px;">\
                '</div>' +
                <span>✓ Instant Deployment</span>\
            '</div>' +
                <span>✓ Custom Control Panel</span>\
             '<a href="' + trackingUrl + '" target="_blank" style="background: white; color: ' + game.color + '; padding: 14px 32px; border-radius: 8px; text-decoration: none; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 8px; transition: all 0.3s ease; box-shadow: 0 2px 10px rgba(0,0,0,0.2);" onmouseover="this.style.transform=\'translateY(-2px)\';this.style.boxShadow=\'0 4px 15px rgba(0,0,0,0.3)\';" onmouseout="this.style.transform=\'translateY(0)\';this.style.boxShadow=\'0 2px 10px rgba(0,0,0,0.2)\';">' +
                <span>✓ Mod Support</span>\
                 'Order Now ' +
                <span>✓ DDoS Protection</span>\
                 '<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>' +
            </div>\
             '</a>';
            <div style="margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px;">\
 
                <span style="background: rgba(255,107,53,0.2); color: #ff6b35; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">9 Global Locations</span>\
                <span style="background: rgba(46,204,113,0.2); color: #2ecc71; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">24/7 Support</span>\
                <span style="background: rgba(52,152,219,0.2); color: #3498db; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">700+ Reviews</span>\
            </div>\
        </div>\
        <div style="display: flex; flex-direction: column; gap: 10px; align-items: flex-end;">\
             <a href="' + trackingUrl + '" style="background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%); color: white; padding: 14px 35px; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 10px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(255,107,53,0.4);" onmouseover="this.style.transform=\'translateY(-2px)\';this.style.boxShadow=\'0 6px 20px rgba(255,107,53,0.5)\';" onmouseout="this.style.transform=\'translateY(0)\';this.style.boxShadow=\'0 4px 15px rgba(255,107,53,0.4)\';">\
                 Order Now\
                 <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>\
             </a>\
            <span style="color: rgba(255,255,255,0.5); font-size: 11px;">Starting at $9.98/mo</span>\
        </div>\
    </div>\
</div>';
         return banner;
         return banner;
     }
     }
Line 186: Line 161:
         var banner = document.createElement('div');
         var banner = document.createElement('div');
         banner.id = 'ss-game-banner';
         banner.id = 'ss-game-banner';
         banner.style.cssText = 'background: linear-gradient(135deg, #1e3a5f 0%, #0d1b2a 100%); border-radius: 12px; padding: 20px 30px; margin: 0 0 25px 0; box-shadow: 0 4px 20px rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 15px;';
         banner.innerHTML = '\
          
<div style="background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); border-radius: 8px; padding: 0; margin: 0 0 20px 0; box-shadow: 0 4px 15px rgba(0,0,0,0.4); overflow: hidden; border: 1px solid #2a2a4a;">\
        banner.innerHTML =
    <div style="background: linear-gradient(90deg, #ff6b35 0%, #f7931e 100%); padding: 8px 20px; display: flex; align-items: center; gap: 10px;">\
            '<div style="display: flex; align-items: center; gap: 20px; flex: 1; min-width: 280px;">' +
         <span style="color: white; font-weight: 700; font-size: 14px; letter-spacing: 0.5px;">SURVIVAL<span style="color: #1a1a2e;">●</span>SERVERS</span>\
                '<div style="width: 60px; height: 60px; background: rgba(255,255,255,0.15); border-radius: 12px; display: flex; align-items: center; justify-content: center;">' +
        <span style="color: rgba(255,255,255,0.9); font-size: 12px;">— Trusted Game Server Hosting Since 2012</span>\
                    '<svg width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>' +
    </div>\
                '</div>' +
    <div style="padding: 20px 25px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px;">\
                '<div>' +
        <div style="flex: 1; min-width: 300px;">\
                    '<div style="color: rgba(255,255,255,0.85); font-size: 13px; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 4px; font-weight: 500;">Trusted Since 2012</div>' +
            <div style="color: #ff6b35; font-size: 12px; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 6px; font-weight: 600;">Premium Game Server Hosting</div>\
                    '<div style="color: white; font-size: 22px; font-weight: 700;">SurvivalServers.com</div>' +
            <div style="color: white; font-size: 24px; font-weight: 700; margin-bottom: 10px;">100+ Games • Instant Setup • Global Network</div>\
                    '<div style="color: rgba(255,255,255,0.9); font-size: 14px; margin-top: 4px;">🎮 100+ Games • ⚡ Instant Setup • 🌍 9 Global Locations • 💬 24/7 Expert Support</div>' +
            <div style="display: flex; flex-wrap: wrap; gap: 15px; color: rgba(255,255,255,0.85); font-size: 13px;">\
                '</div>' +
                <span>✓ Custom Control Panel</span>\
            '</div>' +
                <span>✓ Full FTP Access</span>\
             '<a href="' + trackingUrl + '" target="_blank" style="background: linear-gradient(135deg, #00b4d8 0%, #0077b6 100%); color: white; padding: 14px 32px; border-radius: 8px; text-decoration: none; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 8px; transition: all 0.3s ease; box-shadow: 0 2px 10px rgba(0,0,0,0.2);" onmouseover="this.style.transform=\'translateY(-2px)\';this.style.boxShadow=\'0 4px 15px rgba(0,0,0,0.3)\';" onmouseout="this.style.transform=\'translateY(0)\';this.style.boxShadow=\'0 2px 10px rgba(0,0,0,0.2)\';">' +
                <span>✓ Mod Support</span>\
                 'Browse Games ' +
                <span>✓ DDoS Protection</span>\
                 '<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>' +
            </div>\
             '</a>';
            <div style="margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px;">\
 
                <span style="background: rgba(255,107,53,0.2); color: #ff6b35; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">9 Global Locations</span>\
                <span style="background: rgba(46,204,113,0.2); color: #2ecc71; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">24/7 Support</span>\
                <span style="background: rgba(52,152,219,0.2); color: #3498db; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">700+ Reviews</span>\
            </div>\
        </div>\
        <div style="display: flex; flex-direction: column; gap: 10px; align-items: flex-end;">\
             <a href="' + trackingUrl + '" style="background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%); color: white; padding: 14px 35px; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 10px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(255,107,53,0.4);" onmouseover="this.style.transform=\'translateY(-2px)\';this.style.boxShadow=\'0 6px 20px rgba(255,107,53,0.5)\';" onmouseout="this.style.transform=\'translateY(0)\';this.style.boxShadow=\'0 4px 15px rgba(255,107,53,0.4)\';">\
                 Browse Games\
                 <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>\
             </a>\
            <span style="color: rgba(255,255,255,0.5); font-size: 11px;">Starting at $5.98/mo</span>\
        </div>\
    </div>\
</div>';
         return banner;
         return banner;
    }
    function adjustColor(hex, amount) {
        hex = hex.replace('#', '');
        var r = Math.max(0, Math.min(255, parseInt(hex.substr(0,2), 16) + amount));
        var g = Math.max(0, Math.min(255, parseInt(hex.substr(2,2), 16) + amount));
        var b = Math.max(0, Math.min(255, parseInt(hex.substr(4,2), 16) + amount));
        return '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
     }
     }


     function init() {
     function init() {
        // Don't show on Main Page
         var pageTitle = document.title;
         var pageTitle = document.title;
         if (pageTitle.indexOf('Main Page') !== -1) {
         if (pageTitle.indexOf('Main Page') !== -1) return;
            return;
         if (window.location.href.indexOf('Special:') !== -1) return;
        }
       
        // Don't show on Special pages
         if (window.location.href.indexOf('Special:') !== -1) {
            return;
        }


         var pageName = getPageName();
         var pageName = getPageName();
         var gameKey = detectGame();
         var gameKey = detectGame();
         var banner;
         var banner = (gameKey && gameConfig[gameKey]) ? createGameBanner(gameKey, pageName) : createGenericBanner(pageName);
       
        if (gameKey && gameConfig[gameKey]) {
            banner = createGameBanner(gameKey, pageName);
        } else {
            banner = createGenericBanner(pageName);
        }
          
          
         if (!banner) return;
         if (!banner) return;
        // Insert banner at the top of content area
         var contentDiv = document.getElementById('bodyContent');
         var contentDiv = document.getElementById('bodyContent');
         if (contentDiv) {
         if (contentDiv) contentDiv.insertBefore(banner, contentDiv.firstChild);
            contentDiv.insertBefore(banner, contentDiv.firstChild);
        }
     }
     }


    // Run when DOM is ready
     if (document.readyState === 'loading') {
     if (document.readyState === 'loading') {
         document.addEventListener('DOMContentLoaded', init);
         document.addEventListener('DOMContentLoaded', init);

Revision as of 15:15, 8 December 2025

/**
 * SurvivalServers Wiki - Game Server Banner System
 * Shows game-specific banners OR generic banner on all wiki pages
 * Includes affiliate tracking: trckaff=3881, trckit=WIKI<PageName>
 */
(function() {
    'use strict';

    var TRACK_AFF_ID = '3881';
    var MAX_TRCKIT_LENGTH = 41;
    
    var gameConfig = {
        'valheim': { name: 'Valheim', slug: 'valheim' },
        'ark': { name: 'ARK: Survival Evolved', slug: 'ark' },
        'arksurvivalascended': { name: 'ARK: Survival Ascended', slug: 'arksurvivalascended' },
        'asa': { name: 'ARK: Survival Ascended', slug: 'arksurvivalascended' },
        'rust': { name: 'Rust', slug: 'rust' },
        'minecraft': { name: 'Minecraft', slug: 'minecraft' },
        'palworld': { name: 'Palworld', slug: 'palworld' },
        'dayz': { name: 'DayZ', slug: 'dayz' },
        'conan': { name: 'Conan Exiles', slug: 'conanexiles' },
        '7daystodie': { name: '7 Days to Die', slug: '7daystodie' },
        '7days': { name: '7 Days to Die', slug: '7daystodie' },
        'theforest': { name: 'The Forest', slug: 'theforest' },
        'forest': { name: 'The Forest', slug: 'theforest' },
        'sonsoftheforest': { name: 'Sons of the Forest', slug: 'sonsoftheforest' },
        'sons of the forest': { name: 'Sons of the Forest', slug: 'sonsoftheforest' },
        'terraria': { name: 'Terraria', slug: 'terraria' },
        'projectzomboid': { name: 'Project Zomboid', slug: 'projectzomboid' },
        'zomboid': { name: 'Project Zomboid', slug: 'projectzomboid' },
        'enshrouded': { name: 'Enshrouded', slug: 'enshrouded' },
        'satisfactory': { name: 'Satisfactory', slug: 'satisfactory' },
        'v rising': { name: 'V Rising', slug: 'vrising' },
        'vrising': { name: 'V Rising', slug: 'vrising' },
        'aska': { name: 'ASKA', slug: 'aska' },
        'unturned': { name: 'Unturned', slug: 'unturned' },
        'factorio': { name: 'Factorio', slug: 'factorio' },
        'csgo': { name: 'CS2', slug: 'csgo' },
        'cs2': { name: 'CS2', slug: 'csgo' },
        'counterstrike': { name: 'CS2', slug: 'csgo' },
        'theisle': { name: 'The Isle', slug: 'theisle' },
        'isle': { name: 'The Isle', slug: 'theisle' },
        'squad': { name: 'Squad', slug: 'squad' },
        'arma': { name: 'Arma 3', slug: 'arma3' },
        'starbound': { name: 'Starbound', slug: 'starbound' },
        'empyrion': { name: 'Empyrion', slug: 'empyrion' },
        'pixark': { name: 'PixARK', slug: 'pixark' },
        'dontstarve': { name: "Don't Starve Together", slug: 'dontstarve' },
        "don't starve": { name: "Don't Starve Together", slug: 'dontstarve' },
        'scum': { name: 'SCUM', slug: 'scum' },
        'barotrauma': { name: 'Barotrauma', slug: 'barotrauma' },
        'corekeeper': { name: 'Core Keeper', slug: 'corekeeper' },
        'core keeper': { name: 'Core Keeper', slug: 'corekeeper' },
        'stationeers': { name: 'Stationeers', slug: 'stationeers' },
        'icarus': { name: 'Icarus', slug: 'icarus' },
        'avorion': { name: 'Avorion', slug: 'avorion' },
        'spaceengineers': { name: 'Space Engineers', slug: 'spaceengineers' },
        'space engineers': { name: 'Space Engineers', slug: 'spaceengineers' },
        'mordhau': { name: 'Mordhau', slug: 'mordhau' },
        'hurtworld': { name: 'Hurtworld', slug: 'hurtworld' },
        'miscreated': { name: 'Miscreated', slug: 'miscreated' },
        'fivem': { name: 'FiveM', slug: 'fivem' },
        'redm': { name: 'RedM', slug: 'redm' },
        'assettocorsa': { name: 'Assetto Corsa', slug: 'assettocorsa' },
        'assetto': { name: 'Assetto Corsa', slug: 'assettocorsa' },
        'renown': { name: 'Renown', slug: 'renown' },
        'brickadia': { name: 'Brickadia', slug: 'brickadia' },
        'holdfast': { name: 'Holdfast: Nations At War', slug: 'holdfast' },
        'left4dead': { name: 'Left 4 Dead 2', slug: 'left4dead2' },
        'l4d2': { name: 'Left 4 Dead 2', slug: 'left4dead2' },
        'deadmatter': { name: 'Dead Matter', slug: 'deadmatter' },
        'soulmask': { name: 'Soulmask', slug: 'soulmask' },
        'nightingale': { name: 'Nightingale', slug: 'nightingale' }
    };

    function getPageName() {
        var urlParams = new URLSearchParams(window.location.search);
        var title = urlParams.get('title');
        if (!title) {
            var path = window.location.pathname;
            var match = path.match(/\/wiki\/(.+)$/);
            if (match) title = decodeURIComponent(match[1]);
        }
        if (!title) {
            var heading = document.getElementById('firstHeading');
            if (heading) title = heading.textContent;
        }
        if (title) {
            title = title.replace(/[^a-zA-Z0-9]/g, '_').replace(/_+/g, '_').substring(0, MAX_TRCKIT_LENGTH);
        }
        return title || 'Unknown';
    }

    function buildTrackingUrl(baseUrl, pageName) {
        var separator = baseUrl.indexOf('?') === -1 ? '?' : '&';
        return baseUrl + separator + 'trckaff=' + TRACK_AFF_ID + '&trckit=WIKI' + pageName;
    }

    function detectGame() {
        var pageTitle = document.title.toLowerCase();
        var bodyContent = document.getElementById('bodyContent');
        
        var manualGame = document.querySelector('[data-ss-game]');
        if (manualGame) return manualGame.getAttribute('data-ss-game').toLowerCase();
        
        var content = bodyContent ? bodyContent.innerHTML : '';
        var markerMatch = content.match(/<!--\s*SSGAME:\s*(\w+)\s*-->/i);
        if (markerMatch) return markerMatch[1].toLowerCase();
        
        var keywords = Object.keys(gameConfig).sort(function(a, b) { return b.length - a.length; });
        for (var i = 0; i < keywords.length; i++) {
            if (pageTitle.indexOf(keywords[i]) !== -1) return keywords[i];
        }
        return null;
    }

    function createGameBanner(gameKey, pageName) {
        var game = gameConfig[gameKey];
        if (!game) return null;
        var trackingUrl = buildTrackingUrl('https://www.survivalservers.com/services/game_servers/' + game.slug + '/', pageName);

        var banner = document.createElement('div');
        banner.id = 'ss-game-banner';
        banner.innerHTML = '\
<div style="background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); border-radius: 8px; padding: 0; margin: 0 0 20px 0; box-shadow: 0 4px 15px rgba(0,0,0,0.4); overflow: hidden; border: 1px solid #2a2a4a;">\
    <div style="background: linear-gradient(90deg, #ff6b35 0%, #f7931e 100%); padding: 8px 20px; display: flex; align-items: center; gap: 10px;">\
        <span style="color: white; font-weight: 700; font-size: 14px; letter-spacing: 0.5px;">SURVIVAL<span style="color: #1a1a2e;">●</span>SERVERS</span>\
        <span style="color: rgba(255,255,255,0.9); font-size: 12px;">— Trusted Game Server Hosting Since 2012</span>\
    </div>\
    <div style="padding: 20px 25px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px;">\
        <div style="flex: 1; min-width: 300px;">\
            <div style="color: #ff6b35; font-size: 12px; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 6px; font-weight: 600;">Deploy Your ' + game.name + ' Server</div>\
            <div style="color: white; font-size: 24px; font-weight: 700; margin-bottom: 10px;">' + game.name + ' Game Server Hosting</div>\
            <div style="display: flex; flex-wrap: wrap; gap: 15px; color: rgba(255,255,255,0.85); font-size: 13px;">\
                <span>✓ Instant Deployment</span>\
                <span>✓ Custom Control Panel</span>\
                <span>✓ Mod Support</span>\
                <span>✓ DDoS Protection</span>\
            </div>\
            <div style="margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px;">\
                <span style="background: rgba(255,107,53,0.2); color: #ff6b35; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">9 Global Locations</span>\
                <span style="background: rgba(46,204,113,0.2); color: #2ecc71; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">24/7 Support</span>\
                <span style="background: rgba(52,152,219,0.2); color: #3498db; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">700+ Reviews</span>\
            </div>\
        </div>\
        <div style="display: flex; flex-direction: column; gap: 10px; align-items: flex-end;">\
            <a href="' + trackingUrl + '" style="background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%); color: white; padding: 14px 35px; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 10px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(255,107,53,0.4);" onmouseover="this.style.transform=\'translateY(-2px)\';this.style.boxShadow=\'0 6px 20px rgba(255,107,53,0.5)\';" onmouseout="this.style.transform=\'translateY(0)\';this.style.boxShadow=\'0 4px 15px rgba(255,107,53,0.4)\';">\
                Order Now\
                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>\
            </a>\
            <span style="color: rgba(255,255,255,0.5); font-size: 11px;">Starting at $9.98/mo</span>\
        </div>\
    </div>\
</div>';
        return banner;
    }

    function createGenericBanner(pageName) {
        var trackingUrl = buildTrackingUrl('https://www.survivalservers.com/', pageName);
        
        var banner = document.createElement('div');
        banner.id = 'ss-game-banner';
        banner.innerHTML = '\
<div style="background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); border-radius: 8px; padding: 0; margin: 0 0 20px 0; box-shadow: 0 4px 15px rgba(0,0,0,0.4); overflow: hidden; border: 1px solid #2a2a4a;">\
    <div style="background: linear-gradient(90deg, #ff6b35 0%, #f7931e 100%); padding: 8px 20px; display: flex; align-items: center; gap: 10px;">\
        <span style="color: white; font-weight: 700; font-size: 14px; letter-spacing: 0.5px;">SURVIVAL<span style="color: #1a1a2e;">●</span>SERVERS</span>\
        <span style="color: rgba(255,255,255,0.9); font-size: 12px;">— Trusted Game Server Hosting Since 2012</span>\
    </div>\
    <div style="padding: 20px 25px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px;">\
        <div style="flex: 1; min-width: 300px;">\
            <div style="color: #ff6b35; font-size: 12px; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 6px; font-weight: 600;">Premium Game Server Hosting</div>\
            <div style="color: white; font-size: 24px; font-weight: 700; margin-bottom: 10px;">100+ Games • Instant Setup • Global Network</div>\
            <div style="display: flex; flex-wrap: wrap; gap: 15px; color: rgba(255,255,255,0.85); font-size: 13px;">\
                <span>✓ Custom Control Panel</span>\
                <span>✓ Full FTP Access</span>\
                <span>✓ Mod Support</span>\
                <span>✓ DDoS Protection</span>\
            </div>\
            <div style="margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px;">\
                <span style="background: rgba(255,107,53,0.2); color: #ff6b35; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">9 Global Locations</span>\
                <span style="background: rgba(46,204,113,0.2); color: #2ecc71; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">24/7 Support</span>\
                <span style="background: rgba(52,152,219,0.2); color: #3498db; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 600;">700+ Reviews</span>\
            </div>\
        </div>\
        <div style="display: flex; flex-direction: column; gap: 10px; align-items: flex-end;">\
            <a href="' + trackingUrl + '" style="background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%); color: white; padding: 14px 35px; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 10px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(255,107,53,0.4);" onmouseover="this.style.transform=\'translateY(-2px)\';this.style.boxShadow=\'0 6px 20px rgba(255,107,53,0.5)\';" onmouseout="this.style.transform=\'translateY(0)\';this.style.boxShadow=\'0 4px 15px rgba(255,107,53,0.4)\';">\
                Browse Games\
                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>\
            </a>\
            <span style="color: rgba(255,255,255,0.5); font-size: 11px;">Starting at $5.98/mo</span>\
        </div>\
    </div>\
</div>';
        return banner;
    }

    function init() {
        var pageTitle = document.title;
        if (pageTitle.indexOf('Main Page') !== -1) return;
        if (window.location.href.indexOf('Special:') !== -1) return;

        var pageName = getPageName();
        var gameKey = detectGame();
        var banner = (gameKey && gameConfig[gameKey]) ? createGameBanner(gameKey, pageName) : createGenericBanner(pageName);
        
        if (!banner) return;
        var contentDiv = document.getElementById('bodyContent');
        if (contentDiv) contentDiv.insertBefore(banner, contentDiv.firstChild);
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
})();
Retrieved from "https://survivalservers.com/wiki/index.php?title=MediaWiki:Common.js&oldid=3214"