]> _ Git - fluidbook-toolbox.git/commitdiff
wip #5645 @3
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 13 Dec 2022 18:12:34 +0000 (19:12 +0100)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 13 Dec 2022 18:12:34 +0000 (19:12 +0100)
package-lock.json
resources/linkeditor/js/linkeditor.js
resources/linkeditor/js/linkeditor.links.js
resources/linkeditor/style/inc/_contextmenu.sass [new file with mode: 0644]
resources/linkeditor/style/style.sass
resources/views/fluidbook_publication/link_editor.blade.php

index a2037b847bbe850bd4f38b371c2f7b04a95aa2ce..1c3654d12889cac5e1efeb4b2dc953854a19d622 100644 (file)
@@ -1,5 +1,5 @@
 {
-    "name": "FluidbookToolbox",
+    "name": "application",
     "lockfileVersion": 2,
     "requires": true,
     "packages": {
index 267fe243b4e13c87ffcb24e412d0d4177af3c784..ff87fb93a4230b8af1249ca75c0891ef6a51a928 100644 (file)
@@ -35,6 +35,8 @@ window.key.filter = function (event) {
 
 require('jquery.scrollto');
 require('jquery-contextmenu');
+import 'jquery-contextmenu/dist/jquery.contextMenu.css';
+
 require('jquery-form');
 require('spectrum-colorpicker');
 import 'spectrum-colorpicker/spectrum.css';
@@ -66,6 +68,8 @@ function LinkEditor() {
     this.editorRect = null;
     this.currentPage = -1;
 
+    this.rightClick = false;
+
     this.dimensionProperties = ['left', 'top', 'width', 'height'];
 
     this.init();
@@ -73,6 +77,8 @@ function LinkEditor() {
 
 LinkEditor.prototype = {
     init: function () {
+        var $this = this;
+
         this.toolbar = new LinkeditorToolbar(this);
         this.resize = new LinkeditorResize(this);
         this.rulers = new LinkeditorRulers(this);
@@ -108,6 +114,22 @@ LinkEditor.prototype = {
 
     initEvents: function () {
         var $this = this;
+
+        $(document).on('mousedown', '*', function (e) {
+            $this.rightClick = e.which !== 1;
+            return true;
+        });
+
+        $(document).on('mouseup', '*', function (e) {
+            if ($this.rightClick) {
+                setTimeout(function () {
+                    $this.rightClick = false;
+                }, 100);
+            }
+            $this.rightClick = false;
+            return true;
+        });
+
         $(window).on('hashchange', function () {
             $this.changePage();
         });
@@ -133,6 +155,7 @@ LinkEditor.prototype = {
             }
             $this.rulers.moveRuler();
         });
+
         $(window).on('keyup', function (e) {
             if (e.keyCode == 32) {
                 $this.zoom.resetZoomDrag();
@@ -144,8 +167,11 @@ LinkEditor.prototype = {
         });
 
         $(document).on('mousedown', "#linkeditor-editor", function (e) {
-            var deselectAll = true;
             $this.setMouseCoordinates(e);
+            if ($this.rightClick) {
+                return true;
+            }
+            var deselectAll = true;
             if ($(this).hasClass('duplicate')) {
                 $this.links.duplicateLinkClick();
                 return;
@@ -172,11 +198,18 @@ LinkEditor.prototype = {
         });
 
         $(window).on('mousemove', function (e) {
+            $this.setMouseCoordinates(e);
+            if ($this.rightClick) {
+                return true;
+            }
             $this.updateMousePosition(e);
         });
 
         $(window).on('mouseup', function (e) {
             $this.setMouseCoordinates(e);
+            if ($this.rightClick) {
+                return true;
+            }
             $this.panels.mouseup();
             $this.zoom.mouseUp();
             $this.rulers.mouseUp();
@@ -198,6 +231,9 @@ LinkEditor.prototype = {
             width: this.fw, height: this.ph
         });
 
+        this.links.initEvents();
+
+
         this.resize.resize();
         this.changePage();
     },
@@ -305,6 +341,9 @@ LinkEditor.prototype = {
         if (e !== undefined) {
             this.setMouseCoordinates(e);
         }
+        if (this.rightClick) {
+            return;
+        }
 
         this.panels.moveHandle();
         this.rulers.updateMousePositionRulers();
index 0a64a14d5f0d5c0c784dbde8c4dcfd3e32e72c75..9144f6477deff6f9b5b5563d2266b038598b5ab6 100644 (file)
@@ -15,8 +15,15 @@ var LinkeditorLinks = function (linkeditor) {
 
 LinkeditorLinks.prototype = {
     init: function () {
+
+    },
+
+    initEvents: function () {
         let $this = this;
         $(document).on('mousedown', '.link .corners div', function (e) {
+            if ($this.linkeditor.rightClick) {
+                return true;
+            }
             e.preventDefault();
             e.stopPropagation();
             $this.deselectAllLinks();
@@ -26,6 +33,9 @@ LinkeditorLinks.prototype = {
         });
 
         $(document).on('mousedown', '.link', function (e) {
+            if ($this.linkeditor.rightClick) {
+                return true;
+            }
             e.preventDefault();
             e.stopPropagation();
             if (!$(this).hasClass('selected')) {
@@ -40,6 +50,7 @@ LinkeditorLinks.prototype = {
 
         key('ctrl+a', function () {
             $this.selectAll();
+            return false;
         });
         key('del', function () {
             $this.deleteSelection();
@@ -81,6 +92,63 @@ LinkeditorLinks.prototype = {
             }
         });
 
+        $.contextMenu({
+            selector: '#linkeditor-canvas,.link',
+
+            events: {
+                preShow: function (e) {
+                    if ($(e).is('.link:not(.selected)')) {
+                        $this.deselectAllLinks();
+                        $this.selectLink(e);
+                    }
+                },
+            },
+            build: function ($triggerElement, e) {
+                var res = {
+                    callback: function () {
+
+                    }
+                };
+                var selection = $(".link.selected");
+                var multiple = selection.length > 1;
+                var hasSelection = selection.length > 0;
+
+                res.items = {
+                    'select_all': {
+                        isHtmlName: true,
+                        name: TRANSLATIONS.select_all + ' <kbd>Ctrl+A</kbd>',
+                        callback: function () {
+                            $this.selectAll();
+                        },
+                    }
+                };
+                if (hasSelection && !multiple && selection.is('[fb-type=6]')) {
+                    res.items = $.extend(res.items, {
+                        'sep_image_link': '---------',
+                        "image_link": {
+                            isHtmlName: true,
+                            name: TRANSLATIONS.edit_image_link + ' <kbd>Ctrl+L</kbd>', callback: function () {
+                                $this.linkeditor.changePage(selection.attr('fb-uid'));
+                            }
+                        },
+                    });
+                }
+                if (hasSelection) {
+                    res.items = $.extend(res.items, {
+                        'sep0': '---------',
+                        "delete": {
+                            isHtmlName: true,
+                            name: (multiple ? TRANSLATIONS.delete_selection : TRANSLATIONS.delete_link) + ' <kbd>Del</kbd>',
+                            callback: function () {
+                                $this.deleteSelection();
+                            }
+                        },
+                    });
+                }
+                return res;
+            },
+        });
+
         setInterval(function () {
             $this.checkLastSelectedLink();
         }, 250);
diff --git a/resources/linkeditor/style/inc/_contextmenu.sass b/resources/linkeditor/style/inc/_contextmenu.sass
new file mode 100644 (file)
index 0000000..3894a28
--- /dev/null
@@ -0,0 +1,8 @@
+.context-menu-item
+    kbd
+        float: right
+        margin-left: 20px
+        border-radius: 2px
+        border: 1px solid currentColor
+        padding: 2px 4px
+        opacity: 0.6
index b53c01da493e82232e3feddc53099ad9021725b1..fb133a7a818a1802ce0349c64764bdc58e283278 100644 (file)
@@ -140,4 +140,5 @@ body, #linkeditor, html
 @import "inc/_form"
 @import "inc/_versions"
 @import "inc/_popup"
+@import "inc/_contextmenu"
 
index 6b61ceec5d257a32923c50abf5c6812e24730bd4..dc67a0c3416d423084a1326c07f2207875632c10 100644 (file)
         'before_restore_message'=>__("Sauvegarde avant la restauration des liens"),
         'restore_version_tooltip'=>__('Restaurer cette version'),
         'export_version_tooltip'=>__('Exporter les liens au format xlsx'),
+        'delete_link'=>__('Supprimer le lien'),
+        'edit_image_link'=>__('Editer les liens de l\'image'),
+        'delete_selection'=>__('Supprimer la sélection'),
+        'select_all'=>__('Tout sélectionner'),
     ];
 
     $rulers=!count($rulers)?'{}':json_encode($rulers);