Day:día 53
Location:Lucenec
Empresa actual: argent1 4
Owner: The Others (Unidad militar)
Monedas disponibles:
No se detecta formulario #rewardMission para recolectar en este momento.
El boton Claim intenta reclamar directamente desde el panel usando la sesion cURL actual.
Presiona el boton para consultar notificaciones con la sesion cURL activa.
Usa los botones de filtro para consultar ofertas por producto/calidad.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="preconnect" href="https://cdn.e-sim.org" crossorigin>
<link rel="dns-prefetch" href="https://cdn.e-sim.org">
<script src="https://cdn.jsdelivr.net/npm/mobile-detect@1.4.3/mobile-detect.min.js"></script>
<script>
var MobileDetector = function() {
"use strict";
const md = new MobileDetect(window.navigator.userAgent);
return {
isMobile: function() {
return md.mobile() !== null;
},
isTablet: function() {
return md.tablet() !== null;
},
isPhone: function() {
return md.phone() !== null;
},
isDesktop: function() {
return !md.mobile() && !md.tablet() && !md.phone();
},
getUserSystem: function() {
return md.os();
}
}
};
var isMobile = function() {
let mobileDetector = new MobileDetector();
return mobileDetector.isMobile() || mobileDetector.isPhone();
}();
var isDesktop = function() {
let mobileDetector = new MobileDetector();
return mobileDetector.isDesktop();
}();
</script>
<script>
var PaypalInput = {
CMD: 'CMD',
HOSTED_BUTTON_ID: 'XE56Q7PEMZZ24',
ON0: 'ON0',
OS0: 'OS0',
ON1: 'ON1',
OS1: 'OS1',
ON2: 'ON2',
OS2: 'OS2',
ON3: 'ON3',
OS3: 'OS3',
ON4: 'ON4',
OS4: 'OS4',
values: [
'CMD',
'HOSTED_BUTTON_ID',
'ON0',
'OS0',
'ON1',
'OS1',
'ON2',
'OS2',
'ON3',
'OS3',
'ON4',
'OS4',
],
properties: {
citizenLogin: 'Tom Sawyer',
citizenId: '192465',
priceForWelcomePack: '0.99\u20AC',
priceForLcFundraising: '99.00\u20AC',
priceForEqUpgrade: '50.00\u20AC',
priceForMiniStarterPack: '5.00\u20AC',
priceForStandardStarterPack: '20.00\u20AC',
priceForExcepStarterPack: '99.99\u20AC',
priceForPaid1000GoldToTransfer: '6.99\u20AC',
priceForWeaponsPack: '21.99\u20AC',
priceForSmartStarterGoldPack: '2.00\u20AC',
CURRENCY_CODE: {
value: 'EUR'
},
CMD: {
name: 'cmd',
value: '_s-xclick',
},
HOSTED_BUTTON_ID: {
id: 'hostedButtonId',
name: 'hosted_button_id',
value: 'XE56Q7PEMZZ24',
valueForPiggyBank: '2ANCQY4LKSHAY',
valueForGoldBuy: '9YA4P82M5BMSJ'
},
ON0: {
name: 'on0',
value: 'money',
valueForPiggyBank: 'Subscriber Account',
},
OS0: {
name: 'os0',
value: '20 EUR',
valueForFinalSmallMedkitPack: '5 EUR',
valueForLcFundraising: '99 EUR',
valueForEqUpgrade: '50 EUR',
valueForStandardStarterPack: '20 EUR',
valueForMiniStarterPack: '20 Gold',
valueForExcepStarterPack: '99 EUR',
valueForWeaponsPack: '100 Gold',
valueForPiggyBank: 'Tom Sawyer',
},
ON1: {
name: 'on1',
value: 'Citizen',
valueForPiggyBank: 'serverName'
},
OS1: {
name: 'os1',
value: 'Tom Sawyer',
valueForPiggyBank: 'vara'
},
ON2: {
name: 'on2',
value: 'ProjectId',
valueForPiggyBank: 'Payer name',
valueForGoldBuy: 'serverName'
},
OS2: {
name: 'os2',
value: '0',
valueForPiggyBank: 'Tom Sawyer',
valueForGoldBuy: 'vara'
},
ON3: {
name: 'on3',
value: 'serverName',
},
OS3: {
name: 'os3',
value: 'vara',
},
ON4: {
name: 'on4',
value: 'Payer name',
},
OS4: {
name: 'os4',
value: 'Tom Sawyer',
},
}
}
</script>
<script>
var Utils = {};
Utils.showMission = false;
Utils.showMission = true;
Utils.workUrl = "work2.html";
Utils.fbParam = "";
async function ninja(karate, kungfu) {
try {
const params = new URLSearchParams({"karate": karate, "kungfu": kungfu});
await fetch("ninjaLogger?" + params.toString(), {method: "POST"});
} catch (error) {
};
}
</script>
<script src="//vara.e-sim.org/cdn/static/js/utils.js?v=9"></script>
<script>
var citizenAccounts = [
{'currency': '0', 'amount': '3.0', 'country': ''},
{'currency': '26', 'amount': '54.0', 'country': 'USA'},
{'currency': '127', 'amount': '5.0', 'country': 'Guatemala'}
];
var bidAuctionAjaxCallback = function(){};
//TODO refactor
console.info('optionsToDisplayAccounts !!!', citizenAccounts);
var DefaultModal = {
flagClass: isMobile ? 'xflagsBig xflagsBig-' : 'xflagsSmall xflagsSmall-',
loggedCitizenId: Number('192465'),
isModalTest: Boolean(''),
translations: {
bid: "Licitación",
changeBid: "Cambiar oferta",
lvlUp: "Subir de nivel",
lvl2Msg1: "¡Felicidades!",
lvlUpModal: "Has alcanzado el nivel",
rankUp: "¡Ascenso de rango!",
newMilitaryRank: "¡Has sido ascendido a un nuevo rango militar!",
newAchievement: "Nuevo logro",
receivedNew: "Has recibido un nuevo",
achievement: "logro",
}
}
</script>
<script src="//vara.e-sim.org/cdn/static/js/defaultModal.js?v=1"></script>
<script src="//vara.e-sim.org/cdn/static/js/loader.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-932571714"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-932571714');
</script>
<script>
!function (w, d, t) {
w.TiktokAnalyticsObject=t;var ttq=w[t]=w[t]||[];ttq.methods=["page","track","identify","instances","debug","on","off","once","ready","alias","group","enableCookie","disableCookie","holdConsent","revokeConsent","grantConsent"],ttq.setAndDefer=function(t,e){t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}};for(var i=0;i<ttq.methods.length;i++)ttq.setAndDefer(ttq,ttq.methods[i]);ttq.instance=function(t){for(
var e=ttq._i[t]||[],n=0;n<ttq.methods.length;n++)ttq.setAndDefer(e,ttq.methods[n]);return e},ttq.load=function(e,n){var r="https://analytics.tiktok.com/i18n/pixel/events.js",o=n&&n.partner;ttq._i=ttq._i||{},ttq._i[e]=[],ttq._i[e]._u=r,ttq._t=ttq._t||{},ttq._t[e]=+new Date,ttq._o=ttq._o||{},ttq._o[e]=n||{};n=document.createElement("script")
;n.type="text/javascript",n.async=!0,n.src=r+"?sdkid="+e+"&lib="+t;e=document.getElementsByTagName("script")[0];e.parentNode.insertBefore(n,e)};
ttq.load('CCK9BUBC77UCJ9EIJOO0');
ttq.grantConsent();
ttq.page();
}(window, document, 'ttq');
</script>
<!-- Meta Pixel Code -->
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '749627884427693');
fbq('track', 'PageView');
</script>
<!-- End Meta Pixel Code -->
<meta name="google-site-verification" content="mNN-sslcx0RTQlpggS7Rv8IzlnfjLKdl37AQfg9xzPg"/>
<meta name="facebook-domain-verification" content="dv18u2b149i0y8ec8q052rtcvdkt26" />
<meta property="fb:admins" content="100001950649351"/>
<meta property="fb:app_id" content="146706392170816"/>
<meta property="og:url" content="https://vara.e-sim.org"/>
<meta property="og:title" content="Juego de navegador MMOG gratuito"/>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="keywords" content="e-sim, mmog, browser game, free game, multiplayer game, social game"/>
<meta name="description" content="Free strategic browser game. Fight, earn money, manage businesses"/>
<meta property="og:site_name" content="e-Sim.org"/>
<meta http-equiv="Last-Modified" content="2026-04-10 18:16:07"/>
<meta property="og:image" content="https://vara.e-sim.org/cdn/static/img/logo/varaLogo.png"/>
<meta property="og:description" content="Free strategic browser game. Fight, earn money, manage businesses. Join us, let's have some fun together, help your ecountry to grow."/>
<!-- Google Analytics -->
<!-- End Google Analytics -->
<script src="//vara.e-sim.org/cdn/static/js/modules/darkForm.js?v=0006"></script>
<script src="//vara.e-sim.org/cdn/static/js/hammer.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans:400,500,600,700,800,900">
<script>(function(){var dbpr=100;if(Math.random()*100>100-dbpr){var d="dbbRum",w=window,o=document,a=addEventListener,scr=o.createElement("script");scr.async=!0;w[d]=w[d]||[];w[d].push(["presampling",dbpr]);["error","unhandledrejection"].forEach(function(t){a(t,function(e){w[d].push([t,e])});});scr.src="https://cdn.debugbear.com/GZHPpZFzQeaR.js";o.head.appendChild(scr);}})()</script>
<link href="//vara.e-sim.org/cdn/static/css/esim-style.css?v=4" type="text/css" rel="stylesheet">
<!-- <link href="//vara.e-sim.org/cdn/static/css/jquery-ui-1.9.2.custom.min.css" type="text/css" rel="stylesheet"> -->
<link href="//vara.e-sim.org/cdn/static/css/general.css?v=17289799124" type="text/css" rel="stylesheet">
<link href="//vara.e-sim.org/cdn/static/css/animations.css?v=172897990825" type="text/css" rel="stylesheet">
<link href="//vara.e-sim.org/cdn/static/css/missionReward.css" type="text/css" rel="stylesheet">
<link href="//vara.e-sim.org/cdn/static/css/modals.css?v=1728979908" type="text/css" rel="stylesheet">
<link href="//vara.e-sim.org/cdn/static/css/tutorialStyle.css" type="text/css" rel="stylesheet">
<style>
#taskButtonWork, .whiteWork, .workButtonContainer, #jobCriteriaContainer, .job-offer-form, .noWorkPlace {
position: relative;
z-index: 97;
}
</style>
<script src="//vara.e-sim.org/cdn/static/js/jquery-1.8.3.min.js"></script>
<script src="//vara.e-sim.org/cdn/static/js/jquery-ui.min.js"></script>
<link href="//vara.e-sim.org/cdn/static/css/achievementsSprite70.css" type="text/css" rel="stylesheet">
<link href="//vara.e-sim.org/cdn/static/img/FlagsPackage/CSS/flagsStyle.css" type="text/css" rel="stylesheet">
<link href="//vara.e-sim.org/cdn/static/css/countryBalls60x65.css" type="text/css" rel="stylesheet">
<link rel="icon" type="image/png" href="//vara.e-sim.org/cdn/static/img/favicon.png"/>
<title>
Esim - Tom Sawyer Free MMOG browser game
</title>
<script>
var errorCount = 0;
function sendErrorToServer(error) {
var stackData = error.stack;
const errorData = {
message: error.message ,
stack: stackData,
userAgent: navigator.userAgent,
url: window.location.href
};
const xhr = new XMLHttpRequest();
xhr.open('POST', 'jsError.html', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify(errorData));
errorCount++;
if (errorCount >= 3) {
// Remove the error handler to stop capturing errors
window.onerror = null;
}
}
function handleErrors() {
window.onerror = function (message, source, lineno, colno, error) {
sendErrorToServer(error);
return false;
};
}
// Call the handleErrors function to start capturing errors
handleErrors();
</script>
<link href="//vara.e-sim.org/cdn/static/css/serverThemes/headerStyles.css?v=0001" type="text/css" rel="stylesheet">
<script>
document.addEventListener("DOMContentLoaded", () => {
"use strict";
const jspVariablesWrapper = function() {
"use strict";
let serverName = 'vara'.toLowerCase();
return {
serverName: serverName,
}
}();
let googleFormRegByApk = "";
const href = window.location.href;
let url = new URL(href);
var searchPar = url.searchParams;
let fromParam = "";
if (url.searchParams != null )
fromParam = url.searchParams.get("s");
if (fromParam === "android") {
googleFormRegByApk = "%3FgoogleFormRegByApk=1";
}
const signInUrl = "https://accounts.google.com/o/oauth2/auth" +
"?client_id=870564650847-lbpnf7pgft0847bvsor8ap65nf15t3mi.apps.googleusercontent.com" +
"&scope=email profile" +
"&immediate=false" +
"&response_type=code" +
"&redirect_uri=https://" + jspVariablesWrapper.serverName + ".e-sim.org/loginViaGoogle.html" + googleFormRegByApk;
const googleButton = document.getElementById('googleButton');
const googleButtonSwitch = document.getElementById('googleButtonSwitch');
const googleButtonSwitch2 = document.getElementById('googleButtonSwitch2');
if (googleButton != null) {
googleButton.addEventListener("click", () => {
location.href = signInUrl;
});
}
if (googleButtonSwitch != null) {
googleButtonSwitch.addEventListener("click", () => {
const checkbox = document.getElementById("acceptRulesCheckbox");
if (!checkbox || !checkbox.checked) {
showErrorWhenRulesNotAccepted();
return;
}
location.href = signInUrl;
});
}
if (googleButtonSwitch2 != null) {
googleButtonSwitch2.addEventListener("click", () => {
location.href = signInUrl;
});
}
});
</script>
</head>
<link href="//vara.e-sim.org/cdn/static/css/modules/portalsCountryBalls.css?v=0001" type="text/css" rel="stylesheet">
<script>
var CountryBallPortals = {
citizenShip: 'US',
citizenId: '192465',
isImprovedAlerts: Boolean(''),
ballTranslatedText: {
goToTrainBall: "Ir a Entrenamiento",
goToWorkBall: "Ir al trabajo",
goToJobMarketBall: "Ir al mercado laboral",
goToBattleBall: "ir a la batalla",
goToProductMarketBall: "Ir al mercado",
goToSellStuffOnMarketBall: "Ir al mercado",
goToAchievementsBall: "Ir a logros",
goToNotificationsBall: "Ir a notificaciones",
goToTravelBall: "Ir a viajar",
goToMapBall: "Ir al Mapa",
goToMonetaryMarketBall: "Ir al mercado",
goToAuctionsBall: "Ir a subastas",
goToMyAuctionsBall: "Ir a Mis Subastas",
goToEditCitizenBall: "Ir a la configuración",
goToMyMUBall: "Ve a la Unidad Militar",
goToTutorialProgressionBall: "Ir a Progresión del Tutorial",
goToStorageByTypeBall: "Ir a Almacenamiento",
goToMessageBall: "Ir a Mensaje",
goToNewspaperBall: "Ir a Periódico",
goToStatisticsByTypeBall: "Ir a Estadísticas",
goToProfileByIdBall: "Ir a Perfil",
goToArticleByIdBall: "Ir a Artículo",
goToShoutsBall: "Ir a Shouts",
goToAdventureBall: "Juego de aventuras",
goToBanditBall: "Juego de bandidos",
goToDiceBall: "Juego de dados",
goToShooterBall: "Juego de disparos",
},
}
const StorageTypeForPortal = {
PRODUCTS: 'PRODUCTS',
MONEY: 'MONEY',
EQUIPMENT: 'EQUIPMENT',
EQUIPMENT_LIST: 'EQUIPMENT_LIST',
SPECIAL_ITEM: 'SPECIAL_ITEM',
};
const StatisticsTypeForPortal = {
CITIZEN: 'CITIZEN',
COUNTRY: 'COUNTRY',
COALITION: 'COALITION',
NEW_CITIZEN: 'NEW_CITIZEN',
PARTY: 'PARTY&countryId=0&statisticType=MEMBERS',
NEWSPAPER: 'NEWSPAPER',
MILITARY_UNIT: 'MILITARY_UNIT',
STOCK_MARKET: 'STOCK_MARKET',
};
const CountryBallPortalsType = {
TRAIN: 'goToTrainBall',
WORK: 'goToWorkBall',
JOB_MARKET: 'goToJobMarketBall',
BATTLE: 'goToBattleBall',
PRODUCT_MARKET: 'goToProductMarketBall',
SELL_STUFF_ON_MARKET: 'goToSellStuffOnMarketBall',
ACHIEVEMENTS: 'goToAchievementsBall',
NOTIFICATIONS: 'goToNotificationsBall',
TRAVEL: 'goToTravelBall',
MAP: 'goToMapBall',
MONETARY_MARKET: 'goToMonetaryMarketBall',
AUCTIONS: 'goToAuctionsBall',
MY_AUCTIONS: 'goToMyAuctionsBall',
EDIT_CITIZEN: 'goToEditCitizenBall',
MY_MILITARY_UNIT: 'goToMyMUBall',
TUTORIAL_PROGRESSION: 'goToTutorialProgressionBall',
STORAGE_BY_TYPE: 'goToStorageByTypeBall',
MESSAGE: 'goToMessageBall',
NEWSPAPER: 'goToNewspaperBall',
STATISTICS_BY_TYPE: 'goToStatisticsByTypeBall',
PROFILE_BY_ID: 'goToProfileByIdBall',
ARTICLE_BY_ID: 'goToArticleByIdBall',
SHOUTS: 'goToShoutsBall',
ADVENTURE_GAME: 'goToAdventureBall',
BANDIT_GAME: 'goToBanditBall',
DICE_GAME: 'goToDiceBall',
SHOOTER_GAME: 'goToShooterBall',
};
CountryBallPortals = {
...CountryBallPortals,
testButton: undefined,
container: undefined,
portal: undefined,
functionCalledOnce: false,
position: {
x: isMobile ? '40%' : '26%',
y: isMobile ? '20%' : '6%',
},
//another position because old one sometimes is bugged
position2: {
x: isMobile ? '36%' : '26%',
y: isMobile ? '16%' : '6%',
},
ballActions: {
goToTrainBall: () => {
Utils.sendReloadContentAjax('train', event);
CountryBallPortals.clearContainer();
},
goToWorkBall: () => {
Utils.sendReloadContentAjax('work', event);
CountryBallPortals.clearContainer();
},
goToJobMarketBall: () => {
Utils.sendReloadContentAjax('jobMarket', event);
CountryBallPortals.clearContainer();
},
goToBattleBall: () => {
window.location.href = 'battle.html?id=' + 0;
},
goToProductMarketBall: () => {
Utils.sendReloadContentAjax('productMarket', event);
CountryBallPortals.clearContainer();
},
//TODO REFACTOR below is generic method for storage
goToSellStuffOnMarketBall: () => {
window.location.href = 'storage.html?storageType=PRODUCT';
},
goToAchievementsBall: () => {
Utils.sendReloadContentAjax('citizenAchievements?id=' + CountryBallPortals.citizenId, event);
CountryBallPortals.clearContainer();
},
goToNotificationsBall: () => {
if (CountryBallPortals.isImprovedAlerts) {
window.location.href = 'notificationsNew.html';
} else {
window.location.href = 'notifications.html';
}
},
goToTravelBall: () => {
Utils.sendReloadContentAjax('travel', event);
CountryBallPortals.clearContainer();
},
goToMapBall: () => {
window.location.href = 'map.html';
},
goToMonetaryMarketBall: () => {
Utils.sendReloadContentAjax('monetaryMarket', event);
CountryBallPortals.clearContainer();
},
goToAuctionsBall: () => {
Utils.sendReloadContentAjax('auctions', event);
CountryBallPortals.clearContainer();
},
goToMyAuctionsBall: () => {
Utils.sendReloadContentAjax('myAuctions', event);
CountryBallPortals.clearContainer();
},
goToEditCitizenBall: () => {
window.location.href = 'editCitizen.html?editCitizenPage=CUSTOMIZE';
},
goToMyMUBall: () => {
Utils.sendReloadContentAjax('myMilitaryUnit', event);
CountryBallPortals.clearContainer();
},
goToTutorialProgressionBall: () => {
window.location.href = 'tutorialProgression.html';
},
goToStorageByTypeBall: (type) => {
window.location.href = 'storage.html?storageType=' + type;
},
goToMessageBall: () => {
window.location.href = 'composeMessage.html';
},
goToNewspaperBall: () => {
window.location.href = 'newspaper.html?id=1';
},
goToStatisticsByTypeBall: (type) => {
window.location.href = 'statistics.html?selectedSite=' + type;
},
goToProfileByIdBall: (id) => {
Utils.sendReloadContentAjax('profile?id=' + id, event);
CountryBallPortals.clearContainer();
},
goToArticleByIdBall: (id) => {
window.location.href = 'article.html?id=' + id;
},
goToShoutsBall: () => {
window.location.href = 'shouts.html';
},
goToBanditBall: () => {
window.location.href = 'banditForMission.html';
},
goToAdventureBall: () => {
window.location.href = 'adventureForMission.html';
},
goToDiceBall: () => {
window.location.href = 'diceForMission.html';
},
goToShooterBall: () => {
window.location.href = 'shooterForMission.html';
},
},
showPortalToNextMission: function() {
const elementsToShow = document.querySelectorAll('.goToBall, .portalTo');
for (let i = 0; i < elementsToShow.length; i++) {
elementsToShow[i].classList.add('fadeIn', 'd-block');
elementsToShow[i].classList.remove('hidden');
}
},
hidePortalToNextMission: function() {
const elementsToShow = document.querySelectorAll('.goToBall, .portalTo');
for (let i = 0; i < elementsToShow.length; i++) {
elementsToShow[i].classList.add('hidden');
}
},
clearContainer: function() {
this.container.innerHTML = "";
},
isPortalExist: function() {
return !!document.querySelector('.portalTo');
},
getActionFunction: function(type, parameter) {
if (typeof parameter !== 'undefined') {
return () => {
this.ballActions[type](parameter);
};
} else {
return this.ballActions[type];
}
},
handlePortalByType: function(type, parameter) {
this.handleTestPortal(type, parameter);
// const steps = {'.portalBtnContainer': 'top'};
// missionMarkers.setPointerOnElement(steps);
// missionMarkers.positionSmallArrowPointingDown(document.querySelector(".portalTo"), 1);
},
initializePortalByType: function(type, parameter) {
if (this.isPortalExist()) return;
this.container = document.querySelector('#portalContainer');
const action = this.getActionFunction(type, parameter);
this.portal = this.createPortal(action);
this.addGoToBall(type);
},
createPortal(clickHandler) {
const portal = Utils.makeDiv("portalTo");
portal.addEventListener('click', clickHandler);
this.container.appendChild(portal);
return portal;
},
isTestBtnExist() {
return !!document.querySelector('.portalBtn');
},
handleTestPortal(type, parameter) {
this.fillTestButtonWithData(type, parameter);
this.positionTestButton();
// if (!CountryBallPortals.functionCalledOnce) {
// CountryBallPortals.functionCalledOnce = true;
// missionDropdown.positionDropdown();
// }
},
fillTestButtonWithData(type, parameter) {
//temporary for old portals
this.container = document.querySelector('#portalContainer');
const container = document.querySelector('#missionDropdown');
const action = this.getActionFunction(type, parameter);
this.fillBubbleText(type, action);
this.showBubbleText();
missionDropdown.positionDropdown();
container.addEventListener('click', () => {
action();
}, { once: true })
},
isVisible: function(el) {
return el.classList.contains("visible");
},
positionTestButton() {
missionMarkers.positionSmallArrowPointingDown(this.testButton, 1);
},
fillBubbleText(text, callback) {
const container = document.getElementById('portalBtnContainer');
const translatedText = this.ballTranslatedText[text];
//remove old events
const newContainer = container.cloneNode(true);
container.querySelectorAll('.missionTip, .noPointerEvents').forEach(el => el.remove());
container.parentNode.replaceChild(newContainer, container);
const btn = newContainer.querySelector('.portalBtn');
const span = newContainer.querySelector('.portalText');
span.textContent = translatedText;
this.testButton = newContainer;
if (callback !== undefined) {
container.addEventListener('click', () => {
Loader.initializeLoading(btn, LoaderSettings.optionsWithoutPosAbsolute);
callback();
});
}
return container;
},
showBubbleText: function() {
if (this.testButton!=null) {
this.testButton.classList.add('visible');
}
},
hideBubbleText: function() {
if (this.testButton!=null) {
this.testButton.classList.remove('visible');
}
},
createBubbleText(text, callback) {
const container = Utils.makeDiv("portalBtnContainer");
const translatedText = this.ballTranslatedText[text];
const btn = Utils.makeButton('', 'button', 'w-90', 'btn-buy', 'portalBtn');
//for loader
const span = Utils.makeSpan();
span.textContent = translatedText;
btn.appendChild(span);
if (callback !== undefined) {
container.addEventListener('click', () => {
Loader.initializeLoading(btn, LoaderSettings.optionsWithoutPosAbsolute);
callback();
});
}
container.appendChild(btn);
return container;
},
addWeapon : function(countryBall, classes) {
const weapon = Utils.makeDiv('weapon', ...classes);
if (classes.includes('weapon-shovel')) {
this.addDirt(weapon);
}
countryBall.append(weapon);
},
addHat : function(countryBall, classes) {
const hat = Utils.makeDiv('hat', ...classes);
countryBall.append(hat);
},
addNewBall : function (position, myText, classes, weaponClasses, hatClasses) {
let newBall = document.createElement('div');
const bubble = this.createBubbleText(myText);
newBall.appendChild(bubble);
newBall.classList.add('countryBall', ...classes);
if (weaponClasses !== undefined) {
this.addWeapon(newBall, weaponClasses)
}
if (hatClasses !== undefined) {
this.addHat(newBall, hatClasses)
}
classes.forEach((className) => {
const action = this.ballActions[className];
if (action) {
newBall.addEventListener('click', action);
}
});
newBall.style.left = position.x;
newBall.style.bottom = position.y;
this.portal.appendChild(newBall);
},
addGoToBall: function(portalName) {
const myClasses = [];
myClasses.push('ball-' + this.citizenShip);
myClasses.push('size-XL');
myClasses.push('face-happy');
myClasses.push('attacker');
myClasses.push('goToBall');
myClasses.push('goTo' + portalName.replace(/\s/g, '') + 'Ball');
this.addNewBall(this.position2, portalName, myClasses, undefined, ['hat-rabbi']);
},
removeClickEvent: function() {
const myBall = this.portal.querySelector('.countryBall');
const myBallClasses = myBall.classList;
myBallClasses.forEach((className) => {
const action = this.ballActions[className];
if (action) {
myBallClasses.add('events-none')
this.portal.classList.add('events-none');
}
});
this.setBrightnessOnBall(myBall, 0.25);
},
addClickEvent: function() {
const myBall = this.portal.querySelector('.countryBall');
const myBallClasses = myBall.classList;
myBallClasses.forEach((className) => {
const action = this.ballActions[className];
if (action) {
myBallClasses.remove('events-none')
this.portal.classList.remove('events-none');
}
});
this.setBrightnessOnBall(myBall, 1);
},
setBrightnessOnBall: function(myBall, brightness) {
myBall.style.filter = 'brightness(' + brightness +')';
},
disablePortalAndShowLoader: function() {
this.removeClickEvent();
Loader.initializeLoaderWithContainer('.portalTo', 'spinnerLoader', true);
Loader.setZIndex(999);
const position = {
x: '40%',
y: '65%',
}
Loader.setPosition(position)
Loader.showLoader();
},
}
</script>
<body style="background: url(//vara.e-sim.org/cdn/static/img/bg/energetic.png) no-repeat fixed;background-size:cover; padding-top: 45px; padding-bottom: 10px;">
<link href="//vara.e-sim.org/cdn/static/css/equipment.css" rel="stylesheet" type="text/css">
<script>
(function() {
"use strict";
window.staticServer = '//vara.e-sim.org/cdn/static';
const href = window.location.href;
const url = new URL(href);
const searchPar = url.searchParams;
let fromParam = "";
if (searchPar) {
fromParam = searchPar.get("s");
}
if (fromParam !== 'android') {
const div = Utils.makeDiv('loader__background--black');
if (isMobile) {
const img = Utils.makeImg('//vara.e-sim.org/cdn/static/img/loader2023v2.gif', 'esim-logo', 'loader__gif', 'w-50');
div.appendChild(img);
document.body.prepend(div);
}
const removeDiv = () => {
div.remove();
};
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', removeDiv);
} else {
removeDiv();
}
}
})();
</script>
<div id="post-body" style="margin: 8px">
<div id="fb-root"></div>
<div id="container" style="" class="containerPaddingBottomFix foundation-style row lightback2 foundation-radius transparentBgDark predefinedSet">
<style>
.navbar-mobile {
min-width: 0 !important;
display: none;
position: fixed !important;
height: 8vh !important;
}
.navbar-mobile__content {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
align-content: center;
height: 100%;
width: auto;
padding: 0px 2em;
}
.navbar-mobile__content > .profileLink {
display: none;
}
#mobile-navbar__avatar-sidebar {
display: flex;
align-content: center;
justify-content: center;
align-items: center;
}
#mobile-navbar__avatar-sidebar > img {
border: 0 !important;
outline: none;
height: 7vh;
width: 7vh;
cursor: pointer;
}
#mobile-navbar__hamburger-sidebar {
display: flex;
justify-content: center;
align-items: center;
}
#mobile-navbar__hamburger-sidebar > img {
border: 0 !important;
outline: none;
height: 7vh;
width: 7vh;
cursor: pointer;
}
#mobile-navbar__hamburger-sidebarTest > img {
height: 11em;
width: 11em;
}
#mobileNavbar.darkNavbar #indexShortcut img,
#mobileNavbarNew.darkNavbar #indexShortcut img {
width: 3em !important;
height: 3em !important;
}
#mobile-navbar .profileLink {
display: none;
}
.muteButtonContainer.desktop {
float: right;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 1.5em;
cursor: pointer;
padding: 0.25em;
margin: 0 0.25em;
}
</style>
<div class="foundation-on"></div>
<div id="mobile-navbar" class="navbar-mobile fixed foundation-style">
<div class="navbar-mobile__content canvaback">
<a id="mobile-navbar__hamburger-sidebar" style="height: 100%;" href="#left-menu">
</a>
<div style="position:relative;display: flex;flex-direction: row;justify-content: center;align-items: center;text-align: center;">
<li id='mobile_menu_notification_mission' class="menuNotifications" style="display:flex;"></li>
<style>
nav .shopIcon,
#mobile-navbar .shopIcon {
float: right;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 2.5em;
cursor: pointer;
padding: 0.25em;
margin: 0 0.25em;
}
.mobile nav .shopIcon,
.mobile #mobile-navbar .shopIcon {
font-size: 6vh;
width: 100px;
}
.shopIcon .notificationBadge {
top: 5%;
left: 65%;
font-size: 0.6em;
}
.shopIconAtOldFundraisingPage {
padding: 1em 3em;
}
nav .shopIcon.btn-buy {
background: unset !important;
box-shadow: unset !important;
outline: unset !important;
}
</style>
<div class="shopIcon tests" onclick="Utils.sendReloadContentAjax('shop?shopType=PROMOTIONS', event)">
<i class="icon-shopping-cart p-0 cursor-pointer"></i>
<div class="notificationBadge "></div>
</div>
<style>
#taskButtonDaily .missionCenterIcon {
color: white;
display: flex;
justify-content: center;
align-items: center;
/*width: 50px;*/
/*height: 100%;*/
/*font-size: 2.5em;*/
/*cursor: pointer;*/
/*padding: 0.25em;*/
/*margin: 0 0.5em;*/
}
nav .missionCenterIcon,
#mobile-navbar .missionCenterIcon {
float: right;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 2.5em;
cursor: pointer;
padding: 0.25em;
margin: 0 0.25em;
}
.mobile nav .missionCenterIcon,
.mobile #mobile-navbar .missionCenterIcon {
font-size: 6vh;
width: 100px;
}
.mobile .missionCenterIcon {
width: 100px;
}
.missionCenterIcon .missionCenterTooltip {
box-shadow: -2px 2px 5px 0px rgb(0 0 0 / 75%);
color: #030303;
background: #f2f2f2;
border: 3px solid #333;
border-radius: 0.25em;
visibility: visible;
text-align: center;
font-weight: bold;
padding: 5px;
position: absolute;
z-index: 1;
top: 125%;
left: 50%;
transform: translateX(-50%);
text-transform: initial;
width: 250px;
text-shadow: none;
font-size: 0.5em;
}
.mobile .missionCenterIcon .missionCenterTooltip {
width: 600px;
}
.mobile #taskButtonDaily .missionCenterIcon .missionCenterTooltip {
width: 430px;
font-size: 2em;
}
.missionCenterTooltip::after {
content: "";
position: absolute;
top: -30px;
left: 50%;
transform: translateX(-50%);
border-width: 15px;
border-style: solid;
border-color: transparent transparent #f2f2f2 transparent;
}
.mobile .missionCenterTooltip::after {
content: "";
position: absolute;
top: -150px;
left: 50%;
transform: translateX(-50%);
border-width: 80px;
border-style: solid;
border-color: transparent transparent #f2f2f2 transparent;
}
</style>
<div class="missionCenterIcon "
onclick="(function(el) { MissionCenterModal.showModal(el); setTimeout(() => toggleMissionCenterTooltip(false), 800); })(this)">
<i class="icon-calendar-alt-regular p-0 cursor-pointer"></i>
<div class="notificationBadge"></div>
<div class="missionCenterTooltip fadeIn hidden">
Daily Missions are now enabled
</div>
</div>
<script>
function toggleMissionCenterTooltip(flag) {
const tooltip = document.querySelectorAll('.missionCenterTooltip');
tooltip.forEach(el => {
el.classList.toggle('hidden', !flag);
});
}
</script>
<a id="notificationIconLink" href="notifications.html" class="active-icon">
<i style="font-size:7vh !important;padding:0;margin:2vw;" class="icon-bell"></i>
</a>
<a id="inboxMessagesMission"
href="inboxMessages.html"
class="active-icon">
<i style="font-size:7vh !important; padding:0; margin:2vw;" class="icon-email2"></i>
</a>
<a id="mobile-navbar__avatar-sidebar" href="#right-menu">
<img align="absmiddle" class="smallAvatar" style="" src="//vara.e-sim.org/cdn/static/img/avatar/blankAvatar.png"> <a class="profileLink" href="profile.html?id=192465">Tom Sawyer</a>
</a>
</div>
</div>
</div>
<div id="mobileLeftNavbar" class="hidden" style="z-index: 1;
position: fixed;
bottom: 3%;
right: 5%;
background-image: linear-gradient(to bottom, #45719b 20%, #2c3e50 100%) !important;
outline: 3px solid #ffffff !important;
border-radius: 1.5em;
box-shadow: 5px 5px 10px black !important;">
<a id="mobile-navbar__hamburger-sidebarTest" style="height: 100%;" href="#left-menu">
<img src="//vara.e-sim.org/cdn/static/img/menu.png"/>
</a>
</div>
<div id="desktop-navbar" class="fixed foundation-style">
<nav class="top-bar">
<section class="top-bar-section ">
<!-- Left Nav Section -->
<style>
.lockLvl6 {
background: rgba(44,44,44,0.7) !important;
filter: brightness(0.7);
pointer-events: none;
}
.lockLvl6 span {
cursor: default !important;
color:#777 !important;
pointer-events: none;
text-shadow: 0 0 2px #000000 !important;
}
.lockLvl6 img {
display:inline-block !important;
}
.lockLvl6 small {
display:inline-block !important;
color:#e6f044 !important;
}
.lockLvl7 {
background: rgba(44,44,44,0.7) !important;
filter: brightness(0.7);
pointer-events: none;
}
.lockLvl7 span {
cursor: default !important;
color:#777 !important;
pointer-events: none;
text-shadow: 0 0 2px #000000 !important;
}
.lockLvl7 img {
display:inline-block !important;
}
.lockLvl7 small {
display:inline-block !important;
color:#e6f044 !important;
}
.lockLvl8 {
background: rgba(44,44,44,0.7) !important;
filter: brightness(0.7);
pointer-events: none;
}
.lockLvl8 span {
cursor: default !important;
color:#777 !important;
pointer-events: none;
text-shadow: 0 0 2px #000000 !important;
}
.lockLvl8 img {
display:inline-block !important;
}
.lockLvl8 small {
display:inline-block !important;
color:#e6f044 !important;
}
.lockMission12 {
background: rgba(44,44,44,0.7) !important;
filter: brightness(0.7);
pointer-events: none;
}
.lockMission12 span {
cursor: default !important;
color:#777 !important;
pointer-events: none;
text-shadow: 0 0 2px #000000 !important;
}
.lockMission12 img {
display:inline-block !important;
}
.lockMission12 small {
display:inline-block !important;
color:#e6f044 !important;
}
#mobileNavbarNew .dropdownSelect .dropdownDark {
width: 90% !important;
left: 0% !important;
border-radius: 1em !important;
filter: drop-shadow(2px 2px 4px black);
background: #000000ab !important;
}
.mobile #mobileNavbarNew .dropdownSelect .dropdownDark {
left: -720px !important;
width: 710px !important;
max-height: unset;
/*top: 0% !important;*/
}
#mobileNavbarNew .option {
line-height: 1;
padding: 1.25em 0 !important;
gap: 0.5em;
text-align: center;
justify-content: center !important;
height: 100%;
}
#mobileNavbarNew .option > i {
font-size: 1.5em;
padding-right: 0;
}
#mobileNavbarNew .dropdownSelect > .option {
border-radius: 0 0 0.5em 0.5em;
}
.mobile #mobileNavbarNew .dropdownSelect > .option {
border-radius: 0.5em 0 0 0.5em;
}
.darkNavbar .dropdownSelect > .option.selected {
box-shadow: inset 0px -3px 1px 0px #0047b7, inset 0px 1px 1px 0px rgb(255 255 255) !important;
background: linear-gradient(to bottom, #2c79f3 0, #00b0f4 100%) !important;
}
.darkform .option.blueTheme {
box-shadow: inset 0px -3px 1px 0px #1a4d80, inset 0px 1px 1px 0px rgb(255 255 255) !important;
color: #f0f8ff;
background-image: linear-gradient(to bottom, #0073e6 5%, #004a99 100%);
outline: 3px solid #003366 !important;
}
.darkform .option.blueTheme:hover {
background-image: linear-gradient(to bottom, #0091ff 5%, #005bb5 100%);
}
.darkform .option.blueTheme.selected,
.darkNavbar .dropdownSelect > .option.blueTheme.selected {
box-shadow: inset 0px -3px 1px 0px #003366, inset 0px 1px 1px 0px rgb(255 255 255) !important;
background: linear-gradient(to bottom, #ff0000 0%, #990000 100%) !important; /* High contrast red background */
color: #ffffff !important;
}
.darkform .option.blueTheme.selected:hover {
background: linear-gradient(to bottom, #ff3333 0, #cc0000 100%) !important;
}
.darkform .option.redTheme {
box-shadow: inset 0px -3px 1px 0px #8b0000, inset 0px 1px 1px 0px rgb(255 255 255) !important;
color: #fff5f5;
background-image: linear-gradient(to bottom, #ff4500 5%, #8b0000 100%);
outline: 3px solid #5a0000 !important;
}
.darkform .option.redTheme:hover {
background-image: linear-gradient(to bottom, #ff6347 5%, #b22222 100%);
}
.darkform .option.redTheme.selected,
.darkNavbar .dropdownSelect > .option.redTheme.selected{
box-shadow: inset 0px -3px 1px 0px #5a0000, inset 0px 1px 1px 0px rgb(255 255 255) !important;
background: linear-gradient(to bottom, #00FFFF 0%, #00BFFF 100%) !important; /* High contrast cyan-blue background */
}
.darkform .option.redTheme.selected:hover {
background: linear-gradient(to bottom, #00BFFF 0%, #1E90FF 100%) !important;
}
.darkform .option.greenTheme {
box-shadow: inset 0px -3px 1px 0px #005f29, inset 0px 1px 1px 0px rgb(255 255 255) !important;
color: #e6ffe6;
background-image: linear-gradient(to bottom, #00a859 5%, #005f29 100%);
outline: 3px solid #004d23 !important;
}
.darkform .option.greenTheme:hover {
background-image: linear-gradient(to bottom, #00cc66 5%, #00733e 100%);
}
.darkform .option.greenTheme.selected,
.darkNavbar .dropdownSelect > .option.greenTheme.selected {
box-shadow: inset 0px -3px 1px 0px #004d23, inset 0px 1px 1px 0px rgb(255 255 255) !important;
background: linear-gradient(to bottom, #ff6600 0%, #cc3300 100%) !important; /* High contrast orange-red background */
color: #ffffff !important;
}
.darkform .option.greenTheme.selected:hover {
background: linear-gradient(to bottom, #ff9933 0, #cc6600 100%) !important;
}
.darkform .option.purpleTheme {
box-shadow: inset 0px -3px 1px 0px #4b0082, inset 0px 1px 1px 0px rgb(255 255 255) !important;
color: #f8f0ff;
background-image: linear-gradient(to bottom, #8000ff 5%, #4b0082 100%);
outline: 3px solid #2a0055 !important;
}
.darkform .option.purpleTheme:hover {
background-image: linear-gradient(to bottom, #9933ff 5%, #6600cc 100%);
}
.darkform .option.purpleTheme.selected,
.darkNavbar .dropdownSelect > .option.purpleTheme.selected {
box-shadow: inset 0px -3px 1px 0px #2a0055, inset 0px 1px 1px 0px rgb(255 255 255) !important;
background: linear-gradient(to bottom, #ff00ff 0%, #9900cc 100%) !important;
color: #ffffff !important;
}
.darkform .option.purpleTheme.selected:hover {
background: linear-gradient(to bottom, #ff66ff 0, #cc33cc 100%) !important;
}
.darkform .option.navyBlueTheme {
background-image: linear-gradient(to bottom, #45719b 20%, #2c3e50 100%) !important;
box-shadow: inset 0px -3px 1px 0px #1a242d, inset 0px 1px 1px 0px rgb(255 255 255) !important;
outline: 3px solid #000000 !important;
}
.darkform .option.navyBlueTheme:hover {
background-image: radial-gradient(#45719b 100%, #2c3e50 10%) !important;
}
.darkform .option.navyBlueTheme.selected,
.darkNavbar .dropdownSelect > .option.navyBlueTheme.selected {
box-shadow: inset 0px -3px 1px 0px #0047b7, inset 0px 1px 1px 0px rgb(255 255 255) !important;
background: linear-gradient(to bottom, #2c79f3 0, #00b0f4 100%) !important;
color: #ffffff !important;
}
.darkform .option.navyBlueTheme.selected:hover {
background: linear-gradient(to bottom, #2caaf3 0, #00bff4 100%) !important;
}
.darkform .option.navyblueTheme:active {
box-shadow: inset 0px 0px 3px 3px #0381b5, inset 0px 1px 4px 0px rgb(255 255 255) !important;
}
.mobile #mobileNavbarNew .dropdownSelect:hover {
display: grid;
}
.mobile #mobileNavbarNew .dropdownSelect {
height: 13%;
display: block;
width: 100% !important;
font-size: 1.75em;
}
.mobile #mobileNavbarNew .option {
flex-direction: column !important;
gap: 0.25em;
border: 3px solid white;
}
.sidr_override {
background: #0000003d !important;
}
#mobileNavbarNew .grid_template_d4_m3 {
grid-template-columns: repeat(4,1fr);
}
.mobile #mobileNavbarNew .grid_template_d4_m3 {
grid-template-columns: repeat(3,1fr);
gap: 0.25em;
}
.mobile .darkform.darkNavbar {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.5em;
/*background: #3333332b !important;*/
width: 20%;
}
.mobile #selectedDiscordDropdown .discordMobile {
height: 40px !important;
width: 40px !important;
}
.mobile .close-sidr-places-container {
outline: 3px solid #000000 !important;
border: 3px solid white;
}
</style>
<div id="mobileNavbarNew" class="darkform darkNavbar bigDarkTexture">
<div class="dropdownSelect" style="width: 80px;">
<a id="indexShortcut" class="option navyBlueTheme" style="padding: 0.37em !important;" href="index.html"><img style="width: 36px;margin: 0.125em;" src="//vara.e-sim.org/cdn/static/img/bestEsim.png"></a>
</div>
<div id="selectedMyPlacesDropdown" class="dropdownSelect">
<div id="selectedMyPlace"
class="option navyBlueTheme selectedOption"
data-place="">
<i class="icon-home"></i>
<span>Mis lugares</span>
</div>
<div class="dropdownDark grid_template_d4_m3">
<a href="#profile" onmousedown="Utils.sendReloadContentAjax('profile?id=192465', event);">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="profile">
<i class="icon-user"></i>
<span>Perfil</span>
</div>
</a>
<a href="#work" onmousedown="Utils.sendReloadContentAjax('work', event);">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="work">
<i class="icon-user-3"></i>
<span>Trabajar</span>
</div>
</a>
<a href="#train" onmousedown="Utils.sendReloadContentAjax('train', event);">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="train">
<i class="icon-scope"></i>
<span>Entrenamiento</span>
</div>
</a>
<a href="#storage" onmousedown="Utils.sendReloadContentAjax('storage', event);">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="storage">
<i class="icon-uniF005"></i>
<span>Almacén</span>
</div>
</a>
<a href="gameRoom.html">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="business">
<i class="icon-spaceinvaders"></i>
<span>Sala de Juegos</span>
</div>
</a>
<a href="business.html?businessType=COMPANIES">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="business">
<i class="icon-factory"></i>
<span>Negocios</span>
</div>
</a>
<a href="myParty.html" class="lockLvl8 lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="myParty">
<i class="icon-friends"></i>
<span>Partido</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">level 8</small>
</div>
</div>
</a>
<a href="#myAuctions" onmousedown="Utils.sendReloadContentAjax('myAuctions', event)" class="lockLvl5 lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="myAuctions">
<i class="icon-law"></i>
<span>Subastas</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">level 5</small>
</div>
</div>
</a>
<a href="#inviteFriends" onmousedown="Utils.sendReloadContentAjax('inviteFriends', event)">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="inviteFriends">
<i class="icon-addfriend"></i>
<span>Invitar a amigos</span>
</div>
</a>
<a href="myMilitaryUnit.html" class="lockLvl6 lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="myMilitaryUnit">
<i class="icon-bookmark"></i>
<span>Unidad militar</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">level 6</small>
</div>
</div>
</a>
<a href="#shop?shopType=PROMOTIONS" onmousedown="Utils.sendReloadContentAjax('shop?shopType=PROMOTIONS', event)">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="shop">
<i class="icon-shopping-cart"></i>
<span>Shop</span>
</div>
</a>
<a href="https://vara.e-sim.org/promotionalCode.html" class="lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="promotionalCode">
<i class="icon-gift"></i>
<span>Canjear código</span>
</div>
</a>
</div>
</div>
<div id="selectedMarketsDropdown" class="dropdownSelect">
<div id="selectedMarket"
class="option navyBlueTheme selectedOption"
data-place="">
<i class="icon-value"></i>
<span>Mercado</span>
</div>
<div class="dropdownDark grid_template_d4_m3">
<a href="#productMarket" onmousedown="Utils.sendReloadContentAjax('productMarket', event)" class="lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="productMarket">
<i class="icon-diamond"></i>
<span>Mercado de productos</span>
</div>
</a>
<a href="#jobMarket" onmousedown="Utils.sendReloadContentAjax('jobMarket', event)" class="lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="jobMarket">
<i class="icon-tie"></i>
<span>Mercado de trabajo</span>
</div>
</a>
<a href="#monetaryMarket" onmousedown="Utils.sendReloadContentAjax('monetaryMarket', event)" class="lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="monetaryMarket">
<i class="icon-cash"></i>
<span>Mercado monetario</span>
</div>
</a>
<a href="#auctions" onmousedown="Utils.sendReloadContentAjax('auctions', event)" class="lockLvl5">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="auctions">
<i class="icon-law"></i>
<span>Subastas</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">level 5</small>
</div>
</div>
</a>
<a href="companiesForSale.html" class="lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="companiesForSale">
<i class="icon-factory"></i>
<span>Empresas en venta</span>
</div>
</a>
<a href="#storage?storageType=SPECIAL_ITEM" onmousedown="Utils.sendReloadContentAjax('storage?storageType=SPECIAL_ITEM', event)">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="specialItem">
<i class="icon-dagger"></i>
<span>Artículos especiales</span>
</div>
</a>
</div>
</div>
<div id="selectedNewsDropdown" class="dropdownSelect">
<div id="selectedNews"
class="option navyBlueTheme selectedOption"
data-place="">
<i class="icon-document"></i>
<span>Noticias</span>
</div>
<div class="dropdownDark grid_template_d4_m3">
<a href="news.html?newsType=TOP_ARTICLES" class="lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="topArticles">
<i class="icon-news"></i>
<span>Artículos principales</span>
</div>
</a>
<a href="news.html?newsType=LATEST_ARTICLES" class="lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="latestArticle">
<i class="icon-bell"></i>
<span>Últimos artículos</span>
</div>
</a>
<a href="eventsNew.html?eventType=MILITARY" class="lockMission12 lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="eventsMilitary">
<i class="icon-danger"></i>
<span>Eventos militares</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">mission 12</small>
</div>
</div>
</a>
<a href="eventsNew.html?eventType=POLITICAL" class="lockMission12 lockServerIsClosed">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="eventsPolitical">
<i class="icon-director"></i>
<span>Eventos políticos</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">mission 12</small>
</div>
</div>
</a>
<a href="mergeSchedule.html">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="mergeSchedule">
<i class="icon-earth"></i>
<span>Programación de fusión de servidores</span>
</div>
</a>
<a href="statisticsNew.html?statisticsType=CITIZEN">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="statistics">
<i class="icon-statistics"></i>
<span>Estadísticas</span>
</div>
</a>
<a href="#poolEventRewardPreferences" onmousedown="Utils.sendReloadContentAjax('poolEventRewardPreferences', event)">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="eventsNew">
<i class="icon-trophy2"></i>
<span>Bolsa de premios</span>
</div>
</a>
<a href="shouts.html">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="shouts">
<i class="icon-bubbles-2"></i>
<span>Shouts</span>
</div>
</a>
</div>
</div>
<div id="selectedCountryDropdown" class="dropdownSelect">
<div id="selectedCountryTab"
class="option navyBlueTheme selectedOption"
data-place="">
<i class="icon-map-marked-alt"></i>
<span>País</span>
</div>
<div class="dropdownDark grid_template_d4_m3">
<a href="#battles"
onmousedown="Utils.sendBattlesAjax(26, false, '&sorting=BY_TOTAL_DAMAGE&_substidedOnly=on', event)"
class="lockMission5 lockServerIsClosed lockCountryIsEliminated ">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="battles">
<i class="icon-cannon"></i>
<span>Batallas</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">mission 5</small>
</div>
</div>
</a>
<a href="#eventsNew" onmousedown="Utils.sendReloadContentAjax('eventsNew', event)" class="lockMission5">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="eventsNew">
<i class="icon-trophy"></i>
<span>Eventos</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">mission 5</small>
</div>
</div>
</a>
<a href="coalition.html">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="coalition">
<i class="icon-domain"></i>
<span>Coaliciones</span>
</div>
</a>
<a href="country.html?countryType=LAWS">
<div class="option navyBlueTheme lockServerIsClosed fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="laws">
<i class="icon-scales"></i>
<span>leyes</span>
</div>
</a>
<a href="elections.html" class="lockLvl7 lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="presidentalElections">
<i class="icon-crown"></i>
<span>Elecciones</span>
<div class="d-flex flex-row align-center gap-25">
<img src="//vara.e-sim.org/cdn/static/img/lock-icon-20.png" style="height:16px;display:none;">
<small style="display:none;">level 7</small>
</div>
</div>
</a>
<a href="/pendingCitizenshipApplicationsDark.html" class="lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="pendingCitizenshipApplications">
<i class="icon-contact"></i>
<span>Ciudadanía</span>
</div>
</a>
<a href="newMap.html" class="lockServerIsClosed lockCountryIsEliminated">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="pendingCitizenshipApplications">
<i class="icon-map"></i>
<span>Mapa</span>
</div>
</a>
</div>
</div>
<div id="selectedDiscordDropdown" class="dropdownSelect">
<div id="selectedDiscordTab"
class="option navyBlueTheme selectedOption"
data-place="">
<img src="//vara.e-sim.org/cdn/static/img/Discord-Logo-Color.png" class="discordMobile" style="background-position: center;
height: 17px;width: 17px;background-size: 100% 100%;filter: brightness(0) invert(1) drop-shadow(0px 2px 1px black);">
<span>Discord</span>
</div>
<div class="dropdownDark grid_template_d4_m3">
<a href="https://discord.gg/4qX5sZ6" target="_blank" rel="noopener noreferrer">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place')"
data-place="discord">
<img src="//vara.e-sim.org/cdn/static/img/Discord-Logo-Color.png" class="discordMobile" style="background-position: center;
height: 22px;width: 22px;background-size: 100% 100%;filter: brightness(0) invert(1) drop-shadow(0px 2px 1px black);">
<span>Discord</span>
</div>
</a>
<a href="https://vara.e-sim.org/discordLocalServers.html">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="discordLocalServers">
<img src="//vara.e-sim.org/cdn/static/img/Discord-Logo-Color.png" class="discordMobile" style="background-position: center;
height: 22px;width: 22px;background-size: 100% 100%;filter: brightness(0) invert(1) drop-shadow(0px 2px 1px black);">
<span>Servidores locales</span>
</div>
</a>
<a href="https://vara.e-sim.org/connectWithDiscord.html">
<div class="option navyBlueTheme fadeIn"
onclick="DarkFormFunctions.highlightAndSelectDropdownOption(this, 'place');"
data-place="connectWithDiscord">
<img src="//vara.e-sim.org/cdn/static/img/Discord-Logo-Color.png" class="discordMobile" style="background-position: center;
height: 22px;width: 22px;background-size: 100% 100%;filter: brightness(0) invert(1) drop-shadow(0px 2px 1px black);">
<span>Conectar cuentas</span>
</div>
</a>
</div>
</div>
<div class="close-sidr-places-container hidden p-absolute" style="bottom: -28%;right: 24%;background: black;
background-image: linear-gradient(to bottom, #45719b 20%, #2c3e50 100%) !important;
outline: 3px solid #ffffff !important;
border-radius: 1.5em;
box-shadow: 5px 5px 10px black !important;">
<img id="close-sidr-places" style="width: 8em; height: 8em; filter:invert(1);" src="//vara.e-sim.org/cdn/static/img/menuClose.png"/>
</div>
</div>
<ul class="foundation-right hidden-overflow">
<div data-dropdown-content style="width:auto" class="newLogout bg-dark f-dropdown content medium canvaback foundation-text-center foundation-base-font" id="contentDrop">
<b class="time">09:23 4-2026</b>
<b>día 53</b>
<a class="btn-buy btn-yellow white m-05-auto" style="white-space: break-spaces !important; padding: 0.75em 1em;" href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=192465', event)"><i class="icon-user"></i>Tom Sawyer</a><br>
<form action="logout.html" method="POST" id="logoutForm">
<a class="btn-buy btn-red white logoutButton" href="javascript:;" onclick="parentNode.submit();"><i class='icon-error2'></i>Cerrar sesión</a>
</form>
</div>
<li id="userAvatar">
<a data-dropdown="contentDrop" href="#">
<img align="absmiddle" class="smallAvatar" style="" src="//vara.e-sim.org/cdn/static/img/avatar/blankAvatar.png"> <a class="profileLink" href="profile.html?id=192465">Tom Sawyer</a>
</a>
</li>
<li id="numero2" class="menuNotifications">
<a id="inboxMessagesMission"
href="#inboxMessages"
onmousedown="Utils.sendReloadContentAjax('inboxMessages', event)"
class="active-icon">
<i class="icon-email2"></i>
<b>2</b>
</a>
</li>
<li id="numero1" class="menuNotifications">
<a href="#" data-dropdown='dropdownNotifications' class="active-icon">
<i class="icon-bell"></i></i><b>1</b>
</a>
</li>
<li class="menuNotifications" style="display: none;">
<a href="subs.html" class="blank-icon">
<i class="icon-rss"></i><b>0</b>
</a>
</li>
</ul>
<div data-dropdown-content class="bg-dark notifDropdown f-dropdown content " id='dropdownNotifications'>
<div class="d-flex flex-column align-center gap-1">
<div id='dropdownNotificationsWrap' class="bg-dark-row">
<div id='dropdownNotificationsAjaxArea' class='antiscroll-inner'>
<!--this areal will bi fild with ajax-->
</div>
</div>
<div class="d-flex flex-row align-center gap-1">
<button id='dropdownNotificationButton' class='btn-buy btn-yellow font-size-1'>Mostrar más</button>
<a id="allNotifications"class='btn-buy btn-yellow color-white font-size-1' href="#" onmousedown="Utils.sendReloadContentAjax('notifications', event)" style="text-transform:none">Todas las notificaciones</a>
</div>
</div>
</div>
<style>
#taskButtonDaily .missionCenterIcon {
color: white;
display: flex;
justify-content: center;
align-items: center;
/*width: 50px;*/
/*height: 100%;*/
/*font-size: 2.5em;*/
/*cursor: pointer;*/
/*padding: 0.25em;*/
/*margin: 0 0.5em;*/
}
nav .missionCenterIcon,
#mobile-navbar .missionCenterIcon {
float: right;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 2.5em;
cursor: pointer;
padding: 0.25em;
margin: 0 0.25em;
}
.mobile nav .missionCenterIcon,
.mobile #mobile-navbar .missionCenterIcon {
font-size: 6vh;
width: 100px;
}
.mobile .missionCenterIcon {
width: 100px;
}
.missionCenterIcon .missionCenterTooltip {
box-shadow: -2px 2px 5px 0px rgb(0 0 0 / 75%);
color: #030303;
background: #f2f2f2;
border: 3px solid #333;
border-radius: 0.25em;
visibility: visible;
text-align: center;
font-weight: bold;
padding: 5px;
position: absolute;
z-index: 1;
top: 125%;
left: 50%;
transform: translateX(-50%);
text-transform: initial;
width: 250px;
text-shadow: none;
font-size: 0.5em;
}
.mobile .missionCenterIcon .missionCenterTooltip {
width: 600px;
}
.mobile #taskButtonDaily .missionCenterIcon .missionCenterTooltip {
width: 430px;
font-size: 2em;
}
.missionCenterTooltip::after {
content: "";
position: absolute;
top: -30px;
left: 50%;
transform: translateX(-50%);
border-width: 15px;
border-style: solid;
border-color: transparent transparent #f2f2f2 transparent;
}
.mobile .missionCenterTooltip::after {
content: "";
position: absolute;
top: -150px;
left: 50%;
transform: translateX(-50%);
border-width: 80px;
border-style: solid;
border-color: transparent transparent #f2f2f2 transparent;
}
</style>
<div class="missionCenterIcon "
onclick="(function(el) { MissionCenterModal.showModal(el); setTimeout(() => toggleMissionCenterTooltip(false), 800); })(this)">
<i class="icon-calendar-alt-regular p-0 cursor-pointer"></i>
<div class="notificationBadge"></div>
<div class="missionCenterTooltip fadeIn hidden">
Daily Missions are now enabled
</div>
</div>
<script>
function toggleMissionCenterTooltip(flag) {
const tooltip = document.querySelectorAll('.missionCenterTooltip');
tooltip.forEach(el => {
el.classList.toggle('hidden', !flag);
});
}
</script>
<style>
nav .shopIcon,
#mobile-navbar .shopIcon {
float: right;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 2.5em;
cursor: pointer;
padding: 0.25em;
margin: 0 0.25em;
}
.mobile nav .shopIcon,
.mobile #mobile-navbar .shopIcon {
font-size: 6vh;
width: 100px;
}
.shopIcon .notificationBadge {
top: 5%;
left: 65%;
font-size: 0.6em;
}
.shopIconAtOldFundraisingPage {
padding: 1em 3em;
}
nav .shopIcon.btn-buy {
background: unset !important;
box-shadow: unset !important;
outline: unset !important;
}
</style>
<div class="shopIcon tests" onclick="Utils.sendReloadContentAjax('shop?shopType=PROMOTIONS', event)">
<i class="icon-shopping-cart p-0 cursor-pointer"></i>
<div class="notificationBadge "></div>
</div>
<div class="muteButtonContainer desktop">
<div id="muteButton" class="mute-button justify-center align-center" onclick="SoundManager.toggleSound()">
<i id="speakerIcon" class="speakerIcon icon-volume-mute cursor-pointer p-0"></i>
</div>
</div>
<script src="//vara.e-sim.org/cdn/static/js/miniscroll.min.js" type="text/javascript"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
});
</script>
<style>
.logoutButton {
display: flex;
align-items: center;
justify-content: center;
padding: 0.5em 1em;
width: fit-content;
margin: 0 auto;
}
.newLogout {
border: 2px solid grey !important;
border-radius: 0.5em !important;
filter: drop-shadow(2px 4px 4px black);
padding: 1em !important;
}
#dropdownNotifications {
min-width: 470px;
padding: 10px 7px;
}
#dropdownNotificationsWrap {
width: 470px;
display: block;
height: 300px;
min-height: 300px;
max-height: 300px;
overflow: hidden;
}
#dropdownNotificationsAjaxArea::-webkit-scrollbar {
width: 10px;
}
#dropdownNotificationsAjaxArea::-webkit-scrollbar-track {
background: rgba(82, 82, 82, 0.25);
border-radius: 5px;
}
#dropdownNotificationsAjaxArea::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.56);
border-radius: 5px;
}
#dropdownNotificationsAjaxArea {
height: 100%;
overflow-y: auto;
overflow-x: hidden;
padding-right: 10px;
width: 470px;
}
#dropdownNotificationsAjaxArea {
scrollbar-width: thin;
scrollbar-color: rgba(255, 255, 255, 0.56) rgba(82, 82, 82, 0.25);
}
#dropdownNotifications .notification {
clear: both;
min-height: 40px;
padding: 5px 5px;
text-align: left;
width: 100%;
line-height: 1.2em !important;
display: grid;
grid-template-columns: 0.25fr 2fr;
}
#dropdownNotifications .notification:nth-child(2n) {
background: rgba(0, 0, 0, 0.35);
}
#dropdownNotifications i {
display: block;
float: left;
font-size: 1.25em;
}
#dropdownNotifications .notification time {
float: right;
font-size: 0.75em;
padding-right: 0.5em;
}
#dropdownNotifications .notification span, #dropdownNotifications .notification span * {
font-size: 0.9em;
}
#dropdownNotifications .notification span > img {
width: 20px !important;
height: 20px !important;
}
#dropdownNotifications .active-icon {
color: #F67A44;
}
.notifDropdown {
z-index: 99 !important;
border-radius: 0.5em !important;
max-width: 500px !important;
border: 1px solid black !important;
box-shadow: 2px 2px 6px black !important;
font-size: 1.3em !important;
max-width: 500px !important;
display: block;
background-color: #222 !important;
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/texture3.png) !important;
background-repeat: repeat, repeat;
}
.newLogout > b {
margin-bottom: 0 !important;
}
</style>
</section>
</nav>
</div>
<script type="text/javascript">
function initBasicTooltips(selector = '.help[title], .smallhelp[title]') {
document.body.addEventListener('mouseover', (event) => {
const el = event.target.closest(selector);
if (el && !el.dataset.tooltipActive) {
showTooltip(el);
}
}, true);
}
function showTooltip(el) {
const text = el.getAttribute('title');
if (!text) return;
el.dataset.tooltipActive = 'true'; // prevent multiple tooltips
el.removeAttribute('title');
const tooltip = document.createElement('div');
tooltip.className = 'tooltip';
tooltip.innerHTML = text;
document.body.appendChild(tooltip);
const rect = el.getBoundingClientRect();
const ttRect = tooltip.getBoundingClientRect();
let top = rect.bottom + window.scrollY + 8;
let left = rect.left + window.scrollX + (rect.width - ttRect.width) / 2;
if (top + ttRect.height + 8 > window.scrollY + window.innerHeight) {
top = rect.top + window.scrollY - ttRect.height - 8;
tooltip.classList.add('top');
}
left = Math.min(Math.max(left, window.scrollX + 8), window.scrollX + window.innerWidth - ttRect.width);
top = Math.min(Math.max(top, window.scrollY + 8), window.scrollY + window.innerHeight - ttRect.height - 8);
tooltip.style.top = top + 'px';
tooltip.style.left = left + 'px';
requestAnimationFrame(() => tooltip.classList.add('show'));
let isHoveringElement = true;
let isHoveringTooltip = false;
const removeTooltip = () => {
tooltip.classList.remove('show'); // fade out
setTimeout(() => {
tooltip.remove();
delete el.dataset.tooltipActive;
el.setAttribute('title', text);
}, 100);
};
const checkAndRemove = () => {
setTimeout(() => {
if (!isHoveringElement && !isHoveringTooltip) {
removeTooltip();
}
}, 50);
};
el.addEventListener('mouseleave', () => {
isHoveringElement = false;
checkAndRemove();
});
tooltip.addEventListener('mouseenter', () => {
isHoveringTooltip = true;
});
tooltip.addEventListener('mouseleave', () => {
isHoveringTooltip = false;
checkAndRemove();
});
}
function initCustomTooltips(selector) {
function getTooltipPosition(target, tooltip) {
const targetRect = target.getBoundingClientRect();
const tooltipRect = tooltip.getBoundingClientRect();
const scrollY = window.scrollY || window.pageYOffset;
const scrollX = window.scrollX || window.pageXOffset;
let top = targetRect.top + scrollY + targetRect.height / 2 - tooltipRect.height / 2;
let left = targetRect.left + scrollX - tooltipRect.width - 10;
// If out of viewport on left, show on right
if (left < 10) left = targetRect.right + scrollX + 10;
if (left + tooltipRect.width > window.innerWidth - 10)
left = window.innerWidth - tooltipRect.width - 10 + scrollX;
if (top < scrollY + 10) top = scrollY + 10;
if (top + tooltipRect.height > scrollY + window.innerHeight - 10)
top = scrollY + window.innerHeight - tooltipRect.height - 10;
return { top, left };
}
function removeTooltip(tooltip, target, text) {
if (!tooltip) return;
tooltip.classList.remove('show'); // fade out
setTimeout(() => {
tooltip.remove();
if (target) target.setAttribute('title', text);
}, 200); // fade-out duration
}
function showTooltip(target) {
// Remove existing one first
const existing = document.querySelector('.custom-tooltip');
if (existing) existing.remove();
const tooltipId = target.getAttribute('tooltip');
if (!tooltipId) return;
const contentEl = document.getElementById(tooltipId);
if (!contentEl) return;
const text = target.getAttribute('title');
if (text) target.removeAttribute('title');
const tooltip = document.createElement('div');
tooltip.className = 'custom-tooltip';
tooltip.innerHTML = contentEl.innerHTML;
document.body.appendChild(tooltip);
const pos = getTooltipPosition(target, tooltip);
tooltip.style.top = pos.top + 'px';
tooltip.style.left = pos.left + 'px';
requestAnimationFrame(() => tooltip.classList.add('show'));
// --- Hover persistence logic (same as your example) ---
let isHoveringElement = true;
let isHoveringTooltip = false;
const checkAndRemove = () => {
setTimeout(() => {
if (!isHoveringElement && !isHoveringTooltip) {
removeTooltip(tooltip, target, text);
}
}, 80);
};
target.addEventListener('mouseleave', () => {
isHoveringElement = false;
checkAndRemove();
});
tooltip.addEventListener('mouseenter', () => {
isHoveringTooltip = true;
});
tooltip.addEventListener('mouseleave', () => {
isHoveringTooltip = false;
checkAndRemove();
});
}
document.addEventListener('mouseover', function (e) {
const target = e.target.closest(selector);
if (!target) return;
showTooltip(target);
});
document.addEventListener('touchstart', function (e) {
const target = e.target.closest(selector);
if (!target) return;
e.stopPropagation();
const existing = document.querySelector('.custom-tooltip');
if (existing) existing.remove();
else showTooltip(target);
});
['touchstart', 'click'].forEach(eventType => {
document.addEventListener(eventType, function (e) {
if (!e.target.closest(selector)) {
const existing = document.querySelector('.custom-tooltip');
if (existing) existing.remove();
}
});
});
}
function initDropdownHover() {
const dropdownItems = document.querySelectorAll('li.has-dropdown');
dropdownItems.forEach(item => {
item.addEventListener('mouseenter', () => {
item.classList.add('hover');
});
item.addEventListener('mouseleave', () => {
item.classList.remove('hover');
});
});
}
//TODO try to make generic method maybe???
function initUserDropdown(userAvatarId = 'userAvatar', contentDropId = 'contentDrop') {
const userAvatar = document.getElementById(userAvatarId);
const contentDrop = document.getElementById(contentDropId);
let isAnimating = false;
if (!userAvatar || !contentDrop) return;
const avatarLink = userAvatar.querySelector('a[data-dropdown]');
if (!avatarLink) return;
avatarLink.addEventListener('click', (e) => {
e.preventDefault();
e.stopPropagation();
if (isAnimating) return;
if (contentDrop.classList.contains('open')) {
closeDropdown();
} else {
openDropdown();
}
});
document.addEventListener('click', (e) => {
if (!userAvatar.contains(e.target) && !contentDrop.contains(e.target)) {
closeDropdown();
}
});
function openDropdown() {
isAnimating = true;
contentDrop.classList.add('open');
contentDrop.style.display = 'block';
contentDrop.style.opacity = '0';
requestAnimationFrame(() => {
positionDropdown();
Utils.fadeIn(contentDrop, 200);
setTimeout(() => {
isAnimating = false;
}, 200);
});
}
function closeDropdown() {
isAnimating = true;
Utils.fadeOut(contentDrop, 200, () => {
contentDrop.classList.remove('open');
isAnimating = false;
});
}
function positionDropdown() {
const avatarRect = userAvatar.getBoundingClientRect();
const dropdownRect = contentDrop.getBoundingClientRect();
contentDrop.style.top = (avatarRect.bottom) + 'px';
contentDrop.style.left = (avatarRect.left - dropdownRect.width / 2) + 'px';
contentDrop.style.minWidth = '200px';
}
}
function initNotificationDropdown(triggerId = 'numero1', dropdownId = 'dropdownNotifications') {
const trigger = document.getElementById(triggerId);
const dropdown = document.getElementById(dropdownId);
if (!trigger || !dropdown) return;
const triggerLink = trigger.querySelector('a[data-dropdown], a');
if (!triggerLink) return;
let isInitialized = false;
let page = 1;
let numMessages;
let isAnimating = false;
triggerLink.addEventListener('click', async (e) => {
e.preventDefault();
e.stopPropagation();
if (isAnimating) return;
if (dropdown.classList.contains('open')) {
closeDropdown();
} else {
openDropdown();
if (!isInitialized) {
await loadFirstPage();
setupLoadMoreButton();
isInitialized = true;
}
}
});
document.addEventListener('click', (e) => {
if (dropdown.classList.contains('open') &&
!trigger.contains(e.target) &&
!dropdown.contains(e.target)) {
closeDropdown();
}
});
function openDropdown() {
isAnimating = true;
dropdown.classList.add('open');
positionDropdown();
Utils.fadeIn(dropdown, 200);
setTimeout(() => {
isAnimating = false;
}, 200);
}
function closeDropdown() {
isAnimating = true;
Utils.fadeOut(dropdown, 200, () => {
dropdown.classList.remove('open');
isAnimating = false;
});
}
function positionDropdown() {
const triggerRect = trigger.getBoundingClientRect();
const dropdownRect = dropdown.getBoundingClientRect();
dropdown.style.top = triggerRect.bottom + 'px';
dropdown.style.right = '0px';
dropdown.style.left = 'auto';
dropdown.style.minWidth = '200px';
}
async function loadFirstPage() {
try {
const response = await fetch('dropdownNotifications.html?page=' + page + '×tamp=1776669806561');
const data = await response.text();
const container = document.getElementById("dropdownNotificationsAjaxArea");
if (!container) return;
container.innerHTML = data;
console.log(data);
page++;
const pEl = container.querySelector("p");
if (pEl) {
numMessages = pEl.dataset.unread;
pEl.remove();
}
updateBadge(numMessages);
} catch (err) {
console.error("Failed to load first page notifications:", err);
}
}
function setupLoadMoreButton() {
const btn = document.getElementById("dropdownNotificationButton");
if (!btn) return;
btn.addEventListener("click", async () => {
try {
const response = await fetch('dropdownNotifications.html?page=' + page + '×tamp=1776669806561');
const data = await response.text();
const container = document.getElementById("dropdownNotificationsAjaxArea");
if (!container) return;
container.insertAdjacentHTML("beforeend", data);
page++;
const pEl = container.querySelector("p");
if (pEl) {
numMessages = pEl.dataset.unread;
pEl.remove();
}
updateBadge(numMessages);
} catch (err) {
console.error("Failed to load more notifications:", err);
}
});
}
function updateBadge(count) {
const bEl = trigger.querySelector("b");
if (bEl) bEl.textContent = count;
if (count < 1) {
const activeIcon = trigger.querySelector(".active-icon");
if (activeIcon) {
activeIcon.classList.remove("active-icon");
activeIcon.classList.add("blank-icon");
}
}
}
}
document.addEventListener("DOMContentLoaded", () => {
initBasicTooltips();
initCustomTooltips('.eqStats div.help, i.help');
initDropdownHover();
initNotificationDropdown('numero1', 'dropdownNotifications');
if (isDesktop) initUserDropdown('userAvatar', 'contentDrop');
});
</script>
<style>
.foundation-style.panel.callout {
border: none;
margin-bottom: .5em;
padding: .5em;
background: transparent;
box-shadow: none;
}
.sidebar-clock {
min-height: 50px;
font-size: 1em;
text-shadow: 0px 2px 4px black !important;
display: flex;
align-items: center;
justify-content: center;
gap: 1em;
}
.sidebar-clock>b {
display: block;
}
.sidebar-clock>i {
float: left;
font-size: 41px;
padding: 0;
}
.server-merge-info {
display: block;
padding: 4px 0 0;
}
button.button.sidebar-language-button, .button.sidebar-language-button {
font-size: 12px;
margin-bottom: 8px;
padding: 9px 0;
width: 100%;
}
.mobile button.button.sidebar-language-button {
width: 50%;
margin: 0.5em !important;
}
button.sidebar-language-button>img {
margin: 0 4px 0 0;
vertical-align: sub;
}
#eatForm>b {
display: flex;
align-items: center;
justify-content: center;
}
.sidebar-money {
padding: 3px;
background: #0000002b;
border-radius: 0.5em;
padding: 0.25em 0.5em;
display: flex;
align-items: center;
gap: 0.5em;
justify-content: center;
}
.mobile #sideBarMoneyList > a {
font-size: 1.75em !important;
}
#sideBarMoneyList {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 0.125em;
}
.mobile #sideBarMoneyList {
display: grid;
grid-template-columns: repeat(2, 1fr);
justify-items: stretch;
align-items: center;
}
.sidebar-header {
display: block;
font-size: 14px;
letter-spacing: 1px;
text-align: center;
margin: 2px auto;
font-weight: bold;
text-shadow: 0px 2px 4px black !important;
text-decoration: underline;
}
.sidebar-labeled-information {
margin: 4px 8px 0;
min-height: 1.5em;
text-align: right;
font-weight: bold;
}
.flags-small {
margin: 0 2px;
vertical-align: middle;
}
.sidebar-labeled-information>*:first-child {
float: left;
}
.sidebar-labeled-information>*:nth-child(2) {
display: inline-block;
}
.sidebar-progres-description {
padding: 0 4px 0 0;
position: relative;
top: -16px;
text-shadow: 0px 0px 2px black, 0px 1px 2px black, 0px 1px 2px black;
font-weight: bold;
}
.font-for-consumable {
font-size: 11px;
}
input.button.sidebar-small-button {
font-size: 12px !important;
padding: 8px 24px;
margin: 2px auto;
}
a.profile-link, #userName.profile-link {
border-bottom: 1px solid #f2f2f2;
color: #f2f2f2;
font-size: 18px;
letter-spacing: 1px;
padding: 0 4px;
text-decoration: none;
}
.mobile .sidebar-header, .mobile .sidebar-clock {
font-size: 2em;
text-shadow: 0px 3px 6px black !important;
}
.mobile #sidepanelSearchFormButton {
height: 5vh !important;
font-size: 1.25em !important;
}
.mobile .button.foundation-style {
background: linear-gradient(to bottom,#a5a5a5 0,#212121 100%);
box-shadow: inset 0px -4px 2px 1px #161616, inset 0px 1px 4px 0px rgb(255 237 197) !important;
border-radius: 15px !important;
outline: 6px solid black !important;
}
.mobile #sidebarSearchForm input {
box-shadow: inset 0px 3px 10px black !important;
font-weight: bold;
}
.mobile #logoutForm {
padding: 1em !important;
width: unset;
margin-bottom: 2em;
}
.mobile .shortCutsList a {
padding: 1em 1.5em !important;
font-size: 1.25em !important;
}
.mobile .profileLinkContainer {
gap: 1em;
font-size: 1.5em;
}
.sidebar-labeled-information {
background: #0000002b;
border-radius: 0.5em;
padding: 0.25em 0.5em;
margin: 0.25em auto;
}
.mobile .sidebar-labeled-information {
border-radius: 0.5em;
padding: 0.25em 1em;
margin: 0.25em;
}
.mobile #stats .ui-progressbar {
height: 3em !important;
border-radius: 0.5em !important;
}
.mobile #stats .ui-progressbar-value{
border-radius: 0.5em !important;
}
.mobile .stats__text {
justify-content: center;
font-size: 0.8125em;
}
.mobile .sidebar-progres-description {
top: 1px;
}
</style>
<div id="testing">
<div id="userMenu" class="two-tenths columns column-margin-left column-margin-vertical foundation-text-center foundation-style foundation-base-font">
<div class="columns column-margin-both column-margin-vertical foundation-style canvaback foundation-shadow foundation-radius" style="outline: 2px solid grey;
border-radius: 0.5em !important;
margin: 0 auto !important;
filter: drop-shadow(2px 4px 4px black);">
<div class="foundation-style panel callout">
<div class="sidebar-clock">
<i class="icon-uptime"></i>
<div class="d-flex flex-column align-center justify-center">
<b class="time" style="width: 75px">09:23 4-2026</b>
<b style="display:none;" id="time2">1776669806561</b>
<b>día 53</b>
</div>
</div>
</div>
<div class="d-flex justify-center align-center gap-05">
<button id="sidebarChangeLanguage"
class="sidebar-language-button button foundation-style"
onclick="window.location.href = 'editCitizen.html?editCitizenPage=LANGUAGE'">
<img src="//vara.e-sim.org/cdn/static/img/FlagsPackage/IMAGES/SMALL/Spain.png"/>Change language
</button>
<div id="mobileMuteButtonContainer" class="muteButtonContainer hidden">
<div id="muteButton" class="mute-button justify-center align-center" onclick="SoundManager.toggleSound()">
<i id="speakerIcon" class="speakerIcon icon-volume-mute cursor-pointer p-0 font-size-2"></i>
</div>
</div>
</div>
<div id="dailyTaskSection" class="show-more-section">
<div>
<span class="sidebar-header">Tareas diarias:</span>
<ul id="dailyButton" style="position:relative" class="show-more-list animBreath2 button foundation-center foundation-style-group fadeIn">
<li id="taskButtonFight" class="show-more-item"><a class="button foundation-style smallhelp only-icon profileButton" title="Lucha" href="battles.html?countryId=26&filter=PRACTICE_BATTLE"><i class="icon-scope"></i></a></li>
<li id="taskButtonAvatar" class="show-more-item"><a class="button foundation-style smallhelp only-icon profileButton" title="Subir avatar" href="editCitizen.html?id=192465"><i class="icon-user-cog"></i></a></li>
<li id="taskButtonDaily" class="show-more-item fadeIn" onclick="MissionCenterModal.showModal(this);">
<a class="button foundation-style smallhelp only-icon profileButton d-flex justify-center align-center" title="Misiones diarias">
<div class="missionCenterIcon">
<i class="icon-calendar-alt-regular p-0"></i>
</div>
</a>
</li>
</ul>
<div id="showMoreBtn" class="show-more-btn m-0-auto"></div>
</div>
</div>
<script>
Utils.toggleShowMoreVisibility();
// Train button
const trainLink = document.querySelector("#taskButtonTrain a");
if (trainLink) {
trainLink.setAttribute("href", "#train");
trainLink.addEventListener("mousedown", (event) => {
Utils.sendReloadContentAjax("train", event);
});
}
// Work button
const workLink = document.querySelector("#taskButtonWork a");
if (workLink) {
workLink.setAttribute("href", "#work");
workLink.addEventListener("mousedown", (event) => {
Utils.sendReloadContentAjax("work", event);
});
}
// Fight button
const fightLink = document.querySelector("#taskButtonFight a");
if (fightLink) {
fightLink.setAttribute("href", "#battles");
fightLink.addEventListener("mousedown", (event) => {
const id = "26";
const locationId = id.length > 0 ? id : 0;
location.href = "battle.html?id=0";
});
}
</script>
<hr class="foundation-divider">
<span class="sidebar-header">Atajos:</span>
<ul class="button foundation-center foundation-style-group shortCutsList">
<li>
<a id="taskButtonMU" href="#"
onmousedown="Utils.sendReloadContentAjax('myMilitaryUnit', event)"
title="Unidad militar"
class="button foundation-style smallhelp only-icon profileButton">
<i class="icon-bookmark"></i>
</a>
</li>
<li>
<a id="taskButtonParty" href="myParty.html"
title="Partido"
class="button foundation-style smallhelp only-icon profileButton">
<i class="icon-friends"></i>
</a>
</li>
<li>
<a id="travelMission" href="#"
onmousedown="Utils.sendReloadContentAjax('travel', event)"
title="Viajar"
class="button foundation-style smallhelp only-icon profileButton">
<i class="icon-airplane"></i>
</a>
</li>
<li>
<a id="achievementsMission" href="#"
onmousedown="Utils.sendReloadContentAjax('citizenAchievements?id=192465', event)"
title="Sus logros"
class="button foundation-style smallhelp only-icon profileButton">
<i class="icon-trophy"></i>
</a>
</li>
<li>
<a href="editCitizen.html" id="editCitizenId"
title="Editar perfil"
class="button foundation-style smallhelp only-icon profileButton">
<i class="icon-tools"></i>
</a>
</li>
</ul>
<hr class="foundation-divider">
<div>
<div class="profileLinkContainer d-flex flex-column justify-center align-center">
<div class="d-flex flex-column">
<a class="profile-link" href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=192465', event)"
id="userName">Tom Sawyer</a>
</div>
<div class="d-flex justify-center align-center p-5">
<div class="xflagsSmall xflagsSmall-USA"></div>
</div>
</div>
<div id="stats" class="foundation-center foundation-style">
<div id="levelMission" class="sidebar-labeled-information">
<span>Nivel:</span>
<span>5</span>
</div>
<div id="currRankText" class="sidebar-labeled-information">
<span>Rango:</span>
<span>Sargento del Estado Mayor</span>
</div>
<div class="progress foundation-center">
<div class="smallhelp bar ui-progressbar" title="81 / 100" id="xpProgress"></div>
</div>
<div class="stats__text">
<span class="sidebar-progres-description">experiencia:</span>
<span class="sidebar-progres-description" id="actualXp">81</span>
</div>
<div class="progress foundation-center">
<div class="smallhelp bar ui-progressbar" title="19211 / 30000" id="rankProgress"></div>
</div>
<div class="stats__text">
<span class="sidebar-progres-description">Rango:</span>
<span class="sidebar-progres-description" id="actualRank">19,211</span>
</div>
<div class="progress foundation-center">
<div class="smallhelp bar ui-progressbar" title="100.0 / 100" id="healthProgress"></div>
</div>
<div class="stats__text">
<span class="sidebar-progres-description">Energía:</span>
<span class="sidebar-progres-description" id="actualHealth">100.0</span>
</div>
</div>
<div style="font-size:0.8175em;">
<div class="sidebar-labeled-information">
<span>Ubicación:</span>
<div>
<a href="region.html?id=3018">
Lucenec
<div class="xflagsSmall xflagsSmall-USA"></div>
</a>
</div>
</div>
</div>
</div>
<hr class="foundation-divider">
<span class="sidebar-header">Tu dinero:</span>
<div id="sideBarMoneyList" class="panelPlate foundation-style">
<div class="sidebar-money">
<div class="xflagsSmall xflagsSmall-Gold"></div> <b title="3.00000">3.00</b> Oro
</div>
<div class="sidebar-money">
<div class="xflagsSmall xflagsSmall-USA"></div> <b title="54.00000">54.00</b> USD
</div>
<div class="sidebar-money">
<div class="xflagsSmall xflagsSmall-Guatemala"></div> <b title="5.00000">5.00</b> GTQ
</div>
</div>
<div id="storage-ammount" class="panelPlate foundation-style">
<hr class="foundation-divider">
<form action="logout.html" method="POST" id="logoutForm">
<a class="button foundation-style" href="javascript:;" onclick="parentNode.submit();">
Cerrar sesión
</a>
</form>
</div>
</div>
</div>
</div>
<script type="text/javascript">
async function reloadSidebarMoney() {
try {
const response = await fetch('sidebar/money', {
method: 'GET',
headers: {
'Content-Type': 'application/json'
}
});
if (!response.ok) {
throw new Error('HTTP error! Status: ' + response.status);
}
const data = await response.text();
const contentContainer = document.querySelector("#sideBarMoneyList");
if (contentContainer) {
const temp = document.createElement("div");
temp.innerHTML = data.trim();
const newContent = temp.firstElementChild;
if (newContent) {
contentContainer.replaceWith(newContent);
} else {
contentContainer.innerHTML = data;
}
}
} catch (error) {
console.error("Failed to reload sidebar money:", error);
}
}
Utils.setProgressBar('xpProgress', 11, 30);
Utils.setProgressBar('rankProgress', 9211, 20000);
Utils.setProgressBar('healthProgress', 100.0, 100);
// dialogs
const medkitBtn = document.getElementById('medkitButton');
if (medkitBtn) {
medkitBtn.addEventListener('click', (event) => {
event.preventDefault();
DefaultModal.showFormModal({
title: "Confirmación de uso del botiquín",
message: 'Este artículo será utilizado. ¿Está seguro?',
gridColumns: 1,
submitText: 'Entregar',
cancelText: 'Cancelar',
onConfirm: () => document.getElementById('medkitForm').submit()
});
});
}
document.addEventListener('DOMContentLoaded', () => {
const storages = document.querySelectorAll(".storageMini");
const switches = document.querySelectorAll(".switch");
const consumable = document.getElementById("consumable");
const currentPage = 'index.html';
// ----- easing functions -----
const easing = {
easeInBack: (t, b, c, d, s = 1.70158) => {
t /= d;
return c * t * t * ((s + 1) * t - s) + b;
},
easeOutBounce: (t, b, c, d) => {
t /= d;
if (t < (1 / 2.75)) {
return c * (7.5625 * t * t) + b;
} else if (t < (2 / 2.75)) {
return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;
} else if (t < (2.5 / 2.75)) {
return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;
} else {
return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;
}
}
};
// ----- slide animation helpers -----
function slideDown(el, duration = 1000, ease = "easeOutBounce") {
el.style.removeProperty("display");
let display = window.getComputedStyle(el).display;
if (display === "none") display = "block";
el.style.display = display;
const height = el.scrollHeight;
el.style.overflow = "hidden";
el.style.height = "0px";
let start;
function animate(time) {
if (!start) start = time;
const progress = Math.min((time - start) / duration, 1);
el.style.height = easing[ease](progress, 0, height, 1) + "px";
if (progress < 1) {
el._animFrame = requestAnimationFrame(animate);
} else {
el.style.height = "";
el.style.overflow = "";
}
}
cancelAnimationFrame(el._animFrame);
el._animFrame = requestAnimationFrame(animate);
}
function slideUp(el, duration = 1000, ease = "easeInBack") {
const height = el.scrollHeight;
el.style.overflow = "hidden";
let start;
function animate(time) {
if (!start) start = time;
const progress = Math.min((time - start) / duration, 1);
el.style.height = (height - easing[ease](progress, 0, height, 1)) + "px";
if (progress < 1) {
el._animFrame = requestAnimationFrame(animate);
} else {
el.style.display = "none";
el.style.height = "";
el.style.overflow = "";
}
}
cancelAnimationFrame(el._animFrame);
el._animFrame = requestAnimationFrame(animate);
}
// ----- initial state -----
if (document.querySelector("input#x1[type='radio']:checked")?.value === "on") {
storages.forEach(el => el.style.display = "none");
}
if (document.querySelector("input#x5[type='radio']:checked")?.value === "on") {
if (consumable) consumable.style.display = "none";
}
if (currentPage === "battle.html") {
if (consumable) consumable.style.display = "block";
const radio = document.querySelector("input#x4[type='radio']");
if (radio) radio.checked = true;
}
// ----- switch click events -----
switches.forEach(sw => {
sw.addEventListener("click", () => {
if (document.querySelector("input#x[type='radio']:checked")?.value === "on") {
storages.forEach(el => slideDown(el, 1000, "easeOutBounce"));
}
if (document.querySelector("input#x1[type='radio']:checked")?.value === "on") {
storages.forEach(el => slideUp(el, 1000, "easeInBack"));
}
if (document.querySelector("input#x4[type='radio']:checked")?.value === "on") {
if (consumable) slideDown(consumable, 1000, "easeOutBounce");
}
if (document.querySelector("input#x5[type='radio']:checked")?.value === "on") {
if (consumable) slideUp(consumable, 1000, "easeInBack");
}
});
});
function setupSelectable(listId, storageKey, inputId) {
const list = document.getElementById(listId);
const input = document.getElementById(inputId);
if (!list || !input) return;
const items = list.querySelectorAll('li');
const storedValue = localStorage.getItem(storageKey) || '1';
const selectedIndex = parseInt(storedValue, 10) - 1;
// clear old selections
items.forEach(li => li.classList.remove('ui-selected'));
// restore last selection
if (items[selectedIndex]) {
items[selectedIndex].classList.add('ui-selected');
input.value = storedValue;
}
items.forEach((li, index) => {
li.addEventListener('click', () => {
// remove other selections
items.forEach(el => el.classList.remove('ui-selected'));
// add selected class
li.classList.add('ui-selected');
// get the "Q" number from inner <b> if present
const valueText = li.querySelector('span > b')
? li.querySelector('span > b').textContent.replace('Q', '')
: (index + 1).toString();
// save in localStorage
localStorage.setItem(storageKey, valueText);
input.value = valueText;
});
});
}
setupSelectable('selectable', 'uiSelectable1', 'foodQuality');
setupSelectable('selectable2', 'uiSelectable2', 'giftQuality');
});
</script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", () => {
if (isMobile) {
return;
}
// timer
const timeZone = 'Poland';
let server = parseInt(document.getElementById("time2").textContent, 10);
// function checkTime(i) {
// if (i === "" || i == null) {
// i = 0;
// }
// if (i < 10 || i === 0 || i === "0") {
// i = "0" + i;
// }
// return i;
// }
function timeConverter3(unixTimestamp) {
// JS timestamp is in milliseconds â backend probably sends in seconds
const date = new Date(unixTimestamp);
// format full date + time in target timeZone
const formatter = new Intl.DateTimeFormat("en-GB", {
timeZone: timeZone,
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
day: "2-digit",
month: "2-digit",
year: "numeric"
});
document.querySelectorAll(".time").forEach(el => {
el.textContent = formatter.format(date);
});
// countdown calculations
const sec = date.getSeconds();
let secCDown = (60 - sec) % 60;
let minCDown;
if (secCDown === 0) {
minCDown = (60 - date.getMinutes()) % 60;
} else {
minCDown = 59 - date.getMinutes();
}
let hourCDown;
if (minCDown === 0) {
hourCDown = (24 - date.getHours()) % 24;
} else {
hourCDown = 23 - date.getHours();
}
const countdown =
pad(hourCDown) + ":" + pad(minCDown) + ":" + pad(secCDown);
document.querySelectorAll(".timeCountdown").forEach(el => {
el.textContent = countdown;
});
// tick forward 1s
setTimeout(() => timeConverter3(unixTimestamp + 1000), 1000);
}
function pad(n) {
return n < 10 ? "0" + n : n;
}
timeConverter3(server);
});
</script>
<style>
.mobile #userMenu {
position: fixed !important;
top: 0 !important;
right: 0 !important;
width: 280px;
height: 100%;
overflow-y: auto;
z-index: 1002;
background: #333;
transform: translateX(100%);
transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
-webkit-overflow-scrolling: touch;
padding-top: 0 !important;
}
.mobile #mobileNavbar {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 280px;
height: 100%;
overflow-y: auto;
z-index: 1002;
background: #333;
transform: translateX(-100%);
transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
-webkit-overflow-scrolling: touch;
padding-top: 0 !important;
}
.mobile #mobileNavbarNew {
display: flex;
opacity: 0;
position: fixed !important;
bottom: 11% !important;
right: 0 !important;
width: 280px;
/*height: 80vh;*/
/*overflow-y: auto;*/
z-index: 1002;
/*background: #333;*/
/*transform: translateX(100%);*/
transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 0.15s ease;
-webkit-overflow-scrolling: touch;
padding-top: 0 !important;
pointer-events: none;
}
.mobile #mobileNavbar.menu-open,
.mobile #userMenu.menu-open {
transform: translateX(0) !important;
}
.mobile #mobileNavbarNew.menu-open {
opacity: 1;
pointer-events: auto;
}
.mobile #container {
position: relative;
}
.mobile #container:before {
content: '';
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0);
transition: opacity 0.3s ease;
pointer-events: none;
z-index: 1001;
opacity: 0;
}
.mobile #container.slideout-open:before {
background-color: rgba(0, 0, 0, 0.5);
opacity: 1;
pointer-events: auto;
}
body.slideout-open {
overflow: hidden;
height: 100vh;
}
.profile-row, .profile-data, .eqStats, #hideToMobile, .eq-profile-stats {
text-align: center !important;
}
.userMenu-mobile {
width: 80% !important;
padding: 0 !important;
margin: 0 0 0 20% !important;
}
.userNavbar-mobile {
text-align: center !important;
width: 80% !important;
height: 100% !important;
background: #333 !important;
box-shadow: 0 0 5px 5px #222 inset !important;
}
.userNavbar-mobile > ul {
width: 100%;
font-size: 4vh;
background: #333 !important;
display: block;
margin: 0 0 15px;
padding: 0;
}
.userNavbar-mobile > ul > li {
display: block;
margin: 0;
line-height: 48px;
}
.userNavbar-mobile > ul > li > a {
height: 10vh;
text-align: left;
display: flex;
justify-content: left !important;
align-items: center;
line-height: 4vh;
width: 100%;
font-size: 4.5vh;
padding: 0 15px;
text-decoration: none;
color: #fff;
}
.userNavbar-mobile > ul > li > ul {
width: 100%;
margin: 0;
padding: 0;
}
.userNavbar-mobile > ul > li > ul > li {
text-align: left;
display: flex;
justify-content: left;
align-items: center;
line-height: 4vh;
width: 100%;
height: 8vh;
font-size: 3.5vh;
margin: 0;
}
.userNavbar-mobile > ul > li > ul > li > a {
text-align: left;
display: flex;
justify-content: left;
align-items: center;
line-height: 4vh;
width: 100%;
height: 8vh;
font-size: 3.5vh;
padding: 0 15px 0 10%;
color: rgba(255, 255, 255, 0.8);
}
.userNavbar-mobile .discordMobile {
background-position: center center !important;
height: 90px !important;
width: 90px !important;
background-size: 100% 100% !important;
display: block;
margin-left: -0.15em;
}
.mobile #frontPagePushQuestion {
font-size: 2vh !important;
max-width: 50vw !important;
}
.mobile #slider, .mobile .mobileFooter, .mobile .dividerMobile {
display: none !important;
}
.mobile #sidebarSearchForm {
height: 5.5vh !important;
clear: both;
}
.mobile .sidebar-money {
font-size: 1.5em;
}
.dropdownMobileHide {
display: none !important;
}
.dropdownMobileShow {
display: inline-block !important;
}
.dropdownMobileShow li a div > img {
height: 40px !important;
}
.dropdownMobileShow li a div > small {
display: inline-block;
font-size: 45px;
margin-left: 4px;
color: #e6f044 !important;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', (event) => {
"use strict";
// const hamburgerTest = $('#mobile-navbar__hamburger-sidebarTest');
if (isMobile) {
document.body.classList.add('mobile');
document.querySelectorAll('.time').forEach(el => el.removeAttribute('style'));
//information box in specific pages
const mainContainer = document.getElementById('container');
if (mainContainer) mainContainer.classList.remove('row');
document.querySelectorAll('#pagination-digg li').forEach(li => {
li.style.display = 'none';
});
document.querySelectorAll('#pagination-digg .previous, #pagination-digg .active, #pagination-digg .gotopage, #pagination-digg .gotopageInput, #pagination-digg .next')
.forEach(el => {
el.style.display = '';
const child = el.firstElementChild;
if (child) {
child.style.fontSize = '5vw';
child.style.padding = '.4em .8em';
}
});
if (!Utils.isOnPage('battle.html')) {
const upgradeFlag = flag => {
const classList = [...flag.classList];
const flagImageClass = classList.find(cls =>
cls.includes('xflagsSmall-') || cls.includes('xflagsMedium-')
);
if (!flagImageClass) return;
flag.classList.remove(flagImageClass);
if (flagImageClass.includes('Small')) {
flag.classList.remove('xflagsSmall');
flag.classList.add(flagImageClass.replace('xflagsSmall', 'xflagsBig'));
} else if (flagImageClass.includes('Medium')) {
flag.classList.remove('xflagsMedium');
flag.classList.add(flagImageClass.replace('xflagsMedium', 'xflagsBig'));
}
flag.classList.add('xflagsBig');
};
document.querySelectorAll('[class*="xflagsSmall-"], [class*="xflagsMedium-"]').forEach(upgradeFlag);
const observerTarget = document.querySelector('#countryBallContentContainer') || document.body;
const observer = new MutationObserver(mutations => {
const added = [];
for (const mutation of mutations) {
for (const node of mutation.addedNodes) {
if (!(node instanceof HTMLElement)) continue;
if (node.matches('[class*="xflagsSmall-"], [class*="xflagsMedium-"]')) {
added.push(node);
} else if (node.querySelector) {
node.querySelectorAll('[class*="xflagsSmall-"], [class*="xflagsMedium-"]').forEach(el => added.push(el));
}
}
}
if (added.length) {
requestAnimationFrame(() => {
for (const el of added) upgradeFlag(el);
});
}
});
observer.observe(observerTarget, { childList: true, subtree: true });
}
Utils.generateCssClass('pico-content',
`left: 28% !important;
top: 15% !important;
margin: 0 !important;
width: unset !important;
max-width: unset !important;`
);
Utils.generateCssClass('newRank', 'font-size: 1.9vh !important; width: 45vw;');
Utils.generateCssClass('levelsspritebig', 'font-size: 5vh !important;');
Utils.generateCssClass('newAchievement', 'font-size: 2vh !important; width: 45vw;');
Utils.generateCssClass('spritewhite', 'font-size: 5vh !important;');
const desktopNavbar = document.getElementById('desktop-navbar');
const mainMobileNavbar = document.getElementById('mobile-navbar');
const mobileLeftNavbarIcon = document.getElementById('mobileLeftNavbar');
const muteButtonContainer = document.getElementById('mobileMuteButtonContainer');
if (desktopNavbar) desktopNavbar.style.display = 'none';
if (mainMobileNavbar) mainMobileNavbar.style.display = 'block';
if (mobileLeftNavbarIcon) mobileLeftNavbarIcon.classList.remove('hidden');
if (muteButtonContainer) muteButtonContainer.classList.remove('hidden');
document.querySelectorAll('.sidebar-clock i, #consumable, #numero5')
.forEach(el => el.style.display = 'none');
document.querySelectorAll('span').forEach(span => {
if (span.textContent.includes('Consumir artículos:')) {
span.style.display = 'none';
}
});
const debugBtn = document.getElementById('debugTableButton');
if (debugBtn && debugBtn.parentElement) {
debugBtn.parentElement.remove();
}
document.querySelectorAll('.dropdown').forEach(el => el.classList.add('dropdownMobileHide'));
document.querySelectorAll('.column-view-fix').forEach(el => el.classList.remove('column-view-fix'));
const pagination = document.getElementById('pagination-digg');
if (pagination) {
pagination.style.fontSize = '34px';
pagination.querySelectorAll('*').forEach(el => {
el.style.setProperty('font-size', '34px', 'important');
});
}
Utils.generateCssClass('mobile_optimize_painting',
`box-shadow:none !important;
text-shadow: none !important;
border: none !important;
outline: none !important;`
);
const mobileNavbar = document.getElementById('mobileNavbarNew');
const hamburgerButton = document.getElementById('mobile-navbar__hamburger-sidebarTest');
const container = document.getElementById('container');
window.leftMenuOpen = false;
window.openLeftMenu = function() {
console.log('Opening left menu');
window.leftMenuOpen = true;
mobileNavbar.classList.add('menu-open');
container.classList.add('slideout-open');
document.body.classList.add('slideout-open');
setTimeout(() => {
document.addEventListener('click', handleOutsideClickLeft);
}, 50);
};
window.closeLeftMenu = function() {
console.log('Closing left menu');
window.leftMenuOpen = false;
mobileNavbar.classList.remove('menu-open');
container.classList.remove('slideout-open');
document.body.classList.remove('slideout-open');
document.removeEventListener('click', handleOutsideClickLeft);
};
const handleOutsideClickLeft = function(e) {
if (!mobileNavbar.contains(e.target) && !hamburgerButton.contains(e.target)) {
window.closeLeftMenu();
}
};
const toggleLeftMenu = function(e) {
e.preventDefault();
e.stopPropagation();
if (window.leftMenuOpen) {
window.closeLeftMenu();
} else {
window.openLeftMenu();
}
};
if (hamburgerButton) {
hamburgerButton.addEventListener('click', toggleLeftMenu);
}
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape' && window.leftMenuOpen) {
window.closeLeftMenu();
}
});
const buildMobileNavbar = function(isAccountConnectedWithDiscord) {
const mobileNavbar = document.getElementById('mobileNavbar');
if (!mobileNavbar) return;
mobileNavbar.classList.add('userNavbar-mobile');
const mobileNavbarLeft = document.querySelector('.mobileNavbar-left');
if (!mobileNavbarLeft) return;
if (!mobileNavbarLeft.querySelector('#indexShortcut')) {
const indexShortcut = document.createElement('a');
indexShortcut.id = 'indexShortcut';
indexShortcut.className = 'esim-logo';
indexShortcut.href = 'index.html';
indexShortcut.innerHTML = `<img id="indexShortCutImg" style="width:25vw; margin:5px 0;" src="//vara.e-sim.org/cdn/static/img/bestEsim.png" />`;
mobileNavbarLeft.prepend(indexShortcut);
}
if (isAccountConnectedWithDiscord && !mobileNavbarLeft.querySelector('#discordLink')) {
const discordLink = document.createElement('a');
discordLink.id = 'discordLink';
discordLink.href = 'https://discord.gg/4qX5sZ6';
discordLink.target = '_blank';
discordLink.innerHTML = `<img style="height:10vh;margin:5px 0;" src="//vara.e-sim.org/cdn/static/img/Discord-Logo-Color.png" />`;
mobileNavbarLeft.appendChild(discordLink);
}
document.querySelectorAll('.mobileNavbar-left li a').forEach(link => {
Array.from(link.children).forEach(child => {
const wrapper = document.createElement('div');
wrapper.style.display = 'flex';
wrapper.style.alignItems = 'center';
link.replaceChild(wrapper, child);
wrapper.appendChild(child);
});
});
const buttons = [
'myPlaces',
'menuMarket',
'statisticsMenu',
'navigationCountry',
'navigationNews',
'navigationDiscord'
];
buttons.forEach(id => {
const button = document.getElementById(id);
if (button) {
button.onclick = () => {
const targetClass = id + 'Mobile';
const target = document.querySelector('.' + targetClass);
if (target) {
document.querySelectorAll('.dropdownMobileShow').forEach(openMenu => {
if (openMenu !== target) {
openMenu.classList.remove('dropdownMobileShow');
}
});
target.classList.toggle('dropdownMobileShow');
}
}
}
});
mobileNavbar.querySelectorAll('*').forEach(el => el.classList.add('mobile_optimize_painting'));
return mobileNavbar;
}
const userMenu = document.getElementById('userMenu');
const avatarButton = document.getElementById('mobile-navbar__avatar-sidebar');
window.rightMenuOpen = false;
window.openRightMenu = function() {
console.log('Opening menu');
window.rightMenuOpen = true;
userMenu.classList.add('menu-open');
container.classList.add('slideout-open');
document.body.classList.add('slideout-open');
styleMenuChildren(userMenu);
setTimeout(function() {
document.addEventListener('click', handleOutsideClick);
}, 100);
};
window.closeRightMenu = function() {
console.log('Closing menu');
window.rightMenuOpen = false;
userMenu.classList.remove('menu-open');
container.classList.remove('slideout-open');
document.body.classList.remove('slideout-open');
document.removeEventListener('click', handleOutsideClick);
};
const handleOutsideClick = function(e) {
if (!userMenu.contains(e.target) && !avatarButton.contains(e.target)) {
window.closeRightMenu();
}
};
const toggleRightMenu = function(e) {
e.preventDefault();
e.stopPropagation();
if (window.rightMenuOpen) {
window.closeRightMenu();
} else {
window.openRightMenu();
}
};
if (avatarButton) {
avatarButton.addEventListener('click', toggleRightMenu);
}
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape' && window.rightMenuOpen) {
window.closeRightMenu();
}
});
const styleMenuChildren = function(userMenu) {
const children = userMenu.children;
for (let i = 0; i < children.length; i++) {
children[i].style.fontSize = '1.75em';
}
const iconUptime = document.querySelectorAll('.icon-uptime');
iconUptime.forEach(function(el) {
el.style.fontSize = '2em';
});
const sidebarClock = document.querySelectorAll('.sidebar-clock');
sidebarClock.forEach(function(el) {
el.style.fontSize = '1.5em';
});
const searchForm = document.getElementById('searchForm');
if (searchForm) {
searchForm.style.height = '5vh';
searchForm.style.fontSize = '1.5em';
}
const sidebarLang = document.getElementById('sidebarChangeLanguage');
if (sidebarLang) {
sidebarLang.setAttribute('style', 'height: 3.5em !important; background: unset!important; height: 5vh !important; font-size: 1.25em !important;');
const langChildren = sidebarLang.children;
for (let i = 0; i < langChildren.length; i++) {
langChildren[i].style.height = '50%';
}
}
const levelMission = document.getElementById('levelMission');
if (levelMission) levelMission.style.fontSize = '1.25em';
const currRankText = document.getElementById('currRankText');
if (currRankText) currRankText.style.fontSize = '1.25em';
const timerLimits = document.getElementById('timerLimits');
if (timerLimits) {
timerLimits.style.fontSize = '1.25em';
timerLimits.style.height = '5vh';
}
const numero5 = document.getElementById('numero5');
if (numero5) numero5.style.height = '5vh';
const userName = document.getElementById('userName');
if (userName) userName.style.fontSize = '1.5em';
const consumableOl = document.querySelector('#consumable > ol');
if (consumableOl) {
consumableOl.setAttribute('style', 'height: 10vh;');
const consumableLi = document.querySelectorAll('#consumable > ol > li');
consumableLi.forEach(function(li) {
li.setAttribute('style', 'font-size: 5em !important; height: 10vh;');
});
}
const consumableInput = document.querySelector('#consumable > form > input');
if (consumableInput) {
consumableInput.setAttribute('style', 'font-size: 2em !important;');
}
userMenu.setAttribute('style', 'padding-left: 0 !important; padding-right: 0 !important; font-size: 1.5em;');
userMenu.classList.add('userMenu-mobile');
};
}
});
</script>
<script>
var gameRoomSoundTest = Boolean('');
var isSoundMutedInDatabase = 'false';
var isHideNavbar = 'false';
</script>
<script src="//vara.e-sim.org/cdn/static/js/soundManager.js?v=1"></script>
<!-- <link rel="stylesheet" href="//cdn.jsdelivr.net/jquery.sidr/2.2.1/stylesheets/jquery.sidr.dark.min.css"> -->
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/sidr/2.2.1/jquery.sidr.min.js"></script> -->
<div id="esim-layout" class="foundation-style column-margin-both column-margin-vertical column small-8 foundation-text-center no-style">
<link href="//vara.e-sim.org/cdn/static/css/modules/frontPage.css?v=0002" type="text/css" rel="stylesheet">
<style>
.tabs [id^="tabs-"] {
display: none;
padding: .5em;
}
.tabs [id^="tabs-"].active {
display: block;
}
.frontPage {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.5em;
}
.mobile .frontPage {
grid-template-columns: 1fr;
font-size: 1.25em;
}
.mobile .frontPage .muOrders {
zoom: 2;
}
.mobile .frontPage .topSubsidedBattle {
font-size: 1em;
width: 99%;
}
.mobile .frontPage .topSubsidedBattle :is(.changingColor, .attackersPercent, .defendersPercent) {
font-size: 1.5em !important;
}
.mobile .frontPage :is(.mobile_article_preview_width_fix) {
font-size: 0.75em !important;
}
.mobile .frontPage .articleTitle {
font-size: 1em;
}
.mobile .frontPageContainer .articleContainer > div:nth-of-type(2) {
font-size: 1em;
}
.mobile .frontPage .mobilePostShout {
overflow: hidden;
border: 1px solid black;
box-shadow: black 0px 0px 3px inset;
border-radius: 4px 4px 0px 0px;
margin-bottom: -5px;
padding: 5px;
display: block;
height: 10vw !important;
width: 97%;
}
.mobile .frontPage #togableShout {
height: 100%;
}
.mobile .frontPage .mobilePostShout label span {
zoom: 2;
}
.mobile .frontPage .mobilePostShout #shoutButton {
width: unset !important;
margin: 0 auto;
}
.mobile .frontPage .mobilePostShout textarea {
width: 98% !important;
height: 150px !important;
margin: 0 auto;
}
.frontPageContainer {
border: 2px solid grey;
border-radius: 0.5em;
margin: 0 auto !important;
width: 99%;
filter: drop-shadow(2px 4px 4px black);
}
.frontPageContainer ul::after,
.frontPageContainer ul::before {
display: none;
}
.frontPageContainer :is(.ui-tabs-panel) {
background: unset !important;
}
.frontPageContainer :is(.ui-widget-header) {
background: #00000052 !important;
}
.frontPageContainer ul:not(#dailyButton) > li > a {
font-size: 0.75em !important;
padding: 0.625em 0.25em;
text-decoration: none;
display: block;
font-weight: bold;
}
.frontPageContainer .articleHeaderContent {
height: unset;
}
.frontPageContainer ul:not(#dailyButton) > li {
margin: 0;
background: linear-gradient(1deg, #6b6b6b, #b9b9b9);
text-shadow: 0 -1px 1px #222;
border: 2px solid black;
border-radius: 0.5em;
padding: 0.25em 0;
box-shadow: inset 0px -1px 1px 2px #414141, inset 0px 2px 2px white;
transition: background 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.mobile .frontPageContainer ul:not(#dailyButton) > li {
border-radius: 0.375em;
}
.frontPageContainer ul:not(#dailyButton) > li:hover {
background: linear-gradient(1deg, #5a5a5a, #a3a3a3);
box-shadow: inset 0px -1px 1px 2px #333333, inset 0px 2px 2px #dcdcdc;
}
.frontPageContainer ul .ui-state-active :is(a, a:link, a:visited) {
color: floralwhite;
width: 100%;
box-sizing: border-box !important;
}
.frontPageContainer li :is(a, a:link, a:visited) {
color: white;
width: 100%;
box-sizing: border-box !important;
}
.frontPageContainer .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
background: linear-gradient(1deg, #3d4b6d, #80a0c5) !important;
box-shadow: inset 0px -1px 1px 2px #28233b, inset 0px 2px 2px white !important;
}
.frontPageContainer > ul {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
border: 2px solid black;
padding: 0.1em !important;
box-shadow: inset 0px 2px 2px 2px #0000003d;
list-style-type: none;
margin: 0.25em auto;
}
.frontPageContainer .fpInfoBox {
width: 100%;
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
box-sizing: border-box !important;
height: auto !important;
padding: 0.5em !important;
}
.frontPageContainer .mainHeader {
font-weight: bold;
font-size: 1.25em;
text-shadow: none;
display: flex;
align-items: center;
justify-content: center;
padding: 0.25em;
}
.fpInfoBox.newIndex {
position: relative;
padding: 1em;
border: 2px solid grey;
border-radius: 0.5em;
height: auto;
color: #080808;
margin: 0 auto;
filter: drop-shadow(2px 4px 4px black);
}
.frontPageContainer .battleContainer:not(.topSubsidedBattle) {
box-sizing: border-box !important;
position: relative;
padding: 1em;
border: 2px solid white;
font-size: 0.75em !important;
margin-bottom: 0.5em;
box-shadow: 0px 3px 10px 0px rgb(0 0 0 / 50%);
border-radius: 1em;
}
.mobile .frontPageContainer .battleContainer:not(.topSubsidedBattle) {
padding: 0.5em 1em;
row-gap: 0.75em;
}
.frontPageContainer :is(.battleDefender, .battleAttacker):not(.topSubsidedBattle) {
width: 60px !important;
height: 40px !important;
}
.mobile .frontPageContainer :is(.battleDefender, .battleAttacker):not(.topSubsidedBattle) {
width: 120px !important;
height: 80px !important;
zoom: 1.25;
}
.frontPageContainer .battleIcon {
width: 20px;
height: 20px;
min-width: unset !important;
}
.frontPageContainer .battleMinitag.battleContainer .battleButton {
padding: 1em 2.5em;
}
.frontPageContainer .mainBar {
height: 2em !important;
}
.mobile .frontPageContainer .mainBar {
height: 1.5em !important;
}
.frontPageContainer .battleBar {
border: 2px solid black;
border-radius: 0.5em;
}
.mobile .frontPageContainer .battleBar {
width: 70%;
}
.mobile .frontPageContainer .battleFooterTimer {
padding: 0 0.5em;
width: 30% !important;
}
.frontPageContainer :is(.defendersPercent, .attackersPercent) {
font-size: 1.5em !important;
}
.mobile .frontPageContainer :is(.defendersPercent, .attackersPercent) {
font-size: 1.25em !important;
padding: 0 0.5em !important;
}
.frontPageContainer .attackersPercent small,
.frontPageContainer .defendersPercent small {
display: none;
}
.frontPageContainer .countdown-amount {
padding-right: 0;
}
.frontPageContainer .defaultModal {
border: none;
box-shadow: none;
}
.frontPageContainer #dailyButton {
padding: 0.25em;
margin: 0.5em auto !important;
}
.frontPageContainer .dailyInfo {
display: none;
}
.frontPageContainer .dailies {
margin: 0 auto !important;
width: 90% !important;
}
.mobile .frontPageContainer .dailies {
font-size: 0.8em !important;
}
.frontPageContainer .missionCenterModal {
min-height: 400px;
}
.frontPageContainer .articleContainer {
padding: 0.5em;
border: 2px solid white;
margin-bottom: 0.5em;
border-radius: 0.75em;
color: white;
text-shadow: 0px 1px 2px black, 0px 1px 2px black, 1px 1px 2px black;
background: url(//vara.e-sim.org/cdn/static/img/bgForElements/articleHeader.jpg);
background-size: 175%;
background-position: center right;
box-shadow: inset 0 0 3px 1px black;
min-height: 54px;
position: relative;
font-weight: bold;
display: flex;
flex-direction: row;
gap: 0.25em;
cursor: pointer;
}
.mobile .frontPageContainer .articleContainer {
min-height: 110px;
padding: 0.25em;
}
.frontPageContainer .smallArticleTab {
zoom: 0.8;
filter: drop-shadow(2px 2px 3px #000000ba);
background: linear-gradient(0deg, #575046, blanchedalmond);
box-shadow: inset 0px 0px 2px 2px antiquewhite;
font-weight: bold;
align-self: flex-start
}
.mobile .frontPageContainer .smallArticleTab {
width: 8%;
line-height: 2.25em;
}
.frontPageContainer .articleContainer > a {
color: white;
}
.frontPageContainer .articleContainer > div:nth-of-type(2) {
font-size: 0.75em;
color: lightgray;
background: #00000070;
padding: 0.25em 0.75em;
border-radius: 0.5em;
}
.frontPageContainer .articleTitle {
color: deepskyblue !important;
text-align: left;
}
.frontPageContainer .newShout {
padding: 0.5em;
border: 2px solid white;
margin-bottom: 0.5em;
border-radius: 1em;
color: white;
text-shadow: 0px 1px 2px black, 0px 1px 2px black, 0px 1px 2px black;
background: url(//vara.e-sim.org/cdn/static/img/bgForElements/newShoutBg.jpg);
background-size: 120%;
background-position: center;
box-shadow: inset 0 0 3px 1px black;
font-size: 0.8em;
min-height: 76px;
}
.frontPageContainer .voteLink {
background: #00000070 !important;
border: 1px solid white;
left: 12%;
outline: 1px solid grey !important;
color: white !important;
text-shadow: none;
}
.mobile .frontPageContainer .voteLink {
left: 12.5%;
border: 3px solid white;
outline: 3px solid grey !important;
}
.mobile .frontPageContainer .voteLink > img {
zoom: 2;
}
.frontPageContainer .shoutAuthor > span {
zoom: 0.75;
}
.frontPageContainer .shoutAuthor {
display: flex;
justify-content: center;
align-items: center;
}
.frontPageContainer .shoutImage {
zoom: 0.75;
}
.mobile .frontPageContainer .shoutImage {
zoom: 2;
}
.frontPageContainer.shoutModerator,
.frontPageContainer.shoutFundraiser,
.frontPageContainer.shout2 {
width: 89% !important;
}
.frontPageContainer .newTourney {
box-sizing: border-box !important;
position: relative;
padding: 1em 0.25em !important;
border: 2px solid white;
font-size: 0.75em;
margin-bottom: 1em;
filter: none;
border-radius: 1em;
width: 97%;
background-size: cover;
background-position: center;
min-height: 120px !important;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
}
.mobile .frontPageContainer .newTourney {
background-size: cover;
background-position: center;
min-height: 250px !important;
margin-bottom: 0.5em;
}
.mobile .frontPageContainer .fpInfoBoxWhiteFrame {
font-size: 1.125em !important;
position: unset !important;
border-radius: 0.5em;
margin-top: 2em !important;
}
.mobile .frontPageContainer {
font-size: 3em;
}
.mobile #mobileFundraisingInfobox {
height: 260px !important;
margin-top: 1em;
}
.mobile frontPageContainer .eventsContainer .event .indexEvent > div > span {
bottom: 8%;
position: absolute;
right: 2%;
}
.mobile .frontPageContainer .battleButton {
padding: 0.75em 2em !important;
border-radius: 0.5em !important;
}
.mobile .dailyMissionsContainer .missionCenterModal .daily.finished {
grid-template-columns: 0.15fr 0.75fr 0.25fr !important;
}
.mobile .mobileElectionsDiv {
font-size: 2.5em;
width: 99% !important;
max-width: unset;
box-sizing: border-box !important;
}
.frontPageContainer .articleCreator {
display: flex;
flex-direction: row;
gap: 0.25em;
font-size: 0.9em;
align-items: center;
}
.frontPageContainer .articleCreator > div {
zoom: 0.75;
}
.frontPageContainer .articleCreator > a {
color: #8ad3ff;
}
.mobile .frontPageContainer .articleCreator > a {
font-size: 0.75em;
}
.topSubsidedBattle.newIndexSub .battleGrid {
margin: 0 !important;
}
.mobile .topSubsidedBattle.newIndexSub .battleGrid {
width: 99% !important;
}
.topSubsidedBattle.newIndexSub .battleParticipants {
width: 396px !important;
}
.mobile .topSubsidedBattle.newIndexSub .battleParticipants {
width: 100% !important;
}
.mobile .topSubsidedBattle.newIndexSub .ribbon-right {
zoom: 3;
right: -1px;
top: -1px;
}
.frontPageContainer .muTourneyBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/militaryUnit.jpg') !important;
}
.frontPageContainer .leagueBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/league.jpg') !important;
}
.frontPageContainer .tncBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/teamNationalCup.jpg') !important;
}
.frontPageContainer .ttBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/team.jpg') !important;
}
.frontPageContainer .ctBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/cup.jpg') !important;
}
.frontPageContainer .wwBanner {
z-index: 5;
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/worldWar.jpg') !important;
padding-top: 4em !important;
}
.frontPageContainer .rwBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/resistanceWar.png') !important;
}
.frontPageContainer .countryTourneyBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/country.jpg') !important;
background-position: bottom; !important;
}
.frontPageContainer .raceBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/race.jpg') !important;
}
.frontPageContainer .gravityBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/gravityGame.jpg') !important;
}
.frontPageContainer .duelBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/duel.jpg') !important;
}
.frontPageContainer .evilBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/tournaments/evilGame.jpg') !important;
}
.frontPageContainer .warzoneBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/warzone.jpg') !important;
}
.frontPageContainer .cwBanner {
background-image: url('//vara.e-sim.org/cdn/static/img/events/civilwar.jpg') !important;
}
.frontPageContainer .tourneyHeader {
font-size: 1.75em;
background: #000000c7;
border-radius: 0.25em;
padding: 0.25em 0.5em;
color: white;
text-shadow: none;
position: absolute;
top: 1%;
box-shadow: -2px 2px 5px 0px #0008;
}
.mobile .frontPageContainer .tourneyHeader {
font-size: 1.5em;
}
.frontPageContainer .tourneyIcon {
vertical-align: middle;
font-size: 0.8em;
}
.mobile .frontPageContainer .tourneyIcon {
vertical-align: unset;
}
.frontPageContainer .wwFlex {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
gap: 0.5em;
}
.mobile .frontPageContainer .wwFlex {
margin-top: 0 !important;
}
.frontPageContainer .wwFlags {
display: flex;
align-items: center;
width: 100%;
justify-content: space-evenly;
}
.mobile .frontPageContainer .wwFlags img {
zoom: 2;
}
.frontPageContainer .alliesLinkContainer:hover .wwAliesTooltip {
display: block !important;
}
.frontPageContainer .wwAliesTooltip {
position: absolute;
display: none;
width: 190px;
padding: 0.25em 1em;
background: rgb(0 0 0 / 91%);
color: white;
z-index: 99;
text-align: left;
border: 2px solid grey;
border-radius: 0.5em;
box-shadow: black 2px 2px 4px;
text-shadow: none;
overflow-y: auto;
height: 175px;
}
.frontPageContainer .wwAliesTooltip.left {
left: 0px;
}
.frontPageContainer .wwAliesTooltip.right {
right: 0px;
}
.frontPageContainer .wwAliesTooltip::-webkit-scrollbar {
width: 8px;
}
.frontPageContainer .wwAliesTooltip::-webkit-scrollbar-thumb {
background-color: #888;
border-radius: 4px;
}
.frontPageContainer .wwAliesTooltip::-webkit-scrollbar-thumb:hover {
background-color: #555;
}
.frontPageContainer .newShoutForm {
font-size: 1em;
filter: none;
width: 96%;
border-radius: 0.5em;
padding: 0.5em;
margin: 0.25em auto;
}
.mobile .frontPageContainer .newShoutForm {
width: 96%;
}
.frontPageContainer .shoutTextArea {
height: 60px;
font-size: 0.8em;
border-radius: 0.5em;
}
.mobile .frontPageContainer .shoutTextArea {
height: 170px;
font-size: 0.5em;
}
.frontPageContainer #frontPageShouts__frontPageCharactersRemaining,
.frontPageContainer .charsRemaining {
font-size: 0.75em !important;
}
/*.mobile .frontPageContainer #frontPageShouts__frontPageCharactersRemaining,*/
/*.mobile .frontPageContainer .charsRemaining {*/
/*font-size: 0.5em !important;*/
/*}*/
.frontPageContainer .shoutContainer {
margin-bottom: 0.35em;
filter: none;
width: 96% !important;
padding: 0.5em;
gap: 0.25em;
}
.mobile .frontPageContainer .shoutContainer {
padding: 0.25em !important;
width: 98% !important;
}
.frontPageContainer .shoutAuthor {
font-size: 0.75em;
}
.frontPageContainer .shoutContent {
padding: 0.25em;
font-size: 0.8125em;
}
.frontPageContainer .shoutAvatar {
width: 30px;
height: 30px;
}
.mobile .frontPageContainer .shoutAvatar {
zoom: 2 !important;
border-radius: 0.125em;
}
.frontPageContainer .shout2,
.frontPageContainer .shoutModerator {
padding: 0.25em !important;
}
.mobile .frontPageContainer .shout2,
.mobile .frontPageContainer .shoutModerator {
max-width: 100% !important;
width: 100% !important;
gap: 0.25em;
}
.frontPageContainer #dailyButton > li > a {
display: flex;
align-items: center;
justify-content: center;
padding: 0.75em 0.25em !important;
}
.mobile .frontPageContainer #dailyButton > li > a {
width: 12vw !important;
padding: 0.5em !important;
}
.mobile .frontPageContainer #dailyButton i {
font-size: 1.5em !important;
}
.electionsBanner {
background: url(//vara.e-sim.org/cdn/static/img/bgForElements/electionsBanner.png);
background-size: cover;
background-position: center;
color: white !important;
text-shadow: 1px 1px 2px black, 0px 0px 3px black;
font-size: 1.25em;
font-weight: bold;
text-transform: uppercase;
}
.electionsBanner > a {
background: #00000057;
border-radius: 0.5em;
color: #79e742;
}
</style>
<link href="//vara.e-sim.org/cdn/static/css/modules/battleMiniTag.css?v=0001" type="text/css" rel="stylesheet">
<div id="fb-root"></div>
<div class="frontPage">
<div id="left-column" class="d-flex flex-column align-center gap-1">
<style>
.askForEmail-fpInfoBoxColor {
background: #3d636f;
min-height: 91px;
display: flex;
justify-content: center;
align-items: center;
}
.askForEmail-fpInfoBoxSecond {
position: relative;
padding: 20px 10px 20px;
border: 1px solid #333;
border-radius: 5px;
}
.askForEmail-fpInfoBlueBox {
background: rgba(33, 43, 49, .90) !important;
text-shadow: none !important;
color: #fff !important;
font-weight: normal !important;
font-size: 60px !important;
float: left;
border: 2px solid #ffdb1a;
margin: 0 auto !important;
border-radius: 5px;
}
.mobile #ask_for_email {
width: 100vw !important;
max-width: 100% !important;
height: 16em !important;
display: flex;
justify-content: center;
align-items: center;
font-size: 2.7em !important;
}
.mobile .frontPage #ask_for_email {
font-size: 1.7em !important;
max-width: 100%;
}
.askFromEmail-ask_for_email_msg {
font-size: 1.5em !important;
color: rgb(242, 242, 242) !important;
text-shadow: 0 0 0.1px #243b42 !important;
}
.askFromEmail-ask_for_email_msg:before {
content: "";
font-size: 1.5em !important;
color: rgb(242, 242, 242) !important;
text-shadow: 0 0 0.1px #243b42 !important;
}
.askFromEmail-input {
height: 2.5em;
border-radius: 3px;
border: solid 1px #000;
}
.askFromEmail-mailIcon {
text-shadow: 0 0 2px #22393f !important;
}
@keyframes mailAnimation {
from {
background-position: 0 0;
}
to {
background-position: -100px -100px;
}
}
.askForEmail-mailAnimation {
animation: mailAnimation 3s infinite linear;
background: repeating-linear-gradient(-45deg, #212b31, #88a0b0 50px, #b6c5cf 70px, #5e7b8d 80px, #212b31 100px, #212b31 142px);
background-size: 7070px 700px;
border-radius: 5px;
padding: 2px;
}
#ask_for_email_body {
text-align: center;
padding: 0 2px 7px;
}
#front_page_email_send {
transition: all 0.5s;
}
#front_page_email_send:hover {
cursor: pointer;
background: #2ba6cb;
}
</style>
<div class="askForEmail-mailAnimation">
<div id="ask_for_email" class="fpInfoBlueBox fpInfoBoxSecond">
<div id="ask_for_email_body">
<div id="ask_for_email_msg" class="askFromEmail-ask_for_email_msg">
<b>Únete a nosotros!</b>
<br>
Ingresa tu correo electrónico para evitar perder tu cuenta! También recibirás códigos promocionales y novedades en el futuro.!
</div>
<br>
<input type="text" id="front_page_email" class="askFromEmail-input">
<button id="front_page_email_send" type="button" class="foundation-style button" disabled>Unirse!</button>
</div>
</div>
</div>
<script>
let successText = `
<div id="ask_for_email_msg" class="askFromEmail-ask_for_email_msg">
Gracias por unirte a nosotros!
</div>
`;
let textEmailBox = document.getElementById('front_page_email');
let textEmailButton = document.getElementById('front_page_email_send');
function validateEmail(email) {
let re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
}
let writingValidationTimeout;
textEmailBox.addEventListener('input', function() {
clearTimeout(writingValidationTimeout);
writingValidationTimeout = setTimeout(function() {
textEmailButton.disabled = !validateEmail(textEmailBox.value);
}, 100);
});
$("#front_page_email_send").on('click', function(e) {
e.preventDefault();
this.disabled = true;
const that = this;
$.post("editCitizen.html", { 'askForEmail': "true", 'mail': $("#front_page_email").attr('value') }).
success(function(data) {
if (data.startsWith("Success")) {
const extraRespone = successText + `<div class="askFromEmail-ask_for_email_msg">Revisa tus mensajes para obtener el código.</div>`;
$("#ask_for_email_body").html(extraRespone);
that.remove();
} else {
$("#ask_for_email_msg").html(successText);
that.disabled = false;
}
}).
error(function() {
$("#ask_for_email_msg").html("Whoops! Something went wrong.");
that.disabled = false;
});
});
</script>
<style>
.indexBanners {
/*container: indexBanners / inline-size;*/
display: flex;
flex-direction: column;
gap: 0.5em;
filter: drop-shadow(2px 4px 4px black);
width: 100% !important;
/*grid-template-columns: repeat(auto-fill, minmax(0, 1fr));*/
/**/
/*.myBanner {*/
/*width: 50% !important;*/
/**/
/*}*/
}
.indexBanners :is(.triviaText, .gameText) {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 0;
background-size: cover !important;
background:url('//vara.e-sim.org/cdn/static/img/discordGame.jpg') 0 no-repeat;
height: 135px;
}
.indexBanners :is(.triviaDescription, .gameDescription) {
padding: 10px;
font-size: 1.5em;
color: black;
font-weight: bold;
background-color: rgba(255, 255, 255, 1);
border-radius: 0.25em;
border: 2px solid black;
box-shadow: 2px 2px 6px black;
}
.indexBanners :is(#startTriviaForm, #startGameForm) {
margin-bottom: 0;
transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}
.indexBanners :is(#startTrivia:hover, #startGame:hover) {
background:#53a7ea !important;
}
.indexBanners :is(.triviaCountdown, .gameCountdown) {
color: #090;
font-size: 20px;
font-weight: 800;
}
.indexBanners .promotionsContainer {
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/promoBanner.jpg);
background-size: cover;
height: fit-content;
min-height: 75px;
background-position: center;
border-radius: 0.5em;
border: 2px solid grey;
background-color: unset;
width: 99%;
margin: 0 auto;
box-shadow: none;
padding: 0.5em 0;
}
.mobile .indexBanners .promotionsContainer {
height: fit-content;
min-height: 150px;
}
.mobile .indexBanners .promotionDescription {
max-width: unset;
}
.indexBanners .promotionText {
display: grid;
grid-template-columns: 1fr 0.5fr;
color: white;
text-shadow: 1px 1px 2px black;
font-weight: bold;
padding-bottom: 0;
filter: drop-shadow(2px 4px 4px black);
}
.mobile .indexBanners .promotionText {
font-size: 3em;
}
.mobile .indexBanners .countdown-amount {
font-size: 1em !important;
}
.indexBanners .promotionCountdown {
width: unset;
color: yellowgreen;
padding: 0.25em;
border: 2px solid darkslategrey;
background-color: #000000b8;
filter: drop-shadow(2px 4px 4px black);
}
.indexBanners .rebelsWeek > div {
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/rebelsWeekBanner.jpg);
}
.indexBanners .sailorsWeek > div {
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/sailorsWeekBanner.jpg);
}
.mobile .indexBanners .sailorsWeek > div {
background-position: bottom;
}
.indexBanners .promotionCountdown > span {
padding-right: 0;
}
.indexBanners :is(.gameText, .triviaText) {
background-size: cover;
background-position: center;
border: 2px solid grey;
border-radius: 0.5em;
width: 99%;
height: 75px;
min-height: 75px;
padding: 0.25em 0;
}
.mobile .indexBanners :is(.gameText, .triviaText) {
height: fit-content;
min-height: 150px;
font-size: 2.5em;
}
.indexBanners .gameText {
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/textGameBanner.jpg);
}
.indexBanners .triviaText {
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/triviaBanner.jpg);
}
.indexBanners .endServerInfo {
height: 75px;
min-height: 75px;
border-radius: 0.5em;
border: 2px solid grey;
background-color: unset;
width: 99% !important;
margin: 0 auto !important;
background-position: bottom;
color: white;
font-weight: bold;
text-shadow: 1px 1px 2px black, 2px 2px 5px black;
padding: 0.25em 0;
background-image: url(//vara.e-sim.org/cdn/static/img/bgForElements/serverEndBanner.jpg);
}
.mobile .indexBanners .endServerInfo {
font-size: 2.5em;
height: 150px;
}
.indexBanners .endServerInfo > span,
.indexBanners .endServerInfo #endServerTimer {
filter: drop-shadow(2px 4px 4px black);
}
.indexBanners .rebelAndSailorDate {
display: flex;
flex-direction: row;
gap: 1em;
justify-content: space-around;
width: 100%;
}
.indexBanners .rebelAndSailorBanner {
padding: 0.25em 0 !important;
height: 100px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
background-size: cover;
background-position: center;
color: white;
text-shadow: 1px 1px 2px black, 0px 0px 4px black;
font-size: 1.2em;
}
.rebelAndSailorBanner #rebelsWeekTimer,
.rebelAndSailorBanner #sailorsWeekTimer{
font-size: 1.25em;
color: yellow;
}
.mobile .indexBanners .rebelAndSailorBanner {
height: unset;
min-height: 200px;
font-size: 3em;
}
.mobile #sailorsWeekText > b {
font-size: 1.5em !important;
}
.indexBanners :is(.sailorsWeekTimer, .rebelsWeeksTimer) {
font-size: 1.5em;
color: yellowgreen;
font-weight: bold;
text-shadow: 1px 1px 6px black, 0px 0px 10px black;
}
</style>
<div class="indexBanners">
</div>
<div class="dailyTasksContainer tabs frontPageContainer bg-dark foundation-style darkform">
<div class="mainHeader"><i class="icon-trophy"></i>Tareas diarias:</div>
<ul>
<li><a href="#tabs-14">Tareas</a></li>
<li><a href="#tabs-15">Misiones</a></li>
</ul>
<div id="tabs-14" class="p-025">
<ul id="dailyButton" style="position:relative" class="show-more-list animBreath2 button foundation-center foundation-style-group fadeIn">
<li id="taskButtonFight" class="show-more-item"><a class="button foundation-style smallhelp only-icon profileButton" title="Lucha" href="battles.html?countryId=26&filter=PRACTICE_BATTLE"><i class="icon-scope"></i></a></li>
<li id="taskButtonAvatar" class="show-more-item"><a class="button foundation-style smallhelp only-icon profileButton" title="Subir avatar" href="editCitizen.html?id=192465"><i class="icon-user-cog"></i></a></li>
<li id="taskButtonDaily" class="task-item" onclick="MissionCenterModal.showModal(this);">
<a class="button foundation-style smallhelp only-icon profileButton d-flex justify-center align-center" title="Misiones diarias">
<div class="missionCenterIcon">
<i class="icon-calendar-alt-regular p-0"></i>
</div>
</a>
</li>
</ul>
</div>
<div id="tabs-15" class="dailyMissionsContainer">
<script>
(function() {
function initMissionCenterModal() {
if (typeof MissionCenterModal === "undefined") return;
MissionCenterModal.showModalInContainer();
setTimeout(function() {
MissionCenterModal.addOpenModalEventToDailiesOnNewIndex();
}, 1500);
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initMissionCenterModal);
} else {
initMissionCenterModal();
}
})();
</script>
</div>
</div>
<div id="newsTabs" class="frontPageContainer darkform bg-dark tabs foundation-style">
<div class="mainHeader"><i class="icon-news"></i>Noticias</div>
<ul class="hidden">
<li><a href="#tabs-2">El último</a></li>
</ul>
<div id="tabs-2" class="ui-tabs ui-tabs-panel">
<div class="articleContainer" onmousedown="Utils.sendReloadContentAjax('article?id=78', event)">
<div class="smallArticleTab">15</div>
<div class="articleHeaderContent">
<a href="#" onmousedown="Utils.sendReloadContentAjax('article?id=78&THE_HIDDEN_COST_OF_WAR', event)" class="articleTitle">
THE HIDDEN COST OF WAR
</a>
<div class="articleDateAut d-flex flex-row gap-1 align-center">
<div class="articleCreator d-flex flex-row align-center gap-05">
<div class="xflagsSmall xflagsSmall-Sweden"></div>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=98569', event)" class="">
<span>Maximus Decimus Meridius</span>
</a>
</div>
<div class="mobile_article_preview_width_fix">
1 día atrás
</div>
</div>
</div>
</div>
<div class="articleContainer" onmousedown="Utils.sendReloadContentAjax('article?id=77', event)">
<div class="smallArticleTab">18</div>
<div class="articleHeaderContent">
<a href="#" onmousedown="Utils.sendReloadContentAjax('article?id=77&IS_THIS_REALLY_THE_FINAL_STATE_', event)" class="articleTitle">
IS THIS REALLY THE FINAL STATE?
</a>
<div class="articleDateAut d-flex flex-row gap-1 align-center">
<div class="articleCreator d-flex flex-row align-center gap-05">
<div class="xflagsSmall xflagsSmall-Sweden"></div>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=98569', event)" class="">
<span>Maximus Decimus Meridius</span>
</a>
</div>
<div class="mobile_article_preview_width_fix">
3 días atrás
</div>
</div>
</div>
</div>
<div class="articleContainer" onmousedown="Utils.sendReloadContentAjax('article?id=76', event)">
<div class="smallArticleTab">25</div>
<div class="articleHeaderContent">
<a href="#" onmousedown="Utils.sendReloadContentAjax('article?id=76&The_current_state_of_the_server_is_becoming_impossible_to_ignore_', event)" class="articleTitle">
The current state of the server is b[..]
</a>
<div class="articleDateAut d-flex flex-row gap-1 align-center">
<div class="articleCreator d-flex flex-row align-center gap-05">
<div class="xflagsSmall xflagsSmall-Sweden"></div>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=98569', event)" class="">
<span>Maximus Decimus Meridius</span>
</a>
</div>
<div class="mobile_article_preview_width_fix">
5 días atrás
</div>
</div>
</div>
</div>
<div style="text-align: center"><a href="news.html?newsType=LATEST_ARTICLES" style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;">Mostrar más artículos</a></div>
</div>
</div>
<div id="shoutTabs" class="frontPageContainer darkform bg-dark tabs foundation-style mobileTabs">
<div class="mainHeader"><i class="icon-bubbles-2"></i>Shouts</div>
<ul>
<li><a href="#tabs-10">Global</a></li>
<li><a href="#tabs-11">País</a></li>
</ul>
<div id="tabs-10">
<style>
.newShoutForm {
background: url(//vara.e-sim.org/cdn/static/img/bgForElements/newShoutBg.jpg);
background-size: 120%;
background-position: center;
border: 2px solid grey;
box-shadow: inset 0 0 3px 1px black;
filter: drop-shadow(2px 2px 4px black);
padding: 1em;
border-radius: 0.5em;
width: 72%;
font-size: 1.25em;
margin: 0.5em auto;
}
.mobile .newShoutForm {
width: 93%;
}
.shoutTextArea {
width: 100%;
height: 80px;
resize: none;
border-radius: 0.5em;
}
.mobile .shoutTextArea {
height: 120px;
touch-action: manipulation;
font-size: 16px;
}
#frontPageShouts__frontPageCharactersRemaining,
.charsRemaining {
font-size: 1em !important;
}
.mobile #frontPageShouts__frontPageCharactersRemaining,
.mobile .charsRemaining {
font-size: 0.75em !important;
}
.newShoutForm p,
.newShoutForm span {
margin: 0;
}
</style>
<form action="shoutActions.html" method="POST" class="newShoutForm" id="command" >
<input value="POST_SHOUT_AJAX" type="hidden" name="action"/>
<div class="d-flex flex-row gap-1 align-center justify-center">
<div class="w-80">
<textarea name="body" maxlength="201" class="shoutTextArea"></textarea>
<span id="frontPageShouts__frontPageCharactersRemaining" class="black" style="text-shadow: none">Caracteres restantes:</span>
<p style="font-size:0.8125em;display:inline;text-shadow: none " class="charsRemaining black">201</p>
</div>
<button id="shoutButton"
class="btn-buy"
type="button"
style="padding: 0.75em 1.5em;"
onclick="postShout(this)">
<span>Enviar</span>
</button>
</div>
<div class="mobileShoutBtns hidden">
<span>Mostrar en: </span>
<input type="checkbox" checked="checked" id="shoutCheck1" name="sendToCountry"/>
<label for="shoutCheck1" style="color:#f2f2f2;">
País
</label>
<input type="checkbox" checked="checked" id="shoutCheck2" name="sendToMilitaryUnit"/>
<label for="shoutCheck2" style="color:#f2f2f2;">
Unidad militar
</label>
<input type="checkbox" checked="checked" id="shoutCheck3" name="sendToParty"/>
<label for="shoutCheck3" style="color:#f2f2f2;">
Partido
</label>
<input type="checkbox" checked="checked" id="shoutCheck4" name="sendToFriends"/>
<label for="shoutCheck4" style="color:#f2f2f2;">
Amigos
</label>
</div>
<script>
async function postShout(button) {
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
const params = new URLSearchParams({
action: button.form.action.value,
body: button.form.body.value,
sendToCountry: button.form.sendToCountry.value,
sendToMilitaryUnit: button.form.sendToMilitaryUnit.value,
sendToParty: button.form.sendToParty.value,
sendToFriends: button.form.sendToFriends.value,
isLocal: window.location.search.includes("isLocal") || button.form.parentNode.dataset.local,
});
try {
const response = await fetch('shoutActions.html', {
method: "POST",
body: params,
});
if (!response.ok) {
throw new Error("HTTP error! status: " + response.status);
}
const data = await response.text();
$(button.form.nextElementSibling).replaceWith(data);
} catch (error) {
console.error('Error loading content:', error);
} finally {
setTimeout(() => {Loader.removeLoading(button, commonLoaderSettings.loaderClass)}, 250);
button.form.body.value = '';
}
}
</script>
</form>
<div class="newShoutBox fadeIn">
<div class="shoutContainer p-relative">
<img class="citizenAvatar shoutAvatar" alt="GrootSK Avatar" src="https://vara.e-sim.org/cdn/avatarsVara/1888_small">
<div id="shout2114" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor ">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-Sweden"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=159575', event)" class="">
<span class="premiumStar">★</span>
<span>GrootSK</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>1 minute ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="2114" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies2114" style="color:lightgrey;">0</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes2114" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="2114">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦
🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦
🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦
🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨
🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨
🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦
🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦
🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦<br/>🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦<br/>🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦<br/>🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨<br/>🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨🟨<br/>🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦<br/>🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦<br/>🟦🟦🟦🟨🟨🟦🟦🟦🟦🟦🟦🟦
</div>
</div>
<div id="shoutComments2114" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenEmptyAvatar shoutAvatar" alt="Kamari King Avatar" src="https://cdn.e-sim.org/img/avatar/blankAvatar.png">
<div id="shout2112" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor ">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-Turkey"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=159370', event)" class="">
<span>Kamari King</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>28 minutes ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="2112" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies2112" style="color:lightgrey;">1</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes2112" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="2112">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">Aniyohaseyo</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
Aniyohaseyo
</div>
</div>
<div id="shoutComments2112" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenAvatar shoutAvatar" alt="abondares Avatar" src="https://vara.e-sim.org/cdn/avatarsVara/31_small">
<div id="shout2111" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor ">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-Croatia"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=151', event)" class="">
<span class="premiumStar">★</span>
<span>abondares</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>1 hour ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="2111" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies2111" style="color:lightgrey;">0</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes2111" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="2111">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">mission</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
mission
</div>
</div>
<div id="shoutComments2111" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenAvatar shoutAvatar" alt="Dallas Hester Avatar" src="https://vara.e-sim.org/cdn/avatarsVara/2079_small">
<div id="shout2110" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor ">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-India"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=192314', event)" class="">
<span>Dallas Hester</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>2 hours ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="2110" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies2110" style="color:lightgrey;">0</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes2110" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="2110">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">I won from pakistan
</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
I won from pakistan<br/>
</div>
</div>
<div id="shoutComments2110" class="shoutComments grid-col-span w-100 black"></div>
</div>
</div>
<a style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;" href="shouts.html">Más shouts</a>
</div>
<div id="tabs-11" data-local="true">
<style>
.newShoutForm {
background: url(//vara.e-sim.org/cdn/static/img/bgForElements/newShoutBg.jpg);
background-size: 120%;
background-position: center;
border: 2px solid grey;
box-shadow: inset 0 0 3px 1px black;
filter: drop-shadow(2px 2px 4px black);
padding: 1em;
border-radius: 0.5em;
width: 72%;
font-size: 1.25em;
margin: 0.5em auto;
}
.mobile .newShoutForm {
width: 93%;
}
.shoutTextArea {
width: 100%;
height: 80px;
resize: none;
border-radius: 0.5em;
}
.mobile .shoutTextArea {
height: 120px;
touch-action: manipulation;
font-size: 16px;
}
#frontPageShouts__frontPageCharactersRemaining,
.charsRemaining {
font-size: 1em !important;
}
.mobile #frontPageShouts__frontPageCharactersRemaining,
.mobile .charsRemaining {
font-size: 0.75em !important;
}
.newShoutForm p,
.newShoutForm span {
margin: 0;
}
</style>
<form action="shoutActions.html" method="POST" class="newShoutForm" id="command" >
<input value="POST_SHOUT_AJAX" type="hidden" name="action"/>
<div class="d-flex flex-row gap-1 align-center justify-center">
<div class="w-80">
<textarea name="body" maxlength="201" class="shoutTextArea"></textarea>
<span id="frontPageShouts__frontPageCharactersRemaining" class="black" style="text-shadow: none">Caracteres restantes:</span>
<p style="font-size:0.8125em;display:inline;text-shadow: none " class="charsRemaining black">201</p>
</div>
<button id="shoutButton"
class="btn-buy"
type="button"
style="padding: 0.75em 1.5em;"
onclick="postShout(this)">
<span>Enviar</span>
</button>
</div>
<div class="mobileShoutBtns hidden">
<span>Mostrar en: </span>
<input type="checkbox" checked="checked" id="shoutCheck1" name="sendToCountry"/>
<label for="shoutCheck1" style="color:#f2f2f2;">
País
</label>
<input type="checkbox" checked="checked" id="shoutCheck2" name="sendToMilitaryUnit"/>
<label for="shoutCheck2" style="color:#f2f2f2;">
Unidad militar
</label>
<input type="checkbox" checked="checked" id="shoutCheck3" name="sendToParty"/>
<label for="shoutCheck3" style="color:#f2f2f2;">
Partido
</label>
<input type="checkbox" checked="checked" id="shoutCheck4" name="sendToFriends"/>
<label for="shoutCheck4" style="color:#f2f2f2;">
Amigos
</label>
</div>
<script>
async function postShout(button) {
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
const params = new URLSearchParams({
action: button.form.action.value,
body: button.form.body.value,
sendToCountry: button.form.sendToCountry.value,
sendToMilitaryUnit: button.form.sendToMilitaryUnit.value,
sendToParty: button.form.sendToParty.value,
sendToFriends: button.form.sendToFriends.value,
isLocal: window.location.search.includes("isLocal") || button.form.parentNode.dataset.local,
});
try {
const response = await fetch('shoutActions.html', {
method: "POST",
body: params,
});
if (!response.ok) {
throw new Error("HTTP error! status: " + response.status);
}
const data = await response.text();
$(button.form.nextElementSibling).replaceWith(data);
} catch (error) {
console.error('Error loading content:', error);
} finally {
setTimeout(() => {Loader.removeLoading(button, commonLoaderSettings.loaderClass)}, 250);
button.form.body.value = '';
}
}
</script>
</form>
<div class="newShoutBox fadeIn">
<div class="shoutContainer p-relative">
<img class="citizenAvatar shoutAvatar" alt="Hoologram Avatar" src="https://vara.e-sim.org/cdn/avatarsVara/327_small">
<div id="shout2101" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor ">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-USA"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=128', event)" class="">
<span class="premiumStar">★</span>
<span>Hoologram</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>12 hours ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="2101" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies2101" style="color:lightgrey;">3</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes2101" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="2101">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">Well well i see what is going on here, someone have to boost its own ego by spending bucks on other players cause he is being a total noob and can't do shiet by himself 🤣 well we all know the ending of it and its only gonna taste much better 🫡</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
Well well i see what is going on here, someone have to boost its own ego by spending bucks on other players cause he is being a total noob and can't do shiet by himself 🤣 well we all know the ending of it and its only gonna taste much better 🫡
</div>
</div>
<div id="shoutComments2101" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenEmptyAvatar shoutAvatar" alt="Isabela Holland Avatar" src="https://cdn.e-sim.org/img/avatar/blankAvatar.png">
<div id="shout1968" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor ">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-USA"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=174520', event)" class="">
<span>Isabela Holland</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>5 days ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="1968" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies1968" style="color:lightgrey;">2</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes1968" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="1968">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">Is there a country older than Egypt?
</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
Is there a country older than Egypt? <br/>
</div>
</div>
<div id="shoutComments1968" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenAvatar shoutAvatar" alt="Lillianna Hawkins Avatar" src="https://vara.e-sim.org/cdn/avatarsVara/1772_small">
<div id="shout1771" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor citizenInactive">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-USA"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=158417', event)" class="citizenInactive">
<span>Lillianna Hawkins</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>10 days ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="1771" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies1771" style="color:lightgrey;">0</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes1771" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="1771">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">I am here again </textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
I am here again
</div>
</div>
<div id="shoutComments1771" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenEmptyAvatar shoutAvatar" alt="Allen Maxwell Avatar" src="https://cdn.e-sim.org/img/avatar/blankAvatar.png">
<div id="shout1740" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor citizenInactive">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-USA"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=152201', event)" class="citizenInactive">
<span>Allen Maxwell</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>11 days ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="1740" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies1740" style="color:lightgrey;">0</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes1740" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="1740">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">Aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaa</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
Aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa aaaaaaa
</div>
</div>
<div id="shoutComments1740" class="shoutComments grid-col-span w-100 black"></div>
</div>
<div class="shoutContainer p-relative">
<img class="citizenAvatar shoutAvatar" alt="Bradley Bryan Avatar" src="https://vara.e-sim.org/cdn/avatarsVara/1714_small">
<div id="shout1730" class="d-flex flex-column gap-25 w-100 shout2"
>
<div class="shoutAuthor citizenInactive">
<div style="padding-bottom: 0;" class="d-flex flex-row align-center gap-05">
<span class="xflagsSmall xflagsSmall-USA"></span>
<a href="#" onmousedown="Utils.sendReloadContentAjax('profile?id=152907', event)" class="citizenInactive">
<span>Bradley Bryan</span>
</a>
</div>
<div class="d-flex flex-row gap-05 align-center">
<b>11 days ago</b>
<div class="shoutEditButtons d-flex flex-row">
<a shoutId="1730" shoutTab="" class="showShoutDetails" href="#">
<font id="totalReplies1730" style="color:lightgrey;">0</font><i class="icon-comment2" style="padding-right: 0;color: white;"></i>
</a>
<div id="votes1730" class="text-align-left" style="display: none;"></div>
<div>
<b>
<a href="#" class="hiddenForm"><i class="icon-exclamation-triangle" style="padding-right: 0;color: white;"></i></a>
</b>
<div style="display: none;">
<form style="display: inline" action="shoutActions.html" method="POST">
<input type="hidden" name="id" value="1730">
<input type="hidden" name="action" value="REPORT_SHOUT">
<textarea name="text" style="height: 45px; width: 260px; display: none;">Indian</textarea>
<input type="submit" value="Send">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="shoutContent">
Indian
</div>
</div>
<div id="shoutComments1730" class="shoutComments grid-col-span w-100 black"></div>
</div>
</div>
<center><a style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;" href="shouts.html?country=26">Más shouts</a></center>
</div>
</div>
</div>
<div id="right-column" class="d-flex flex-column align-center gap-1">
<style>
#slider {
overflow: hidden;
width: 403px !important;
height: 145px !important;
margin: 0 auto !important;
position: relative;
}
#slider ul {
position: relative;
list-style: none;
height: 100%;
width: 2015px;
padding: 0;
margin: 0;
transition: all 750ms ease;
left: 0;
}
.mySlides {
float: left;
width: 403px !important;
height: 145px !important;
margin: 0 auto !important;
}
#slider ul li {
position: relative;
height: 100%;
width: 403px;
float: left;
}
#slider #prev, #slider #next {
width: 35px;
height: 35px;
font-size: 1.15rem;
line-height: 35px;
border-radius: 50%;
text-shadow: 0 0 20px rgba(0, 0, 0, 1);
text-align: center;
color: white;
text-decoration: none;
position: absolute;
top: 75%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
transition: all 150ms ease;
}
#slider #prev:hover, #slider #next:hover {
background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0;
}
#slider #prev {
left: 10px;
}
#slider #next {
right: 10px;
}
.myDots {
position: absolute;
top: 88%;
margin-top: -4px;
left: 45%;
margin-left: -10px;
}
.dot {
cursor: pointer;
height: 7px;
width: 7px;
margin: 0 2px;
background-color: #bbb;
border-radius: 50%;
display: inline-block;
transition: background-color 0.6s ease;
}
.notActive {
display: none;
}
.dot.active, .dot:hover {
background-color: #717171;
}
.events :is(.warZoneTime, .raceStageTime, .evilgameTime, .duelTournamentTime, .gravityTime) {
color: #d93e00;
font-size: 1.1em;
font-weight: 800;
}
.events .pendingText {
color: darkorange;
font-weight: bold;
font-size: 1.1em;
text-shadow: 1px 1px 2px #000000d4, -1px -1px 2px #000000d4, 1px -1px 2px #000000d4, -1px 1px 2px #000000d4, 0px 0px 3px black;
}
.mobile .pendingText,
.mobile .activeText {
text-shadow: 2px 2px 4px #000000d4, -2px -2px 4px #000000d4, 2px -2px 4px #000000d4, -2px 2px 4px #000000d4, 0px 0px 6px black;
}
.events .activeText {
font-weight: bold;
color: limegreen;
font-size: 1.1em;
text-shadow: 1px 1px 2px #000000d4, -1px -1px 2px #000000d4, 1px -1px 2px #000000d4, -1px 1px 2px #000000d4, 0px 0px 3px black;
}
.events #raceEventDiv {
height: 100px;
background-size: 100%;
background-image: url('//vara.e-sim.org/cdn/static/img/bgForElements/race.png');
}
.events #evilgameDiv {
height: 100px;
background-size: 100%;
background-image: url('//vara.e-sim.org/cdn/static/img/banners/evilGameBanner.png');
}
.events .duelTournamentBanner {
margin-top: 2em !important;
}
.events #duelTournamentDiv {
background-image: url('//vara.e-sim.org/cdn/static/img/banners/duelTournamentBanner.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.events #duelTournamentDiv button.btn {
box-sizing: border-box;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: transparent;
border-radius: 0.6em;
cursor: pointer;
display: flex;
align-self: center;
font-size: 1rem;
font-weight: 400;
padding: 0.25em 0.7em;
text-decoration: none;
text-align: center;
text-transform: uppercase;
font-family: "Montserrat", sans-serif;
font-weight: 700;
color: #fff;
background-color: transparent;
/*width: 225px;*/
/*height: 35px;*/
}
.events #duelTournamentDiv :is(button.btn:hover, button.btn:focus) {
color: black;
outline: 0;
}
/*.events #duelTournamentDiv .btn:hover .playGameText {*/
/*-webkit-animation: focus-in-contract 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;*/
/*animation: focus-in-contract 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;*/
/*}*/
.events #duelTournamentDiv button.red {
color: unset;
border-color: rgb(199, 9, 4);
box-shadow: 0 0 40px 40px rgb(121, 24, 7) inset, 0 0 0 0 rgb(121, 21, 12);
}
.events #duelTournamentDiv button.red:hover {
box-shadow: 0 0 40px 40px #de192b inset, 0 0 0 0 #de1a17;
}
.events #duelTournamentDiv button.green {
color: unset;
border-color: rgb(58, 199, 40);
box-shadow: 0 0 40px 40px rgb(16, 121, 1) inset, 0 0 0 0 rgb(16, 121, 1);
}
.events #duelTournamentDiv button.green:hover {
box-shadow: 0 0 40px 40px #28de0c inset, 0 0 0 0 #28de0c;
}
.events #duelTournamentDiv .btn:disabled {
filter: brightness(0.5);
pointer-events: none;
border-color: rgb(255 255 255);
box-shadow: 0 0 40px 40px rgb(159 159 159) inset, 0 0 0 0 rgb(16 121 1);
}
.events #duelTournamentDiv .pending_schedule a table {
margin: 0 auto;
width: 110px;
}
.events #duelTournamentDiv .pending_schedule_container {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
}
.mobile .events #duelTournamentDiv .pending_schedule .dataTable>tbody>tr:first-child>td,
.mobile .events #duelTournamentDiv .pending_schedule .dataTable tr td {
font-size: 2.5em;
}
.mobile .events #duelTournamentDiv button.btn {
font-size: 1em;
}
</style>
<div class="events frontPageContainer bg-dark foundation-style darkform">
<div class="mainHeader"><i class="icon-trophy"></i>Torneos</div>
<div class="content ui-tabs-panel ui-widget-content ui-corner-bottom d-flex flex-column">
<p class="foundation-base-font">No active events right now.</p>
</div>
</div>
<div class="frontPageContainer darkform bg-dark tabs foundation-style mobileBattlesTabs">
<div class="mainHeader"><i class="icon-cannon"></i>Batallas</div>
<ul id="numero3">
<li><a href="#tabs-4">País</a></li>
<li><a href="#tabs-5">Subvencionado</a></li>
<li><a href="#tabs-6">Importante</a></li>
</ul>
<div id="tabs-4">
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6218" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/china_flag-png-small.png')"
data-hover="China">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/usa_flag-png-small.png')"
data-hover="USA">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6218">Malasia Central</a>
<span>Batalla normal</span>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6218"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:3% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:97% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">3%</span>
<br>
<small id="defenderDamage">311.537</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">97%</span>
<br>
<small id="attackerDamage">10.695.605</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer0_2 = new Date();
fundraisingTimer0_2.setHours(fundraisingTimer0_2.getHours() + 1);
fundraisingTimer0_2.setMinutes(fundraisingTimer0_2.getMinutes() + 40);
fundraisingTimer0_2.setSeconds(fundraisingTimer0_2.getSeconds() + 58);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer0_2').countdown({
until: fundraisingTimer0_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer0_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6217" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/kazakhstan_flag-png-small.png')"
data-hover="Kazakhstan">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/usa_flag-png-small.png')"
data-hover="USA">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6217">Rusia Oriental</a>
<span>Batalla normal</span>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6217"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:1% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:99% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">1%</span>
<br>
<small id="defenderDamage">37.741</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">99%</span>
<br>
<small id="attackerDamage">3.309.094</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer1_2 = new Date();
fundraisingTimer1_2.setHours(fundraisingTimer1_2.getHours() + 1);
fundraisingTimer1_2.setMinutes(fundraisingTimer1_2.getMinutes() + 40);
fundraisingTimer1_2.setSeconds(fundraisingTimer1_2.getSeconds() + 38);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer1_2').countdown({
until: fundraisingTimer1_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer1_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6216" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/egypt_flag-png-small.png')"
data-hover="Egypt">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/usa_flag-png-small.png')"
data-hover="USA">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6216">Sofía</a>
<span>Batalla normal</span>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6216"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:0% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:100% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">0%</span>
<br>
<small id="defenderDamage">0</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">100%</span>
<br>
<small id="attackerDamage">4.354.374</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer2_2 = new Date();
fundraisingTimer2_2.setHours(fundraisingTimer2_2.getHours() + 1);
fundraisingTimer2_2.setMinutes(fundraisingTimer2_2.getMinutes() + 40);
fundraisingTimer2_2.setSeconds(fundraisingTimer2_2.getSeconds() + 15);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer2_2').countdown({
until: fundraisingTimer2_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer2_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6215" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/norway_flag-png-small.png')"
data-hover="Norway">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/usa_flag-png-small.png')"
data-hover="USA">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6215">Finlandia occidental</a>
<span>Batalla normal</span>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6215"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:27% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:73% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">27%</span>
<br>
<small id="defenderDamage">984.443</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">73%</span>
<br>
<small id="attackerDamage">2.614.014</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer3_2 = new Date();
fundraisingTimer3_2.setHours(fundraisingTimer3_2.getHours() + 1);
fundraisingTimer3_2.setMinutes(fundraisingTimer3_2.getMinutes() + 39);
fundraisingTimer3_2.setSeconds(fundraisingTimer3_2.getSeconds() + 56);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer3_2').countdown({
until: fundraisingTimer3_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer3_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<div class="battlesLink" style="text-align: center"><a href="battles.html?countryId=26&sorting=BY_START_TIME" style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;">Mostrar más batallas</a></div>
</div>
<div id="tabs-5">
<div style="color: white; text-shadow: 1px 1px 2px black; padding: 0.75em 1em 1em;">Sin batallas subvencionadas</div>
</div>
<style>
.muAvatar {
width: 48px;
height: 48px;
}
</style>
<div id="tabs-6">
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6212" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/laos_flag-png-small.png')"
data-hover="Laos">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/thailand_flag-png-small.png')"
data-hover="Thailand">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<div class="d-flex flex-column justify-center align-center">
<a href="battle.html?id=6212">Norte de Tailandia</a>
<span>Guerra de resistencia</span>
</div>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6212"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:97% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:3% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">97%</span>
<br>
<small id="defenderDamage">1.483.950.254</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">3%</span>
<br>
<small id="attackerDamage">48.973.975</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer24_2 = new Date();
fundraisingTimer24_2.setHours(fundraisingTimer24_2.getHours() + 0);
fundraisingTimer24_2.setMinutes(fundraisingTimer24_2.getMinutes() + 50);
fundraisingTimer24_2.setSeconds(fundraisingTimer24_2.getSeconds() + 13);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer24_2').countdown({
until: fundraisingTimer24_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer24_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div id="practiceBattle" data-link="battle.html?id=6211" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/188px/teamBlack.png')"
data-hover="Black">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/188px/teamWhite.png')"
data-hover="White">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6211">Practica la batalla</a>
</div>
<div class="battleButtonContainer">
<button id="practiceBattleId"
class="btn-buy battleButton"
data-id="6211"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:77% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:23% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">77%</span>
<br>
<small id="defenderDamage">1.690.139</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">23%</span>
<br>
<small id="attackerDamage">512.907</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer25_2 = new Date();
fundraisingTimer25_2.setHours(fundraisingTimer25_2.getHours() + 0);
fundraisingTimer25_2.setMinutes(fundraisingTimer25_2.getMinutes() + 22);
fundraisingTimer25_2.setSeconds(fundraisingTimer25_2.getSeconds() + 10);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer25_2').countdown({
until: fundraisingTimer25_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer25_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6218" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/china_flag-png-small.png')"
data-hover="China">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/usa_flag-png-small.png')"
data-hover="USA">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6218">Malasia Central</a>
<span>Batalla normal</span>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6218"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:3% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:97% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">3%</span>
<br>
<small id="defenderDamage">311.537</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">97%</span>
<br>
<small id="attackerDamage">10.695.605</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer26_2 = new Date();
fundraisingTimer26_2.setHours(fundraisingTimer26_2.getHours() + 1);
fundraisingTimer26_2.setMinutes(fundraisingTimer26_2.getMinutes() + 40);
fundraisingTimer26_2.setSeconds(fundraisingTimer26_2.getSeconds() + 58);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer26_2').countdown({
until: fundraisingTimer26_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer26_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.plugin.js"></script>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/jquery.countdown2.js"></script>
<div data-link="battle.html?id=6214" class="battleContainer insideShadowWrapper basicTexture battleMinitag">
<div>
<div class="battleParticipants">
<div class="battleDefender">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/nepal_flag-png-small.png')"
data-hover="Nepal">
<div class="flagTexture"></div>
</div>
</div>
<div class="font-size-2 text-bold">vs</div>
<div class="battleAttacker">
<div class="battleFlagBackground hovertext"
style="background-image: url('//vara.e-sim.org/cdn/static/img/flags/500px/usa_flag-png-small.png')"
data-hover="USA">
<div class="flagTexture"></div>
</div>
</div>
</div>
</div>
<div class="battleLocation d-flex flex-column justify-center align-center gap-05">
<a href="battle.html?id=6214">Bangladesh Oriental</a>
<span>Batalla normal</span>
</div>
<div class="battleButtonContainer">
<button class="btn-buy battleButton"
data-id="6214"
onclick="goToBattle(this)">
<div class="battleIcon"></div>
</button>
</div>
<div class="d-flex flex-row gap-1 w-100" style="grid-column: span 3">
<div class="battleBar">
<div class="roundStatus crimsonBar">
<div class="mainBar">
<div id="defendersBar" class="defendersBar" style="width:0% !important;">
</div>
<div id="attackersBar" class="attackersBar" style="width:100% !important;">
</div>
<div class="defendersPercent">
<span id="defenderScoreInPercent">0%</span>
<br>
<small id="defenderDamage">0</small>
</div>
<div class="attackersPercent">
<span id="attackerScoreInPercent">100%</span>
<br>
<small id="attackerDamage">10.064.092</small>
</div>
</div>
</div>
</div>
<div class="battleFooterTimer hovertext ellipsis-text" data-hover="Ronda cerrada">
<script type="text/javascript">
function initializeBattleClock() {
const fundraisingTimer27_2 = new Date();
fundraisingTimer27_2.setHours(fundraisingTimer27_2.getHours() + 1);
fundraisingTimer27_2.setMinutes(fundraisingTimer27_2.getMinutes() + 39);
fundraisingTimer27_2.setSeconds(fundraisingTimer27_2.getSeconds() + 8);
setTimeout(function() {
$('#yourContainer').on('click', '#yourCountdownElement', function() {
// Initialize countdown
$(this).countdown();
});
$('#fundraisingTimer27_2').countdown({
until: fundraisingTimer27_2,
compact: true,
format: 'dHMS',
expiryText: 'Ronda cerrada'
});
}, 250);
}
initializeBattleClock();
</script>
<span id="fundraisingTimer27_2" ></span>
</div>
</div>
</div>
<style>
.battleMinitag .spinnerLoader {
width: 1rem !important;
height: 1rem !important;
}
.mobile .battleMinitag .spinnerLoader {
width: 3rem !important;
height: 3rem !important;
}
</style>
<script>
function goToBattle(button) {
const battleId = Number(button.dataset.id);
Loader.initializeLoading(button, LoaderSettings.optionsWithoutPosAbsolute);
location.href = 'battle.html?id=' + battleId;
}
</script>
<div class="battlesLink" style="text-align: center"><a href="battles.html?countryId=-1&sorting=BY_TOTAL_DAMAGE" style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;">Mostrar más batallas</a></div>
</div>
</div>
<link href="//vara.e-sim.org/cdn/static/css/modules/events.css?v=0007" type="text/css" rel="stylesheet">
<div class="frontPageContainer darkform bg-dark tabs foundation-style mobileEventsTabs">
<div class="mainHeader"><i class="icon-trophy"></i>Eventos</div>
<ul>
<li><a href="#tabs-7">Local</a></li>
<li><a href="#tabs-8">Militar</a></li>
<li><a href="#tabs-9">Político</a></li>
</ul>
<div id="tabs-7">
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6218">Central Malaysia of <div class="xflagsSmall xflagsSmall-China"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:04:24 (19 minutos atrás)"> 19 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6217">Eastern Russia of <div class="xflagsSmall xflagsSmall-Kazakhstan"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:04:05 (19 minutos atrás)"> 19 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6216">Sofia of <div class="xflagsSmall xflagsSmall-Egypt"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:03:41 (19 minutos atrás)"> 19 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6215">Western Finland of <div class="xflagsSmall xflagsSmall-Norway"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:03:23 (20 minutos atrás)"> 20 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div style="text-align: center"><a href="eventsNew.html?eventType=MILITARY" style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;">Mostrar más</a></div>
</div>
<div id="tabs-8">
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6218">Central Malaysia of <div class="xflagsSmall xflagsSmall-China"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:04:24 (19 minutos atrás)"> 19 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6217">Eastern Russia of <div class="xflagsSmall xflagsSmall-Kazakhstan"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:04:05 (19 minutos atrás)"> 19 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6216">Sofia of <div class="xflagsSmall xflagsSmall-Egypt"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:03:41 (19 minutos atrás)"> 19 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="militaryEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/attackIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="battle.html?id=6215">Western Finland of <div class="xflagsSmall xflagsSmall-Norway"></div> was attacked by USA<div class="xflagsSmall xflagsSmall-USA"></div> </a>
<span title="20-04-2026 9:03:23 (20 minutos atrás)"> 20 minutos atrás</span>
</div>
</div>
</div>
</div>
</div>
<div style="text-align: center"><a href="eventsNew.html?eventType=MILITARY" style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;">Mostrar más</a></div>
</div>
<div id="tabs-9">
<div class="eventsContainer m-bot-05">
<div class="politicalEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/printMoneyIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="law.html?id=2150">The issuance of 200000 <b>USD</b> <div class="xflagsSmall xflagsSmall-USA"></div> has been approved by Congress.</a>
<span title="19-04-2026 18:47:13 (14 horas atrás)"> 14 horas atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="politicalEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/printMoneyIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="law.html?id=2150">The issuance of 200000 <b>USD</b> <div class="xflagsSmall xflagsSmall-USA"></div> has been proposed in Congress.</a>
<span title="19-04-2026 18:43:44 (14 horas atrás)"> 14 horas atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="politicalEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/printMoneyIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="law.html?id=2149">The issuance of 200000 <b>USD</b> <div class="xflagsSmall xflagsSmall-USA"></div> has been approved by Congress.</a>
<span title="19-04-2026 18:43:13 (14 horas atrás)"> 14 horas atrás</span>
</div>
</div>
</div>
</div>
</div>
<div class="eventsContainer m-bot-05">
<div class="politicalEvent event compactCard">
<div class="insideShadowWrapper indexEvent">
<div style="display: flex; align-items: center;">
<img src="//vara.e-sim.org/cdn/static/img/eventIcons/printMoneyIcon.png" style="margin: 3px; width: 40px; height: 40px;" />
<div style="margin-left: 8px;display: flex;
align-items: center;
flex-direction: column;
width: 100%;
gap: 0.25em;">
<a href="law.html?id=2149">The issuance of 200000 <b>USD</b> <div class="xflagsSmall xflagsSmall-USA"></div> has been proposed in Congress.</a>
<span title="19-04-2026 18:41:42 (14 horas atrás)"> 14 horas atrás</span>
</div>
</div>
</div>
</div>
</div>
<div style="text-align: center"><a href="eventsNew.html?eventType=POLITICAL" style="color: white; text-shadow: 1px 1px 2px black; font-weight: bold;">Mostrar más</a></div>
</div>
</div>
</div>
</div>
<script>
// google
(function () {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/platform.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
document.addEventListener("DOMContentLoaded", () => {
document.querySelectorAll(".tabs").forEach(tab => {
initTabs(tab);
Utils.fadeIn(tab, 500);
});
});
function initTabs(tabs) {
const tabLinks = tabs.querySelectorAll("ul li a[href^='#']");
const tabPanels = Array.from(tabLinks).map(link => document.querySelector(link.getAttribute("href")));
let activeTab = null;
tabLinks.forEach(link => {
link.addEventListener("click", e => {
e.preventDefault();
const targetId = link.getAttribute("href");
const panel = document.querySelector(targetId);
// collapsible tab
if (activeTab === panel) {
panel.classList.remove("active", "fadeIn");
link.parentElement.classList.remove("ui-tabs-active", "ui-state-active");
activeTab = null;
return;
}
tabPanels.forEach(p => {
p.classList.remove("active", "fadeIn");
});
tabLinks.forEach(l => l.parentElement.classList.remove("ui-tabs-active", "ui-state-active"));
// Activate this one
panel.classList.add("active", "fadeIn");
link.parentElement.classList.add("ui-tabs-active", "ui-state-active");
activeTab = panel;
});
});
if (tabLinks[0]) tabLinks[0].click();
}
// init();
// });
</script>
</div>
<script type="text/javascript" src="//vara.e-sim.org/cdn/static/js/dragresize.js"></script>
<div class="foundation-style foundation-text-center foundation-base-font small-10 columns column-margin-both column-margin-vertical-down mobileFooter">
<div style="font-size: .8125em;" class="foundation-style columns canvaback column-margin-both column-margin-vertical foundation-radius foundation-shadow">
<div style="display: inline-block; width: 100%; padding-bottom: 12px;">
<span>|</span> <a href="laws.html">Términos de servicio</a>
<span>|</span> <a href="privacyPolicy.html">Política de privacidad</a>
<span>|</span> <a href="staff.html">Apoyo</a>
<span>|</span>
<a href="https://alpha.e-sim.org"><i class='icon-earth'></i>Alpha</a>
<span>|</span>
<a href="https://luxia.e-sim.org"><i class='icon-fire'></i>Luxia</a>
<span>|</span>
<a href="https://primera.e-sim.org"><i class='icon-earth'></i>Primera</a>
<span>|</span>
<a href="https://secura.e-sim.org"><i class='icon-earth'></i>Secura</a>
<span>|</span>
<a href="https://suna.e-sim.org"><i class='icon-earth'></i>Suna</a>
<span>|</span>
<a href="https://vexa.e-sim.org"><i class='icon-fire'></i>Vexa</a>
<span>|</span>
<a href="https://sora.e-sim.org"><i class='icon-fire'></i>Sora</a>
<span>|</span>
<a href="https://e-sim.org" target="_blank">e-Sim: Countryballs Country Game</a>
</div>
<div id="footer"
style="display: inline-block; width: 100%; padding-bottom: 12px;">
<a href="version.html">e-Sim 3.8.4</a> ©
<script type="text/javascript">document.write(new Date().getFullYear())</script>
Massive Online Games FZE <br> <span style="font-size: 10px; color: #BBB; font-weight: 400;"> Al Jazeera Al Hamra, Ras Al Khaimah, United Arab Emirates </span>
</div>
<div style="display: inline-block; width: 100%; padding-bottom: 12px;">
<span style="font-size: 16px; color: #BBB; line-height: 45px; vertical-align: top; padding-right: 10px; text-transform: uppercase; font-weight: 400;">
APROVECHARSE DE
</span>
<a id="icon-android" href="#"> <i class="icon-android" style="font-size: 36px; color: #bbbbbb;"></i></a>
</div>
</div>
</div>
<div class="lightback2" id="smallPopup"></div>
<div id="modalContainer"></div>
<div id="portalContainer"></div>
<div id="tutorialPanel" class="tutorialPanel">
<div id="tutorialPanelBubbleText" class="'bubbleText fadeIn hidden"></div>
<div data-dropdown-content style="width:1px;height:1px;display:none;position:absolute;" id="contentDrop2"></div>
<div id="menuNotifications" class="menuNotifications" style="position:relative;">
<a data-dropdown="contentDrop2" href="#" id="startMission" class="blank-icon only-icon missionStart">
<i title="No hay misiones disponibles!" class="help icon-error"></i>
</a>
</div>
<div class="tutorialBallContainer">
<img id="tutorialCB"
class="tutorialBall"
width="100"
src="//vara.e-sim.org/cdn/static/img/countryballsAssets/Optimized/usaR.png"
onError="this.src='//vara.e-sim.org/cdn/static/img/countryballsAssets/polandR.png';">
<div id="tutorialCBEyes"
onclick="missionDropdown.toggle();"
class="tutorialBallEyes happyRight"></div>
</div>
</div>
<script>
var tutorialFunction=0;
var Tutorial = {
blackScreenWithHint: null,
isTest: Boolean(''),
functionCalledOnce: false,
noActionToMotivate: '¡No hay ciudadano disponible para motivar en este momento, por favor vuelve más tarde!',
noActionToBid: "¡No hay subasta disponible para superar a otros ciudadanos, por favor regresa más tarde!",
mergeObserver: null,
};
Tutorial.ready = new Promise((resolve) => {
Tutorial._resolveReady = resolve;
});
Tutorial.handleBossTest = async () => {
// if (Tutorial.isBossWithTutorialBallTest) {
console.log('Waiting for CountryBallBoss to be ready...');
await CountryBallBoss.ready;
console.log('CountryBallBoss is ready.');
CountryBallBoss.initializeBossBall(window.missionConfig.currentMission.type);
// }
};
tutorialFunction=1;
Tutorial.handleTest = () => {
console.log("TESTESTESTSETSET")
};
tutorialFunction=2;
Tutorial.fixPointerSizeOnMobile = () => {
const pointer = document.querySelector('#missionPointer');
pointer.classList.add('fixSize10vw');
};
tutorialFunction=3;
Tutorial.makeAndShowBlackScreenWithHint = (text) => {
if (!Tutorial.blackScreenWithHint) {
const hint = Utils.makeDiv('text-center', 'white', 'font-size-2', 'text-bold');
hint.textContent = text;
Tutorial.blackScreenWithHint = Utils.makeDiv('blackBackgroundWithHint', 'blackBackground', 'd-flex', 'justify-center', 'align-center', 'z-98', 'font-size-2');
Tutorial.blackScreenWithHint.addEventListener("click", () => Tutorial.hideBlackScreenWithHint());
Tutorial.blackScreenWithHint.append(hint);
document.body.prepend(Tutorial.blackScreenWithHint);
}
Tutorial.showBlackScreenWithHint();
};
tutorialFunction=4;
Tutorial.showStatusOnce = (text) => {
showStatusOnce = function() {};
Tutorial.functionCalledOnce = true;
Utils.showStatus(text, true);
};
tutorialFunction=5;
Tutorial.showBlackScreenWithHint = () => {
Tutorial.blackScreenWithHint.classList.remove('fadeOut');
Tutorial.blackScreenWithHint.classList.add('fadeIn');
Tutorial.blackScreenWithHint.style.opacity = '1';
Tutorial.blackScreenWithHint.style.visibility = 'visible';
};
tutorialFunction=6;
Tutorial.hideBlackScreenWithHint = () => {
Tutorial.blackScreenWithHint.classList.remove('fadeIn');
Tutorial.blackScreenWithHint.classList.add('fadeOut');
Tutorial.blackScreenWithHint.style.opacity = '0';
Tutorial.blackScreenWithHint.style.visibility = 'hidden';
setTimeout(() => {
document.body.removeChild(Tutorial.blackScreenWithHint);
Tutorial.blackScreenWithHint = null;
}, 250);
};
tutorialFunction=7;
Tutorial.greyOutElements = (selectors) => {
const elements = document.querySelectorAll(selectors);
elements.forEach((el) => {
el.style.opacity = '0.4';
})
};
Tutorial.restoreGreyedElements = (selectors) => {
const elements = document.querySelectorAll(selectors);
elements.forEach((el) => {
el.style.opacity = '';
})
};
tutorialFunction=8;
Tutorial.handleWorkAndTrainMission = () => {
const myTrainBtn = document.getElementById('taskButtonTrain');
const myWorkBtn = document.getElementById('taskButtonWork');
if (myTrainBtn) {
if (missionDropdown.isOn("train")) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("trainButton"), 1);
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAIN);
}
return;
}
if (missionDropdown.isOn("jobMarket")) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.job-offer-footer .btn-buy'), 1);
Utils.greyOutElementsExceptFirstOne('job-offer-form');
return;
}
if (myWorkBtn) {
if (missionDropdown.isOn("work", "work2")) {
Tutorial.showElementsDuringMission('#esim-layout');
if (Utils.checkElementExists("jobMarketButton")) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("jobMarketButton"), 1);
} else {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("workButton"), 1);
}
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.WORK);
}
}
};
tutorialFunction=9;
Tutorial.handleBattleWithWeaponActions = () => {
selectSide('defenderSide');
fightAjaxCallback = updateMissionProgress;
Tutorial.showElementsDuringMission('#esim-layout');
document.getElementById("weaponContainer").style.visibility="visible";
document.getElementById("weaponContainer").style.display="flex";
if (document.getElementById("selectedWeapon").dataset.quality>0) {
if (Utils.getCookie("selectedSide") === 'attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
}
} else {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("selectWeaponButton"), 4);
}
openWeaponCollapsibleCallback = function() {
missionMarkers.hideMarkers(4);
if (document.getElementById("selectedWeapon").dataset.quality === '0') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("weaponSelection1"), 2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("weaponSelection1"), 2);
}
};
hideFoodAndWeaponCollapsibleCallback = function() {
missionMarkers.hideMarkers(2);
if (document.getElementById("selectedWeapon").dataset.quality === '0') {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("selectWeaponButton"), 4);
}
};
selectWeaponCallback = function() {
if (document.getElementById("selectedWeapon").dataset.quality === '0') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("selectWeaponButton"), 4);
missionMarkers.hideMarkers(3);
} else {
missionMarkers.hideMarkers(2);
if (Utils.getCookie("selectedSide") === 'attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
}
}
};
};
tutorialFunction=10;
Tutorial.handleTrainMissions = () => {
Tutorial.showElementsDuringMission('#countryballsBgContainer');
Tutorial.hideElementsDuringMission('.mobileMilitaryStats, #mobileEqStatsContainer');
missionMarkers.positionSmallArrowPointingUp(document.getElementById('trainButton'), 1);
};
tutorialFunction=11;
Tutorial.handleWorkMissions = () => {
const workBtn = document.getElementById('workButton');
const jobMarketBtn = document.getElementById('jobMarketButton');
const jobApplyBtn = document.getElementById('jobApply0');
const missionCrate = document.getElementById('missionCrate');
//offsetParent checks if element is visible
if (missionCrate && missionCrate.offsetParent !== null) {
missionMarkers.positionArrowOnRewardBox();
} else if (workBtn) {
missionMarkers.positionSmallArrowPointingUp(workBtn, 1);
} else if (jobMarketBtn) {
missionMarkers.positionSmallArrowPointingDown(jobMarketBtn, 1);
} else if (jobApplyBtn) {
Utils.greyOutElementsExceptFirstOne('job-offer-form');
missionMarkers.positionSmallArrowPointingDown(jobApplyBtn, 1);
//TODO FOR TEST
document.querySelector('#esim-layout').style.overflow = 'hidden';
Tutorial.showElementsDuringMission('#taskButtonWork, #jobCriteriaContainer, .job-offer-form, .noWorkPlace, .countryBallWrapper, .jobMarketBg');
Tutorial.handleBossTest();
} else {
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.travel'), 1);
}
};
tutorialFunction=12;
Tutorial.handleIconLinks = () => {
const iconLinks = document.querySelector('.iconLinks');
if (iconLinks) {
Tutorial.showElementsDuringMission('.iconLinks');
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.iconLinks'), 1);
return true;
}
return false;
};
tutorialFunction=13;
Tutorial.handleNavigationOnTown = (classSelector, arrowPointingDown = true) => {
Tutorial.showElementsDuringMission('.countryBallWrapper, .building' + classSelector);
Tutorial.hideElementsDuringMission('.building:not(' + classSelector + ') > .countryballTitle');
Tutorial.highlightElementsDuringMission('.building' + classSelector);
arrowPointingDown ? missionMarkers.positionSmallArrowPointingDown(document.querySelector(".building" + classSelector), 1) : missionMarkers.positionSmallArrowPointingUp(document.querySelector(".building" + classSelector), 1);
};
tutorialFunction=14;
Tutorial.highlightElementsDuringMission = (selectors) => {
const elementsToShow = document.querySelectorAll(selectors);
elementsToShow.forEach(element => {
element.classList.add('tutorialHighlight');
});
};
tutorialFunction=15;
Tutorial.removeHighlightFromElementsDuringMission = () => {
const elementsToShow = document.querySelectorAll('.tutorialHighlight');
elementsToShow.forEach(element => {
element.classList.remove('tutorialHighlight');
});
};
tutorialFunction=16;
Tutorial.showElementsDuringMission = (selectors) => {
const elementsToShow = document.querySelectorAll(selectors);
for (let i = 0; i < elementsToShow.length; i++) {
elementsToShow[i].classList.add('z-97', 'p-relative');
}
};
tutorialFunction=17;
Tutorial.hideElementsDuringMission = (selectors) => {
const elementsToShow = document.querySelectorAll(selectors);
for (let i = 0; i < elementsToShow.length; i++) {
elementsToShow[i].style.display = 'none';
}
};
tutorialFunction=18;
Tutorial.removeEventsDuringMission = (selectors) => {
const elementsToShow = document.querySelectorAll(selectors);
elementsToShow.forEach(element => {
element.classList.add('events-none');
});
};
tutorialFunction=19;
Tutorial.handleGravityMission = () => {
if (missionDropdown.isOn("tutorialProgression")) {
Tutorial.showElementsDuringMission('.activity.gravity')
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.gravityContainer'), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TUTORIAL_PROGRESSION);
};
tutorialFunction=20;
Tutorial.handleDealDamage = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=21;
Tutorial.handleDealDamageForTest = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=22;
Tutorial.handleDealDamage_I = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=23;
Tutorial.handleDealDamage_II = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=24;
Tutorial.handleDealDamage_III = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
},
tutorialFunction=25;
Tutorial.handleDealDamage_IV = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
Tutorial.handleDealDamage_V = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=26;
Tutorial.handleSimplifiedFight = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=27;
Tutorial.handleSimplifiedFightLonger = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide("defenderSide");
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=28;
Tutorial.handleSimplifiedFightForOtherSide = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
document.getElementById("sidesContainer").style.display="block";
Tutorial.showElementsDuringMission('#esim-layout');
if (Utils.getCookie("selectedSide")=='attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("attackerSide"), 4);
}
document.getElementById('attackerSide').click(function() {
missionMarkers.hideMarkers(4);
missionMarkers.showMarkers(3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
});
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=29;
Tutorial.handleSimplifiedFightUseFood = () => {
if (missionDropdown.isOn("battle.html")) {
const foodContainer = document.getElementById("foodContainer");
foodContainer.style.display="flex";
foodContainer.style.visibility="visible";
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById('selectedFood'), 4);
// Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=30;
Tutorial.handleSimplifiedFightWithWeapon = () => {
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.fight', false);
return;
}
if (missionDropdown.isOn("battles")) {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("practiceBattle"), 1);
return;
}
if (missionDropdown.isOn("battle.html")) {
Tutorial.handleBattleWithWeaponActions();
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("battle.html")) {
Tutorial.handleBattleWithWeaponActions();
// Tutorial.handleBossTest();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=31;
Tutorial.handleSimplifiedFightBerserk = () => {
if (missionDropdown.isOn("battle.html")) {
selectSide('defenderSide');
fightAjaxCallback = updateMissionProgress;
document.getElementById("esim-layout").style.zIndex=97;
document.getElementById("attackerBerserkContainer").style.display="flex";
document.getElementById("defenderBerserkContainer").style.display="flex";
if (Utils.getCookie("selectedSide")=='attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("attackerBerserkContainer").querySelector(".checkmarkText"), 4);
}
else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderBerserkContainer").querySelector(".checkmarkText"), 4);
}
document.getElementById("attackerBerserkCheckbox").addEventListener("change", function () {
if (document.getElementById("attackerBerserkCheckbox").checked) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
missionMarkers.hideMarkers(4);
} else {
mobileMissions.positionSmallArrowPointingDown(document.getElementById("attackerBerserkContainer").querySelector(".checkmarkText"), 4);
missionMarkers.hideMarkers(3);
}
});
document.getElementById("defenderBerserkCheckbox").addEventListener("change", function () {
if (document.getElementById("defenderBerserkCheckbox").checked) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
missionMarkers.hideMarkers(4);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderBerserkContainer").querySelector(".checkmarkText"), 4);
missionMarkers.hideMarkers(3);
}
});
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=32;
Tutorial.handleSingleFight = () => {
if (missionDropdown.isOn("battles")) {
fightAjaxCallback = updateMissionProgress;
missionMarkers.showMarkers(1);
missionMarkers.markers[1].arrow.addClass("arrowPointDown");
missionMarkers.markers[1].arrow.position({
of: document.getElementById("practiceBattle"),
my: "center bottom",
at: "center top",
collision: "none none"
});
return;
}
if (missionDropdown.isOn("battle.html")) {
missionMarkers.hideMarkers(1);
if(document.getElementById('defenderSide:not(.active)').length === 0) {
setTimeout(()=>missionMarkers.hideMarkers(3), 300);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4);
} else {
missionMarkers.hideMarkers(4);
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.leftSide'), 3);
}
document.querySelector('.leftSide').click(function() {
missionMarkers.hideMarkers(3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4)
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=33;
Tutorial.handleChangeSideInBattle= () => {
if (missionDropdown.isOn("battle.html")) {
missionMarkers.hideMarkers(1);
fightAjaxCallback = updateMissionProgress;
if(document.getElementById('attackerSide:not(.active)').length === 0) {
setTimeout(()=>missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 4), 300);
} else {
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.rightSide'), 3);
}
document.querySelector('.rightSide').click(function() {
missionMarkers.hideMarkers(3)
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 4)
})
document.querySelector('.leftSide').click(function() {
missionMarkers.hideMarkers(4);
missionMarkers.positionSmallArrowPointingDown(document.querySelector(".rightSide"), 3);
})
document.getElementById("fightButton1").click(function() {
missionMarkers.hideMarkers(4)
missionMarkers.positionSmallArrowPointingDown(document.querySelector(".leftSide"), 3)
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=34;
Tutorial.handleCheckMessages = () => {
if (missionDropdown.isOn('inboxMessages')) {
missionDropdown.showMissionCompletedPanel();
}
};
tutorialFunction=35;
Tutorial.handleFirstTrain = () => {
if (missionDropdown.isOn('train')) {
console.log("testssssss????")
history.replaceState(null, null, 'train.html');
// Utils.addURLParameter(Utils.fbParam);
window.addEventListener('popstate', function(event) {
window.location.href = '/town.html';
});
Tutorial.handleTrainMissions();
Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAIN);
};
tutorialFunction=36;
Tutorial.handleFindJob = () => {
if (missionDropdown.isOn("work", "work2", "jobMarket", 'marketplace.html?marketType=JOB')) {
Tutorial.showElementsDuringMission('#taskButtonWork, #jobCriteriaContainer, .job-offer-form, .noWorkPlace, .countryBallWrapper');
Tutorial.handleWorkMissions();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.JOB_MARKET);
};
tutorialFunction=37;
Tutorial.handleFirstWork = () => {
if (missionDropdown.isOn("work", "work2")) {
Tutorial.showElementsDuringMission('#taskButtonWork, #countryballsBgContainer');
Tutorial.handleWorkMissions();
setTimeout(() => {
Tutorial.handleBossTest();
}, 1250);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.WORK);
};
tutorialFunction=38;
Tutorial.handleFightPracticeBattle = () => {
if (missionDropdown.isOn('battle.html')) {
fightAjaxCallback = updateMissionProgress;
missionMarkers.hideMarkers(1, 2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderSide"), 3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4);
document.getElementById('defenderSide').click(function() {
missionMarkers.hideMarkers(1, 2, 3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4);
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=39;
Tutorial.handleGetSomeEnergy = () => {
if (missionDropdown.isOn('battle.html')) {
missionMarkers.hideMarkers(2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderSide"), 3);
document.getElementById('defenderSide').click(function() {
missionMarkers.hideMarkers(1, 2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("selectedFood"), 3);
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=40;
Tutorial.handleBerserkPracticeBattle = () => {
if (missionDropdown.isOn("battles")) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingDown(document.getElementById('practiceBattle'), 2);
return;
}
if (missionDropdown.isOn('battle.html')) {
fightAjaxCallback = updateMissionProgress;
setTimeout(()=>missionMarkers.hideMarkers(1, 3, 4), 300);
if(document.getElementById('defenderSide:not(.active)').length === 0) {
setTimeout(()=>missionMarkers.positionSmallArrowPointingDown(document.querySelector(".checkmarkText"), 2), 300);
} else {
setTimeout(()=>missionMarkers.positionSmallArrowPointingDown(document.querySelector(".leftSide"), 2), 300);
}
document.querySelector(".leftSide").click(function () {
missionMarkers.hideMarkers(2, 4);
missionMarkers.positionSmallArrowPointingDown(document.querySelector(".checkmarkText"), 3);
})
document.querySelector('.checkmarkText').click(function() {
missionMarkers.hideMarkers(2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=41;
Tutorial.handleCheckNotifications = () => {
if (!missionDropdown.isOn('notifications')) {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.NOTIFICATIONS);
}
};
tutorialFunction=42;
Tutorial.handleCheckMap = () => {
if (missionDropdown.isOn('newMap')) {
missionDropdown.showRewardModal();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.MAP);
};
tutorialFunction=43;
Tutorial.handleUploadAvatar = () => {
if (missionDropdown.isOn('editCitizen')) {
missionDropdown.showRewardModal();
return;
}
if (isMobile) {
missionMarkers.positionAvatarArrowOnMobile(1);
missionMarkers.positionSmallArrowPointingUp(document.getElementById("editCitizenId"), 2);
return;
}
document.getElementById('taskButtonAvatar').style.zIndex=97;
missionMarkers.positionSmallArrowPointingUp(document.getElementById('taskButtonAvatar'), 1);
};
tutorialFunction=44;
Tutorial.handleBuySomethingOnMarket = () => {
if (missionDropdown.isOn('productMarket', 'marketplace.html?marketType=PRODUCT')) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.buy'), 2);
Utils.greyOutElementsExceptFirstOne('productMarketOffer');
document.querySelector('.buy').click(function() {
missionMarkers.hideMarkers(2);
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('buyProductButton'), 3);
}, 700);
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.PRODUCT_MARKET);
};
tutorialFunction=45;
Tutorial.handleTravelToCapital = () => {
// if (Tutorial.isTravelTest) {
// if (missionDropdown.isOn('map')) {
// Tutorial.showElementsDuringMission('#pixi_map');
// const myRegion = REGIONS.find(r => r.id != RegionModal.loggedCitizenData.locationRegionId);
// const myRegion22 = MAP_OF_REGIONS.get(myRegion.id);
// if (myRegion22) {
// zoomOnRegion(myRegion.id);
// makePointer(myRegion22, myRegion.flag);
// cropMapToView();
// }
// return;
// }
// CountryBallPortals.handlePortalByType(CountryBallPortalsType.MAP);
// } else {
if (missionDropdown.isOn('travel')) {
Tutorial.showElementsDuringMission('.travelContainer');
Tutorial.handleBossTest();
missionMarkers.positionSmallArrowPointingUp(document.getElementById('travelButton'), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAVEL);
// }
};
tutorialFunction=46;
Tutorial.handleGetNewAchievement = () => {
if (!missionDropdown.isOn('citizenAchievements')) {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.ACHIEVEMENTS);
}
};
tutorialFunction=47;
Tutorial.handlePutEquipmentOn = () => {
if (missionDropdown.isOn('storageType=EQUIPMENT')) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("putOnEqMission"), 2);
const element = document.getElementById('equipmentTable');
if (element) {
const top = element.offsetTop - 300;
window.scrollTo({
top: top,
behavior: 'smooth'
});
}
return;
}
missionMarkers.positionSmallArrowPointingUp(document.getElementById("myPlaces"), 1)
// if (missionDropdown.isOn('storageType=EQUIPMENT')) {
// //key: cssSelector | value: pointerDirection
// const steps = {'.equipmentListGrid': 'bottom'};
// missionMarkers.setPointerOnElement(steps);
//
// $("html, body").animate({ scrollTop: document.getElementById('equipmentTable').offset().top - 300}, 1000);
// return;
// }
//key: cssSelector | value: pointerDirection
const steps = {'#myPlaces': 'top', '#myEquipmentlink': 'top'};
missionMarkers.setPointerOnElement(steps);
};
tutorialFunction=48;
Tutorial.handleVoteOneArticle = () => {
if (missionDropdown.isOn('news')) {
return;
}
if (missionDropdown.isOn('article')) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingUp(document.getElementById('voteButton'), 2);
if (isMobile) {
document.getElementById('voteLink').click(function(){setTimeout(reloadContent, 100)});
}
return;
}
if (missionDropdown.isOn('index.html')) {
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.ui-tabs-nav'), 1);
return;
}
if (isMobile) {
missionMarkers.positionMainMenuArrowOnMobile(1);
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 2);
return;
}
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 1);
};
tutorialFunction=49;
Tutorial.handleSecondWork = () => {
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.work')
return;
}
if (missionDropdown.isOn("work", "work2", "jobMarket")) {
Tutorial.handleWorkMissions();
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("work", "work2", "jobMarket")) {
Tutorial.showElementsDuringMission('#taskButtonWork, #countryballsBgContainer');
Tutorial.handleWorkMissions();
Tutorial.handleBossTest();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.WORK);
};
tutorialFunction=50;
Tutorial.handleSecondTrain = () => {
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.train');
return;
}
if (missionDropdown.isOn('train')) {
missionMarkers.positionSmallArrowPointingUp(document.getElementById('trainButton'), 1);
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn('train')) {
Tutorial.handleTrainMissions();
Tutorial.handleBossTest();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAIN);
};
tutorialFunction=51;
Tutorial.handleSayHello = () => {
if (missionDropdown.isOn('index.html')) {
missionMarkers.positionSmallArrowPointingUp(document.getElementById('togableShout'), 1);
const element = document.getElementById('togableShout');
if (element) {
const top = element.offsetTop - 300;
window.scrollTo({
top: top,
behavior: 'smooth'
});
}
return;
}
if (isMobile) {
missionMarkers.positionMainMenuArrowOnMobile(1);
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 2);
return;
}
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 2);
};
tutorialFunction=52;
//TODO second day of tutorial for town
Tutorial.handleGetGold = () => {
function handleMMAction() {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.hideMarkers(1);
if ( document.getElementById("selectedSellCurrency").dataset.currencyId==missionDropdown.loggedCitizenshipId
&& document.getElementById("selectedBuyCurrency").dataset.currencyId==0 ) {
missionMarkers.hideMarkers(2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById('monetaryMarketBuyColumn'), 3);
MonetaryMarket.buyCallbackFunction = function() {
missionMarkers.hideMarkers(3);
const steps = {'#buyCurrencyButton': 'bottom'};
setTimeout(function() {
missionMarkers.setPointerOnElement(steps);
missionMarkers.positionSmallArrowPointingDown(document.getElementById('buyCurrencyButton'), 3);
}, 700);
};
MonetaryMarket.closeOrSubmitCallbackFunction = function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('monetaryMarketBuyColumn'), 3);
};
} else {
missionMarkers.hideMarkers(3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById('swapContainer'), 2);
}
}
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.market');
CountryBallScrollingContent.scrollContentToMiddlePosition();
return;
}
if (missionDropdown.isOn('marketplace') && !missionDropdown.isOn('marketplace.html?')) {
Tutorial.handleNavigationOnTown('.monetaryMarket');
return;
}
if (missionDropdown.isOn("monetaryMarket", "marketplace.html?marketType=MONETARY")) {
handleMMAction();
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("monetaryMarket")) {
handleMMAction();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.MONETARY_MARKET);
};
tutorialFunction=53;
Tutorial.handleAuctionBuyEq = () => {
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.market');
CountryBallScrollingContent.scrollContentToMiddlePosition();
return;
}
if (missionDropdown.isOn('marketplace') && !missionDropdown.isOn('marketplace.html?')) {
Tutorial.handleNavigationOnTown('.auctionHall');
return;
}
if (missionDropdown.isOn("auctions", "marketplace.html?marketType=AUCTION_HALL")) {
missionMarkers.hideMarkers(1);
missionDropdown.showMissionCompletedPanel();
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("auctions")) {
missionMarkers.hideMarkers(1);
Tutorial.hideElementsDuringMission('#auctionForm');
missionDropdown.showMissionCompletedPanel();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.AUCTIONS);
};
tutorialFunction=54;
Tutorial.handleAuctionSellEq = () => {
sellEqOnAuctionAjaxCallback = updateMissionProgress;
function handleSellEqAction() {
document.querySelector('.createAuctionForm').style.overflow = 'hidden';
if (isMobile) {
const createAuctions = document.getElementById('createAuctions');
const esimLayout = document.getElementById('esim-layout');
esimLayout.prepend(createAuctions);
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('createAuctionButton'), 1);
}, 1000);
} else {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('createAuctionButton'), 1);
}, 1000);
}
Tutorial.handleBossTest();
}
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.market');
CountryBallScrollingContent.scrollContentToMiddlePosition();
return;
}
if (missionDropdown.isOn('marketplace') && !missionDropdown.isOn('marketplace.html?')) {
Tutorial.handleNavigationOnTown('.auctionHall');
return;
}
if (missionDropdown.isOn('marketplace.html?marketType=AUCTION_HALL')) {
Tutorial.showElementsDuringMission('.linkToMyAuctions');
Tutorial.hideElementsDuringMission('.iconLinks');
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.linkToMyAuctions'), 1);
return;
}
if (missionDropdown.isOn("myAuctions")) {
handleSellEqAction();
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("myAuctions.html")) {
handleSellEqAction();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.MY_AUCTIONS);
};
tutorialFunction=55;
Tutorial.handleSellStuff = () => {
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.market');
CountryBallScrollingContent.scrollContentToMiddlePosition();
return;
}
if (missionDropdown.isOn("productMarket", "marketplace.html?marketType=PRODUCT")) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingUp(document.getElementById('postOfferRef'), 2);
return;
}
if (missionDropdown.isOn('marketplace.html') && !missionDropdown.isOn('marketplace.html?')) {
Tutorial.handleNavigationOnTown('.productMarket');
return;
}
if (missionDropdown.isOn("storage.html?storageType=PRODUCT")) {
missionMarkers.hideMarkers(3);
if (isMobile) {
document.getElementById('createProductOfferContainer').prependTo(document.getElementById('storageProductsTab'));
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('marketMission'), 1);
}, 1000);
} else {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('marketMission'), 1);
}, 1000);
}
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("productMarket.html")) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingUp(document.getElementById('postOfferRef'), 2);
return;
}
if (missionDropdown.isOn("storage.html?storageType=PRODUCT")) {
missionMarkers.hideMarkers(3);
if (isMobile) {
const postNewOfferTitle = document.querySelector('.postNewOfferTitle');
const createProductOffer = document.querySelector('#createProductOfferContainer');
const storageProductsTab = document.querySelector('#storageProductsTab');
storageProductsTab.prepend(postNewOfferTitle, createProductOffer);
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("marketMission"), 1);
}, 1000);
} else {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("marketMission"), 1);
}, 1000);
}
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STORAGE_BY_TYPE, StorageTypeForPortal.PRODUCTS);
};
tutorialFunction=56;
Tutorial.handleStaffSergeant = () => {
if (missionDropdown.isOn("battle")) {
fightAjaxCallback = updateMissionProgress;
selectSide('defenderSide');
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
Tutorial.handleBossTest();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=57;
Tutorial.handleArmory = () => {
function removeDesktopHoverAction() {
document.getElementById("productMarketProductType").onmouseenter = () => {};
document.getElementById("productMarketProductType").onmouseleave = () => {};
document.getElementById("productMarketProductTypeSelection").onmouseenter = () => {};
document.getElementById("productMarketProductTypeSelection").onmouseleave = () => {};
}
function handleDesktopHoverAction() {
document.getElementById("productMarketProductType").onmouseleave = () => {
console.log("onmouseout1111")
missionMarkers.positionSmallArrowPointingDown(document.getElementById("productMarketProductType"), 1);
}
document.getElementById("productMarketProductType").onmouseenter = () => {
console.log("onmouseover")
missionMarkers.positionSmallArrowPointingUp(document.getElementById("option_WEAPON"), 1);
}
document.getElementById("productMarketProductTypeSelection").onmouseleave = () => {
console.log("onmouseout2222")
missionMarkers.positionSmallArrowPointingDown(document.getElementById("productMarketProductType"), 1);
}
document.getElementById("productMarketProductTypeSelection").onmouseenter = () => {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("option_WEAPON"), 1);
}
}
function handleSelectingWeapon() {
if (document.getElementById("productMarketProductType").dataset.product !== 'WEAPON') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("productMarketProductType"), 1);
if (isDesktop) {
handleDesktopHoverAction();
}
} else {
removeDesktopHoverAction();
missionMarkers.positionSmallArrowPointingUp(document.querySelector(".buy"), 1);
document.querySelector(".buy").click(function() {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.modalFooter'), 1);
}, 700);
})
}
DarkFormFunctions.updateMissionMarkers = function() {
if (document.getElementById("productMarketProductType").dataset.product === 'WEAPON') {
removeDesktopHoverAction();
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("option_WEAPON"), 1);
}
};
};
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.market');
CountryBallScrollingContent.scrollContentToMiddlePosition();
return;
}
if (missionDropdown.isOn("productMarket", "marketplace.html?marketType=PRODUCT")) {
document.getElementById("blackBackground").style.display="none";
missionMarkers.hideMarkers(1, 2, 3, 4);
handleSelectingWeapon();
return;
}
if (missionDropdown.isOn('marketplace.html') && !missionDropdown.isOn('marketplace.html?')) {
Tutorial.handleNavigationOnTown('.productMarket');
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn("productMarket.html")) {
document.getElementById("blackBackground").style.display="none";
missionMarkers.hideMarkers(1, 2, 3, 4);
handleSelectingWeapon();
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.PRODUCT_MARKET);
};
tutorialFunction=58;
Tutorial.handleChangeBackground = () => {
if (Tutorial.isTest) {
if (missionDropdown.isOn("town")) {
Tutorial.handleNavigationOnTown('.myHome');
return;
}
if (missionDropdown.isOn('myHome') && !missionDropdown.isOn('myHome.html?')) {
Tutorial.handleNavigationOnTown('.settings');
return;
}
if (missionDropdown.isOn('editCitizen.html', 'myHomeType=SETTINGS')) {
setTimeout(function(){
missionMarkers.positionSmallArrowPointingDown(document.getElementById("chooseBg"), 1);
}, 150);
document.getElementById("chooseBg").click(function() {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.bgSelect'), 1);
}, 150);
})
return;
}
const iconLinks = Tutorial.handleIconLinks();
if (iconLinks) return;
} else {
if (missionDropdown.isOn('editCitizen.html?')) {
Tutorial.showElementsDuringMission('.countryBallContent');
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.bgSelect'), 1);
return;
}
if (missionDropdown.isOn("editCitizen.html")) {
Tutorial.showElementsDuringMission('.navigationContainer');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("customizeButton"), 1);
document.getElementById("customizeButton").click(function() {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.bgSelect'), 1);
}, 600);
})
return;
}
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.EDIT_CITIZEN);
};
tutorialFunction=59;
Tutorial.handleSergeantFirstClass = () => {
if (missionDropdown.isOn("battle")) {
Tutorial.handleBattleWithWeaponActions();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=60;
Tutorial.handleThirdWork = () => {
if (missionDropdown.isOn("work", "work2", "jobMarket")) {
Tutorial.handleWorkMissions();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.WORK);
};
tutorialFunction=61;
Tutorial.handleThirdTrain = () => {
if (missionDropdown.isOn('train.html')) {
Tutorial.handleTrainMissions();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAIN);
};
tutorialFunction=62;
Tutorial.handleVoteArticles = () => {
if (missionDropdown.isOn('news.html')) {
return;
}
if (missionDropdown.isOn('article')) {
missionMarkers.showMarkers(3);
missionMarkers.positionSmallArrowPointingUp(document.getElementById('voteDiv'), 3);
document.getElementById('voteLink').click(function(){setTimeout(reloadContent, 100)});
return;
}
if (missionDropdown.isOn('index.html')) {
// mobileMissions.followTheWhiteRabbit.showMarkers(2);
//
// mobileMissions.followTheWhiteRabbit.markers[2].arrow.addClass("arrowPointDown");
//
// mobileMissions.followTheWhiteRabbit.markers[2].tip.position({
// of: document.getElementById("newsTabs"),
// my: "center bottom",
// at: "center top",
// collision: "none none"
// });
//
// mobileMissions.followTheWhiteRabbit.markers[2].arrow.position({
// of: mobileMissions.followTheWhiteRabbit.markers[2].tip,
// my: "center bottom",
// at: "center top-2px",
// collision: "none none"
// });
return;
}
if (isMobile) {
missionMarkers.positionMainMenuArrowOnMobile(1);
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 3);
return;
}
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 3);
};
tutorialFunction=63;
Tutorial.handleSubscribeAdminNews = () => {
if (missionDropdown.isOn('newspaper.html')) {
Tutorial.showElementsDuringMission('#esim-layout');
Tutorial.greyOutElements('.testDivwhite');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("subButton"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.NEWSPAPER);
};
tutorialFunction=64;
Tutorial.handleApplyMu = () => {
if (missionDropdown.isOn("myMilitaryUnit")) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("joinMU"), 1);
return;
}
if (missionDropdown.isOn("joinMilitaryUnit")) {
Tutorial.showElementsDuringMission('#esim-layout');
const applyBtn = document.querySelector('.muApplyButton[data-limit-reached="false"]');
if (applyBtn) {
missionMarkers.positionSmallArrowPointingDown((applyBtn), 1);
}
return;
}
if (missionDropdown.isOn("militaryUnitRecrutation")) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("applyToMuContainer"), 4);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.MY_MILITARY_UNIT);
};
tutorialFunction=65;
Tutorial.handleThirdFight = () => {
if (missionDropdown.isOn("battles")) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingDown(document.getElementById('practiceBattle'), 2);
return;
}
if (missionDropdown.isOn('battle.html')) {
missionMarkers.hideMarkers(1, 2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderSide"), 3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4);
document.getElementById('defenderSide').click(function() {
missionMarkers.hideMarkers(1, 2, 3);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4);
})
return;
}
missionMarkers.positionSmallArrowPointingUp(document.getElementById('taskButtonFight'), 1);
};
tutorialFunction=66;
Tutorial.handleMasterSergeant = () => {
if (missionDropdown.isOn("battle")) {
fightAjaxCallback = updateMissionProgress;
selectSide('defenderSide');
document.getElementById("esim-layout").style.zIndex=97;
if (document.getElementById("selectedWeapon").dataset.quality>0) {
if (Utils.getCookie("selectedSide")=='attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
}
} else {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("selectWeaponButton"), 4);
}
openWeaponCollapsibleCallback = function() {
missionMarkers.hideMarkers(4);
if (document.getElementById("selectedWeapon").dataset.quality==0) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("weaponSelection1"), 2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("weaponSelection1"), 2);
}
};
hideFoodAndWeaponCollapsibleCallback = function() {
missionMarkers.hideMarkers(2);
if (document.getElementById("selectedWeapon").dataset.quality==0) {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("selectWeaponButton"), 4);
}
};
selectWeaponCallback = function() {
if (document.getElementById("selectedWeapon").dataset.quality==0) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("selectWeaponButton"), 4);
missionMarkers.hideMarkers(3);
} else {
if (Utils.getCookie("selectedSide")=='attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
}
}
};
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=67;
Tutorial.handleSecondEquipment = () => {
if (missionDropdown.isOn("auctions.html")) {
Tutorial.showElementsDuringMission('#esim-layout');
const bidBtn = document.querySelector('.btn-buy.bid');
missionMarkers.positionSmallArrowPointingDown((bidBtn), 1);
bidAuctionAjaxCallback = updateMissionProgress;
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.AUCTIONS);
};
tutorialFunction=68;
Tutorial.handleBerserk = () => {
if (missionDropdown.isOn("battle.html")) {
selectSide('defenderSide');
fightAjaxCallback = updateMissionProgress;
document.getElementById("esim-layout").style.zIndex=97;
document.getElementById("attackerBerserkContainer").style.display="flex";
document.getElementById("defenderBerserkContainer").style.display="flex";
if (Utils.getCookie("selectedSide")=='attacker') {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("attackerBerserkContainer").querySelector(".checkmarkText"), 4);
}
else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderBerserkContainer").querySelector(".checkmarkText"), 4);
}
document.getElementById("attackerBerserkCheckbox").addEventListener("change", function () {
if (document.getElementById("attackerBerserkCheckbox").checked) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 3);
missionMarkers.hideMarkers(4);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("attackerBerserkContainer").querySelector(".checkmarkText"), 4);
missionMarkers.hideMarkers(3);
}
});
document.getElementById("defenderBerserkCheckbox").addEventListener("change", function () {
if (document.getElementById("defenderBerserkCheckbox").checked) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 3);
missionMarkers.hideMarkers(4);
} else {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderBerserkContainer").querySelector(".checkmarkText"), 4);
missionMarkers.hideMarkers(3);
}
});
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=69;
Tutorial.handleFourthWorkAndTrain = () => {
Tutorial.handleWorkAndTrainMission();
};
tutorialFunction=70;
Tutorial.handleSecondShout = () => {
if (missionDropdown.isOn('index.html')) {
setTimeout(() => {
document.getElementById('x2').click();
document.getElementById('togableShout').click();
missionMarkers.positionSmallArrowPointingDown(document.getElementById('shoutButton'), 1);
}, 500);
return;
}
if (isMobile) {
missionMarkers.positionMainMenuArrowOnMobile(1);
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.esim-logo'), 2);
return;
}
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.title-area'), 1);
};
tutorialFunction=71;
Tutorial.handleDealCriticalHits = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
selectSide('defenderSide');
Tutorial.showElementsDuringMission('.battle2022');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 4);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=72;
Tutorial.handleSendFriendProposal = () => {
if (missionDropdown.isOn('profile')) {
missionMarkers.hideMarkers(2, 4);
Tutorial.showElementsDuringMission('.login-bar');
let myElement = document.getElementById("addFriendMission");
if (myElement) {
missionMarkers.positionSmallArrowPointingUp(myElement, 3);
}
return;
}
const adminProfileId = 1;
CountryBallPortals.handlePortalByType(CountryBallPortalsType.PROFILE_BY_ID, adminProfileId);
};
tutorialFunction=73;
Tutorial.handleWeaponBerserk = () => {
if (missionDropdown.isOn("battle.html")) {
missionMarkers.hideMarkers(2, 5);
function isSelectedWeapon() {
if (document.getElementById("selectedWeapon").dataset.quality>0) {
if (Utils.getCookie("selectedSide")=='attacker') {
missionMarkers.hideMarkers(4)
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton1"), 2);
// document.getElementById("selectedWeapon").querySelector("#missionTip3").hide();
} else {
missionMarkers.hideMarkers(4)
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 2);
// document.getElementById("selectedWeapon").querySelector("#missionTip3").hide();
}
} else {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("selectWeaponButton"), 4);
}
}
function isSelectedAttackerBerserkCheckbox() {
if (document.getElementById("attackerBerserkCheckbox").checked) {
isSelectedWeapon();
} else {
missionMarkers.hideMarkers(2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("attackerBerserkContainer").querySelector(".checkmarkText"), 4);
}
}
function isSelectedDefenderBerserkCheckbox() {
if (document.getElementById("defenderBerserkCheckbox").checked) {
isSelectedWeapon();
} else {
missionMarkers.hideMarkers(2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("defenderBerserkContainer").querySelector(".checkmarkText"), 4);
}
}
function isSelectedBerserk() {
if (Utils.getCookie("selectedSide") === 'attacker') {
isSelectedAttackerBerserkCheckbox();
} else {
isSelectedDefenderBerserkCheckbox();
}
};
selectSide('defenderSide');
fightAjaxCallback = updateMissionProgress;
openWeaponCollapsibleCallback = function() {
missionMarkers.hideMarkers(2, 3, 4);
if (document.getElementById("selectedWeapon").dataset.quality==0) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("weaponSelection1"), 2);
}
};
hideFoodAndWeaponCollapsibleCallback = function() {
missionMarkers.hideMarkers(2, 3, 4);
isSelectedBerserk()
};
selectWeaponCallback = function() {
missionMarkers.hideMarkers(2, 3, 4);
isSelectedBerserk()
};
isSelectedBerserk();
document.getElementById("attackerBerserkCheckbox").addEventListener("change", function () {
isSelectedAttackerBerserkCheckbox();
});
document.getElementById("defenderBerserkCheckbox").addEventListener("change", function () {
isSelectedDefenderBerserkCheckbox();
});
document.getElementById("defenderNormalCheckbox").addEventListener("change", function () {
isSelectedDefenderBerserkCheckbox();
});
document.getElementById("attackerNormalCheckbox").addEventListener("change", function () {
isSelectedAttackerBerserkCheckbox();
});
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=74;
Tutorial.handleCommentArticle = () => {
if (missionDropdown.isOn('article.html')) {
function scrollToBottomOnce() {
scrollToBottomOnce = function() {};
Tutorial.functionCalledOnce = true;
Utils.scrollToBottom();
}
if (!Tutorial.functionCalledOnce) {
scrollToBottomOnce();
}
missionMarkers.positionSmallArrowPointingDown(document.getElementById('mobilePublishBtn'), 1);
return;
}
const articleId = 1;
CountryBallPortals.handlePortalByType(CountryBallPortalsType.ARTICLE_BY_ID, articleId);
};
tutorialFunction=75;
Tutorial.handleJoinParty = () => {
if (missionDropdown.isOn("selectedSite=PARTY")) {
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.partyMission'), 4);
document.querySelector(".mobileBtnStatsContainer").hide();
return;
}
if (missionDropdown.isOn("party.")) {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("command"), 5);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STATISTICS_BY_TYPE, StatisticsTypeForPortal.PARTY);
};
tutorialFunction=76;
Tutorial.handleFifthWorkAndTrain = () => {
Tutorial.handleWorkAndTrainMission();
};
tutorialFunction=77;
Tutorial.handleGet450Xp = () => {
if (missionDropdown.isOn('battle')) {
fightAjaxCallback = updateMissionProgress;
selectSide('defenderSide');
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=78;
Tutorial.handleCommentShout = () => {
if (missionDropdown.isOn('shouts')) {
Tutorial.showElementsDuringMission('#shoutTabs, #mobileCommentsContainer, #globalShouts');
const shoutBtn = document.querySelector('.ajaxShout');
if (shoutBtn) {
missionMarkers.positionSmallArrowPointingDown(shoutBtn, 1);
return;
}
missionMarkers.positionSmallArrowPointingUp(document.querySelector('.showShoutDetails'), 1);
document.querySelector('.showShoutDetails').click(function() {
setTimeout(function() {
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.ajaxShout'), 1)
}, 500);
});
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.SHOUTS);
};
tutorialFunction=79;
Tutorial.handleBuySteroids = () => {
if (missionDropdown.isOn('storageType=SPECIAL_ITEM')) {
Tutorial.showElementsDuringMission('.slide-in');
Utils.greyOutElementsExceptFirstOne('specialItemInventory');
missionMarkers.positionSmallArrowPointingUp(document.getElementById('buySteroidsMission'), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STORAGE_BY_TYPE, StorageTypeForPortal.SPECIAL_ITEM);
};
tutorialFunction=80;
Tutorial.handleFightFiveTimes = () => {
if (missionDropdown.isOn("battles")) {
missionMarkers.hideMarkers(1);
missionMarkers.positionSmallArrowPointingDown(document.getElementById('practiceBattle'), 2);
return;
}
if (missionDropdown.isOn('battle.html')) {
const defenderSide = document.querySelector(".selectedLeftSide");
defenderSide ? missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 2) : missionMarkers.positionSmallArrowPointingDown(defenderSide, 1)
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=81;
Tutorial.handleDepleteLimitsAgain = () => {
if (missionDropdown.isOn('battle.html')) {
const defenderSide = document.querySelector(".selectedLeftSide");
defenderSide ? missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 2) : missionMarkers.positionSmallArrowPointingDown(defenderSide, 1)
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=82;
Tutorial.handlePutOnThirdEq = () => {
if (missionDropdown.isOn('storage.html?storageType=EQUIPMENT')) {
function handleArrowWhenVisibleItemList() {
if (itemList.classList.contains('show')) {
missionMarkers.hideMarkers(1)
missionMarkers.positionSmallArrowPointingUp((itemButton), 2);
Tutorial.fixPointerSizeOnMobile();
} else {
missionMarkers.hideMarkers(2)
missionMarkers.positionSmallArrowPointingDown((itemSlot), 1);
}
}
Tutorial.showElementsDuringMission('.slide-in');
Tutorial.fixPointerSizeOnMobile();
const item = document.querySelector('.equipmentItem[data-id=""] > .equipmentList > .equipmentInStorage:not(.equippedItem)');
if (!item) return;
const itemList = document.querySelector('.equipmentList.show') || item.parentNode;
const itemSlot = itemList.parentNode;
const itemButton = itemList.querySelector('.btn-buy');
missionMarkers.positionSmallArrowPointingDown((itemSlot), 1);
Tutorial.greyOutElements('.equipmentItem[data-id]:not([data-id=""])');
handleArrowWhenVisibleItemList();
Equipment.toggleEquipmentListCallback = () => {
Tutorial.handlePutOnThirdEq();
}
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STORAGE_BY_TYPE, StorageTypeForPortal.EQUIPMENT);
}
};
tutorialFunction=83;
Tutorial.handleVoteShout = () => {
if (missionDropdown.isOn('shouts', 'index')) {
Tutorial.showElementsDuringMission('#shoutTabs, #mobileCommentsContainer, #globalShouts');
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.voteLink'), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.SHOUTS);
};
tutorialFunction=84;
Tutorial.handleTrainAndFight = () => {
const myTrainBtn = document.getElementById('taskButtonTrain');
const myWorkBtn = document.getElementById('taskButtonWork');
const myTaskFightButton = document.getElementById('taskButtonFight');
if (myTrainBtn) {
if (missionDropdown.isOn("train")) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("trainButton"), 1);
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAIN);
}
return;
}
console.log(missionDropdown.isOn("jobMarket"))
if (missionDropdown.isOn("jobMarket")) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.querySelector('#jobApply0'), 1);
Utils.greyOutElementsExceptFirstOne('job-offer-form');
return;
}
if (myWorkBtn) {
if (missionDropdown.isOn("work", "work2")) {
Tutorial.showElementsDuringMission('#esim-layout');
if (Utils.checkElementExists("jobMarketButton")) {
missionMarkers.positionSmallArrowPointingDown(document.getElementById("jobMarketButton"), 1);
} else {
missionMarkers.positionSmallArrowPointingUp(document.getElementById("workButton"), 1);
}
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.WORK);
}
return;
}
if (myTaskFightButton) {
if (missionDropdown.isOn("battle")) {
fightAjaxCallback = updateMissionProgress;
selectSide('defenderSide');
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
}
}
};
tutorialFunction=85;
Tutorial.handleTravelAbroad = () => {
if (missionDropdown.isOn('travel')) {
async function selectOtherCountryThanLoggedCitizenshipOnce() {
selectOtherCountryThanLoggedCitizenshipOnce = function() {};
Tutorial.functionCalledOnce = true;
await selectOtherCountryThanLoggedCitizenship();
}
if (!Tutorial.functionCalledOnce) {
selectOtherCountryThanLoggedCitizenshipOnce();
}
Tutorial.showElementsDuringMission('.TravelBack');
missionMarkers.positionSmallArrowPointingUp(document.getElementById('travelButton'), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAVEL);
};
tutorialFunction=86;
Tutorial.handleFightAbroad = () => {
if (missionDropdown.isOn("battle")) {
fightAjaxCallback = updateMissionProgress;
selectSide('defenderSide');
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=87;
//todo handle selecting country
// function removeDesktopHoverAction() {
// document.getElementById("productMarketProductType").onmouseenter = () => {};
// document.getElementById("productMarketProductType").onmouseleave = () => {};
// document.getElementById("productMarketProductTypeSelection").onmouseenter = () => {};
// document.getElementById("productMarketProductTypeSelection").onmouseleave = () => {};
// }
// function handleDesktopHoverAction() {
// document.getElementById("productMarketProductType").onmouseleave = () => {
// console.log("onmouseout1111")
// missionMarkers.positionSmallArrowPointingDown(document.getElementById("productMarketProductType"), 1);
// }
// document.getElementById("productMarketProductType").onmouseenter = () => {
// console.log("onmouseover")
// missionMarkers.positionSmallArrowPointingUp(document.getElementById("option_WEAPON"), 1);
// }
// document.getElementById("productMarketProductTypeSelection").onmouseleave = () => {
// console.log("onmouseout2222")
// missionMarkers.positionSmallArrowPointingDown(document.getElementById("productMarketProductType"), 1);
// }
// document.getElementById("productMarketProductTypeSelection").onmouseenter = () => {
// missionMarkers.positionSmallArrowPointingUp(document.getElementById("option_WEAPON"), 1);
// }
// }
tutorialFunction=88;
Tutorial.handleBackHome = () => {
const travelPage = missionDropdown.isOn('travel.html');
const handleTravelPage = async () => {
Tutorial.showElementsDuringMission('.TravelBack');
await selectSameCountryAsLoggedCitizenship();
missionMarkers.positionSmallArrowPointingUp(document.getElementById("travelButton"), 1);
};
if (travelPage) {
handleTravelPage();
} else {
CountryBallPortals.handlePortalByType(CountryBallPortalsType.TRAVEL);
}
};
tutorialFunction=89;
Tutorial.handleSendReflink = () => {
if (missionDropdown.isOn("inviteFriends")) {
missionMarkers.hideMarkers(1);
missionMarkers.showMarkers(2);
const mobileOffset = isMobile ? '-74' : '-24';
missionMarkers.markers[2].arrow.addClass('arrowPointUp');
missionMarkers.markers[2].tip.position({
of: document.getElementById("personalReflink"),
my: "center bottom",
at: "center top" + mobileOffset,
collision: "none none"
});
return;
}
if (isMobile) {
missionMarkers.appendRedArrowToElement(document.getElementById('inviteFriendslink'));
missionMarkers.positionMainMenuArrowOnMobile(1);
missionMarkers.positionMainMenuElementArrowOnMobile(document.getElementById("myPlaces"), 2);
return;
}
missionMarkers.positionSmallArrowPointingUp(document.getElementById("myPlaces"), 1);
};
tutorialFunction=90;
//TODO MOBILNA WRSJA
Tutorial.handleMotiveSomeone = () => {
if (missionDropdown.isOn('statistics.html?selectedSite=NEW_CITIZEN')) {
if (isMobile) {
document.getElementById('newCitizensContainer').prependTo(document.getElementById('esim-layout'));
}
const notLoggedCitizenToSelect = document.querySelector('#motivateMission[data-id]:not([data-id=""]');
Tutorial.hideElementsDuringMission('.personalizedPromotions');
Tutorial.showElementsDuringMission('#newCitizensContainer');
missionMarkers.positionSmallArrowPointingUp(notLoggedCitizenToSelect, 1);
function showStatusOnce() {
showStatusOnce = function() {};
Tutorial.functionCalledOnce = true;
Utils.showStatus(Tutorial.noActionToMotivate, true);
}
if (!notLoggedCitizenToSelect && !Tutorial.functionCalledOnce) {
showStatusOnce();
}
return;
}
if (missionDropdown.isOn('motivateCitizen', 'motivateCItizen')) {
Tutorial.showElementsDuringMission('#esim-layout')
missionMarkers.positionSmallArrowPointingDown(document.getElementById("motivateCitizenGift"), 2);
document.getElementById('motivateCitizenGift').addEventListener("click", function() {
missionMarkers.hideMarkers(2);
missionMarkers.positionSmallArrowPointingDown(document.getElementById("motivateButton"), 3);
})
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STATISTICS_BY_TYPE, StatisticsTypeForPortal.NEW_CITIZEN);
};
tutorialFunction=91;
Tutorial.handleWritePrivateMessage = () => {
if (missionDropdown.isOn('composeMessage.')) {
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("sendButton"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.MESSAGE);
};
tutorialFunction=92;
Tutorial.handleSubscribeNewspaper = () => {
if (missionDropdown.isOn('newspaper.html')) {
Tutorial.showElementsDuringMission('#esim-layout');
Tutorial.greyOutElements('.testDivwhite');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("subButton"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.NEWSPAPER);
};
tutorialFunction=93;
Tutorial.handleSeventhWorkAndTrain = () => {
Tutorial.handleWorkAndTrainMission();
};
tutorialFunction=94;
Tutorial.handleForeignFriends = () => {
if (missionDropdown.isOn('profile.html')) {
Tutorial.showElementsDuringMission('.login-bar');
const myElement = document.getElementById("addFriendMission");
if (myElement) {
missionMarkers.positionSmallArrowPointingUp(myElement, 1);
return;
}
}
if (missionDropdown.isOn('statistics.html?selectedSite=CITIZEN')) {
const otherCitizenshipThanLogged = document.querySelector('td[data-tutorial="true"]');
Tutorial.showElementsDuringMission('#citizensContainer');
missionMarkers.positionSmallArrowPointingUp((otherCitizenshipThanLogged), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STATISTICS_BY_TYPE, StatisticsTypeForPortal.CITIZEN);
};
tutorialFunction=95;
Tutorial.handleUseMedkit = () => {
if (missionDropdown.isOn("storage.html")) {
Tutorial.showElementsDuringMission('.slide-in');
Utils.greyOutElementsExceptFirstOne('specialItemInventory');
missionMarkers.positionSmallArrowPointingUp(document.getElementById('useMedkitMission'), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STORAGE_BY_TYPE, StorageTypeForPortal.SPECIAL_ITEM);
};
tutorialFunction=96;
Tutorial.handleDmgInRound = () => {
if (missionDropdown.isOn("battle.html")) {
fightAjaxCallback = updateMissionProgress;
Tutorial.showElementsDuringMission('#esim-layout');
const defenderSide = document.querySelector(".selectedLeftSide");
defenderSide.classList.contains("active") ? missionMarkers.positionSmallArrowPointingDown(document.getElementById("fightButton0"), 2) : missionMarkers.positionSmallArrowPointingDown(defenderSide, 1)
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
tutorialFunction=97;
Tutorial.handleOutbidPlayers = () => {
if (missionDropdown.isOn("auctions")) {
bidAuctionAjaxCallback = updateMissionProgress;
Tutorial.showElementsDuringMission('.auctionOfferList');
const bidBtn = document.querySelector('.btn-buy.bid');
if (bidBtn) {
missionMarkers.positionSmallArrowPointingDown(bidBtn, 1);
} else if (!Tutorial.functionCalledOnce) {
Tutorial.showStatusOnce(Tutorial.noActionToBid);
}
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.AUCTIONS);
};
tutorialFunction=98;
Tutorial.handleWeaponUp = () => {
if (missionDropdown.isOn("battle.html")) {
Tutorial.handleBattleWithWeaponActions();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BATTLE);
};
Tutorial.handleAdventureGame = () => {
if (missionDropdown.isOn("adventureForMission.html")) {
gameRoomTutorialProgression = updateMissionProgress;
const lootBar = document.querySelector('.lootBar');
let lootBarStep;
if (lootBar) {
lootBarStep = Number(lootBar.dataset.step);
}
Tutorial.showElementsDuringMission('#esim-layout');
const btn = document.querySelector('#adventureContentBox button.green:not(:disabled)');
if (btn) {
missionMarkers.positionSmallArrowPointingUp(btn, 1);
} else {
if (lootBar === null || lootBarStep < 3) {
missionMarkers.positionSmallArrowPointingDown(document.querySelector(".gameContent"), 1);
} else {
missionMarkers.hide(1);
}
}
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.ADVENTURE_GAME);
};
Tutorial.handleBanditGame = () => {
if (missionDropdown.isOn("banditForMission.html")) {
gameRoomTutorialProgression = updateMissionProgress;
Tutorial.showElementsDuringMission('#esim-layout');
missionMarkers.positionSmallArrowPointingUp(document.getElementById("banditBodyPlay"), 1);
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.BANDIT_GAME);
};
Tutorial.handleDiceGame = () => {
if (missionDropdown.isOn("diceForMission.html")) {
gameRoomTutorialProgression = updateMissionProgress;
Tutorial.showElementsDuringMission('#esim-layout');
const rollBtn = document.querySelector(".rollButton");
const rerollBtn = document.querySelector(".rerollButton");
const claimButton = document.querySelector(".claimButton");
missionMarkers.positionSmallArrowPointingUp(rollBtn, 1);
const dices = document.querySelectorAll('.diceSpace > .dieBox');
const counts = {};
const diceByClass = {};
Array.from(dices).forEach(die => {
const showClass = Array.from(die.classList).find(c => c.startsWith("show_"));
counts[showClass] = (counts[showClass] || 0) + 1;
if (!diceByClass[showClass]) diceByClass[showClass] = [];
diceByClass[showClass].push(die);
});
const maxCount = Math.max(...Object.values(counts));
if (maxCount >= 3 && claimButton.is(":visible")) {
missionMarkers.positionSmallArrowPointingUp(claimButton, 1);
} else if (maxCount === 2) {
const duplicateClass = Object.keys(counts).find(k => counts[k] === 2);
const otherDie = Array.from(dices).find(die => !die.classList.contains(duplicateClass));
if (otherDie && !rollBtn.is(":visible")) {
let arrowOnDie = true;
missionMarkers.positionSmallArrowPointingDown(otherDie, 4);
otherDie.addEventListener("click", () => {
if (arrowOnDie) {
missionMarkers.positionSmallArrowPointingUp(rerollBtn, 4);
} else {
missionMarkers.positionSmallArrowPointingDown(otherDie, 4);
}
arrowOnDie = !arrowOnDie;
});
}
}
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.DICE_GAME);
};
Tutorial.handleShooterGame = () => {
if (missionDropdown.isOn("shooterForMission.html")) {
Tutorial.showElementsDuringMission('#esim-layout');
gameRoomTutorialProgression = updateMissionProgress;
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.SHOOTER_GAME);
};
Tutorial.handleMergeEquipment = () => {
if (missionDropdown.isOn("storage.html?storageType=EQUIPMENT_LIST")) {
EquipmentList.equipmentActionCallback = updateMissionProgress;
Tutorial.showElementsDuringMission('#esim-layout');
const floatMergeBtn = document.getElementById("floatinMergeButton");
const container = document.querySelector(".storageEquipment");
if (isMobile && !container.spacer) {
const spacer = Utils.makeDiv('w-100');
spacer.style.height = '400px';
container.spacer = spacer;
container.appendChild(spacer);
}
floatMergeBtn.addEventListener("click", () => {
const steps = {'.modalFooter > .btn-buy': 'bottom'};
missionMarkers.hideMarkers(1);
setTimeout(function() {
missionMarkers.setPointerOnElement(steps);
}, 200);
});
const mergeButtons = Array.from(document.querySelectorAll(".mergeItemForm"));
const getNextButton = () => mergeButtons.find(btn => !btn.classList.contains("clicked") && !btn.classList.contains("disabled"));
const updateArrow = () => {
const nextBtn = getNextButton();
if (nextBtn) {
Tutorial.restoreGreyedElements('#equipmentTable');
missionMarkers.positionSmallArrowPointingDown(nextBtn, 1);
} else {
Tutorial.greyOutElements('#equipmentTable');
missionMarkers.positionSmallArrowPointingUp(floatMergeBtn, 1);
}
};
let scheduled = false;
const scheduleUpdate = () => {
if (scheduled) return;
scheduled = true;
requestAnimationFrame(() => {
updateArrow();
scheduled = false;
});
};
if (!Tutorial.mergeObserver) {
Tutorial.mergeObserver = new MutationObserver(records => {
const relevant = records.some(r =>
r.type === "attributes" &&
r.attributeName === "class" &&
r.target.classList.contains("mergeItemForm")
);
if (relevant) scheduleUpdate();
});
Tutorial.mergeObserver.observe(container, { subtree: true, attributes: true, attributeFilter: ["class"] });
}
mergeButtons.forEach(btn => {
if (!btn._tutorialClickHandler) {
btn._tutorialClickHandler = () => {
btn.classList.toggle("clicked");
scheduleUpdate();
};
btn.addEventListener("click", btn._tutorialClickHandler);
}
});
scheduleUpdate();
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STORAGE_BY_TYPE, StorageTypeForPortal.EQUIPMENT_LIST
);
};
Tutorial.handleSplitEquipment = () => {
if (missionDropdown.isOn("storage.html?storageType=EQUIPMENT_LIST")) {
return;
}
CountryBallPortals.handlePortalByType(CountryBallPortalsType.STORAGE_BY_TYPE, StorageTypeForPortal.EQUIPMENT_LIST);
};
Tutorial._resolveReady();
Tutorial.ready.then(() => {
console.log("%cTutorial is fully loaded and ready!", "color: green; font-weight: bold;");
});
</script>
<script src="//vara.e-sim.org/cdn/static/js/tutorialMissionHandlers.js?v=1"></script>
<div id="missionReload">
<div class="missionTip missionTipTest testTipAnimation2" id="missionTip1" style="position: fixed !important;pointer-events:none; border: unset !important; width: unset !important; height: unset !important; padding: 0 !important">
<img id="missionPointer" src="//vara.e-sim.org/cdn/static/img/pointerOutlinedPNG.png" class="testTipAnimation pointer-animation" style="width: 5vw; height: auto;filter: drop-shadow(0px 0px 2px black) drop-shadow(0px 0px 2px black);"/>
</div>
<div class="missionTip missionTipTest testTipAnimation2" id="missionTip2" style="position: fixed !important;pointer-events:none; border: unset !important; width: unset !important; height: unset !important; padding: 0 !important">
<img id="missionPointer" src="//vara.e-sim.org/cdn/static/img/pointerOutlinedPNG.png" class="testTipAnimation pointer-animation" style="width: 5vw; height: auto;filter: drop-shadow(0px 0px 2px black) drop-shadow(0px 0px 2px black);"/>
</div>
<div class="missionTip missionTipTest testTipAnimation2" id="missionTip3" style="position: fixed !important;pointer-events:none; border: unset !important; width: unset !important; height: unset !important; padding: 0 !important">
<img id="missionPointer" src="//vara.e-sim.org/cdn/static/img/pointerOutlinedPNG.png" class="testTipAnimation pointer-animation" style="width: 5vw; height: auto;filter: drop-shadow(0px 0px 2px black) drop-shadow(0px 0px 2px black);"/>
</div>
<div class="missionTip missionTipTest testTipAnimation2" id="missionTip4" style="position: fixed !important;pointer-events:none; border: unset !important; width: unset !important; height: unset !important; padding: 0 !important">
<img id="missionPointer" src="//vara.e-sim.org/cdn/static/img/pointerOutlinedPNG.png" class="testTipAnimation pointer-animation" style="width: 5vw; height: auto;filter: drop-shadow(0px 0px 2px black) drop-shadow(0px 0px 2px black);"/>
</div>
<div class="missionTip missionTipTest testTipAnimation2" id="missionTip5" style="position: fixed !important;pointer-events:none; border: unset !important; width: unset !important; height: unset !important; padding: 0 !important">
<img id="missionPointer" src="//vara.e-sim.org/cdn/static/img/pointerOutlinedPNG.png" class="testTipAnimation pointer-animation" style="width: 5vw; height: auto;filter: drop-shadow(0px 0px 2px black) drop-shadow(0px 0px 2px black);"/>
</div>
<script>
window.missionConfig = {
tutorialDebug: false,
currentMission: {
missionNumber: Number('10'),
type: "SECOND_WORK",
awaitingStart: Boolean(false),
inProgress: Boolean(true),
isCompleted: Boolean(false),
maxProgress: Number(),
actualProgress: Number(),
},
lastMissionOfDay1Type: "DEAL_DAMAGE_FOR_TEST",
lastMissionOfDay2Type: "DEAL_DAMAGE_III",
noMissionsToday: Boolean(true),
allMissionsCompleted: Boolean(false),
loggedCitizenId: 26,
staticServer: "//vara.e-sim.org/cdn/static",
progressCheckpointsSelector: "",
translations: {
skip: "Saltar",
cancel: "Cancelar",
skipText: "¿Estás seguro de que quieres saltarte esta misión?",
skipTitle: "Saltar confirmación de misión",
noReward: "No obtendrás recompensa si te saltas la misión",
},
isTrainMission: false,
isTrainWorkMissions: false,
isWorkMission: true,
isTrainFightMission: false,
};
</script>
<div id="dialog-confirm4" style="display:none;" title="Saltar confirmación de misión">
<p><span class="ui-icon ui-icon-alert"
style="float: left; margin: 0 7px 20px 0;"></span>¿Estás seguro de que quieres saltarte esta misión?</p>
<p><span class="ui-icon ui-icon-notice"
style="float: left; margin: 0 7px 20px 0;"></span><b>No obtendrás recompensa si te saltas la misión</b></p>
</div>
<div id="missionDropdown" class="missionDropdown bubbleSpeech">
<script>
var GenericTimer = (function () {
"use strict";
let optionalMessage = undefined;
let callback = undefined;
let frozen = false;
const getSpecifiedTimeValueSimple = function (mainValue, unit) {
return mainValue > 0 ? mainValue + unit + ' ' : '';
};
const getSpecifiedTimeValue = function (mainValue, basedOnValue, unit) {
if (mainValue === 0 && basedOnValue > 0) {
return '0' + unit + ' ';
} else if (mainValue > 0) {
return mainValue + unit + ' ';
}
return '';
};
const pad = v => String(v).padStart(2, '0');
const showUnit = (value, higherUnitValue) => { return value > 0 || higherUnitValue > 0; };
const formatCountdown = function ({ days, hours, minutes, seconds }) {
let output = '';
if (showUnit(days, 0)) output += pad(days) + ':';
if (showUnit(hours, days)) output += pad(hours) + ':';
if (showUnit(minutes, hours + days)) output += pad(minutes) + ':';
output += pad(seconds); // always show seconds
return output;
};
return {
bindTimerToHtmlElement: function (destinationTimeInMilliseconds, domElementThatDisplayTimer) {
"use strict";
if (!Utils.isTypeProper('Number', destinationTimeInMilliseconds, 'destinationTimeInSeconds', 'GenericTimer.bindTimerToHtmlElement')
|| !Utils.isOneOfGivenTypesProper(['HTMLDivElement', 'HTMLSpanElement'], domElementThatDisplayTimer, 'domElementThatDisplayTimer', 'GenericTimer.bindTimerToHtmlElement')) {
return;
}
let interval = setInterval(function () {
"use strict";
if (frozen) {
return;
}
let now = new Date().getTime();
let distance = destinationTimeInMilliseconds - now;
let days = Math.floor(distance / (1000 * 60 * 60 * 24));
let hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
let minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
let seconds = Math.floor((distance % (1000 * 60)) / 1000);
const output = formatCountdown({ days, hours, minutes, seconds });
if (distance < 0) {
clearInterval(interval);
if (optionalMessage !== undefined) {
domElementThatDisplayTimer.innerHTML = optionalMessage;
}
if (callback !== undefined) {
callback();
}
return;
}
domElementThatDisplayTimer.innerHTML = output;
}, 1000);
},
setOptionalMessage: function (value) {
if (!Utils.isTypeProper('String', value, 'value', 'GenericTimer.setOptionalMessage')) {
return
}
optionalMessage = value;
},
setCallback: function (value) {
if (!Utils.isTypeProper('Function', value, 'value', 'GenericTimer.setCallback')) {
return
}
callback = value;
},
setFrozen: function (bool) {
frozen = bool;
}
}
});
</script>
<div class="header">No hay más misiones disponibles hoy!</div>
<div id="cdToNextDay" class="greenFont"></div>
<script>
function handleNoNewMissions() {
const firstDayPushesCookie = getPushesCookie();
if (firstDayPushesCookie != "shown") {
setTimeout(function() { $("#startMission").click(); }, 200);
}
document.cookie = "firstDayPushes=shown";
setTimeout(function () {
showMissionCenter();
}, 250)
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', handleNoNewMissions);
} else {
handleNoNewMissions()
}
function showMissionCenter() {
const isMissionCenterShow = Utils.getItemFromLocalStorage('isMissionCenterPanelShow') === 'true';
const isAllMissionsCompleted = 'false' === 'true';
const isTestOn = '' === 'true' && 'true' === 'true';
const shouldShowPanel = isTestOn || isMissionCenterShow || isAllMissionsCompleted;
// MissionCenterModal.toggleMissionCenterPanel(shouldShowPanel);
setTimeout(function () {
MissionCenterModal.toggleTutorialPanel(!shouldShowPanel);
}, 250)
}
function getPushesCookie() {
var name = "firstDayPushes=";
var ca = document.cookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length,c.length);
}
}
return "";
}
(function () {
let startText = document.getElementById('cdToNextDay');
let timeToGo = Number('1776722340000');
console.log(1776722340000)
let timer = new GenericTimer();
timer.bindTimerToHtmlElement(timeToGo, startText);
})();
</script>
</div>
</div>
<link href="//vara.e-sim.org/cdn/static/css/countryBallBossStyle.css" type="text/css" rel="stylesheet">
<span id="dealDamageText" style="display:none;">¡Excelente esfuerzo!</span>
<script>
var CountryBallMissionType = {
FIRST_TRAIN: 'FIRST_TRAIN',
FIND_JOB: 'FIND_JOB',
FIRST_WORK: 'FIRST_WORK',
SIMPLIFIED_FIGHT: 'SIMPLIFIED_FIGHT',
SIMPLIFIED_FIGHT_USE_FOOD: 'SIMPLIFIED_FIGHT_USE_FOOD',
TRAVEL_TO_CAPITAL: 'TRAVEL_TO_CAPITAL',
CHECK_NOTIFICATIONS: 'CHECK_NOTIFICATIONS',
GET_NEW_ACHIEVEMENT: 'GET_NEW_ACHIEVEMENT',
DEAL_DAMAGE_FOR_TEST: 'DEAL_DAMAGE_FOR_TEST',
SECOND_WORK: 'SECOND_WORK',
SECOND_TRAIN: 'SECOND_TRAIN',
DEAL_DAMAGE_I: 'DEAL_DAMAGE_I',
AUCTION_BUY_EQ: 'AUCTION_BUY_EQ',
AUCTION_SELL_EQ: 'AUCTION_SELL_EQ',
STAFF_SERGEANT: 'STAFF_SERGEANT',
DEAL_DAMAGE_II: 'DEAL_DAMAGE_II',
SIMPLIFIED_FIGHT_WITH_WEAPON: 'SIMPLIFIED_FIGHT_WITH_WEAPON',
DEAL_DAMAGE_III: 'DEAL_DAMAGE_III',
DEAL_DAMAGE: 'DEAL_DAMAGE',
};
var CountryBallBoss = {
loggedPlayerCitizenship: 'USA',
loggedPlayerCitizenshipShortName: 'US',
container: undefined,
position: {
unit: {
pixel: 'px',
percent: '%',
},
outsideScreen: {
x: 1500,
y: isMobile ? 250 : 25,
},
},
travelForm: undefined,
boss: {
name: 'Camarada Chaosball',
translatedText: {
[CountryBallMissionType.FIRST_TRAIN]: 'Practica mientras puedas.',
[CountryBallMissionType.FIND_JOB]: '¡Ja! ¡No tienes habilidades!',
[CountryBallMissionType.FIRST_WORK]: '¡Trabajarás para mí!',
[CountryBallMissionType.SIMPLIFIED_FIGHT]: {
start: 'Tu tiempo ha llegado.',
end: "No siempre será tan fácil.",
},
[CountryBallMissionType.SIMPLIFIED_FIGHT_USE_FOOD]: '',
[CountryBallMissionType.TRAVEL_TO_CAPITAL]: "Te he estado esperando.",
[CountryBallMissionType.CHECK_NOTIFICATIONS]: '',
[CountryBallMissionType.GET_NEW_ACHIEVEMENT]: {
start: 'Bueno, bueno, ¿qué tenemos aquí?',
end: 'No mucho, para nada.',
},
[CountryBallMissionType.DEAL_DAMAGE_FOR_TEST]: {
start: 'Tu tiempo ha llegado.',
mid: '¡Mis armas son más grandes que las tuyas!',
end: 'Esto es solo el principio...'
},
[CountryBallMissionType.SECOND_WORK]: "¿Segundo trabajo? Esfuerzo débil.",
[CountryBallMissionType.SECOND_TRAIN]: "¿Segundo tren? Apenas intentando.",
[CountryBallMissionType.DEAL_DAMAGE_I]: {
start: "¿Infligir daño? He visto mejores.",
mid: "¿Eso es todo lo que puedes hacer? Patético.",
end: "¡Tendrás que hacerlo mucho mejor!",
},
[CountryBallMissionType.AUCTION_SELL_EQ]: "Jajaja, intento patético",
[CountryBallMissionType.STAFF_SERGEANT]: {
start: "Tu rendimiento fue débil.",
end: "¡Mejora tu juego, perdedor!",
},
[CountryBallMissionType.DEAL_DAMAGE_II]: {
start: "¡Actuación patética!",
mid: "¿Llamas a eso luchar?",
end: "He visto a niños pequeños golpear más fuerte.",
},
[CountryBallMissionType.SIMPLIFIED_FIGHT_WITH_WEAPON]: "¡Necesitas una mejora seria!",
[CountryBallMissionType.DEAL_DAMAGE_III]: {
start: "¡Actuación patética!",
mid: document.getElementById('dealDamageText').innerText,
end: "Intento patético",
},
},
},
tutorialBall: {
translatedText: {
[CountryBallMissionType.FIRST_TRAIN]: 'Aquí puedes volverte más fuerte.',
[CountryBallMissionType.FIND_JOB]: 'Bueno... necesitamos dinero.',
[CountryBallMissionType.FIRST_WORK]: 'Se le pagará por cada día.',
[CountryBallMissionType.SIMPLIFIED_FIGHT]: '¡Solo patea su trasero!',
[CountryBallMissionType.SIMPLIFIED_FIGHT_USE_FOOD]: 'Usa comida o bebidas para regenerarte.',
[CountryBallMissionType.TRAVEL_TO_CAPITAL]: "Puedes volar a otra región.",
[CountryBallMissionType.CHECK_NOTIFICATIONS]: 'Aquí está la información importante.',
[CountryBallMissionType.GET_NEW_ACHIEVEMENT]: 'Esta es tu sala de trofeos.',
[CountryBallMissionType.DEAL_DAMAGE_FOR_TEST]: {
start: "¡Tú puedes!",
end: "No dejes que te intimide.",
},
[CountryBallMissionType.SECOND_WORK]: "Trabajando ganas dinero.",
[CountryBallMissionType.SECOND_TRAIN]: "Te estás volviendo más fuerte.",
[CountryBallMissionType.DEAL_DAMAGE_I]: {
start: "Sigue así",
mid: "¡Sigue infligiendo ese daño!",
end: "¡Buen trabajo! ¡Estás mejorando!",
},
[CountryBallMissionType.AUCTION_SELL_EQ]: "Aquí puedes vender artículos en subasta.",
[CountryBallMissionType.STAFF_SERGEANT]: {
start: "¡Te estás volviendo más fuerte!",
end: "¡Gran trabajo!",
},
[CountryBallMissionType.DEAL_DAMAGE_II]: {
start: "¡Estás mejorando cada día!",
mid: "¡Trabajo fantástico!",
end: "¡Sigue adelante!",
},
[CountryBallMissionType.SIMPLIFIED_FIGHT_WITH_WEAPON]: "¡Impresionante trabajo en la batalla!",
[CountryBallMissionType.DEAL_DAMAGE_III]: {
start: "¡Bien hecho! ¡Sigue así!",
mid: document.getElementById('dealDamageText').innerText,
end: "¡Increíble!",
},
}
},
}
</script>
<script src="//vara.e-sim.org/cdn/static/js/countryballBoss.js"></script>
<script>
var tutorialDebug = window.missionConfig.tutorialDebug;
const skip = window.missionConfig.translations.skip;
const cancel = window.missionConfig.translations.cancel;
const skipText = window.missionConfig.translations.skipText;
const skipTitle = window.missionConfig.translations.skipTitle;
const noReward = window.missionConfig.translations.noReward;
document.addEventListener('click', (event) => {
const skipBtn = event.target.closest('#skipMissionForm input[type="button"]');
if (!skipBtn) return;
event.preventDefault();
DefaultModal.showFormModal({
title: skipTitle,
message: skipText + "<br>" + noReward,
gridColumns: 1,
submitText: skip,
cancelText: cancel,
onConfirm: () => document.getElementById('skipMissionForm').submit()
});
});
function isInViewport(elem) {
let distance = elem.getBoundingClientRect();
return (
distance.top >= 0
&& distance.left >= 0
&& distance.bottom <= (window.innerHeight || document.documentElement.clientHeight)
&& distance.right <= (window.innerWidth || document.documentElement.clientWidth)
);
};
var missionDropdown = {
blackBackground: null,
loggedCitizenshipId: null,
missionDropdown: null,
myArrow: null,
closeButton: null,
topBarIcon: null,
skipMissionPanel: null,
receiveRewardPanel: null,
inProgressPanel: null,
startPanel: null,
tutorialPanel: null,
tutorialCB: null,
tutorialCBEyes: null,
//new rewardPanel for tests
militaryCrateOpenPanel: null,
militaryCrateClosePanel: null,
isStartMissionRequestInProgress: false,
isRewardMissionRequestInProgress: false,
animationProgressTest: true,
initialize: function() {
this.missionDropdown = document.getElementById('missionDropdown');
this.myArrow = document.getElementById('missionDropdownArrow');
this.skipMissionPanel = document.getElementById('skipMissionPanel');
this.receiveRewardPanel = document.getElementById('receiveRewardPanel');
this.inProgressPanel = document.getElementById('inProgressPanel');
this.startPanel = document.getElementById('startPanel');
this.tutorialPanel = document.getElementById('tutorialPanel');
this.militaryCrateOpenPanel = document.getElementById('militaryCrateContainerOpen');
this.militaryCrateClosePanel = document.getElementById('militaryCrateContainerClose');
this.tutorialCB = document.getElementById('tutorialCB');
this.tutorialCBEyes = document.getElementById('tutorialCBEyes');
this.topBarIcon = document.getElementById('startMission');
this.topBarIcon.onclick = () => missionDropdown.toggle();
this.loggedCitizenshipId = window.missionConfig.loggedCitizenId;
if (isMobile) {
this.missionDropdown.classList.add("mobileView");
const missionTip = document.querySelector('.missionTip');
if (missionTip) missionTip.classList.add("mobileView");
const rewardContainer = document.querySelector('.rewardContainer');
if (rewardContainer) rewardContainer.classList.add("mobileView");
const welcomeMsg = document.getElementById('welcomeTutorialMsg');
if (welcomeMsg) welcomeMsg.classList.add("mobileView");
this.hideMentorChat();
}
},
isOn: (...pages) => {
return pages.some(p => window.location.href.includes(p));
},
disableBallToggleClickEvent: function() {
missionDropdown.tutorialCBEyes.onclick = missionDropdown.rewardMission;
},
enableBallToggleClickEvent: function() {
missionDropdown.tutorialCBEyes.onclick = missionDropdown.toggle;
},
makeBlackBackground: function() {
const div = document.createElement('div');
div.id = "blackBackground";
div.classList.add('blackBackground');
return div;
},
showBlackBackground: function() {
let blackBackground = document.querySelector('#blackBackground');
if (!blackBackground) {
blackBackground = this.makeBlackBackground();
document.body.prepend(blackBackground);
}
blackBackground.classList.remove('fadeOut');
blackBackground.classList.add('fadeIn');
blackBackground.style.opacity = '1';
blackBackground.style.visibility = 'visible';
},
hideBlackBackground: function() {
const blackBackground = document.querySelector('#blackBackground');
if (!blackBackground) return;
blackBackground.classList.remove('fadeIn');
blackBackground.classList.add('fadeOut');
blackBackground.style.opacity = '0';
blackBackground.style.visibility = 'hidden';
},
setMissionIsInProgress: function() {
if (!window.missionConfig.isMissionAwaitingStart) {
return;
}
window.missionConfig.isMissionAwaitingStart = false;
window.missionConfig.isMissionInProgress = true;
},
hideMentorChat: function () {
let mentorChat = document.getElementsByClassName("mentor_chat")[0];
let href = window.location.href;
if (mentorChat !== undefined) {
href.includes("index") ? mentorChat.style.display = "flex" : mentorChat.style.display = "none";
}
},
showRewardModal() {
if (tutorialDebug)
console.log("tutorial ScriptTest - showRewardModal()");
missionDropdown.showMissionCompletedPanel();
missionDropdown.toggleShow();
},
isVisible: function() {
if (!this.missionDropdown) return;
return this.missionDropdown.classList.contains('visible');
},
toggleShow: function(){
Utils.eraseCookie("hideMissionDropdown");
this.missionDropdown.classList.remove('closedByUser');
this.positionDropdown();
},
show: function(){
if (!!Utils.getCookie("hideMissionDropdown")) {
this.missionDropdown.classList.add('closedByUser');
return;
}
if (tutorialDebug)
console.log("tutorial ScriptTest - show()");
missionDropdown.showBlackBackground();
Utils.eraseCookie("hideMissionDropdown");
this.missionDropdown.classList.remove('closedByUser');
this.positionDropdown();
},
hide: function(closedByUser) {
Utils.setCookie("hideMissionDropdown", true, 2);
if (closedByUser) {
this.missionDropdown.classList.add('closedByUser');
}
if (tutorialDebug)
console.log("tutorial ScriptTest - hide()");
missionMarkers.hide();
missionDropdown.hideBlackBackground();
this.missionDropdown.classList.remove('visible', 'fadeIn');
// setTimeout(() => {
if (!this.topBarIcon.classList.contains("blank-icon")) {
this.tutorialPanel.classList.add('shakeOften');
}
// }, 500);
},
minimize: function() {
this.missionDropdown.classList.remove("visible", 'fadeIn');
},
positionDropdown: function() {
if (!this.missionDropdown) return;
if (this.missionDropdown.classList.contains('closedByUser')) {
this.hide(false);
return;
}
if (tutorialDebug) console.log("tutorial ScriptTest - positionDropdown()");
const mobileOffset = isMobile ? '40': '20';
const mobileOffset2 = isMobile ? '30': '20';
const dropdown = missionDropdown.missionDropdown;
const positionAndShow = () => {
if (!this.tutorialCB || !dropdown) return;
dropdown.style.opacity = 0;
const rect = this.tutorialCB.getBoundingClientRect();
const viewportWidth = window.innerWidth;
const viewportHeight = window.innerHeight;
let left = rect.right - mobileOffset2;
if (left + dropdown.offsetWidth > viewportWidth) {
left = rect.left - dropdown.offsetWidth - 10;
if (left < 0) {
left = 10;
}
}
if (left + dropdown.offsetWidth > viewportWidth) {
left = viewportWidth - dropdown.offsetWidth - 10;
}
let top = rect.top;
// console.log(top, rect.top, top + dropdown.offsetHeight > viewportHeight, rect.bottom, dropdown.offsetHeight)
if (top + dropdown.offsetHeight > viewportHeight) {
top = rect.bottom - dropdown.offsetHeight - mobileOffset;
if (top < 0) {
top = 10;
}
}
if (top < 0) {
top = 10;
}
dropdown.style.position = "fixed";
dropdown.style.left = left + "px";
dropdown.style.top = top + "px";
dropdown.classList.add("visible", "fadeIn");
requestAnimationFrame(() => {
dropdown.style.opacity = 1;
});
};
const img = dropdown.querySelector('img');
if (img && !img.complete) {
img.onload = positionAndShow;
setTimeout(positionAndShow, 200);
} else {
setTimeout(positionAndShow, 10);
}
},
toggle: function(){
if (tutorialDebug)
console.log("tutorial ScriptTest - toggle()");
if (missionDropdown.isVisible()) {
missionDropdown.hide(true);
missionMarkers.hide();
missionMarkers.showMarker(false);
CountryBallPortals.hideBubbleText();
Tutorial.removeHighlightFromElementsDuringMission();
return;
}
if (window.missionConfig.isMissionInProgress) {
missionMarkers.setMarkersHidden(false);
missionMarkers.showMarker(true);
}
missionDropdown.showBlackBackground();
CountryBallPortals.showBubbleText();
missionDropdown.tutorialPanel.classList.remove('shakeOften');
setTimeout(function () {
positionMissionMarkers2();
}, 100)
missionDropdown.toggleShow();
},
hideMissionInProgressPanel: function () {
if (tutorialDebug)
console.log("tutorial ScriptTest - hideMissionInProgressPanel()");
const panels = [
this.inProgressPanel,
this.skipMissionPanel,
this.militaryCrateClosePanel,
this.receiveRewardPanel,
this.militaryCrateOpenPanel
];
panels.forEach(panel => {
if (panel) {
panel.classList.add('hidden');
} else if (tutorialDebug) {
console.warn("Panel is undefined:", panel);
}
});
},
showMissionInProgresPanel: function() {
if (tutorialDebug)
console.log("tutorial ScriptTest - showMissionInProgressPanel()");
const hidePanels = [
this.startPanel,
this.receiveRewardPanel,
this.militaryCrateOpenPanel
];
hidePanels.forEach(panel => {
if (panel) panel.classList.add("hidden");
});
const showPanels = [
this.inProgressPanel,
this.skipMissionPanel,
this.militaryCrateClosePanel
];
showPanels.forEach(panel => {
if (panel) panel.classList.remove("hidden");
});
this.setMissionIsInProgress();
},
showMissionStartPanel: function(){
if (tutorialDebug)
console.log("tutorial ScriptTest - showMissionStartPanel()");
this.startPanel.classList.remove('hidden');
missionDropdown.hideMissionInProgressPanel();
missionMarkers.setMarkersHidden(true);
missionMarkers.hide();
setTimeout(function () {
missionMarkers.positionSmallArrowPointingDown(document.querySelector('.missionForm'), 1);
}, 250)
},
showMissionCompletedPanel: function(){
if (tutorialDebug)
console.log("tutorial ScriptTest - showMissionCompletedPanel()");
const hidePanels = [
this.startPanel,
this.skipMissionPanel,
this.inProgressPanel,
this.militaryCrateClosePanel,
this.militaryCrateOpenPanel,
];
hidePanels.forEach(panel => {
if (panel) panel.classList.add("hidden");
});
if (this.receiveRewardPanel) this.receiveRewardPanel.classList.remove("hidden");
if (this.militaryCrateOpenPanel) this.militaryCrateOpenPanel.classList.remove("hidden");
missionMarkers.hide();
missionMarkers.positionArrowOnRewardBox();
missionDropdown.disableBallToggleClickEvent();
},
rewardMission: async function () {
if (window.tutorialDebug)
console.log("tutorial ScriptTest - rewardMission()");
if (missionDropdown.isRewardMissionRequestInProgress) return;
missionDropdown.isRewardMissionRequestInProgress = true;
try {
addLoaderAfterCollectReward();
const response = await fetch("betaMissions.html?action=COMPLETE", {
method: "POST",
cache: "no-store",
headers: {
"Content-Type": "application/x-www-form-urlencoded"
}
});
if (!response.ok) {
throw new Error('HTTP error: ' + response.status);
}
const data = await response.text();
SoundManager.playActionAudio(soundType.REWARD);
missionDropdown.hideBlackBackground();
Utils.setInnerHTMLWithScripts(document.getElementById("missionReload"), data);
missionMarkers.initialize();
missionDropdown.initialize();
missionDropdown.missionDropdown.classList.remove("visible");
if (window.missionConfig.currentMission.missionNumber === 10 && window.missionConfig.noMissionsToday) {
window.open("tutorialProgression.html?tutorialCompleted=true&showRateUs=true", "_self");
}
if (typeof DefaultModal !== "undefined") {
DefaultModal.initializeNewLevel();
}
} catch (error) {
console.error("â rewardMission failed:", error);
} finally {
missionDropdown.isRewardMissionRequestInProgress = false;
missionDropdown.enableBallToggleClickEvent();
if (!window.missionConfig.allMissionsCompleted && !window.missionConfig.noMissionsToday) {
startMission();
}
if (window.missionConfig.noMissionsToday) {
handleMissionPanel();
}
if (window.missionConfig.currentMission.type === "SIMPLIFIED_FIGHT") {
setTimeout(() => {
window.open("battle.html?id=0", "_self");
}, 450);
}
}
}
};
var missionMarkers = {
markersDirection: {
'BOTTOM': 'bottom',
'TOP': 'top',
'LEFT': 'left',
'RIGHT': 'right',
},
marker: document.querySelector('.tutorialPointer'),
markersAreHidden: true,
markers: [],
href: window.location.href,
isOn: function() {
for (var i = 0; i < arguments.length; i++) {
if (this.href.includes(arguments[i])) {
return true;
}
}
return false;
},
hasParameters: function() {
return this.href.indexOf('?') !== -1;
},
hide: function() {
const missionTips = document.querySelectorAll('.missionTip');
missionTips.forEach(tip => {
tip.classList.add('hidden');
tip.classList.remove('visible');
});
this.setMarkersHidden(true);
},
initialize: function() {
this.markers = [
{},
{
tip: document.getElementById('missionTip1'),
},
{
tip: document.getElementById('missionTip2'),
},
{
tip: document.getElementById('missionTip3'),
},
{
tip: document.getElementById('missionTip4'),
},
{
tip: document.getElementById('missionTip5'),
}
]
},
makeTutorialPointer: function (selector, direction) {
const element = document.querySelector(selector);
if (!element) console.warn('WRONG ELEMENT, ELEMENT IS NULL');
if (this.marker) this.marker.remove();
const pointer = Utils.makeImg('//cdn.e-sim.org/img/pointerOutlined.gif', 'pointer', 'tutorialPointer', direction);
element.classList.add('p-relative')
element.append(pointer);
this.marker = pointer;
pointer.addEventListener('load', () => {
this.positionTutorialPointer(pointer, element, direction);
});
if (missionDropdown.missionDropdown.classList.contains("visible")) {
this.showMarker(true);
} else {
this.showMarker(false);
}
},
positionTutorialPointer: function (pointer, parent, direction) {
const hitbox = pointer.getBoundingClientRect();
const anchor = parent.getBoundingClientRect();
const position = this.setPosition(anchor, hitbox, direction);
pointer.style.left = (position.x - anchor.x) + 'px';
pointer.style.top = (position.y - anchor.y) + 'px';
},
setPosition: function (anchor, hitbox, direction) {
let position = {
x: 0,
y: 0,
}
if (direction === missionMarkers.markersDirection.TOP) {
position.x = anchor.x + anchor.width / 2 - hitbox.width / 2;
position.y = anchor.y + anchor.height;
}
if (direction === missionMarkers.markersDirection.BOTTOM) {
position.x = anchor.x + anchor.width / 2 - hitbox.width / 2;
position.y = anchor.y - hitbox.height;
}
if (direction === missionMarkers.markersDirection.LEFT) {
position.x = anchor.x - hitbox.width;
position.y = anchor.y + anchor.height / 2 - hitbox.height / 2;
}
if (direction === missionMarkers.markersDirection.RIGHT) {
position.x = anchor.x + anchor.width;
position.y = anchor.y + anchor.height / 2 - hitbox.height / 2;
}
return position;
},
setPointerOnElement: function (steps) {
return new Promise((resolve, reject) => {
const firstSelector = Object.keys(steps)[0];
const secondSelector = Object.keys(steps)[1];
const domElement = document.querySelector(firstSelector);
if (!domElement) {
console.error(`Can't target element`)
reject();
return;
}
const arrowDirection = Object.values(steps)[0];
this.makeTutorialPointer(firstSelector, arrowDirection);
const reset = () => {
this.marker.remove();
this.removeEventFromElement(domElement, reset)
if (secondSelector) {
delete steps[firstSelector];
this.setPointerOnElement(steps);
} else {
resolve();
}
};
this.addEventOnElement(domElement, reset);
})
},
addEventOnElement: function (element, callBack) {
if (isMobile) {
element.addEventListener('touchstart', callBack);
} else {
element.addEventListener('click', callBack);
}
},
removeEventFromElement: function (element, callBack) {
if (isMobile) {
element.removeEventListener('touchstart', callBack);
} else {
element.removeEventListener('click', callBack);
}
},
positionSmallArrowPointingUp: function(myElement, markerId) {
if (!myElement || ((typeof welcomeTutorialPanel !== "undefined") && welcomeTutorialPanel.welcomeTutorialPanel)) {
return;
}
let myMarker = missionMarkers.markers[markerId];
const container = document.getElementById('missionReload');
if (myMarker.tip.parentNode !== container) {
container.appendChild(myMarker.tip);
}
myMarker.tip.classList.add('maxWidth30vw');
myMarker.tip.classList.add('arrowPointUp');
myMarker.tip.classList.remove('arrowPointDown', 'arrowPointRight', 'arrowMissionRight');
missionMarkers.showMarkers(markerId);
function positionTip() {
if (!myElement || !myMarker?.tip) return;
const rect = myElement.getBoundingClientRect();
const offsetY = isMobile ? 40 : 0;
const viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
const viewportHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
// FORCE styles before measuring
Object.assign(myMarker.tip.style, {
display: 'block',
visibility: 'hidden',
position: 'fixed',
margin: '0',
left: '0',
top: '0'
});
void myMarker.tip.offsetHeight;
const tipHeight = myMarker.tip.offsetHeight;
const tipWidth = myMarker.tip.offsetWidth;
let tipLeft = rect.left + (rect.width / 2) - (tipWidth / 2);
let tipTop = rect.top + tipHeight;
// Handle viewport boundaries
if (tipTop < 0) {
console.log('tipTop < 0, repositioning below');
tipTop = rect.bottom + offsetY;
if (tipTop + tipHeight > viewportHeight) {
tipTop = Math.max(10, rect.top - tipHeight - 10);
}
}
// Horizontal boundaries
const originalTipLeft = tipLeft;
if (tipLeft < 10) {
tipLeft = 10;
} else if (tipLeft + tipWidth > viewportWidth - 10) {
tipLeft = viewportWidth - tipWidth - 10;
}
if (originalTipLeft !== tipLeft) {
console.log('Horizontal position adjusted from', originalTipLeft, 'to', tipLeft);
}
tipTop = Math.max(10, Math.min(tipTop, viewportHeight - tipHeight - 10));
// console.log('Final calculated position:', {tipLeft, tipTop});
Object.assign(myMarker.tip.style, {
position: 'fixed',
left: tipLeft + 'px',
top: tipTop + 'px',
visibility: 'visible',
margin: '0',
});
//
// setTimeout(() => {
// const computedStyles = window.getComputedStyle(myMarker.tip);
// console.log('=== AFTER SETTING ===');
// console.log('Applied styles:', myMarker.tip.style.cssText);
// console.log('Computed styles:', {
// position: computedStyles.position,
// left: computedStyles.left,
// top: computedStyles.top,
// transform: computedStyles.transform,
// margin: computedStyles.margin
// });
// console.log('Actual position:', myMarker.tip.getBoundingClientRect());
// }, 100);
}
const img = myMarker.tip.querySelector('img');
if (img && !img.complete) {
img.onload = positionTip;
setTimeout(positionTip, 100);
} else {
setTimeout(positionTip, 10);
}
},
positionSmallArrowPointingDown: function(myElement, markerId) {
console.log(((typeof welcomeTutorialPanel !== "undefined") && welcomeTutorialPanel.welcomeTutorialPanel))
if (!myElement || ((typeof welcomeTutorialPanel !== "undefined") && welcomeTutorialPanel.welcomeTutorialPanel)) {
return;
}
let myMarker = missionMarkers.markers[markerId];
if (myMarker.tip.parentNode !== document.body && !document.body.contains(myMarker.tip)) {
document.body.appendChild(myMarker.tip);
}
myMarker.tip.classList.add("maxWidth30vw");
myMarker.tip.classList.add("arrowPointDown");
myMarker.tip.classList.remove('arrowPointUp', 'arrowPointRight', 'arrowMissionRight');
missionMarkers.showMarkers(markerId);
function positionTip() {
if (!myElement || !myMarker?.tip) return;
const rect = myElement.getBoundingClientRect();
const offsetY = isMobile ? 40 : 0;
const viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
const viewportHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
// FORCE styles before measuring
Object.assign(myMarker.tip.style, {
display: 'block',
visibility: 'hidden',
position: 'fixed',
margin: '0',
left: '0',
top: '0'
});
void myMarker.tip.offsetHeight;
const tipHeight = myMarker.tip.offsetHeight;
const tipWidth = myMarker.tip.offsetWidth;
let tipLeft = rect.left + (rect.width / 2) - (tipWidth / 2);
let tipTop = rect.top - tipHeight - offsetY;
// Handle viewport boundaries
if (tipTop < 0) {
console.log('tipTop < 0, repositioning below');
tipTop = rect.bottom + offsetY;
if (tipTop + tipHeight > viewportHeight) {
tipTop = Math.max(10, rect.top - tipHeight - 10);
}
}
// Horizontal boundaries
const originalTipLeft = tipLeft;
if (tipLeft < 10) {
tipLeft = 10;
} else if (tipLeft + tipWidth > viewportWidth - 10) {
tipLeft = viewportWidth - tipWidth - 10;
}
if (originalTipLeft !== tipLeft) {
console.log('Horizontal position adjusted from', originalTipLeft, 'to', tipLeft);
}
tipTop = Math.max(10, Math.min(tipTop, viewportHeight - tipHeight - 10));
console.log('Final calculated position:', {tipLeft, tipTop});
Object.assign(myMarker.tip.style, {
position: 'fixed',
left: tipLeft + 'px',
top: tipTop + 'px',
visibility: 'visible',
margin: '0',
});
}
const img = myMarker.tip.querySelector('img');
if (img && !img.complete) {
img.onload = positionTip;
setTimeout(positionTip, 100);
} else {
setTimeout(positionTip, 10);
}
},
positionElementAboveTarget: function(element, targetRect, viewportWidth, viewportHeight) {
// Calculate position for "bottom of element at top of target"
let top = targetRect.top - element.offsetHeight;
let left = targetRect.left + (targetRect.width / 2) - (element.offsetWidth / 2);
// Handle collisions - adjust if element goes outside viewport
if (top < 0) {
// If goes above viewport, position below target instead
top = targetRect.bottom;
}
if (left < 0) {
left = 10; // Minimum margin from left
} else if (left + element.offsetWidth > viewportWidth) {
left = viewportWidth - element.offsetWidth - 10; // Minimum margin from right
}
// Apply positioning
element.style.position = "fixed";
element.style.top = top + "px";
element.style.left = left + "px";
},
positionSmallArrowPointingRight: function(myElement, markerId) {
if (myElement.length == 0) {
return;
}
let myMarker = missionMarkers.markers[markerId];
myElement[0].appendChild(myMarker.tip[0]);
myMarker.tip.classList.add('maxWidth30vw', 'right');
myMarker.arrow.classList.add('arrowPointRight');
missionMarkers.showMarkers(markerId);
const mobileOffset = isMobile ? '-125' : '';
myMarker.tip.position({
of: myElement,
my: 'right center' + mobileOffset,
at: 'left center',
collision: 'none none'
});
},
positionSmallArrowPointingLeft: function(myElement, markerId) {
if (myElement.length == 0) {
return;
}
let myMarker = missionMarkers.markers[markerId];
myElement[0].appendChild(myMarker.tip[0]);
myMarker.tip.classList.add('maxWidth30vw', 'left');
myMarker.arrow.classList.add('arrowPointRight');
missionMarkers.showMarkers(markerId);
const mobileOffset = isMobile ? '-125' : '';
myMarker.tip.position({
of: myElement,
my: 'left center' + mobileOffset,
at: 'right center',
collision: 'none none'
});
},
positionArrowOnRewardBox: function () {
const steps = {'#missionCrate': 'left'};
setTimeout(function () {
missionMarkers.positionSmallArrowPointingDown(document.getElementById('missionDropdown'), 1);
// missionMarkers.setPointerOnElement(steps);
}, 500)
},
showMarker: function (isShow) {
if (!this.marker) return;
isShow ? this.marker.classList.remove('hidden') : this.marker.classList.add('hidden');
},
showMarkers: function() {
if (missionDropdown.missionDropdown.classList.contains("visible")) {
for (var i = 0; i < arguments.length; i++) {
this.markers[arguments[i]].tip.classList.remove('hidden', 'fadeOut');
this.markers[arguments[i]].tip.classList.add('visible', 'fadeIn');
}
}
},
hideMarkers: function() {
if (missionDropdown.missionDropdown.classList.contains("visible")) {
for (var i = 0; i < arguments.length; i++) {
this.markers[arguments[i]].tip.classList.remove('visible', 'fadeIn');
this.markers[arguments[i]].tip.classList.add('hidden', 'fadeOut');
}
}
},
setMarkersHidden: function(newValue) {
this.markersAreHidden = newValue;
},
positionAvatarArrowOnMobile: function(markerId) {
missionMarkers.showMarkers(markerId);
let myAvatar = document.getElementById('mobile-navbar__avatar-sidebar');
let myMarker = missionMarkers.markers[markerId];
myAvatar.appendChild(myMarker.tip);
myMarker.arrow.classList.add('arrowPointUp');
function positionTip() {
if (!myAvatar || !myMarker?.tip) return;
const rect = myAvatar.getBoundingClientRect();
const offsetY = isMobile ? 40 : 0;
const viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
const viewportHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
// FORCE styles before measuring
Object.assign(myMarker.tip.style, {
display: 'block',
visibility: 'hidden',
position: 'fixed',
margin: '0',
left: '0',
top: '0'
});
void myMarker.tip.offsetHeight;
const tipHeight = myMarker.tip.offsetHeight;
const tipWidth = myMarker.tip.offsetWidth;
let tipLeft = rect.left + (rect.width / 2) - (tipWidth / 2);
let tipTop = rect.top - tipHeight - offsetY;
// Handle viewport boundaries
if (tipTop < 0) {
console.log('tipTop < 0, repositioning below');
tipTop = rect.bottom + offsetY;
if (tipTop + tipHeight > viewportHeight) {
tipTop = Math.max(10, rect.top - tipHeight - 10);
}
}
// Horizontal boundaries
const originalTipLeft = tipLeft;
if (tipLeft < 10) {
tipLeft = 10;
} else if (tipLeft + tipWidth > viewportWidth - 10) {
tipLeft = viewportWidth - tipWidth - 10;
}
if (originalTipLeft !== tipLeft) {
console.log('Horizontal position adjusted from', originalTipLeft, 'to', tipLeft);
}
tipTop = Math.max(10, Math.min(tipTop, viewportHeight - tipHeight - 10));
console.log('Final calculated position:', {tipLeft, tipTop});
Object.assign(myMarker.tip.style, {
position: 'fixed',
left: tipLeft + 'px',
top: tipTop + 'px',
visibility: 'visible',
margin: '0',
});
}
setTimeout(positionTip, 100);
},
positionMainMenuArrowOnMobile: function(markerId) {
missionMarkers.showMarkers(markerId);
let mainMenuIcon = document.getElementById('mobile-navbar__hamburger-sidebar');
let myMarker = missionMarkers.markers[markerId];
mainMenuIcon.appendChild(myMarker.tip);
myMarker.arrow.classList.add('arrowPointUp');
function positionTip() {
if (!mainMenuIcon || !myMarker?.tip) return;
const rect = mainMenuIcon.getBoundingClientRect();
const offsetY = isMobile ? 40 : 0;
const viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
const viewportHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
// FORCE styles before measuring
Object.assign(myMarker.tip.style, {
display: 'block',
visibility: 'hidden',
position: 'fixed',
margin: '0',
left: '0',
top: '0'
});
void myMarker.tip.offsetHeight;
const tipHeight = myMarker.tip.offsetHeight;
const tipWidth = myMarker.tip.offsetWidth;
let tipLeft = rect.left + (rect.width / 2) - (tipWidth / 2);
let tipTop = rect.top + tipHeight;
// Handle viewport boundaries
if (tipTop < 0) {
console.log('tipTop < 0, repositioning below');
tipTop = rect.bottom + offsetY;
if (tipTop + tipHeight > viewportHeight) {
tipTop = Math.max(10, rect.top - tipHeight - 10);
}
}
// Horizontal boundaries
const originalTipLeft = tipLeft;
if (tipLeft < 10) {
tipLeft = 10;
} else if (tipLeft + tipWidth > viewportWidth - 10) {
tipLeft = viewportWidth - tipWidth - 10;
}
if (originalTipLeft !== tipLeft) {
console.log('Horizontal position adjusted from', originalTipLeft, 'to', tipLeft);
}
tipTop = Math.max(10, Math.min(tipTop, viewportHeight - tipHeight - 10));
// console.log('Final calculated position:', {tipLeft, tipTop});
Object.assign(myMarker.tip.style, {
position: 'fixed',
left: tipLeft + 'px',
top: tipTop + 'px',
visibility: 'visible',
margin: '0',
});
}
setTimeout(positionTip, 100);
},
positionMainMenuElementArrowOnMobile: function(myElement, markerId) {
missionMarkers.showMarkers(markerId);
let myMarker = missionMarkers.markers[markerId];
myElement[0].appendChild(myMarker.tip[0]);
myMarker.arrow.classList.add("arrowPointDown");
const mobileOffset = isMobile ? '-54' : '-24';
function positionTip() {
if (!myElement || !myMarker?.tip) return;
const rect = myElement.getBoundingClientRect();
const offsetY = isMobile ? 40 : 0;
const viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
const viewportHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
// FORCE styles before measuring
Object.assign(myMarker.tip.style, {
display: 'block',
visibility: 'hidden',
position: 'fixed',
margin: '0',
left: '0',
top: '0'
});
void myMarker.tip.offsetHeight;
const tipHeight = myMarker.tip.offsetHeight;
const tipWidth = myMarker.tip.offsetWidth;
let tipLeft = rect.left + (rect.width / 2) - (tipWidth / 2);
let tipTop = rect.top - tipHeight - offsetY;
// Handle viewport boundaries
if (tipTop < 0) {
console.log('tipTop < 0, repositioning below');
tipTop = rect.bottom + offsetY;
if (tipTop + tipHeight > viewportHeight) {
tipTop = Math.max(10, rect.top - tipHeight - 10);
}
}
// Horizontal boundaries
const originalTipLeft = tipLeft;
if (tipLeft < 10) {
tipLeft = 10;
} else if (tipLeft + tipWidth > viewportWidth - 10) {
tipLeft = viewportWidth - tipWidth - 10;
}
if (originalTipLeft !== tipLeft) {
console.log('Horizontal position adjusted from', originalTipLeft, 'to', tipLeft);
}
tipTop = Math.max(10, Math.min(tipTop, viewportHeight - tipHeight - 10));
console.log('Final calculated position:', {tipLeft, tipTop});
Object.assign(myMarker.tip.style, {
position: 'fixed',
left: tipLeft + 'px',
top: tipTop + 'px',
visibility: 'visible',
margin: '0',
});
}
setInterval(positionTip, 150);
},
appendRedArrowToElement: function(myElement) {
if(myElement.find('p.mobileMissionArrow').length === 0) {
let myRedArrow = "<p>↩</p>";
myRedArrow.classList.add("mobileMissionArrow", "testTipAnimation3");
myElement.appendChild(myRedArrow);
}
},
}
//TODO REFACTOR AFTER TEST
function addLoaderAndHandleAction(buttonSelector, buttonText, loadingText) {
const button = document.querySelector(buttonSelector);
if (!button) return;
const position = {
x: isMobile ? '4%' : '15%',
y: isMobile ? '25%' : '15%',
};
const loader = button.previousElementSibling;
Loader.initializeLoaderAndButtonWithoutId(loader, button);
if (isMobile) {
Loader.setSize('4rem');
}
Loader.setPosition(position);
Loader.setZIndex(2);
Loader.disableButtonAndShowLoader(loadingText);
}
function addLoaderAfterStartMission() {
const btn = missionDropdown.missionDropdown.querySelector('.orange');
if (btn) Loader.initializeLoading(btn, LoaderSettings.optionsWithoutPosAbsolute);
}
function addLoaderAfterCollectReward() {
const btn = missionDropdown.missionDropdown.querySelector('.collectReward');
if (btn) Loader.initializeLoading(btn, LoaderSettings.optionsWithoutPosAbsolute);
}
async function startMission() {
if (missionDropdown.isStartMissionRequestInProgress) {
console.warn('Request already in progress. Ignoring new request.');
return;
}
missionDropdown.isStartMissionRequestInProgress = true;
try {
addLoaderAfterStartMission();
const response = await fetch("betaMissions.html?action=START", {
method: "POST",
cache: "no-store",
headers: {
"Content-Type": "application/x-www-form-urlencoded"
}
});
if (!response.ok) {
throw new Error('HTTP error: ' + response.status);
}
const data = await response.text();
missionDropdown.missionDropdown.classList.remove("visible");
Utils.setInnerHTMLWithScripts(document.getElementById("missionReload"), data);
handleCSSMissionProgressSelector();
if (window.tutorialDebug) {
console.log("betaMissions.html - START");
}
missionMarkers.initialize();
missionDropdown.initialize();
handleMissionPanel();
missionDropdown.positionDropdown();
missionDropdown.show();
} catch (error) {
console.error("â Mission start failed:", error);
} finally {
missionDropdown.isStartMissionRequestInProgress = false;
}
}
async function updateMissionProgress() {
try {
const response = await fetch("missionProgress.html");
if (!response.ok) throw new Error('Network error: ' + response.status);
const data = await response.text();
const progressEl = document.getElementById('progress');
let current = 0;
if (progressEl) {
current = parseInt(progressEl.textContent, 10) || 0;
progressEl.textContent = data;
}
const mission = window.missionConfig.currentMission;
if (mission && mission.maxProgress !== 0) {
if (missionDropdown.animationProgressTest) {
Utils.animateMissionProgress(current, data);
} else {
const missionProgressBar = document.getElementById('missionProgressBar');
if (missionProgressBar) {
const percentage = (100 * data / mission.maxProgress);
missionProgressBar.style.width = percentage + "%";
}
}
}
const maxProgressEl = document.getElementById('maxProgress');
const receiveRewardPanel = document.getElementById('receiveRewardPanel');
const missionDropdownEl = document.getElementById('missionDropdown');
if (
progressEl &&
maxProgressEl &&
progressEl.textContent === maxProgressEl.textContent &&
progressEl.textContent.trim() !== ""
) {
if (!missionDropdownEl.classList.contains("visible")) {
missionDropdown.showRewardModal();
} else if (receiveRewardPanel && receiveRewardPanel.classList.contains("hidden")) {
missionDropdown.showRewardModal();
}
}
} catch (error) {
console.error("â Failed to update mission progress:", error);
}
};
function handleMissionPanel() {
const currentMission = window.missionConfig.currentMission;
console.log(currentMission)
if (window.missionConfig.noMissionsToday) {
document.getElementById('startMission').classList.remove('active-icon');
document.getElementById('startMission').classList.add('blank-icon');
document.getElementById('tutorialPanel').classList.remove('shakeOften');
missionDropdown.show();
return;
}
if (currentMission.awaitingStart) {
if (tutorialDebug)
console.log("tutorial ScriptTest ready() - awaiting start");
missionMarkers.setMarkersHidden(true);
missionDropdown.showMissionStartPanel();
missionDropdown.show();
}
if (currentMission.isCompleted) {
if (tutorialDebug)
console.log("tutorial ScriptTest ready() - completed");
missionDropdown.showMissionCompletedPanel();
missionDropdown.show();
}
if (currentMission.inProgress) {
if (tutorialDebug)
console.log("tutorial ScriptTest ready() - in progress");
missionDropdown.showMissionInProgresPanel();
missionDropdown.show();
setTimeout(function () {
if (missionDropdown.isVisible()) {
positionMissionMarkers2();
}
}, 250)
}
}
function handleCSSMissionProgressSelector() {
const selectors = window.missionConfig.progressCheckpointsSelector;
if (selectors && selectors.length !== 0) {
const elements = document.querySelectorAll(selectors);
elements.forEach(el => {
el.classList.add('missionProgressEvent');
el.removeEventListener('click', updateMissionProgress);
el.addEventListener('click', updateMissionProgress);
});
}
console.log(window.missionConfig.progressCheckpointsSelector)
}
window.addEventListener('resize', function () {
missionDropdown.positionDropdown();
positionMissionMarkers2();
});
window.addEventListener('scroll', function () {
missionDropdown.positionDropdown();
if (typeof positionMissionMarkers2 === 'function') {
positionMissionMarkers2();
}
});
document.addEventListener("DOMContentLoaded", function() {
missionMarkers.initialize();
missionDropdown.initialize();
if (tutorialDebug)
console.log("tutorial ScriptTest ready()");
handleMissionPanel();
console.log('usuwam eventy od misji');
fightAjaxCallback = function() {};
handleCSSMissionProgressSelector();
});
</script>
<script>
var errorCount = 0;
function sendErrorToServer(error) {
var stackData = error.stack;
const errorData = {
message: error.message ,
stack: stackData,
userAgent: navigator.userAgent,
url: window.location.href
};
const xhr = new XMLHttpRequest();
xhr.open('POST', 'jsError.html', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify(errorData));
errorCount++;
if (errorCount >= 3) {
// Remove the error handler to stop capturing errors
window.onerror = null;
}
}
function handleErrors() {
window.onerror = function (message, source, lineno, colno, error) {
sendErrorToServer(error);
return false;
};
}
// Call the handleErrors function to start capturing errors
handleErrors();
</script>
<script>
let lastTime = performance.now();
let frameCount = 0;
let fps = 0;
let avgFps = 0;
function calculateFPS() {
const currentTime = performance.now();
const delta = currentTime - lastTime;
frameCount++;
if (delta >= 1000) {
fps = frameCount;
frameCount = 0;
lastTime = currentTime;
enqueueFps(fps);
}
requestAnimationFrame(calculateFPS);
}
requestAnimationFrame(calculateFPS);
const fpsQueue = [];
const fpsQueueSize = 10;
function enqueueFps(num) {
if (fpsQueue.length >= fpsQueueSize) {
fpsQueue.shift();
}
fpsQueue.push(num);
};
function getAverageFps() {
if (fpsQueue.length < fpsQueueSize) return 0;
const sum = fpsQueue.reduce((acc, num) => acc + num, 0);
return sum / fpsQueue.length;
};
</script>
<script src="//vara.e-sim.org/cdn/static/js/script-min.js" type="text/javascript"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
// $(document).foundation();
const androidIcon = document.querySelector('.icon-android');
if (androidIcon) {
androidIcon.addEventListener('click', (e) => {
e.preventDefault();
e.stopPropagation();
picoModal(`
<div style="text-align: center;">
<div style="padding:12px">
<a style="font-size:2em" href="https://bit.ly/eSimAndroid">
Download eSim Mobile App
</a>
</div>
<a href="https://bit.ly/eSimAndroid">
<img
style="width: 300px; height: 300px; margin: 0 auto;"
src="//vara.e-sim.org/cdn/static/img/qr/app_android.png"
alt="Android App QR" />
</a>
</div>
`);
});
}
});
</script>
<script>
document.addEventListener("DOMContentLoaded", () => {
ninja("LOADING TIME", "page loaded in " + performance.now() + "ms " + window.location.href);
});
</script>
</div>
<link href="//vara.e-sim.org/cdn/static/css/modules/personalizedPromotion.css?v=0007" type="text/css" rel="stylesheet">
<script src="https://js.stripe.com/v3/"></script>
<script src="//vara.e-sim.org/cdn/static/js/modules/personalizedPromotion.js?v=0010"></script>
<script>
/* this code extends object from modules/personalizedPromotion.js */
(function waitForPP() {
if (typeof PersonalizedPromotions === 'undefined') {
setTimeout(waitForPP, 50);
return;
}
PersonalizedPromotions.isBonusWeaponTimeForMedkits = false;
PersonalizedPromotions.isServerPermament = false;
PersonalizedPromotions.paypalAllowed = 'false';
PersonalizedPromotions.shopExpiresInText = 'Caduca en';
PersonalizedPromotions.isMuAllowed = false;
})();
// || loggedCitizen.level < EWLevelRequirements.CREATE_MILITARY_UNIT && !citizen.isOrganization()
</script>
<div class="personalizedPromotions">
<script>
function initializePromotionsState() {
const toMiliseconds = (m) => Math.floor(m * 60000);
return {
type: "WELCOME_PACK",
startTime: Number('1776668363648'),
duration: toMiliseconds(Number('4320')),
durationInMinutes: '4320',
};
}
function createPromoList() {
return [
];
}
</script>
<div id="WELCOME_PACKContainer" class="personalizedPromotionContainer">
<span id="WELCOME_PACKTime" class="green promotion-time WELCOME_PACK"></span>
<script>
(function() {
const promoState = initializePromotionsState();
const promoList = createPromoList();
const promotionButton = PersonalizedPromotions.makePromotionButton(promoState, '', promoList);
document.getElementById('WELCOME_PACKContainer').prepend(promotionButton);
PersonalizedPromotions.makePromoCounter(promoState.duration, promoState.startTime, 'WELCOME_PACKTime', 'WELCOME_PACKContainer');
const isPromotionTest = Boolean('');
if (Utils.isOnPage("tutorialProgression.html") && isPromotionTest && promoState.type === PersonalizedPromotionsType.WELCOME_PACK) {
PersonalizedPromotions.show(promoState, '', promoList)
}
})()
</script>
</div>
</div>
<script>
var missionCenterModalDailyRule1 = "Puedes completar hasta 3 misiones por día.";
var missionCenterModalDailyRule2 = "Cada misión completada otorga una recompensa.";
var missionCenterModalDailyRule3 = "Completar todas las misiones ayuda a desbloquear una caja de recompensas más grande.";
var missionCenterModalDailyRule4 = "Recibes 1 nueva oportunidad por día.";
var missionCenterModalDailyRule5 = "Las misiones se reinician cada 24 horas.";
var missionCenterModalDailyRule6 = "La dificultad de la misión aumenta a medida que crece tu experiencia.";
var missionCenterDailyMissionTest = '' === 'true';
var missionCenterModalisTest = Boolean('');
var missionCenterModalrefreshTimerText = 'Actualizar en:';
var missionCenterModalisDailyChestClaimed = 'false' === 'true';
var missionCenterModalisPagesGo = 'Ir';
var missionCenterModalClaimPrize = 'Reclamar';
var missionCenterModalEvents = 'Completado';
var missionCenterModalHeaderTitle = '<strong>Misiones diarias</strong>';
var missionCenterModalAllMissionCompleted = 'false' === 'true';
</script>
<script src="//vara.e-sim.org/cdn/static/js/missionCenterModal.js?v=0002"></script>
<style>
.missionCenterPanel {
position: fixed;
bottom: 3%;
left: 2%;
height: 100px;
width: 100px;
z-index: 98;
-webkit-tap-highlight-color: transparent;
}
.missionCenterPanel .missionCenterBall {
cursor: pointer;
position: absolute;
left: 0px;
bottom: 0px;
z-index: 100;
-webkit-tap-highlight-color: transparent;
width: 100px;
}
.missionCenterPanel .missionCenterBallEyes {
cursor: pointer;
-webkit-background-size: cover;
background-size: cover;
width: 100px;
height: 100px;
position: absolute;
display: flex;
top: 0%;
z-index: 101;
}
.missionCenterBallEyes.angryLeft {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/angryeyesL.png');
}
.missionCenterBallEyes.angryRight {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/angryeyesR.png');
}
.missionCenterBallEyes.sadLeft {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/sadeyesL.png');
}
.missionCenterBallEyes.sadRight {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/sadeyesR.png');
}
.missionCenterBallEyes.happyLeft {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/happyeyesL.png');
}
.missionCenterBallEyes.happyRight {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/happyeyesR.png');
}
.missionCenterBallEyes.annoyedLeft {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/annoyedeyesL.png');
}
.missionCenterBallEyes.annoyedRight {
background-image: url('//vara.e-sim.org/cdn/static/img/countryballsAssets/annoyedeyesR.png');
}
.missionCenterIcon .notificationBadge {
top: 5%;
left: 65%;
font-size: 0.6em;
}
</style>
<div id="missionCenterPanel" class="missionCenterPanel hidden">
<img class="missionCenterBall"
src="//vara.e-sim.org/cdn/static/img/countryballsAssets/usaR.png"
onError="this.src='//vara.e-sim.org/cdn/static/img/countryballsAssets/polandR.png';">
<div class="missionCenterBallEyes happyRight" onclick="MissionCenterModal.showModal(this);"></div>
<div class="notificationBadge" onclick="MissionCenterModal.showModal(this);"></div>
</div>
</body>
</html>