From e9fb8e9ce7a22e0e3fc658fd76c010e13288bee1 Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Tue, 3 Jun 2025 15:28:19 +0200 Subject: [PATCH] wip #7467 @6 --- .../js/linkeditor.accessibility.js | 63 +++++++++++---- .../linkeditor-stable/js/linkeditor.layers.js | 1 - .../linkeditor-stable/js/linkeditor.links.js | 25 +++--- .../linkeditor-stable/js/linkeditor.panels.js | 6 +- .../linkeditor-stable/style/inc/_layers.sass | 2 +- .../link_editor.blade.php | 4 +- .../link_editor_icons.blade.php | 78 ++++++++++++++++++- 7 files changed, 151 insertions(+), 28 deletions(-) diff --git a/resources/linkeditor-stable/js/linkeditor.accessibility.js b/resources/linkeditor-stable/js/linkeditor.accessibility.js index 08224ba8e..bdaa92d17 100644 --- a/resources/linkeditor-stable/js/linkeditor.accessibility.js +++ b/resources/linkeditor-stable/js/linkeditor.accessibility.js @@ -50,6 +50,39 @@ LinkeditorAccessibility.prototype = { this.update(); }, + normalizeLinksOrder: function () { + let $this = this; + let links = []; + $('#linkeditor-links .link:not(.pendingCreate)').each(function () { + let level = $this.getLinkLevel($(this)); + links.push({link: $(this), interactive: level >= 5, order: parseInt($(this).attr('fb-order'),)}); + }); + + links.sort(function (a, b) { + if (a.interactive === b.interactive) { + console.log(a.order, b.order); + return a.order - b.order + } + return b.interactive - a.interactive; + }); + + let i = 0; + $(links).each(function (k, v) { + $(v.link).attr('fb-order', i++); + }); + this.linkeditor.hasChanged(); + this.linkeditor.links.pageMaxOrderIndex = i; + }, + + getLinkLevel: function (link) { + let d = parseInt($(link).attr('fb-calc-depth')); + var m = 1; + if (d >= 30 && d < 50) { + m = 10; + } + return Math.floor((m * d) / 10) / m; + }, + update: function () { if (this.container === undefined) { return; @@ -60,9 +93,11 @@ LinkeditorAccessibility.prototype = { var $this = this; this.container.html(''); var accessibility = []; + this.normalizeLinksOrder(); $('#linkeditor-links .link:not(.pendingCreate)').each(function () { let type = $(this).attr('fb-type'); let dest = $(this).attr('fb-to'); + if (dest === '') { dest = '' + TRANSLATIONS.empty + ''; } @@ -70,30 +105,30 @@ LinkeditorAccessibility.prototype = { l += ''; - l += ''; + //l += ''; l += ''; - let d = parseInt($(this).attr('fb-calc-depth')); - var m = 1; - if (d >= 30 && d < 50) { - m = 10; - } - let level = Math.floor((m * d) / 10) / m; + let level = $this.getLinkLevel($(this)); accessibility.push({ - level: level, + interactive: level >= 5, zindex: parseInt($(this).attr('fb-calc-zindex')), - html: l + html: l, + order: parseInt($(this).attr('fb-order')), }); }); accessibility.sort(function (a, b) { - return b.zindex - a.zindex; + if (a.interactive === b.interactive) { + return a.order - b.order + } + return b.interactive - a.interactive; }); var seenLevels = {}; + console.log(accessibility); $.each(accessibility, function (k, v) { - if (seenLevels[v.level] === undefined) { - seenLevels[v.level] = true; - $this.container.append('

' + TRANSLATIONS.level + ' #' + v.level + '

'); + if (seenLevels[v.interactive] === undefined) { + seenLevels[v.interactive] = true; + $this.container.append('

' + (v.interactive ? TRANSLATIONS.interactive_links : TRANSLATIONS.noninteractive_links) + '

