/* ============================================================================ * FIFA World Cup 2026 — Theme JS (matches Figma 169:791 / 169:728 / 169:487) * ---------------------------------------------------------------------------- * Paste into the Theme's "js" field. Delivered as `parsedJs`: the backend * resolves the if / unless template blocks against the entity's effective * settings before injection. village wraps this in an IIFE. * * Settings (all boolean): * game_active — grass pitch + tilt/swipe ball + "GOAL!!" on a goal * fifa_bg — FIFA stadium + "26" logo + tap-only ball (no gravity) * (only when game_active is OFF) * show_live_scores — 3 latest results, placed after the mini-website button * theme_banner — handled server-side (adds the theme banner to the * entity's banners); no JS needed here * ==========================================================================*/ var WC26_ASSETS = '/themes/fifa-world-cup-2026/'; /* ---- shared helpers (always injected; harmless when unused) ------------- */ function wc26WhenReady(selector, cb) { var el = document.querySelector(selector); if (el) { cb(el); return; } var tries = 0; var timer = setInterval(function () { var found = document.querySelector(selector); if (found || ++tries > 50) { clearInterval(timer); if (found) cb(found); } }, 100); } // 3D ball element (image comes from CSS background). modifier: 'game' | 'fifa'. function wc26MakeBall(modifier) { var ball = document.createElement('div'); ball.className = 'wc26-ball wc26-ball--' + modifier; document.body.appendChild(ball); return ball; } // Generic ball simulation. Boundary = the phone corners (viewport edges). // opts: { tilt:Boolean, fallbackGravity:Number, onGoal:Function(reset) } function wc26StartBall(ball, opts) { opts = opts || {}; var radius = (ball.offsetWidth || 56) / 2; var pos = { x: window.innerWidth / 2, y: window.innerHeight / 2 }; var vel = { x: 0, y: 0 }; var bounds = { w: window.innerWidth, h: window.innerHeight }; var tilt = { x: 0, y: 0 }; var spin = 0; var scoring = false; var hasSensor = false; var damping = 0.985; var restitution = 0.7; var maxSpeed = 45; var TILT_SENSITIVITY = 0.01; // ~4x calmer than before window.addEventListener('resize', function () { bounds.w = window.innerWidth; bounds.h = window.innerHeight; radius = (ball.offsetWidth || 56) / 2; }); function clampSpeed() { var s = Math.hypot(vel.x, vel.y); if (s > maxSpeed) { vel.x = (vel.x / s) * maxSpeed; vel.y = (vel.y / s) * maxSpeed; } } function step() { if (opts.tilt && hasSensor) { vel.x += tilt.x; vel.y += tilt.y; } if (opts.fallbackGravity && !(opts.tilt && hasSensor)) { vel.y += opts.fallbackGravity; } vel.x *= damping; vel.y *= damping; clampSpeed(); pos.x += vel.x; pos.y += vel.y; if (pos.x - radius < 0) { pos.x = radius; vel.x = -vel.x * restitution; } else if (pos.x + radius > bounds.w) { pos.x = bounds.w - radius; vel.x = -vel.x * restitution; } if (pos.y - radius < 0) { pos.y = radius; vel.y = -vel.y * restitution; } else if (pos.y + radius > bounds.h) { pos.y = bounds.h - radius; vel.y = -vel.y * restitution; } // Goal zone: top of the pitch, centred, 30% of the width. Only counts // while the pitch (hero) is scrolled into view at the top — see canScore. if (opts.onGoal && !scoring && (!opts.canScore || opts.canScore()) && pos.y - radius <= 6 && Math.abs(pos.x - bounds.w / 2) <= bounds.w * 0.15) { scoring = true; opts.onGoal(function reset() { pos.x = bounds.w / 2; pos.y = bounds.h / 2; vel.x = 0; vel.y = 0; scoring = false; }); } // Both balls only show while the top section (hero) is in view; they // vanish when the user scrolls down to the menu and return at the top. var onTop = !opts.host || opts.host.getBoundingClientRect().bottom > window.innerHeight * 0.4; var visible = onTop && !scoring; ball.style.opacity = visible ? '1' : '0'; ball.style.pointerEvents = visible ? 'auto' : 'none'; spin += vel.x * 1.6; ball.style.transform = 'translate(' + (pos.x - radius) + 'px,' + (pos.y - radius) + 'px) rotate(' + spin + 'deg)'; requestAnimationFrame(step); } function onOrientation(e) { if (e.gamma == null && e.beta == null) return; hasSensor = true; tilt.x = (e.gamma || 0) * TILT_SENSITIVITY; // left-right tilt.y = (e.beta || 0) * TILT_SENSITIVITY; // front-back } function enableMotion() { var DOE = window.DeviceOrientationEvent; if (DOE && typeof DOE.requestPermission === 'function') { DOE.requestPermission().then(function (s) { if (s === 'granted') window.addEventListener('deviceorientation', onOrientation); }).catch(function () {}); } else if (DOE) { window.addEventListener('deviceorientation', onOrientation); } } if (opts.tilt) { enableMotion(); window.addEventListener('touchend', enableMotion, { once: true }); window.addEventListener('click', enableMotion, { once: true }); } requestAnimationFrame(step); return { shoot: function (vx, vy) { vel.x += vx; vel.y += vy; clampSpeed(); } }; } // name -> /icons/country-flags/rounded-rectangular/.svg function wc26FlagUrl(name) { var slug = String(name || '').toLowerCase().trim() .replace(/[^a-z0-9]+/g, '-').replace(/^-+|-+$/g, ''); return '/icons/country-flags/rounded-rectangular/' + slug + '.svg'; } /* ---- 1) Playable pitch (game_active) ----------------------------------- */ /* ---- 2) Static FIFA background (fifa_bg, only when game is OFF) --------- */ // The ball renders in FIFA mode only when "Show ball" is on. wc26WhenReady('.catalogue-top-section', function (host) { var ball = wc26MakeBall('fifa'); // No gravity, no tilt — the ball only moves when tapped. var sim = wc26StartBall(ball, { tilt: false, fallbackGravity: 0, host: host }); // Tap/click the ball -> random direction + random speed. ball.addEventListener('pointerup', function () { var ang = Math.random() * Math.PI * 2; var power = 14 + Math.random() * 22; sim.shoot(Math.cos(ang) * power, Math.sin(ang) * power); }); }); /* ---- 3) Live scores (show_live_scores) --------------------------------- */ /* Placed in normal flow, right after the mini-website button. */ wc26WhenReady('.miniweb-container', function (container) { var ENDPOINT = 'https://worldcup26.ir/get/games'; function parseDate(s) { var m = /(\d{2})\/(\d{2})\/(\d{4})\s+(\d{2}):(\d{2})/.exec(s || ''); return m ? new Date(+m[3], +m[1] - 1, +m[2], +m[4], +m[5]).getTime() : 0; } function teamHtml(name, score, side) { var flag = '

