Skip to content
Permalink
Browse files

Merge pull request #277 from lusbenjamin/economy-daily-stats

Economy daily card counts and vault progress
  • Loading branch information...
Manuel-777 committed Apr 22, 2019
2 parents bfb8fc7 + f15c543 commit ee70338a35b0fe62677dd9eadbefce1339ace623
Showing with 121 additions and 39 deletions.
  1. +100 −35 window_main/economy.js
  2. +21 −4 window_main/index.css
@@ -25,11 +25,20 @@ var dayList = [];
const differenceInCalendarDays = require("date-fns").differenceInCalendarDays;

class economyDay {
constructor(goldEarned = 0, gemsEarned = 0, goldSpent = 0, gemsSpent = 0) {
constructor(
goldEarned = 0,
gemsEarned = 0,
goldSpent = 0,
gemsSpent = 0,
cardsEarned = 0,
vaultProgress = 0.0
) {
this.goldEarned = goldEarned;
this.gemsEarned = gemsEarned;
this.goldSpent = goldSpent;
this.gemsSpent = gemsSpent;
this.cardsEarned = cardsEarned;
this.vaultProgress = vaultProgress;
}
}

@@ -138,60 +147,109 @@ function openEconomyTab(loadMore) {

function createDayHeader(change) {
daysago = differenceInCalendarDays(new Date(), change.date);
let div = createDivision(["economy_title", "flex_item"]);
let headerGrid = createDivision(["economy_title"]);

const cont = createDivision(["economy_metric"]);
let tx = createDivision();
tx.style.lineHeight = "64px";
tx.classList.add("economy_sub");
let up = createDivision(["economy_up"]);
let down = createDivision(["economy_down"]);

let flexLeft = createDivision(["flex_item"]);
flexLeft.style.lineHeight = "64px";
// Title
let gridTitle = createDivision(["flex_item"]);
gridTitle.style.gridArea = "1 / 1 / auto / 2";
gridTitle.style.lineHeight = "64px";

if (daysago == 0) flexLeft.innerHTML = "Today";
if (daysago == 1) flexLeft.innerHTML = "Yesterday";
if (daysago == 0) gridTitle.innerHTML = "Today";
if (daysago == 1) gridTitle.innerHTML = "Yesterday";
if (daysago > 1) {
let date = new Date(change.date);
date = new Date(date.setHours(0, 0, 0, 0));
flexLeft.innerHTML = localDayDateFormat(date);
gridTitle.innerHTML = localDayDateFormat(date);
}

let flexRight = createDivision(["economy_day_stats", "flex_item"]);

// Cards
const gridCards = cont.cloneNode(true);
gridCards.style.gridArea = "1 / 2 / auto / 3";
const icca = tx.cloneNode(true);
icca.innerHTML = "Cards:";
const catx = tx.cloneNode(true);
catx.innerHTML = dayList[daysago].cardsEarned;
gridCards.appendChild(icca);
const upcontca = createDivision(["economy_delta"]);
upcontca.style.width = "auto";
upcontca.appendChild(catx);
upcontca.appendChild(up.cloneNode(true));
gridCards.appendChild(upcontca);

// Gold
const gridGold = cont.cloneNode(true);
gridGold.style.gridArea = "1 / 3 / auto / 4";
let icgo = createDivision(["economy_gold_med"]);
icgo.margin = "3px";
icgo.title = "Gold";
gridGold.appendChild(icgo);

let icge = createDivision(["economy_gems_med"]);
icge.style.marginLeft = "24px";
icge.title = "Gems";

let up = createDivision(["economy_up"]);

let down = createDivision(["economy_down"]);

let tx = createDivision();
tx.style.lineHeight = "64px";
tx.classList.add("economy_sub");

flexRight.appendChild(icgo);
flexRight.appendChild(up);
const upcontgo = createDivision(["economy_delta"]);
tx.innerHTML = dayList[daysago].goldEarned;
flexRight.appendChild(tx);
upcontgo.appendChild(tx);
upcontgo.appendChild(up.cloneNode(true));
gridGold.appendChild(upcontgo);

flexRight.appendChild(down);
const dncontgo = createDivision(["economy_delta"]);
let ntx = tx.cloneNode(true);
ntx.innerHTML = dayList[daysago].goldSpent;
flexRight.appendChild(ntx);
dncontgo.appendChild(ntx);
dncontgo.appendChild(down.cloneNode(true));
gridGold.appendChild(dncontgo);

// Gems
const gridGems = cont.cloneNode(true);
gridGems.style.gridArea = "1 / 4 / auto / 5";
let icge = createDivision(["economy_gems_med"]);
icge.margin = "3px";
icge.title = "Gems";
gridGems.appendChild(icge);

flexRight.appendChild(icge);
flexRight.appendChild(up.cloneNode(true));
const upcontge = createDivision(["economy_delta"]);
ntx = tx.cloneNode(true);
ntx.innerHTML = dayList[daysago].gemsEarned;
flexRight.appendChild(ntx);
upcontge.appendChild(ntx);
upcontge.appendChild(up.cloneNode(true));
gridGems.appendChild(upcontge);

flexRight.appendChild(down.cloneNode(true));
const dncontge = createDivision(["economy_delta"]);
ntx = tx.cloneNode(true);
ntx.innerHTML = dayList[daysago].gemsSpent;
flexRight.appendChild(ntx);

div.appendChild(flexLeft);
div.appendChild(flexRight);
return div;
dncontge.appendChild(ntx);
dncontge.appendChild(down.cloneNode(true));
gridGems.appendChild(dncontge);

// Vault
const gridVault = cont.cloneNode(true);
gridVault.style.gridArea = "1 / 5 / auto / 6";
const icva = tx.cloneNode(true);
icva.innerHTML = "Vault:";
const vatx = tx.cloneNode(true);
const deltaPercent = dayList[daysago].vaultProgress / 100.0;
vatx.innerHTML = deltaPercent.toLocaleString([], {
style: "percent",
maximumSignificantDigits: 2
});
gridVault.appendChild(icva);
const upcontva = createDivision(["economy_delta"]);
upcontva.style.width = "auto";
upcontva.appendChild(vatx);
upcontva.appendChild(up.cloneNode(true));
gridVault.appendChild(upcontva);

headerGrid.appendChild(gridTitle);
headerGrid.appendChild(gridCards);
headerGrid.appendChild(gridGold);
headerGrid.appendChild(gridGems);
headerGrid.appendChild(gridVault);
return headerGrid;
}

function createChangeRow(change, economyId) {
@@ -566,6 +624,13 @@ function createEconomyUI(mainDiv) {

console.log(economyId, "> ", change.date, " > ", change.delta.goldDelta);
}

if (change.delta && change.delta.cardsAdded) {
dayList[daysago].cardsEarned += change.delta.cardsAdded.length;
}
if (change.delta && change.delta.vaultProgressDelta) {
dayList[daysago].vaultProgress += change.delta.vaultProgressDelta;
}
}

mainDiv.classList.remove("flex_item");
@@ -1469,11 +1469,26 @@ a:hover {
font-family: var(--main-font-name);
font-size: 16px;
margin: auto 16px auto auto;
align-items: center;
justify-content: flex-end;
}

.economy_metric {
align-items: center;
display: flex;
justify-content: flex-end;
}

.economy_delta {
align-items: center;
display: flex;
justify-content: flex-end;
margin: 0 6px;
}

.economy_up {
background-repeat: no-repeat;
margin: auto 4px;
margin: 4px;
width: 24px;
height: 24px;
background-image: url(../images/up_green.png);
@@ -1482,20 +1497,22 @@ a:hover {

.economy_down {
background-repeat: no-repeat;
margin: auto 4px;
margin: 4px;
width: 24px;
height: 24px;
background-image: url(../images/down_red.png);
background-size: contain;
}

.economy_title {
display: grid;
padding: 0px 16px;
grid-template-columns: auto 15% 25% 25% 15%;
margin-left: 2px;
color: #FAE5D2;
padding-left: 16px;
line-height: 64px;
font-family: 'belerenbold' !important;
font-size: 18px;
font-size: 16px;
background-color: rgba(145, 121, 97, 0.2);
}

0 comments on commit ee70338

Please sign in to comment.
You can’t perform that action at this time.