wait 5531 @2

diff --git a/resources/linkeditor/js/linkeditor.js b/resources/linkeditor/js/linkeditor.js
index 0c9c34be9d1c649d80c55fb4b52bb76ef87c5be0..cdab03804cffc65e82661ae118aa295031b16245 100644 (file)
--- a/resources/linkeditor/js/linkeditor.js
+++ b/resources/linkeditor/js/linkeditor.js
@@ -129,6 +129,7 @@ LinkEditor.prototype = {
             $this.zoom.mouseUp();
             $this.rulers.mouseUp();
             $this.links.mouseUp();
+            $this.panels.mouseup();
         });
 
         if (this.single) {
@@ -238,11 +239,13 @@ LinkEditor.prototype = {
             this.setMouseCoordinates(e);
         }
 
+        this.panels.moveHandle();
         this.rulers.updateMousePositionRulers();
         this.rulers.moveRuler();
         this.links.moveDragLink();
         this.links.moveResizeLink();
         this.zoom.updateMousePosition();
+
     },
 
     setMouseCoordinates: function (e) {

diff --git a/resources/linkeditor/js/linkeditor.loader.js b/resources/linkeditor/js/linkeditor.loader.js
index 00624cd924901be67ff53cd79b9606ee761e9a1f..3c8049c200a9c7e565da192cbfa7fdf5f53d0a39 100644 (file)
--- a/resources/linkeditor/js/linkeditor.loader.js
+++ b/resources/linkeditor/js/linkeditor.loader.js
@@ -28,15 +28,15 @@ LinkeditorLoader.prototype = {
     preloadPages: function () {
         let j = 1;
         var $this = this;
-        for (let i = Math.max(1, this.linkeditor.currentPage - 4); i <= Math.min(this.linkeditor.currentPage + 16, FLUIDBOOK_DATA.settings.pages); i++) {
+        for (let i = Math.max(1, this.linkeditor.currentPage - 2); i <= Math.min(this.linkeditor.currentPage + 6, FLUIDBOOK_DATA.settings.pages); i++) {
             if ($('.preload[data-page="' + i + '"]').length >= 1) {
                 continue;
             }
             setTimeout(function () {
                 var c = $('<div class="preload" data-page="i"></div>');
                 $("#linkeditor-preload").append(c);
-                $this._loadPage(i, c);
-            }, j * 500);
+                $this._loadPage(i, c, true);
+            }, j * 1500);
             j++;
         }
     },

diff --git a/resources/linkeditor/js/linkeditor.panels.js b/resources/linkeditor/js/linkeditor.panels.js
index 694c382fb0d186fb4d2e8ffb15027d999d40838b..fe3d02c02ca93e8299536d62bea61be83ffa9ab7 100644 (file)
--- a/resources/linkeditor/js/linkeditor.panels.js
+++ b/resources/linkeditor/js/linkeditor.panels.js
@@ -1,19 +1,20 @@
 function LinkeditorPanels(linkeditor) {
     this.linkeditor = linkeditor;
     this.sides = ['left', 'right'];
+    this.maxWidth = 70;
+    this.minWidth = 7;
+    this.thresholdToggle = 3;
 }
 
 LinkeditorPanels.prototype = {
     init: function () {
-
         var $this = this;
         $.each(this.sides, function (k, side) {
             var tool = $this.linkeditor.settings.get(side + '_tool');
             var open = $this.linkeditor.settings.get(tool + '_open');
-            console.log(open);
-            var width = Math.min(70, Math.max(12, $this.linkeditor.settings.get(tool + '_width')));
+            var width = $this.normalizeWidth($this.linkeditor.settings.get(tool + '_width'));
             var icon = $("#linkeditor-icon-" + tool);
-            var panelContainer = $("#linkeditor-" + side + '-panel')
+            var panelContainer = $("#linkeditor-" + side + '-panel').data('tool', tool);
 
             $("#linkeditor-" + side + '-icons').append(icon);
             panelContainer.append($("#linkeditor-panel-" + tool));
@@ -24,6 +25,49 @@ LinkeditorPanels.prototype = {
             panelContainer.attr('data-width', width);
         });
         this.linkeditor.resize.resize();
+        $(document).on('mousedown', ".linkeditor-sidebar .handle", function (e) {
+            $this.linkeditor.setMouseCoordinates(e);
+            $(this).addClass('dragging');
+            return false;
+        });
+
+    },
+
+    moveHandle: function () {
+        var $this = this;
+        $(".linkeditor-sidebar .handle.dragging").each(function () {
+            let cssWidth;
+            let sidebar = $(this).closest('.linkeditor-sidebar');
+            if (sidebar.data('side') === 'left') {
+                cssWidth = $this.linkeditor.mx - 49;
+            } else {
+                cssWidth = $this.linkeditor.resize.ww - 49 - $this.linkeditor.mx;
+            }
+            let panel = $(sidebar).find('.linkeditor-panel');
+            let relativeWidth = 100 * (cssWidth / $this.linkeditor.resize.ww);
+
+            let tool = panel.data('tool');
+            // Open/close when drag&drop
+            if (relativeWidth < $this.thresholdToggle) {
+                // Close
+                $this.setPanelState(tool, false);
+            } else {
+                $this.setPanelState(tool, true);
+            }
+
+            let width = $this.normalizeWidth(relativeWidth);
+            panel.data('width', width);
+            $this.linkeditor.settings.set(tool + '_width', width);
+            $this.linkeditor.resize.resize();
+        });
+    },
+
+    normalizeWidth: function (w) {
+        return Math.max(this.minWidth, Math.min(w, this.maxWidth));
+    },
+
+    mouseup: function () {
+        $(".linkeditor-sidebar .handle.dragging").removeClass('dragging');
     },
 
     resize: function (ww) {
@@ -36,6 +80,7 @@ LinkeditorPanels.prototype = {
             $(this).css('width', w);
         });
     },
+
     toggleLayers: function () {
         this.togglePanel('layers');
     },
@@ -43,18 +88,28 @@ LinkeditorPanels.prototype = {
         this.togglePanel('form');
     },
     togglePanel: function (panel) {
+        this.setPanelState(panel, 'toggle');
+    },
+    setPanelState: function (panel, newState) {
         let container = $("#linkeditor-panel-" + panel).closest('.linkeditor-panel');
-        container.toggleClass('open');
+        var currentState = container.hasClass('open');
+        if (currentState === newState) {
+            return;
+        }
+        if (newState === 'toggle') {
+            newState = !currentState;
+        }
         var icon = $("#linkeditor-icon-" + panel);
-        var opened = container.hasClass('open');
-        if (opened) {
+        if (newState) {
+            container.addClass('open');
             icon.addClass('active');
         } else {
+            container.removeClass('open');
             icon.removeClass('active');
         }
-        this.linkeditor.settings.set(panel + '_open', opened);
+        this.linkeditor.settings.set(panel + '_open', newState);
         this.linkeditor.resize.resize();
-    }
+    },
 
 };
 module.exports = LinkeditorPanels;

diff --git a/resources/views/fluidbook_publication/link_editor.blade.php b/resources/views/fluidbook_publication/link_editor.blade.php
index b94d4c1f8524b649db82bd0e0b36ea42d024307d..b3c9d11156393ae6bf8eccd02ce42ce8ac79d08c 100644 (file)
--- a/resources/views/fluidbook_publication/link_editor.blade.php
+++ b/resources/views/fluidbook_publication/link_editor.blade.php
@@ -33,14 +33,14 @@
                data-tooltip="{{__('Liste des liens')}} (F7)"
                data-key="f7"></a>
             <a href="#" id="linkeditor-icon-form" data-icon="settings" data-action="panels.toggleForm"
-               data-tooltip="{{__('Afficher le formulaire')}} (F8)"
+               data-tooltip="{{__('Paramètres du lien')}} (F8)"
                data-key="f8"></a>
             <div id="linkeditor-panel-layers">
             </div>
             <div id="linkeditor-panel-form">
             </div>
         </div>
-        <aside id="linkeditor-left" class="linkeditor-sidebar">
+        <aside id="linkeditor-left" class="linkeditor-sidebar" data-side="left">
             <nav id="linkeditor-left-icons">
 
             </nav>
@@ -108,7 +108,7 @@
                 </div>
             </div>
         </div>
-        <aside id="linkeditor-right" class="linkeditor-sidebar">
+        <aside id="linkeditor-right" class="linkeditor-sidebar" data-side="right">
             <nav id="linkeditor-right-icons"></nav>
             <div id="linkeditor-right-panel" class="linkeditor-panel"></div>
             <div class="handle"></div>