'; var num = '' + score + ''; return '

' + flag + num + '

'; } // A game is in play when it isn't finished and has already kicked off. function isLive(g) { return g.finished !== 'TRUE' && g.time_elapsed !== 'notstarted'; } function rowHtml(g) { var live = isLive(g); var center = live ? '

' + 'VS' + 'LIVE' + '

' : 'VS'; return '

' + teamHtml(g.home_team_name_en, g.home_score, 'home') + center + teamHtml(g.away_team_name_en, g.away_score, 'away') + '

'; } var box = null; // created on first successful render, reused afterwards function render(games) { var played = games .filter(function (g) { return g.finished === 'TRUE' || g.time_elapsed !== 'notstarted'; }) .sort(function (a, b) { return parseDate(b.local_date) - parseDate(a.local_date); }) .slice(0, 2) .reverse(); if (!played.length) played = games.slice(0, 2); if (!box) { box = document.createElement('div'); box.className = 'wc26-scores'; container.appendChild(box); // after the mini-website button (last child) } box.innerHTML = played.map(rowHtml).join(''); } function refresh() { fetch(ENDPOINT) .then(function (r) { return r.json(); }) .then(function (data) { if (data && Array.isArray(data.games) && data.games.length) render(data.games); }) .catch(function () { /* network/CORS error — keep the last good card */ }); } refresh(); setInterval(refresh, 60000); // renew the live scores every 1 minute });

کربن کافه

Espresso Base

Brewing Base

Cold Coffee Base

Herbal Base

Milky Base

Milk shake

Natural juices

Mocktail Base

Smoothie Base

Morning Base

Starter Base

Salad

Pizza Base

pasta base

Burger Base

Steak

Sea food

Soft Drink

Hooka

Cake