list last three match results

Preliminary styling to mostly show play times.

diff --git a/battle.css b/battle.css
index cf7c4d0b255246be6f990122527bc02d9136a270..bcb8c620c444b0eb414347116a33502c5e6645e0 100644 (file)
--- a/battle.css
+++ b/battle.css
@@ -134,6 +134,15 @@ li, li img {
        background-position: -100px -150px;
 }
 
        background-position: -100px -150px;
 }
 

+.loss:before {
+       color: #C11;
+       content: '✘';
+}
+.win:before {
+       color: #297ACC;
+       content: '✔';
+}
+

 .old {
        text-decoration: line-through;
 }
 .old {
        text-decoration: line-through;
 }


@@ -153,6 +162,9 @@ body {
 .ladders {
        grid-row: 3;
 }
 .ladders {
        grid-row: 3;
 }

+.matches {
+       grid-column: 1;
+}

 
 @media (min-width: 576px) {
        .members {
 
 @media (min-width: 576px) {
        .members {

diff --git a/widget.html b/widget.html
index 1184ab1c506ecd96774219d5f6e749cd4c1a1162..c2a351dc14951302d6881a810a87acb4f191dde8 100644 (file)
--- a/widget.html
+++ b/widget.html
@@ -25,6 +25,8 @@
        })
        .then(clan => {
                let tiernum = (rank) => rank <= 8 ? 1 : rank <= 25 ? 2 : rank <= 50 ? 3 : 4;
        })
        .then(clan => {
                let tiernum = (rank) => rank <= 8 ? 1 : rank <= 25 ? 2 : rank <= 50 ? 3 : 4;

+               let matchtime = (d) => d.getDate() + '/' + (d.getMonth() + 1) +
+                       ' ' + d.getHours() + ":" + ('0' + d.getMinutes()).slice(-2);

                outcont.outerHTML = `
                        <h1>${clan.tag || clan.members[0].name}</h1>
                        <ul class=ladders>
                outcont.outerHTML = `
                        <h1>${clan.tag || clan.members[0].name}</h1>
                        <ul class=ladders>


@@ -48,6 +50,13 @@
                                </figure></a></li>
                        `).join('')}
                        </ul>
                                </figure></a></li>
                        `).join('')}
                        </ul>

+                       <ul class=matches>
+                       ${clan.matches.splice(0, 3).map(match => `
+                               <li data-members="${match.players}" class=${match.decision.toLowerCase()}>
+                                       ${matchtime(new Date(match.date * 1000))} ${match.type}
+                               </li>
+                       `).join('')}
+                       </ul>

                `
 
                document.querySelectorAll('[data-members]').forEach(li => {
                `
 
                document.querySelectorAll('[data-members]').forEach(li => {