move 'in a day' best scores to their own section

This commit is contained in:
Dawid Wysokiński 2020-07-11 17:57:05 +02:00
parent bd67c2b503
commit d7242ba056
2 changed files with 112 additions and 82 deletions

View File

@ -480,7 +480,20 @@ const renderTodaysStats = stats => {
const statIncreaseStyle = 'color: #000; background-color: #0f0';
const statDecreaseStyle = 'color: #000; background-color: #f00';
todaysStats.innerHTML = "\n <table width=\"100%\" class=\"vis\">\n <tbody>\n <tr>\n <th colspan=\"2\">\n Today's stats\n </th>\n </tr>\n <tr>\n <td>\n Points\n </td>\n <td style=\"".concat(stats.points > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.points).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank\n </td>\n <td style=\"").concat(stats.rank > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rank), "\n </td>\n </tr>\n <tr>\n <td>\n Villages\n </td>\n <td style=\"").concat(stats.villages > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.villages).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Score att\n </td>\n <td style=\"").concat(stats.scoreAtt > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreAtt).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (ODA)\n </td>\n <td style=\"").concat(stats.rankAtt > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankAtt), "\n </td>\n </tr>\n <tr>\n <td>\n Score def\n </td>\n <td style=\"").concat(stats.scoreDef > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreDef).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (ODD)\n </td>\n <td style=\"").concat(stats.rankDef > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankDef), "\n </td>\n </tr>\n <tr>\n <td>\n Score sup\n </td>\n <td style=\"").concat(stats.scoreSup > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreSup).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (ODS)\n </td>\n <td style=\"").concat(stats.rankSup > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankSup), "\n </td>\n </tr>\n <tr>\n <td>\n Score total\n </td>\n <td style=\"").concat(stats.scoreTotal > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreTotal).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (OD)\n </td>\n <td style=\"").concat(stats.rankTotal > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankTotal), "\n </td>\n </tr>\n </tbody>\n </table>\n ");
todaysStats.innerHTML = "\n <table width=\"100%\" class=\"vis\">\n <tbody>\n <tr>\n <th colspan=\"2\">\n Today's stats\n </th>\n </tr>\n <tr>\n <td>\n Points\n </td>\n <td style=\"".concat(stats.points > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.points).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank\n </td>\n <td style=\"").concat(stats.rank > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rank), "\n </td>\n </tr>\n <tr>\n <td>\n Villages\n </td>\n <td style=\"").concat(stats.villages > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.villages).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n ODA\n </td>\n <td style=\"").concat(stats.scoreAtt > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreAtt).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (ODA)\n </td>\n <td style=\"").concat(stats.rankAtt > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankAtt), "\n </td>\n </tr>\n <tr>\n <td>\n ODD\n </td>\n <td style=\"").concat(stats.scoreDef > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreDef).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (ODD)\n </td>\n <td style=\"").concat(stats.rankDef > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankDef), "\n </td>\n </tr>\n <tr>\n <td>\n ODS\n </td>\n <td style=\"").concat(stats.scoreSup > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreSup).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (ODS)\n </td>\n <td style=\"").concat(stats.rankSup > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankSup), "\n </td>\n </tr>\n <tr>\n <td>\n OD\n </td>\n <td style=\"").concat(stats.scoreTotal > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.scoreTotal).toLocaleString(), "\n </td>\n </tr>\n <tr>\n <td>\n Rank (OD)\n </td>\n <td style=\"").concat(stats.rankTotal > 0 ? statIncreaseStyle : statDecreaseStyle, "\">\n ").concat(Math.abs(stats.rankTotal), "\n </td>\n </tr>\n </tbody>\n </table>\n ");
};
const renderInADayRanks = player => {
let inADayRanks = document.querySelector('#inADayRanks');
if (!inADayRanks) {
inADayRanks = document.createElement('div');
inADayRanks.id = 'inADayRanks';
inADayRanks.width = '100%';
otherElementsContainer.prepend(inADayRanks);
}
inADayRanks.innerHTML = "\n <table width=\"100%\" class=\"vis\">\n <tbody>\n <tr>\n <th colspan=\"2\">\n 'In a day' best scores\n </th>\n </tr>\n <tr>\n <td>\n Units defeated while attacking:\n </td>\n <td>\n ".concat(player.inADay.att.score.toLocaleString(), " (").concat(player.inADay.att.rank, ".)\n </td>\n </tr>\n <tr>\n <td>\n Units defeated while defending:\n </td>\n <td>\n ").concat(player.inADay.def.score.toLocaleString(), " (").concat(player.inADay.def.rank, ".)\n </td>\n </tr>\n <tr>\n <td>\n Units defeated while supporting:\n </td>\n <td>\n ").concat(player.inADay.sup.score.toLocaleString(), " (").concat(player.inADay.sup.rank, ".)\n </td>\n </tr>\n <tr>\n <td>\n Resources plundered:\n </td>\n <td>\n ").concat(player.inADay.lootRes.score.toLocaleString(), " (").concat(player.inADay.lootRes.rank, ".)\n </td>\n </tr>\n <tr>\n <td>\n Villages plundered:\n </td>\n <td>\n ").concat(player.inADay.lootVil.score.toLocaleString(), " (").concat(player.inADay.lootVil.rank, ".)\n </td>\n </tr>\n <tr>\n <td>\n Resources gathered:\n </td>\n <td>\n ").concat(player.inADay.scavenge.score.toLocaleString(), " (").concat(player.inADay.scavenge.rank, ".)\n </td>\n </tr>\n <tr>\n <td>\n Villages conquered:\n </td>\n <td>\n ").concat(player.inADay.conquer.score.toLocaleString(), " (").concat(player.inADay.conquer.rank, ".)\n </td>\n </tr>\n </tbody>\n </table>\n ");
};
const render = (_ref2) => {
@ -496,37 +509,10 @@ const render = (_ref2) => {
title: 'Daily growth:',
data: player.dailyGrowth.toLocaleString(),
id: 'dg'
}, {
title: 'Units defeated while attacking:',
data: "".concat(player.inADay.att.score.toLocaleString(), " (").concat(player.inADay.att.rank, ".)"),
id: 'kill_att'
}, {
title: 'Units defeated while defending:',
data: "".concat(player.inADay.def.score.toLocaleString(), " (").concat(player.inADay.def.rank, ".)"),
id: 'kill_def'
}, {
title: 'Units defeated while supporting:',
data: "".concat(player.inADay.sup.score.toLocaleString(), " (").concat(player.inADay.sup.rank, ".)"),
id: 'kill_sup'
}, {
title: 'Resources plundered:',
data: "".concat(player.inADay.lootRes.score.toLocaleString(), " (").concat(player.inADay.lootRes.rank, ".)"),
id: 'loot_res'
}, {
title: 'Villages plundered:',
data: "".concat(player.inADay.lootVil.score.toLocaleString(), " (").concat(player.inADay.lootVil.rank, ".)"),
id: 'loot_vil'
}, {
title: 'Resources gathered:',
data: "".concat(player.inADay.scavenge.score.toLocaleString(), " (").concat(player.inADay.scavenge.rank, ".)"),
id: 'scavenge'
}, {
title: 'Villages conquered:',
data: "".concat(player.inADay.conquer.score.toLocaleString(), " (").concat(player.inADay.conquer.rank, ".)"),
id: 'conquer'
}].forEach(data => {
renderTr(data);
});
renderInADayRanks(player);
if (dailyPlayerStats && dailyPlayerStats.items.length > 0) {
renderTodaysStats(dailyPlayerStats.items[0]);

View File

@ -301,7 +301,7 @@ const renderTodaysStats = (stats) => {
</tr>
<tr>
<td>
Score att
ODA
</td>
<td style="${
stats.scoreAtt > 0 ? statIncreaseStyle : statDecreaseStyle
@ -321,7 +321,7 @@ const renderTodaysStats = (stats) => {
</tr>
<tr>
<td>
Score def
ODD
</td>
<td style="${
stats.scoreDef > 0 ? statIncreaseStyle : statDecreaseStyle
@ -341,7 +341,7 @@ const renderTodaysStats = (stats) => {
</tr>
<tr>
<td>
Score sup
ODS
</td>
<td style="${
stats.scoreSup > 0 ? statIncreaseStyle : statDecreaseStyle
@ -361,7 +361,7 @@ const renderTodaysStats = (stats) => {
</tr>
<tr>
<td>
Score total
OD
</td>
<td style="${
stats.scoreTotal > 0 ? statIncreaseStyle : statDecreaseStyle
@ -384,6 +384,98 @@ const renderTodaysStats = (stats) => {
`;
};
const renderInADayRanks = (player) => {
let inADayRanks = document.querySelector('#inADayRanks');
if (!inADayRanks) {
inADayRanks = document.createElement('div');
inADayRanks.id = 'inADayRanks';
inADayRanks.width = '100%';
otherElementsContainer.prepend(inADayRanks);
}
inADayRanks.innerHTML = `
<table width="100%" class="vis">
<tbody>
<tr>
<th colspan="2">
'In a day' best scores
</th>
</tr>
<tr>
<td>
Units defeated while attacking:
</td>
<td>
${player.inADay.att.score.toLocaleString()} (${
player.inADay.att.rank
}.)
</td>
</tr>
<tr>
<td>
Units defeated while defending:
</td>
<td>
${player.inADay.def.score.toLocaleString()} (${
player.inADay.def.rank
}.)
</td>
</tr>
<tr>
<td>
Units defeated while supporting:
</td>
<td>
${player.inADay.sup.score.toLocaleString()} (${
player.inADay.sup.rank
}.)
</td>
</tr>
<tr>
<td>
Resources plundered:
</td>
<td>
${player.inADay.lootRes.score.toLocaleString()} (${
player.inADay.lootRes.rank
}.)
</td>
</tr>
<tr>
<td>
Villages plundered:
</td>
<td>
${player.inADay.lootVil.score.toLocaleString()} (${
player.inADay.lootVil.rank
}.)
</td>
</tr>
<tr>
<td>
Resources gathered:
</td>
<td>
${player.inADay.scavenge.score.toLocaleString()} (${
player.inADay.scavenge.rank
}.)
</td>
</tr>
<tr>
<td>
Villages conquered:
</td>
<td>
${player.inADay.conquer.score.toLocaleString()} (${
player.inADay.conquer.rank
}.)
</td>
</tr>
</tbody>
</table>
`;
};
const render = ({ player, dailyPlayerStats }) => {
[
{
@ -396,59 +488,11 @@ const render = ({ player, dailyPlayerStats }) => {
data: player.dailyGrowth.toLocaleString(),
id: 'dg',
},
{
title: 'Units defeated while attacking:',
data: `${player.inADay.att.score.toLocaleString()} (${
player.inADay.att.rank
}.)`,
id: 'kill_att',
},
{
title: 'Units defeated while defending:',
data: `${player.inADay.def.score.toLocaleString()} (${
player.inADay.def.rank
}.)`,
id: 'kill_def',
},
{
title: 'Units defeated while supporting:',
data: `${player.inADay.sup.score.toLocaleString()} (${
player.inADay.sup.rank
}.)`,
id: 'kill_sup',
},
{
title: 'Resources plundered:',
data: `${player.inADay.lootRes.score.toLocaleString()} (${
player.inADay.lootRes.rank
}.)`,
id: 'loot_res',
},
{
title: 'Villages plundered:',
data: `${player.inADay.lootVil.score.toLocaleString()} (${
player.inADay.lootVil.rank
}.)`,
id: 'loot_vil',
},
{
title: 'Resources gathered:',
data: `${player.inADay.scavenge.score.toLocaleString()} (${
player.inADay.scavenge.rank
}.)`,
id: 'scavenge',
},
{
title: 'Villages conquered:',
data: `${player.inADay.conquer.score.toLocaleString()} (${
player.inADay.conquer.rank
}.)`,
id: 'conquer',
},
].forEach((data) => {
renderTr(data);
});
renderInADayRanks(player);
if (dailyPlayerStats && dailyPlayerStats.items.length > 0) {
renderTodaysStats(dailyPlayerStats.items[0]);
}