From 8963fbb99057e7f14969b9e8d3cc8ba7ef337a98 Mon Sep 17 00:00:00 2001
From: alexandre-pereira <alexandre.pereira.it@gmail.com>
Date: Mon, 23 Mar 2015 10:41:26 +0100
Subject: [PATCH] Spinner

---
 SRC/public/imgs/spinner.png                   | Bin 0 -> 2492 bytes
 SRC/resources/views/frontend/puzzle.blade.php |  52 ++++++++++++++----
 2 files changed, 42 insertions(+), 10 deletions(-)
 create mode 100644 SRC/public/imgs/spinner.png

diff --git a/SRC/public/imgs/spinner.png b/SRC/public/imgs/spinner.png
new file mode 100644
index 0000000000000000000000000000000000000000..7280eb43573ab12bdc54ace38d24c5667f1efebe
GIT binary patch
literal 2492
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
GLSTY(q@7&=

literal 0
HcmV?d00001

diff --git a/SRC/resources/views/frontend/puzzle.blade.php b/SRC/resources/views/frontend/puzzle.blade.php
index 8c220a8..2b01cf2 100755
--- a/SRC/resources/views/frontend/puzzle.blade.php
+++ b/SRC/resources/views/frontend/puzzle.blade.php
@@ -1,6 +1,35 @@
 @extends('frontend/template')
+@section('page-css')
+<style>
+@-webkit-keyframes whirly {
+  0% {
+    -webkit-transform: rotate(0deg);
+    -moz-transform: rotate(0deg);
+    -ms-transform: rotate(0deg);
+    -o-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
 
+  100% {
+    -webkit-transform: rotate(360deg);
+    -moz-transform: rotate(360deg);
+    -ms-transform: rotate(360deg);
+    -o-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+
+#loader img {
+ -webkit-animation: whirly 3s infinite linear;
+}
+</style>
+
+
+@endsection
 @section('content')
+    <div id="loader" style="width:100%;text-align:center;padding-top:100px;">
+        <img src="{{ URL::to('imgs/spinner.png') }}" alt="chargement">
+    </div>
 	<script src="{{ URL::to('js/phaser.min.js') }}"></script>
 	<script src="{{ URL::to('js/responsivevoice.js') }}"></script>
     <script type="text/javascript">
@@ -15,7 +44,6 @@
             //cas où l'image est plus large et haute, on prend le meilleur ratio pour pas redimensionner 2 fois
 
             if(h/y > w/x) { //il faut redimensionner en hauteur
-                console.log("il faut redimensionner en hauteur")
                 return w * y/h * ratioImage;
             } else { //on redimensionne en largeur
                 return x * ratioImage;
@@ -59,7 +87,16 @@
                 game.load.spritesheet("tableau"+i, selection[i-1].src, selection[i-1].width/dimensions[0], selection[i-1].height/dimensions[1]);
             }
         }
+        function create () {
 
+            this.button3 = this.add.button(0, 0, 'previous', changePage);
+            this.button3.width = 50;
+            this.button3.height = 50;
+
+            this.physics.startSystem(Phaser.Physics.ARCADE);
+            createPiecesFor(1);
+            dateDebut = new Date();
+        }
         function nextPuzzle() {
             currentPlayed++;
             pieces.destroy(true);
@@ -110,15 +147,7 @@
 
                  graphics.lineTo(10,10);
         }
-        function create () {
-            this.button3 = this.add.button(0, 0, 'previous', changePage);
-            this.button3.width = 50;
-            this.button3.height = 50;
 
-            this.physics.startSystem(Phaser.Physics.ARCADE);
-            createPiecesFor(1);
-            dateDebut = new Date();
-        }
         function changePage() {
             if (confirm('Quitter le jeu ?')) {
                 location.href = "{{URL::to('/')}}";
@@ -299,8 +328,11 @@
                 
                 tmpImg.onload = function () {
                     loadedImg++;
-                    if(loadedImg == nbToPlay)
+                    if(loadedImg == nbToPlay) {
+                        var element = document.getElementById("loader");
+                        element.parentNode.removeChild(element);
                         game = new Phaser.Game(x, y, Phaser.CANVAS, '', { preload: preload, update: update, create: create }, true);
+                    }
                 }
             }