Update to 1.0.8

- Removed somes images (.png)
+ And replaced by SVG
* Modified some files

README.md

@@ -11,7 +11,7 @@ Do you want to discuss about it ? Go on the [Facepunch thread](http://facepunch.
 Do you want to do a donation ? [It's here](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=WAAU3DKXJXFR6)
 
 ---
-## Current version: 1.0.7.1
+## Current version: 1.0.8
 ## [Download Latest](https://github.com/Multigaming-community/GoulpLoader/releases/latest)
 ## [Demonstration](http://iklem.livehost.fr/goulploader-demo/)
 
@@ -25,9 +25,10 @@ Do you want to do a donation ? [It's here](https://www.paypal.com/cgi-bin/webscr
 * Custom background and colors.
 * Loading bar.
 * Animated.
-* __NEW__ Slideshow !
-* __NEW__ Music Player !
-* __NEW__ New easy way to configure the loader - With JSON !
+* Slideshow !
+* Music Player !
+* Easy way to configure the loader - With JSON !
+* __NEW__ All images are SVG (See Image modification Wiki to modify colors of the svgs)
 * Use of [JQuery](http://jquery.com/), [Jquery UI](http://jqueryui.com/), [Jquery Color](https://github.com/jquery/jquery-color) and [ResponsiveSlides](http://responsiveslides.com/) plugins
 
 

index.html

@@ -24,13 +24,11 @@
     <div id="container">
       <div id="leftPanel">
         <h1 id="servName">ServerName</h1>
-        <svg class='gmodImg' id="imgLeft" width="90px" height="90px" viewBox="0 0 90 90">
-          <path id="square" fill="none" stroke="none" stroke-width="1" d="M 4.50,4.53 C 4.50,4.53 85.47,4.56 85.47,4.56 85.47,4.56 85.47,86.50 85.47,86.50 85.47,86.50 4.47,86.34 4.47,86.34 4.47,86.34 4.50,4.53 4.50,4.53 Z" />
-          <path id="G" fill="none" stroke="black" stroke-width="1" d="M 44.00,58.98 C 27.29,59.40 21.67,48.03 22.01,33.00 22.11,29.03 22.69,25.65 24.35,22.00 28.42,13.08 39.40,7.12 49.00,11.01 51.84,12.16 53.76,14.00 56.00,16.00 56.00,16.00 56.00,11.00 56.00,11.00 56.00,11.00 68.00,11.00 68.00,11.00 68.00,11.00 68.00,61.00 68.00,61.00 67.96,64.23 67.86,67.01 66.43,70.00 58.74,86.11 24.32,87.50 22.00,62.00 22.00,62.00 32.91,62.13 32.91,62.13 33.87,72.48 48.02,74.39 53.65,67.74 56.80,64.03 56.00,58.52 56.00,54.00 51.57,57.58 49.81,58.84 44.00,58.98 Z M 37.51,24.13 C 32.94,29.80 32.99,51.87 47.00,49.76 60.27,47.76 61.25,19.80 44.00,20.38 41.12,21.17 39.49,21.67 37.51,24.13 Z" />
-        </svg><h2 id="gameMode">Gamemode</h2>
-        <img id="imgLeft" src="img/map.png" /><h2 id="map">Mapname</h2>
+        <img class='gmodIMG' id="imgLeft" src="/img/gmod.svg" />
+        <h2 id="gameMode">Gamemode</h2>
+        <img id="imgLeft" src="img/map.svg" /><h2 id="map">Mapname</h2>
         <span id="imgLoad">
-          <img id="noBorder" class="walk" src="img/gear.png" width="90px" />
+          <img id="noBorder" class="walk" src="img/gear.svg" width="90px" />
         </span>
         <!-- The stateLoad will be modify too -->
         <h2 id="stateLoad">Connexion...</h2>
@@ -40,7 +38,7 @@ <h2 id="stateLoad">Connexion...</h2>
           <div id="progressInfo"> - - - </div>
           <div id="progressInfoWS"> - - - </div>
         </div>
-        <div id="versionNo">v1.0.7.1</div>
+        <div id="versionNo">v1.0.8</div>
       </div>
       <div id="rightPanel">
         <!-- This is your server Banner. The image have to be 630px by 181px. The "alt" value will be modified automatically You need to open config.json to add your banner -->

js/script.js

@@ -3,7 +3,7 @@
 *  This file is important for the script to work.
 *
 *  @author: iKlem <[email protected]>
-*  @version: 1.1
+*  @version: 1.1.1
 */
 
 //Number of files to download
@@ -26,7 +26,8 @@ var isAnimate = false;
 
 
 /* IMAGE SVG */
-var dlFile = "<svg class='dlImg' xmlns='http://www.w3.org/2000/svg' width='90px' height='90px' viewBox='0 0 128 128'><path id='dlSVG' fill='black' stroke='black' stroke-width='1' d='M 110.00,116.00 C 110.00,116.00 110.00,124.00 110.00,124.00 110.00,124.00 20.00,124.00 20.00,124.00 20.00,124.00 20.00,116.00 20.00,116.00 20.00,116.00 110.00,116.00 110.00,116.00 Z M 83.00,3.00 C 83.00,3.00 83.00,65.00 83.00,65.00 83.00,65.00 110.00,65.00 110.00,65.00 110.00,65.00 97.63,78.88 97.63,78.88 97.63,78.88 76.63,99.88 76.63,99.88 76.63,99.88 64.88,111.13 64.88,111.13 64.88,111.13 53.13,99.63 53.13,99.63 53.13,99.63 32.38,79.00 32.38,79.00 32.38,79.00 20.00,65.00 20.00,65.00 20.00,65.00 47.00,65.00 47.00,65.00 47.00,65.00 47.00,3.00 47.00,3.00 47.00,3.00 83.00,3.00 83.00,3.00 Z' /></svg>"
+var dlFile = "./img/dl.svg"
+var theGear = "./img/gear.svg"
 
 /* DEBUG VALUES */
 /* --- */
@@ -77,7 +78,7 @@ function DownloadingFile(fileName) {
   $("#loadBar-width").css({"visibility": "visible"});
   isDownload = true;
   $("#stateLoad").html("Downloading " + fileName);
-  $("#imgLoad").html(dlFile);
+  $("#noBorder").attr("src", dlFile);
   $("#noBorder").attr("class", "NOPE");
   var splitSTR = fileName.split(" ");
   for (var i = 0; i<splitSTR.length; i++) {
@@ -104,7 +105,7 @@ function SetStatusChanged(status) {
     }
   }
   $("#stateLoad").html(status);
-  $("#noBorder").attr("src", "./img/gear.png");
+  $("#noBorder").attr("src", theGear);
   $("#noBorder").attr("class", "walk");
   RefreshFileBox();
 }

user.css

@@ -1,11 +1,11 @@
 /*
 *  @author: iKlem <[email protected]>
-*  @version: 1.0
+*  @version: 1.1
 */
 
 /* Change the background image and color. */
 body {
-    background: #CCCCCC url("img/bg.jpg");
+    background: #CCCCCC url("img/bg.png");
 }
 
 /* Change the background color of the left panel */
@@ -19,35 +19,6 @@ h1, #player {
     background-color: #045FB4;
 }
 
-/* SVG COLORATION - dl.svg */
-#dlSVG {
-    fill: #176BAA;
-    stroke: black;
-    stroke-width: 1px;
-}
-
-/* SVG COLORATION - Gmod logo
- * Uncomment what you need and don't forget to comment the other one
- */
-/* With stroke */
-/*#square {
-    fill: #045FB4;
-    stroke: black;
-    stroke-width: 1px;
-}*/
-/* Without stroke */
-#square {
-    fill: #045FB4;
-    stroke: none;
-    stroke-width: 0px;
-}
-
-#G {
-    fill: white;
-    stroke: black;
-    stroke-width: 1px;
-}
-
 /* Change the background color of the back bar */
 #loadBar {
     background-color: #939393;