'); } $this.container.append(v.html); }); diff --git a/resources/linkeditor-stable/js/linkeditor.layers.js b/resources/linkeditor-stable/js/linkeditor.layers.js index ddbca2148..378eb192e 100644 --- a/resources/linkeditor-stable/js/linkeditor.layers.js +++ b/resources/linkeditor-stable/js/linkeditor.layers.js @@ -41,7 +41,6 @@ LinkeditorLayers.prototype = { $(document).on('click', '#linkeditor-panel-layers label span.uid', function () { navigator.clipboard.writeText($(this).attr('fb-uid')); let tippy = $(this).data('tippyinstance'); - console.log(tippy); tippy.setContent(TRANSLATIONS.id_copied); tippy.show(); return false; diff --git a/resources/linkeditor-stable/js/linkeditor.links.js b/resources/linkeditor-stable/js/linkeditor.links.js index 172fa8df3..2b389fcde 100644 --- a/resources/linkeditor-stable/js/linkeditor.links.js +++ b/resources/linkeditor-stable/js/linkeditor.links.js @@ -470,7 +470,7 @@ LinkeditorLinks.prototype = { this.linkeditor.hasChanged(); this.updatePolygonLinks(); - this.updateLayers(); + this.updatePanels(); }, hasUIDLink: function (uid) { @@ -502,7 +502,7 @@ LinkeditorLinks.prototype = { if (cut) { this.linkeditor.form.emptyForm(); this.linkeditor.hasChanged(); - this.updateLayers(); + this.updatePanels(); } var msg = cut ? TRANSLATIONS.n_links_cut : TRANSLATIONS.n_links_copied; @@ -601,7 +601,7 @@ LinkeditorLinks.prototype = { this.deselectAllLinks(); this.selectLink($(link)); this.startResizeLink('se'); - this.updateLayers(); + this.updatePanels(); }, startResizeLink: function (corner) { @@ -925,7 +925,7 @@ LinkeditorLinks.prototype = { $this.addLink(link, false); }); this.updatePolygonLinks(); - this.updateLayers(); + this.updatePanels(); this.locks.update(); this.linkeditor.undo.initState(); }, @@ -956,6 +956,7 @@ LinkeditorLinks.prototype = { } let change = false; if (link.order === undefined) { + console.log('link.order is undefined', link); link.order = ++this.pageMaxOrderIndex; } else { this.pageMaxOrderIndex = Math.max(this.pageMaxOrderIndex, link.order); @@ -1033,6 +1034,7 @@ LinkeditorLinks.prototype = { if (this.hasUIDLink(data.uid)) { delete data.uid; } + data.order = ++this.pageMaxOrderIndex; return data; }, @@ -1056,9 +1058,14 @@ LinkeditorLinks.prototype = { return $(this.addLink(data, false)); }, - updateLayers: function () { + updatePanels: function () { this.updateDepths(); - this.linkeditor.layers.update(); + if (this.linkeditor.panels.isPanelActive('layers')) { + this.linkeditor.layers.update(); + } + if (this.linkeditor.panels.isPanelActive('accessibility')) { + this.linkeditor.accessibility.update(); + } }, deleteSelection: function () { @@ -1091,7 +1098,7 @@ LinkeditorLinks.prototype = { if (triggerChange === true) { this.linkeditor.hasChanged(); } - this.updateLayers(); + this.updatePanels(); this.updateSelection(); }, @@ -1218,7 +1225,7 @@ LinkeditorLinks.prototype = { } }); this.linkeditor.rulers.updateMagnetValues(); - this.updateLayers(); + this.updatePanels(); this.updatePolygonLinks(false); }, @@ -1231,7 +1238,7 @@ LinkeditorLinks.prototype = { } }); this.linkeditor.rulers.updateMagnetValues(); - this.updateLayers(); + this.updatePanels(); }, distributeSelection: function (axis) { diff --git a/resources/linkeditor-stable/js/linkeditor.panels.js b/resources/linkeditor-stable/js/linkeditor.panels.js index cd98d309d..d09b8ddbd 100644 --- a/resources/linkeditor-stable/js/linkeditor.panels.js +++ b/resources/linkeditor-stable/js/linkeditor.panels.js @@ -158,7 +158,7 @@ LinkeditorPanels.prototype = { } else if (panel === 'accessibility') { this.linkeditor.accessibility.update(); } - }catch (e){ + } catch (e) { } } @@ -179,5 +179,9 @@ LinkeditorPanels.prototype = { this.linkeditor.resize.resize(); }, + isPanelActive: function (panel) { + return $('#linkeditor-panel-' + panel).hasClass('open'); + }, + }; export default LinkeditorPanels; diff --git a/resources/linkeditor-stable/style/inc/_layers.sass b/resources/linkeditor-stable/style/inc/_layers.sass index 4ce410a4c..eaacb4b65 100644 --- a/resources/linkeditor-stable/style/inc/_layers.sass +++ b/resources/linkeditor-stable/style/inc/_layers.sass @@ -1,4 +1,4 @@ -#linkeditor-panel-layers +#linkeditor-panel-layers, #linkeditor-panel-accessibility font-size: 11px color: $color user-select: none diff --git a/resources/views/fluidbook_publication/link_editor.blade.php b/resources/views/fluidbook_publication/link_editor.blade.php index 51dc438e6..08969b9c0 100644 --- a/resources/views/fluidbook_publication/link_editor.blade.php +++ b/resources/views/fluidbook_publication/link_editor.blade.php @@ -113,6 +113,8 @@ 'id_copied'=>__('Identifiant copié !'), 'lock'=>__('Vérouiller'), 'fix_offset'=>__('Corriger décalage de page'), + 'interactive_links'=>__('Liens interactifs'), + 'noninteractive_links'=>__('Liens non-interactifs'), ]; $rulers=!count($rulers)?'{}':json_encode($rulers); @@ -421,7 +423,7 @@ var DEPTH = @json($depths); + src="/packages/linkeditor{{$scriptVersion}}/js/linkeditor.js?v={{filemtime(public_path('packages/linkeditor'.$scriptVersion.'/js/linkeditor.js'))}}"> @endpush @push('linkeditor_styles') diff --git a/resources/views/fluidbook_publication/link_editor_icons.blade.php b/resources/views/fluidbook_publication/link_editor_icons.blade.php index 348f82eea..658d6583d 100644 --- a/resources/views/fluidbook_publication/link_editor_icons.blade.php +++ b/resources/views/fluidbook_publication/link_editor_icons.blade.php @@ -3,7 +3,83 @@ Downloaded from https://toolbox.fluidbook.com/tool-sprite/3/download Edit here : https://toolbox.fluidbook.com/tool-sprite/3/edit ---}} +--}}