Oliver/ODOO4projects.com
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify server banner: static city cards, no JS, no ping, no status

Browse Source 
- Header changed to 'Our Server Locations'
- Cards hardcoded in HTML with just city name + region
- Removed all ping JS (IIFE, pingServer, markBest, etc.)
- Removed server-ping-wrap, best-badge, server-best, ping-spinner,
  status-dot, server-optimal CSS
- Removed empty server-optimal div
- Removed card entrance animation (static display)
This commit is contained in:
reef
2026-08-19 22:33:01 +00:00
parent a9328bf383
commit b96c2870ef
3 changed files with 9 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files
script.js
-164
View File
@@ -428,170 +428,6 @@ var si = 0,
renderBlog();
}
/* ---- Server Ping Banner ---- */
(function() {
var SERVERS = [
{ host: 'meppel.odoo4projects.com', city: 'Amsterdam', region: 'Netherlands' },
{ host: 'boston.odoo4projects.com', city: 'Boston', region: 'United States' },
{ host: 'manchester.odoo4projects.com', city: 'Manchester', region: 'United Kingdom' },
{ host: 'mumbai.odoo4projects.com', city: 'Mumbai', region: 'India' },
{ host: 'saopaulo.odoo4projects.com', city: 'S\u00e3o Paulo', region: 'Brazil' },
{ host: 'sydney.odoo4projects.com', city: 'Sydney', region: 'Australia' }
];
var grid = document.getElementById('serverGrid');
var bannerStatus = document.getElementById('bannerStatus');
var optimalEl = document.getElementById('serverOptimal');
var cards = [];
var results = [];
var pending = SERVERS.length;
SERVERS.forEach(function(s, idx) {
var card = document.createElement('div');
card.className = 'server-card';
card.innerHTML =
'<div class="best-badge">Best</div>' +
'<div class="server-city">' + s.city + '</div>' +
'<div class="server-region">' + s.region + '</div>' +
'<div class="server-ping-wrap">' +
'<div class="ping-spinner"></div>' +
'<span class="server-ping-label">connecting</span>' +
'</div>';
grid.appendChild(card);
cards.push({ el: card, server: s, idx: idx });
});
/* GSAP stagger entrance for cards */
gsap.fromTo('.server-card',
{ opacity: 0, y: 20 },
{ opacity: 1, y: 0, duration: 0.6, stagger: 0.09, ease: 'power2.out' }
);
function pingServer(host) {
return new Promise(function(resolve) {
var start = performance.now();
var img = new Image();
var timedOut = false;
var timer = setTimeout(function() {
timedOut = true;
img.src = '';
resolve({ time: -1, error: 'timeout' });
}, 2000);
img.onload = function() {
if (!timedOut) {
clearTimeout(timer);
resolve({ time: performance.now() - start });
}
};
img.onerror = function() {
if (!timedOut) {
clearTimeout(timer);
/* Even 404 measures round-trip time */
resolve({ time: performance.now() - start });
}
};
img.src = 'https://' + host + '/favicon.ico?_=' + Date.now() + '_' + Math.random().toString(36).slice(2,6);
});
}
function updateCardPing(card, time) {
var wrap = card.el.querySelector('.server-ping-wrap');
if (time < 0) {
wrap.innerHTML = '';
} else {
wrap.innerHTML = '';
}
}
var heroImages = {
'meppel.odoo4projects.com': 'images/holland.webp',
'boston.odoo4projects.com': 'images/city-boston.jpg',
'manchester.odoo4projects.com': 'images/england.webp',
'mumbai.odoo4projects.com': 'images/india.webp',
'saopaulo.odoo4projects.com': 'images/brazil.webp',
'sydney.odoo4projects.com': 'images/city-sydney.jpg'
};
function markBest() {
var valid = results.filter(function(r) { return r.time >= 0; });
if (valid.length === 0) return;
valid.sort(function(a, b) { return a.time - b.time; });
var best = valid[0];
cards.forEach(function(c) {
if (c.server.host === best.host) {
c.el.classList.add('server-best');
}
});
/* Preload city image and carousel-slide with GSAP */
var hero = document.querySelector('.hero');
var bestCard = cards.filter(function(c) { return c.server.host === best.host; })[0];
if (hero && bestCard && heroImages[best.host]) {
var img = new Image();
img.onload = function() {
/* Create background container on first swap */
var bg = hero.querySelector('.hero-bg');
if (!bg) {
bg = document.createElement('div');
bg.className = 'hero-bg';
hero.insertBefore(bg, hero.firstChild);
}
var hasExisting = bg.children.length > 0;
/* New slide — starts off-screen right, slides in */
var newEl = document.createElement('div');
newEl.className = 'hero-bg-slide';
newEl.style.backgroundImage = "url('" + heroImages[best.host] + "')";
bg.appendChild(newEl);
/* Label slides in from right */
var label = document.createElement('div');
label.className = 'hero-city-label';
label.innerHTML = 'Our <strong>' + bestCard.server.city + '</strong> server fits your location';
hero.appendChild(label);
/* GSAP timeline — 3x slower */
gsap.set(newEl, { x: '100%' });
gsap.set(label, { x: '150%' });
var tl = gsap.timeline();
if (hasExisting) {
/* Carousel: old slides out right, new slides in */
var oldEl = bg.children[0];
gsap.set(oldEl, { x: '0%' });
tl.to(oldEl, { x: '100%', duration: 3, ease: 'power2.out' }, 0)
.to(newEl, { x: '0%', duration: 3, ease: 'power2.out' }, 0)
.to(label, { x: '0%', duration: 2.5, ease: 'power2.out' }, 0.3)
.call(function() { oldEl.remove(); });
} else {
/* First time: just slide new in from right */
tl.to(newEl, { x: '0%', duration: 3, ease: 'power2.out' }, 0)
.to(label, { x: '0%', duration: 2.5, ease: 'power2.out' }, 0.3);
}
};
img.src = heroImages[best.host];
}
/* Update banner status */
bannerStatus.innerHTML =
'<span class="status-dot" style="animation:none;background:#4ade80;opacity:1;transform:scale(1)"></span> Fastest route found';
}
/* Ping all servers in parallel */
cards.forEach(function(c) {
var idx = c.idx;
pingServer(c.server.host).then(function(result) {
result.host = c.server.host;
result.idx = idx;
results.push(result);
updateCardPing(c, result.time);
pending--;
if (pending === 0) {
markBest();
}
});
});
})();
fetch("blog/index.json?_=" + Date.now())
.then(function (r) {
return r.json();