From: soufiane <soufiane@cubedesigners.com>
Date: Wed, 30 Oct 2024 13:44:51 +0000 (+0100)
Subject: wait #7165 @0:20
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=c7c1a30d70b6b9bbba8b3f64eb93a1cf7de11610;p=fluidbook-toolbox.git

wait #7165 @0:20
---

diff --git a/resources/linkeditor/js/linkeditor.previewLinks.js b/resources/linkeditor/js/linkeditor.previewLinks.js
index f43ade8f8..f702ddd84 100644
--- a/resources/linkeditor/js/linkeditor.previewLinks.js
+++ b/resources/linkeditor/js/linkeditor.previewLinks.js
@@ -10,39 +10,38 @@ LinkeditorPreviewLinks.prototype = {
     },
 
     updatePreview: function(link) {
+        let $this = this
         this.linkData = link
-        if($("#preview-links").hasClass("active")) {
-            let l = this.linkeditor.links.getLinkById(link.uid)
-            let absoluteCss = {
-                width: "100%",
-                height: "100%",
-                top: 0,
-                left: 0,
-                position: "absolute",
-            }
+        let l = this.linkeditor.links.getLinkById(link.uid)
+        let absoluteCss = {
+            width: "100%",
+            height: "100%",
+            top: 0,
+            left: 0,
+            position: "absolute",
+        }
 
-            if ($('[data-id-preview="' + link.uid + '"]').length < 1) {
-                if(this.linkData.type === '35') {
-                    l.html("<div class='bg-preview'></div><div data-id-preview-wrap='" + link.uid + "'><div data-id-preview='" + link.uid + "'></div></div>")
-                } else {
-                    l.html("<div class='bg-preview'></div><div data-id-preview='" + link.uid + "'></div>")
-                }
+        if ($('[data-id-preview="' + link.uid + '"]').length < 1) {
+            if(this.linkData.type === '35') {
+                l.html("<div class='bg-preview'></div><div data-id-preview-wrap='" + link.uid + "'><div data-id-preview='" + link.uid + "'></div></div>")
+            } else {
+                l.html("<div class='bg-preview'></div><div data-id-preview-wrap='" + link.uid + "'><div data-id-preview='" + link.uid + "'></div></div>")
             }
+        }
 
-            $("[data-id-preview=" + this.linkData.uid + "]").css({
-                height: '100%',
-                width: '100%'
-            })
+        $("[data-id-preview=" + this.linkData.uid + "]").css({
+            height: '100%',
+            width: '100%'
+        })
 
-            this.previewByType(link.type)
-        }
+        $this.previewByType(link.type)
     },
 
     setPreview: function(zooming = false, isActive = false) {
         const links = this.linkeditor.links.getLinksOfPage(this.linkeditor.currentPage)
 
-        for(let link in links) {
-            if(!isActive) {
+        for (let link in links) {
+            if (!isActive) {
                 this.updatePreview(links[link])
             }
         }
@@ -84,9 +83,9 @@ LinkeditorPreviewLinks.prototype = {
             })
             this.linkeditor.links.updateFontSize($this.linkData)
         } else if (type === '39') {
-            let $link = $("[fb-uid="+this.linkData.uid+"]")
+            let $link = $("[fb-uid="+$this.linkData.uid+"]")
             let animationText = $link.attr("fb-image_rollover")
-            let animations = this.linkeditor.links.resolveAnimation(animationText)
+            let animations = $this.linkeditor.links.resolveAnimation(animationText)
             let animZoom = animations.filter((v) => v.type === "zoomout" || v.type === "zoomin")
 
             if(animZoom.length > 0 && $("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper").length < 1) {
@@ -111,8 +110,8 @@ LinkeditorPreviewLinks.prototype = {
                 this.linkeditor.zoom.setZoom(1)
             }
             if(animZoom.length > 0) {
-                let srcImg = $("#linkeditor-page-right .contents img.images").attr('src')
-                let srcText = $("#linkeditor-page-right .contents img.texts").attr('src')
+                let srcImg = $("#linkeditor-page-left .contents img.images").attr('src')
+                let srcText = $("#linkeditor-page-left .contents img.texts").attr('src')
                 let bg = 'url('+srcText+'), url('+srcImg+')'
 
                 if($this.linkData.to === "image") {
@@ -124,10 +123,13 @@ LinkeditorPreviewLinks.prototype = {
                 }
 
                 $("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper").css("clip-path","inset(0)")
-                $("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper").addClass("img").find(".linkeditor-page-right-copy").css({
-                    'background': bg,
-                    'background-size': '100%'
+                $("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper").addClass("img")
+
+                $("[data-id-preview=" + $this.linkData.uid + "] .linkeditor-page-left-copy").css({
+                    "background":bg,
+                    "background-size":"100%"
                 })
+
                 //$("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper .linkeditor-page").remove()
             }else {
                 if ($("[data-id-preview=" + $this.linkData.uid + "] img").length < 1) {
@@ -149,15 +151,15 @@ LinkeditorPreviewLinks.prototype = {
                 'left': 0,'top': 0
             })
 
-            requestAnimationFrame(function() {
-                let linkeditorZoomRect = $("#linkeditor-zoom")[0].getBoundingClientRect()
-                let left = $this.linkeditor.fluidbookToGlobal($this.linkData.left, 'left') - linkeditorZoomRect.left
-                let top = $this.linkeditor.fluidbookToGlobal($this.linkData.top, 'top') - linkeditorZoomRect.top
-                $("[data-id-preview=" + $this.linkData.uid + "]").find(".linkeditor-zoom-copy").css({
-                    "left": -left - 1,
-                    "top": -top - 1,
-                })
+            let linkeditorZoomRect = $("#linkeditor-zoom")[0].getBoundingClientRect()
+            let left = $this.linkeditor.fluidbookToGlobal($this.linkData.left, 'left') - linkeditorZoomRect.left
+            let top = $this.linkeditor.fluidbookToGlobal($this.linkData.top, 'top') - linkeditorZoomRect.top
+
+            $("[data-id-preview=" + $this.linkData.uid + "]").find(".linkeditor-zoom-copy").css({
+                "left": -left - 1,
+                "top": -top - 1,
             })
+
             if(animZoom.length > 0) {
                 $("[data-id-preview=" + $this.linkData.uid + "]").children().appendTo("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper")
             }
@@ -206,7 +208,16 @@ LinkeditorPreviewLinks.prototype = {
     },
 
     clearPreview: function() {
-        $("[data-id-preview],.bg-preview").remove()
+        $("[data-id-preview],.bg-preview").hide()
+        $("[data-id-preview]").parents('.link').css()
+    },
+
+    showPreview: function(bool) {
+        const el = $("[data-id-preview],.bg-preview")
+        el.hide()
+        if(bool) {
+            el.show()
+        }
         $("[data-id-preview]").parents('.link').css()
     },
 
diff --git a/resources/linkeditor/style/inc/_links.sass b/resources/linkeditor/style/inc/_links.sass
index decb45bb4..f650ce98d 100644
--- a/resources/linkeditor/style/inc/_links.sass
+++ b/resources/linkeditor/style/inc/_links.sass
@@ -11,7 +11,6 @@ body.preview
 
 #linkeditor-links
     .link
-        overflow: hidden
         &[data-locked="1"]
             pointer-events: none
 
@@ -33,12 +32,13 @@ body.preview
             display: none !important
 
         .bg-preview,
-        .preview-wrapper
+        .preview-wrapper,
+        [data-id-preview-wrap]
             width: 100%
             height: 100%
             position: absolute
 
-        [data-id-preview]:not(.link-text)
+        [data-id-preview-wrap]
             overflow: hidden
 
         &[fb-type='14'] [data-id-preview]