Add waiting logo for PG

Playground/css/index.css

@@ -24,12 +24,38 @@ body {
     flex-direction: column;
 }
 
-#waitSpan {
-    text-align: center;
-    font-size: 20px;
-    font-weight: lighter;
-    color: white;
-}
+#waitLogo {
+    -webkit-animation: spin1 2s infinite ease-in-out;
+    -moz-animation: spin1 2s infinite ease-in-out;
+    -o-animation: spin1 2s infinite ease-in-out;
+    -ms-animation: spin1 2s infinite ease-in-out;
+    animation: spin1 2s infinite ease-in-out;
+    -webkit-transform-origin: 50% 50%;
+    -moz-transform-origin: 50% 50%;
+    -o-transform-origin: 50% 50%;
+    transform-origin: 50% 50%;    
+}
+
+@-webkit-keyframes spin1 {
+0% { -webkit-transform: rotate(0deg);}
+100% { -webkit-transform: rotate(360deg);}
+}
+@-moz-keyframes spin1 {
+0% { -moz-transform: rotate(0deg);}
+100% { -moz-transform: rotate(360deg);}
+}
+@-o-keyframes spin1 {
+0% { -o-transform: rotate(0deg);}
+100% { -o-transform: rotate(360deg);}
+}
+@-ms-keyframes spin1 {
+0% { -ms-transform: rotate(0deg);}
+100% { -ms-transform: rotate(360deg);}
+}
+@keyframes spin1 {
+0% { transform: rotate(0deg);}
+100% { transform: rotate(360deg);}
+} 
 
 #waitTitle {
     text-align: center;

Playground/index-local.html

@@ -343,8 +343,8 @@
 
     <div id="waitDiv">
         <span id="waitTitle">Babylon.js Playground<BR><BR><BR></span>
-        <span id="waitSpan">loading editor...</span>
-    </div>       
+        <img src="waitlogo.png" id="waitLogo"/>
+    </div>   
 
     <script src="https://code.jquery.com/jquery.js"></script>
 

Playground/index.html

@@ -379,7 +379,7 @@
 
     <div id="waitDiv">
         <span id="waitTitle">Babylon.js Playground<BR><BR><BR></span>
-        <span id="waitSpan">loading editor...</span>
+        <img src="waitlogo.png" id="waitLogo"/>
     </div>   
 
     <script src="https://code.jquery.com/jquery.js"></script>