Added RCL to map, made tooltips more opaque, moved CSS out of theme a…

…nd into project style sheet
LeagueOfAutomatedNations · Oct 4, 2016 · 543e51c · 543e51c
1 parent d77a6e0
commit 543e51c
Show file tree

Hide file tree

Showing 4 changed files with 79 additions and 72 deletions.
diff --git a/_sass/_markdown.scss b/_sass/_markdown.scss
@@ -131,74 +131,3 @@ article {
 	padding: 0 10px;
 	}
 } /* @iPhone */
-
-/* Map
---------------------------- */
-#ScreepsMapFlex {
-  position: relative;
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-}
-
-#ScreepsMapFlex .spinner {
-    background-image: url(/img/leaguelogo_spinner.gif);
-    background-repeat: no-repeat;
-    background-position: center center;
-}
-
-#ScreepsMapFlex .spinnerDone {
-    background-image: url(/img/leaguelogo.png);
-    background-repeat: no-repeat;
-    background-position: center center;
-}
-
-#ScreepsMapContainer {
-    display: block;
-}
-
-#ScreepsMapContainer canvas {
-    position: absolute;
-    top: 0px;
-    left: 0px;
-}
-
-#ScreepsColorKeyContainer {
-    float: right;
-}
-
-#ScreepsMapFlex .colorKeyList, #ScreepsMapFlex .layerControls {
-    list-style: none;
-}
-
-#ScreepsColorKeyContainer .colorKeyList .colorBox {
-  display: inline-block;
-  border: 1px solid black;
-  width: 1em;
-  height: 1em;
-  margin-right: 2px;
-  vertical-align: middle;
-}
-
-#ScreepsMapTooltip {
-  position: fixed;
-  z-index: 100;
-  background-color: #FFFFFF;
-  opacity: 0.7;
-  padding: 5px;
-  border: 1px solid black;
-  border-radius: 10px;
-  width: 17em;
-}
-
-#ScreepsMapTooltip dl {
-  display: flex;
-  flex-wrap: wrap;
-}
-
-#ScreepsMapTooltip dl dt {
-  width: 30%;
-}
-#ScreepsMapTooltip dl div {
-  width: 66%;
-}
diff --git a/css/style.scss b/css/style.scss
@@ -512,3 +512,76 @@ article{
 		display: none;
 	}
 }
+
+
+
+/* Map
+--------------------------- */
+#ScreepsMapFlex {
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+}
+
+#ScreepsMapFlex .spinner {
+    background-image: url(/img/leaguelogo_spinner.gif);
+    background-repeat: no-repeat;
+    background-position: center center;
+}
+
+#ScreepsMapFlex .spinnerDone {
+    background-image: url(/img/leaguelogo.png);
+    background-repeat: no-repeat;
+    background-position: center center;
+}
+
+#ScreepsMapContainer {
+    display: block;
+}
+
+#ScreepsMapContainer canvas {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+}
+
+#ScreepsColorKeyContainer {
+    float: right;
+}
+
+#ScreepsMapFlex .colorKeyList, #ScreepsMapFlex .layerControls {
+    list-style: none;
+}
+
+#ScreepsColorKeyContainer .colorKeyList .colorBox {
+  display: inline-block;
+  border: 1px solid black;
+  width: 1em;
+  height: 1em;
+  margin-right: 2px;
+  vertical-align: middle;
+}
+
+#ScreepsMapTooltip {
+  position: fixed;
+  z-index: 100;
+  background-color: #FFFFFF;
+  opacity: 0.80;
+  padding: 5px;
+  border: 1px solid black;
+  border-radius: 10px;
+  width: 17em;
+}
+
+#ScreepsMapTooltip dl {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+#ScreepsMapTooltip dl dt {
+  width: 30%;
+}
+#ScreepsMapTooltip dl div {
+  width: 66%;
+}
diff --git a/js/ScreepsMap.js b/js/ScreepsMap.js
@@ -435,8 +435,10 @@ ScreepsMap.prototype.populateTooltip = function(tooltip, roomName) {
     if (this.rooms[roomName]) {
         if (this.rooms[roomName].level) {
             tooltip.querySelector(".roomType").innerHTML = "Owned";
+            tooltip.querySelector(".roomLevel").innerHTML = this.rooms[roomName].level;
         } else {
             tooltip.querySelector(".roomType").innerHTML = "Reserved";
+            tooltip.querySelector(".roomLevel").innerHTML = "N/A";
         }
         tooltip.querySelector(".roomOwner").innerHTML = this.rooms[roomName].owner;
         let alliance;
@@ -455,5 +457,6 @@ ScreepsMap.prototype.populateTooltip = function(tooltip, roomName) {
         tooltip.querySelector(".roomType").innerHTML = "Unowned";
         tooltip.querySelector(".roomOwner").innerHTML = "N/A";
         tooltip.querySelector(".roomAlliance").innerHTML = "N/A";
+        tooltip.querySelector(".roomLevel").innerHTML = "N/A";
     }
 }
diff --git a/map.html b/map.html
@@ -1,6 +1,6 @@
 ---
 layout: page
-title: Screeps Alliance Map 
+title: Screeps Alliance Map
 sitemap:
   priority: 1.0
   changefreq: weekly
@@ -13,6 +13,8 @@
           <div class="roomName"></div>
           <dt>Type:</dt>
           <div class="roomType"></div>
+          <dt>RCL:</dt>
+          <div class="roomLevel"></div>
           <dt>Owner:</dt>
           <div class="roomOwner"></div>
           <dt>Alliance:</dt>