forked and updated repo to mirror runing setup

config.json

@@ -1,3 +1,3 @@
 {
-    "api_key": "86f7896f97asdf89u0a9s7d7fdasgsda88af"
+    "api_key": "qCUlkiJTqzI3ClxguW2v.etqpOUwi85djis7p.Vicg3a8vjPfCcEG"
 }

css/spaceapi.css

@@ -1,4 +1,4 @@
-@import "../font/kavoon-regular.css";
+@import "../font/bender/bender.css";
 
 body {
     text-align: center;
@@ -23,24 +23,29 @@ body {
  *  https://blueprints.launchpad.net/inkscape/+spec/allow-browser-resizing
  *
  */
-#svg4534 {
-    width: 410px;
-    display: none;
-}
 
 h2 {
-    font-family: KavoonRegular;
+    font-family: bender_bold;
     font-size: 40px;
     /* the letter spaceing breaks the centering */
     /*letter-spacing: 0.7em;*/
 }
 
-#svg4534, h2 {
+h1 {
+    font-family: bender_bold;
+    font-size: 40px;
+}
+
+#svg4534, h2, h1 {
     transition: all 0.3s ease 0s;
 }
 
 @media (max-width: 500px) {
 
+    h1 {
+        font-size: 30px;
+    }
+
     h2 {
         font-size: 30px;
     }
@@ -53,6 +58,10 @@ h2 {
 
 @media (max-width: 380px) {
 
+    h1 {
+        font-size: 25px;
+    }
+
     h2 {
         font-size: 25px;
     }
@@ -65,6 +74,10 @@ h2 {
 
 @media (max-width: 220px) {
 
+    h1 {
+        font-size: 20px;
+    }
+
     h2 {
         font-size: 20px;
     }
@@ -77,6 +90,10 @@ h2 {
 
 @media (max-width: 160px) {
 
+    h1 {
+        font-size: 18px;
+    }
+
     h2 {
         font-size: 18px;
     }
@@ -89,6 +106,10 @@ h2 {
 
 @media (max-width: 125px) {
 
+    h1 {
+        font-size: 18px;
+    }
+
     h2 {
         font-size: 18px;
     }
@@ -101,6 +122,10 @@ h2 {
 
 @media (max-width: 90px) {
 
+    h1 {
+        font-size: 16px;
+    }
+
     h2 {
         font-size: 16px;
     }
@@ -114,21 +139,29 @@ h2 {
 #button {
     display: none;
     margin: 0 auto;
-    text-align: left;
+    text-align: center;
+    /* original:
     width: 128px;
-    height: 128px;
+    height: 128px;*/
+    /*full logo:
+    width: 545px;
+    height: 428px;
+    */
+    width: 256px;
+    height: 261px;
 }
 
 #button.open {
-    background: url('/img/button/green.png') no-repeat;
+    background: url('/img/logo_green.png') no-repeat;
 }
 #button.closed {
-    background: url('/img/button/red.png') no-repeat;
+    background: url('/img/logo_red.png') no-repeat;
 }
-#button.undefined {
-    background: url('/img/button/gray.png') no-repeat;
+#button.undefined\3f \21  {
+    background: url('/img/logo_gray.png') no-repeat;
 }
 
+
 #circle3371,
 #path3339 {
     -webkit-transition: all linear 1s;
@@ -156,4 +189,5 @@ h2 {
 }
 #path3339.undefined {
     fill: #0f91ec !important;
-}
+}
+

css/spaceapi.css.old

@@ -0,0 +1,161 @@
+@import "../font/bender/bender.css";
+
+body {
+    text-align: center;
+    padding: 20px 0px 0px 0px;
+    margin: 0;
+    overflow: hidden;
+}
+
+/**
+ * In order to use the width property to scale the svg
+ * the following attributes had to be added to the outer
+ * svg element:
+ *
+ *    preserveAspectRatio="xMinYMin meet"
+ *    viewBox="0 0 410 430"
+ *
+ * See:
+ *
+ *  http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute
+ *  http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute
+ *  http://stackoverflow.com/questions/644896/how-do-i-scale-a-stubborn-svg-embedded-with-the-object-tag
+ *  https://blueprints.launchpad.net/inkscape/+spec/allow-browser-resizing
+ *
+ */
+#svg4534 {
+    width: 410px;
+    display: none;
+}
+
+h2 {
+    font-family: bender_bold;
+    font-size: 40px;
+    /* the letter spaceing breaks the centering */
+    /*letter-spacing: 0.7em;*/
+}
+
+#svg4534, h2 {
+    transition: all 0.3s ease 0s;
+}
+
+@media (max-width: 500px) {
+
+    h2 {
+        font-size: 30px;
+    }
+
+    #svg4534 {
+        width: 350px;
+    }
+
+}
+
+@media (max-width: 380px) {
+
+    h2 {
+        font-size: 25px;
+    }
+
+    #svg4534 {
+        width: 210px;
+    }
+
+}
+
+@media (max-width: 220px) {
+
+    h2 {
+        font-size: 20px;
+    }
+
+    #svg4534 {
+        width: 150px;
+    }
+
+}
+
+@media (max-width: 160px) {
+
+    h2 {
+        font-size: 18px;
+    }
+
+    #svg4534 {
+        width: 120px;
+    }
+
+}
+
+@media (max-width: 125px) {
+
+    h2 {
+        font-size: 18px;
+    }
+
+    #svg4534 {
+        width: 80px;
+    }
+
+}
+
+@media (max-width: 90px) {
+
+    h2 {
+        font-size: 16px;
+    }
+
+    #svg4534 {
+        width: 50px;
+    }
+
+}
+
+#button {
+    display: none;
+    margin: 0 auto;
+    text-align: left;
+    width: 128px;
+    height: 128px;
+}
+
+#button.open {
+    background: url('/img/button/green.png') no-repeat;
+}
+#button.closed {
+    background: url('/img/button/red.png') no-repeat;
+}
+#button.undefined {
+    background: url('/img/button/gray.png') no-repeat;
+}
+
+
+#circle3371,
+#path3339 {
+    -webkit-transition: all linear 1s;
+    -moz-transition: all linear 1s;
+    -o-transition: all linear 1s;
+    transition: all linear 1s;
+}
+
+#circle3371.open {
+    fill: #2dd2b8 !important;
+}
+#circle3371.closed {
+    fill: #ff7f00 !important;
+}
+#circle3371.undefined {
+    fill: #00cfff !important;
+}
+
+
+#path3339.open {
+    fill: #007f3f !important;
+}
+#path3339.closed {
+    fill: #ec370f !important;
+}
+#path3339.undefined {
+    fill: #0f91ec !important;
+}
+

data/state.open

@@ -0,0 +1 @@
+boolean: