From 6cc0df75a6c9da2fbe1d5b09c783ab95e233dde5 Mon Sep 17 00:00:00 2001
From: Nick O'Leary <nick.oleary@gmail.com>
Date: Tue, 1 Apr 2014 22:53:48 +0100
Subject: [PATCH] Better spinner graphic Fixes #189

---
 public/index.html |   2 +-
 public/spin.gif   | Bin 215 -> 0 bytes
 public/spin.svg   |  41 +++++++++++++++++++++++++++++++++++++++++
 public/style.css  |   3 ++-
 4 files changed, 44 insertions(+), 2 deletions(-)
 delete mode 100644 public/spin.gif
 create mode 100644 public/spin.svg

diff --git a/public/index.html b/public/index.html
index 5bc8c59de..a0fb373ce 100644
--- a/public/index.html
+++ b/public/index.html
@@ -72,7 +72,7 @@
 </div>
 <div id="main-container" class="sidebar-closed">
     <div id="palette">
-        <i class="palette-spinner spinner"></i>
+        <img src="spin.svg" class="palette-spinner"/>
         <div class="palette-scroll">
             <div class="palette-category">
                 <div class="palette-header"><i class="expanded icon-chevron-down"></i><span>inputs</span></div>
diff --git a/public/spin.gif b/public/spin.gif
deleted file mode 100644
index 897543ef5e952252013e01fb9f226cb1e8f476ce..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 215
zcmZ?wbhEHb<YVAtXklRZ|NlP&1H*?8AG*4_9z1y9=H^yaRRt7@h=@>8QCYKQ&Axs6
zL_|d9%$dW&!eVA-mXVPG)IvN^{K>+|#URh112hw8BOe0;YsdrjE+@^J=Nft~nX9rN
zakY3|X;0d=)I+7ct?7x9nb@kE4+1p~1eiA|I@VswQwuBlC?vtByQrz#Nrp|}u<u0y
bj$n<BgaiQ%9)F#^S1KlnSZOFLGFSru_?2h`

diff --git a/public/spin.svg b/public/spin.svg
new file mode 100644
index 000000000..e609530aa
--- /dev/null
+++ b/public/spin.svg
@@ -0,0 +1,41 @@
+<!-- 
+The MIT License (MIT)
+
+Copyright (c) 2014 Brent Jackson
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
+Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+https://github.com/jxnblk/loading
+-->
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" fill="#999">
+  <path transform="translate(2)" d="M0 12 V20 H4 V12z"> 
+    <animate attributeName="d" values="M0 12 V20 H4 V12z; M0 4 V28 H4 V4z; M0 12 V20 H4 V12z; M0 12 V20 H4 V12z" dur="1.2s" repeatCount="indefinite" begin="0" keytimes="0;.2;.5;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.8 0.4 0.8" calcMode="spline"  />
+  </path>
+  <path transform="translate(8)" d="M0 12 V20 H4 V12z">
+    <animate attributeName="d" values="M0 12 V20 H4 V12z; M0 4 V28 H4 V4z; M0 12 V20 H4 V12z; M0 12 V20 H4 V12z" dur="1.2s" repeatCount="indefinite" begin="0.2" keytimes="0;.2;.5;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.8 0.4 0.8" calcMode="spline"  />
+  </path>
+  <path transform="translate(14)" d="M0 12 V20 H4 V12z">
+    <animate attributeName="d" values="M0 12 V20 H4 V12z; M0 4 V28 H4 V4z; M0 12 V20 H4 V12z; M0 12 V20 H4 V12z" dur="1.2s" repeatCount="indefinite" begin="0.4" keytimes="0;.2;.5;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.8 0.4 0.8" calcMode="spline" />
+  </path>
+  <path transform="translate(20)" d="M0 12 V20 H4 V12z">
+    <animate attributeName="d" values="M0 12 V20 H4 V12z; M0 4 V28 H4 V4z; M0 12 V20 H4 V12z; M0 12 V20 H4 V12z" dur="1.2s" repeatCount="indefinite" begin="0.6" keytimes="0;.2;.5;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.8 0.4 0.8" calcMode="spline" />
+  </path>
+  <path transform="translate(26)" d="M0 12 V20 H4 V12z">
+    <animate attributeName="d" values="M0 12 V20 H4 V12z; M0 4 V28 H4 V4z; M0 12 V20 H4 V12z; M0 12 V20 H4 V12z" dur="1.2s" repeatCount="indefinite" begin="0.8" keytimes="0;.2;.5;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.8 0.4 0.8" calcMode="spline" />
+  </path>
+</svg>
diff --git a/public/style.css b/public/style.css
index 56bcebba7..7b01433b8 100644
--- a/public/style.css
+++ b/public/style.css
@@ -852,7 +852,8 @@ i.spinner {
     line-height: 14px;
     vertical-align: text-top;
     margin-top: 0px;
-    background: url(spin.gif) no-repeat 50% 50%;
+    background: url(spin.svg) no-repeat 50% 50%;
+    background-size: contain
 }