add blank

aws-deepracer-community · Sep 3, 2019 · 7b9f582 · 7b9f582
1 parent 8e5c978
commit 7b9f582
Show file tree

Hide file tree

Showing 7 changed files with 91 additions and 121 deletions.
diff --git a/static/league.css b/static/league.css
@@ -115,60 +115,3 @@ div {
     top: 50%;
     transform: translateY(-50%);
 }
-
-.pop-layer {
-    display: none;
-    height: 100%;
-    left: 0;
-    position: fixed;
-    top: 0;
-    width: 100%;
-    z-index: 100;
-}
-
-.pop-layer .pop-bg {
-    background: #000;
-    filter: alpha(opacity=70);
-    height: 100%;
-    left: 0;
-    opacity: .7;
-    position: absolute;
-    top: 0;
-    width: 100%;
-}
-
-.pop-layer .pop-container {
-    height: auto;
-    position: absolute;
-    text-align: center;
-    top: 20%;
-    width: 100%;
-}
-
-.pop-layer .pop-container .pop-title {
-    padding: 1%;
-    font-size: 3vw;
-}
-
-.pop-layer .pop-container .pop-racer {
-    padding: 1%;
-    font-size: 10vw;
-    font-weight: bold;
-}
-
-.pop-layer .pop-container .pop-time {
-    padding: 1%;
-    font-size: 5vw;
-}
-
-.pop-rank1 {
-    color: #fbdf47;
-}
-
-.pop-rank2 {
-    color: #cacacd;
-}
-
-.pop-rank3 {
-    color: #fac07b;
-}
diff --git a/static/league.js b/static/league.js
@@ -37,7 +37,7 @@ function reloaded(res) {
     res.items.sort(compare);
 
     for (let i = 0; i < items.length; i++) {
-        if (items[i].lapTime !== res.items[i].lapTime) {
+        if (items[i].racerName !== res.items[i].racerName || items[i].lapTime !== res.items[i].lapTime) {
             rank = i + 1;
             racerName = res.items[i].racerName;
             lapTime = res.items[i].lapTime;
@@ -56,7 +56,7 @@ function reloaded(res) {
         console.log(`new ${isNew} ${rank} ${racerName} ${lapTime}`);
 
         scroll(rank);
-        // accent(rank, racerName, lapTime);
+        accent(rank, racerName, lapTime);
 
         if (isNew) {
             popup('New Challenger!', rank, racerName, lapTime);
@@ -124,7 +124,7 @@ function addRow(className, rank, racerName, lapTime) {
 
 function addText(row, text) {
     let item = document.createElement('div');
-    item.innerHTML = text;
+    item.innerHTML = `<span class="text">${text}</span>`;
     row.appendChild(item);
 }
 
@@ -151,30 +151,6 @@ $(function () {
     }, 1000);
 });
 
-function accent(rank, racer, time) {
-    $(`.pop-rank${rank}`).fadeOut();
-
-    setTimeout(function () {
-        $(`.pop-rank${rank}`).fadeIn();
-    }, 1000);
-}
-
-function popup(title, rank, racer, time) {
-    document.querySelector('.pop-title').innerText = title;
-    document.querySelector('.pop-time').innerText = time;
-
-    let pop_racer = document.querySelector('.pop-racer');
-    pop_racer.classList.add(`pop-rank${rank}`);
-    pop_racer.innerText = racer;
-
-    $('.pop-layer').fadeIn();
-
-    setTimeout(function () {
-        $('.pop-layer').fadeOut();
-        pop_racer.classList.remove(`pop-rank${rank}`);
-    }, 9000);
-}
-
 function scroll(dir) {
     let scrollTop = 0;
     let duration = 1000;
@@ -209,3 +185,25 @@ function scroll(dir) {
         scrollTop: scrollTop
     }, duration);
 }
+
+function accent(rank, racer, time) {
+    setTimeout(function () {
+        $(`.lb-rank${rank}>div:nth-child(n+2) span`).fadeOut().fadeIn().fadeOut().fadeIn();
+    }, 9000);
+}
+
+function popup(title, rank, racer, time) {
+    document.querySelector('.pop-title').innerText = title;
+    document.querySelector('.pop-time').innerText = time;
+
+    let pop_racer = document.querySelector('.pop-racer');
+    pop_racer.classList.add(`pop-rank${rank}`);
+    pop_racer.innerText = racer;
+
+    $('.pop-layer').fadeIn();
+
+    setTimeout(function () {
+        $('.pop-layer').fadeOut();
+        pop_racer.classList.remove(`pop-rank${rank}`);
+    }, 9000);
+}
diff --git a/static/pop.css b/static/pop.css
@@ -0,0 +1,61 @@
+.pop-layer {
+    display: none;
+    height: 100%;
+    left: 0;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 100;
+}
+
+.pop-layer .pop-bg {
+    background: #000;
+    filter: alpha(opacity=70);
+    height: 100%;
+    left: 0;
+    opacity: .7;
+    position: absolute;
+    top: 0;
+    width: 100%;
+}
+
+.pop-layer .pop-container {
+    height: auto;
+    position: absolute;
+    text-align: center;
+    top: 20%;
+    width: 100%;
+}
+
+.pop-layer .pop-container .pop-title {
+    padding: 1%;
+    font-size: 3vw;
+}
+
+.pop-layer .pop-container .pop-racer {
+    padding: 1%;
+    font-size: 10vw;
+    font-weight: bold;
+}
+
+.pop-layer .pop-container .pop-time {
+    padding: 1%;
+    font-size: 5vw;
+}
+
+.pop-layer .pop-container .pop-message {
+    padding: 10%;
+    font-size: 5vw;
+}
+
+.pop-rank1 {
+    color: #fbdf47;
+}
+
+.pop-rank2 {
+    color: #cacacd;
+}
+
+.pop-rank3 {
+    color: #fac07b;
+}
diff --git a/static/submit.css b/static/submit.css
@@ -134,37 +134,3 @@ a {
     height: 25px;
     padding-top: 5px;
 }
-
-.pop-layer {
-    display: none;
-    height: 100%;
-    left: 0;
-    position: fixed;
-    top: 0;
-    width: 100%;
-    z-index: 100;
-}
-
-.pop-layer .pop-bg {
-    background: #000;
-    filter: alpha(opacity=70);
-    height: 100%;
-    left: 0;
-    opacity: .7;
-    position: absolute;
-    top: 0;
-    width: 100%;
-}
-
-.pop-layer .pop-container {
-    height: auto;
-    position: absolute;
-    text-align: center;
-    top: 40%;
-    width: 100%;
-}
-
-.pop-layer .pop-container .pop-message {
-    padding: 1%;
-    font-size: 5vw;
-}
diff --git a/views/index.ejs b/views/index.ejs
@@ -9,7 +9,7 @@
 
 <body>
     <figure class="lb-logo">
-        <img src="/logo_trophy.png">
+        <img src="/icon-trophy.png">
     </figure>
 
     <h1 class="lb-title">DeepRacer Challenge</h1>

diff --git a/views/league.ejs b/views/league.ejs
@@ -5,11 +5,12 @@
     <meta charset="utf-8">
     <title>league</title>
     <link rel="stylesheet" href="/league.css">
+    <link rel="stylesheet" href="/pop.css">
 </head>
 
 <body>
     <figure class="lb-logo">
-        <img src="/logo_trophy.png">
+        <img src="/icon-trophy.png">
     </figure>
 
     <h1 class="lb-title"></h1>

diff --git a/views/submit.ejs b/views/submit.ejs
@@ -5,11 +5,12 @@
     <meta charset="utf-8">
     <title>submit</title>
     <link rel="stylesheet" href="/submit.css">
+    <link rel="stylesheet" href="/pop.css">
 </head>
 
 <body>
     <figure class="lb-logo">
-        <img src="/logo_trophy.png">
+        <img src="/icon-trophy.png">
     </figure>
 
     <h1 class="lb-title"></h1>