Style + Js

src/TourinsoftExtension.php

@@ -2,6 +2,9 @@
 
 namespace Bolt\Extension\Appolo\Tourinsoft;
 
+use Bolt\Asset\File\JavaScript;
+use Bolt\Asset\File\Stylesheet;
+use Bolt\Controller\Zone;
 use Bolt\Extension\Appolo\Tourinsoft\Controller\Backend\FluxController;
 use Bolt\Extension\DatabaseSchemaTrait;
 use Bolt\Extension\SimpleExtension;
@@ -82,7 +85,6 @@ class TourinsoftExtension extends SimpleExtension
         parent::registerServices($app); // TODO: Change the autogenerated stub
     }
 
-
     /**
      * @param string $type
      * @param string $data
@@ -113,5 +115,21 @@ class TourinsoftExtension extends SimpleExtension
         ];
     }
 
+    /**
+     * {@inheritdoc}
+     */
+    protected function registerAssets()
+    {
+        return [
+            JavaScript::create('js/tourinsoft.js')
+                ->setLate(true)
+                ->setPriority(5)
+                ->setZone(Zone::BACKEND),
+            Stylesheet::create('css/tourinsoft.css')
+                ->setLate(true)
+                ->setPriority(5)
+                ->setZone(Zone::BACKEND)
+        ];
+    }
 
 }
\ No newline at end of file

templates/Backend/flux/list.html.twig

@@ -10,9 +10,13 @@
 {% endblock page_title %}
 
 {% block page_main %}
-    <div class="row">
+    <div id="loader-wrapper">
+        <div id="loader"> Synchronisation en cours. Merci de patienter.</div>
+    </div>
+
+    <div class="row flux_listing">
         <div class="col-md-8">
-            <div class="buic-listing">
+            <div class="buic-listing ">
                 <!-- tableau -->
                 <table class=" dashboardlisting listing">
                     <tbody class="sortable striping_odd ui-sortable">
@@ -41,7 +45,7 @@
                                    </button>
                                     <ul class="dropdown-menu pull-right">
                                         <li>
-                                            <a href="{{ path('tourinsoft_admin_flux_sync', {'id': item.id}) }}">
+                                            <a href="{{ path('tourinsoft_admin_flux_sync', {'id': item.id}) }}" class="tourinsoft_syncrhonize">
                                                 <i class="fa fa-refresh"></i>
                                                 {{ __('appolo.tourinsoft.synchronize') }}
                                             </a>
@@ -107,4 +111,6 @@
         </aside>
         <!-- / sidebar -->
     </div>
+
+
 {% endblock page_main %}
\ No newline at end of file

web/css/tourinsoft.css

+#loader-wrapper {
+    width: 100%;
+    height: 50vh;
+    background-color: #33363e;
+    color: #CCC;
+    display: none;
+}
+
+#loader-wrapper #loader {
+    position: relative;
+    text-align: center;
+    top: 50%;
+    font-size: 2em;
+}
\ No newline at end of file

web/js/tourinsoft.js

+$(document).ready(function () {
+    $('.tourinsoft_syncrhonize').click(function (e) {
+        $('.flux_listing').fadeOut();
+        $('#loader-wrapper').fadeIn();
+    });
+});
\ No newline at end of file