wip #7769 @7:00 corriger l'animation reveal

diff --git a/resources/linkeditor/js/linkeditor.links.js b/resources/linkeditor/js/linkeditor.links.js
index fa22c8e81395aceb485c5e8bc614804689d8c00f..2b3bfedca0d054d1400d79818347508e61ae8479 100644 (file)
--- a/resources/linkeditor/js/linkeditor.links.js
+++ b/resources/linkeditor/js/linkeditor.links.js
@@ -1589,7 +1589,17 @@ LinkeditorLinks.prototype = {
             let target = $("#linkeditor-layer-links [data-id-preview='"+links[link].uid+"']")
             target.css("display","block")
             let animations = this.resolveAnimation(animationText, target)
-            let previewDiv = links[link].type === '39' ? $("#linkeditor-layer-links > [data-id-preview-wrap="+links[link].uid+"] > [data-id-preview="+links[link].uid+"]") : $("[data-id-preview=" + links[link].uid + "]")
+            let previewDiv = $("[data-id-preview=" + links[link].uid + "]")
+            if(links[link].type === '39') {
+                console.log(links[link])
+                if (links[link].to === "image") {
+                    previewDiv = $("#linkeditor-layer-links > [data-id-preview-wrap="+links[link].uid+"] .linkeditor-page-images")
+                } else if (links[link].to === "onlytext" || links[link].to === "text") {
+                    previewDiv = $("#linkeditor-layer-links > [data-id-preview-wrap="+links[link].uid+"] .linkeditor-page-texts")
+                }else {
+                    previewDiv = $("#linkeditor-layer-links > [data-id-preview-wrap="+links[link].uid+"] > [data-id-preview="+links[link].uid+"]")
+                }
+            }
             var el = previewDiv
 
             let animWithBackground = animations.filter((v) => v.backgroundcolor)

diff --git a/resources/linkeditor/js/linkeditor.previewLinks.js b/resources/linkeditor/js/linkeditor.previewLinks.js
index 97b36dc1b1fa16a40b7a9919d087146bfad0de58..01a992f9e1dd04944e566265c5aab182271082c0 100644 (file)
--- a/resources/linkeditor/js/linkeditor.previewLinks.js
+++ b/resources/linkeditor/js/linkeditor.previewLinks.js
@@ -73,8 +73,14 @@ LinkeditorPreviewLinks.prototype = {
             <div data-id-preview="${id}"> <!-- utilisé pour l'animation en general -->
               <div class="preview"> <!-- utilisé pour l'animation sur des background-image -->
                     <div class="linkeditor-fluidbook-copy" data-id="${id}">
-                        <div class="linkeditor-page linkeditor-page-right-copy" data-page="1"></div>
-                        <div class="linkeditor-page linkeditor-page-left-copy" data-page="0"></div>
+                        <div class="linkeditor-page-images">
+                            <div class="linkeditor-page linkeditor-page-right-copy" data-page="1"></div>
+                            <div class="linkeditor-page linkeditor-page-left-copy" data-page="0"></div>
+                        </div>
+                        <div class="linkeditor-page-texts">
+                            <div class="linkeditor-page linkeditor-page-right-copy" data-page="1"></div>
+                            <div class="linkeditor-page linkeditor-page-left-copy" data-page="0"></div>
+                        </div>
                     </div>
                 </div>
             </div>
@@ -175,56 +181,15 @@ LinkeditorPreviewLinks.prototype = {
              */
             this.createPreviewLayerHTML($("#linkeditor-layer-links"),$this.linkData.uid)
 
-            /*if (animZoom.length > 0) {
-                $("#linkeditor-layer-links [data-id-preview=" + $this.linkData.uid + "] .preview").addClass("img")
+            if ($(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] img").length < 1) {
+                $("#linkeditor-page-left .contents img.images").clone().addClass('left').appendTo(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-images .linkeditor-page-left-copy")
+                $("#linkeditor-page-right .contents img.images").clone().addClass('left').appendTo(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-images .linkeditor-page-right-copy")
 
-                let srcImgLeft = $("#linkeditor-page-left .contents img.images").attr('src')
-                let srcTextLeft = $("#linkeditor-page-left .contents img.texts").attr('src')
-
-                let bgLeft = 'url(' + srcTextLeft + '), url(' + srcImgLeft + ')'
-
-                if ($this.linkData.to === "image") {
-                    // do something
-                    bgLeft = 'url(' + srcImgLeft + ')'
-                } else if ($this.linkData.to === "onlytext" || $this.linkData.to === "text") {
-                    // do something
-                    bgLeft = 'url(' + srcTextLeft + ')'
-                }
-
-                $("#linkeditor-layer-links [data-id-preview=" + $this.linkData.uid + "] .preview").css({
-                    "background-image": bgLeft,
-                    "background-size": "100%",
-                    "height": "100%"
-                })
-
-                if($("#linkeditor").hasClass("double")) {
-                    let srcImgRight = $("#linkeditor-page-right .contents img.images").attr('src')
-                    let srcTextRight = $("#linkeditor-page-right .contents img.texts").attr('src')
-
-                    let bgRight = 'url(' + srcTextRight + '), url(' + srcImgRight + ')'
-
-                    if ($this.linkData.to === "image") {
-                        // do something
-                        bgRight = 'url(' + srcImgRight + ')'
-                    } else if ($this.linkData.to === "onlytext" || $this.linkData.to === "text") {
-                        // do something
-                        bgRight = 'url(' + srcTextRight + ')'
-                    }
-
-                    $(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-right-copy").css({
-                        "background": bgRight,
-                        "background-size": "100%"
-                    })
-                }
+                $("#linkeditor-page-left .contents img.texts").clone().addClass('right').appendTo(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-texts .linkeditor-page-left-copy")
+                $("#linkeditor-page-right .contents img.texts").clone().addClass('right').appendTo(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-texts .linkeditor-page-right-copy")
+            }
+            $("#linkeditor-layer-links [data-id-preview=" + $this.linkData.uid + "] .preview").removeClass("img")
 
-                //$("[data-id-preview=" + $this.linkData.uid + "] .preview-wrapper .linkeditor-page").remove()
-            } else {*/
-                if ($(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] img").length < 1) {
-                    $("#linkeditor-page-left .contents img").clone().addClass('left').appendTo(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-left-copy")
-                    $("#linkeditor-page-right .contents img").clone().addClass('right').appendTo(".linkeditor-fluidbook-copy[data-id=" + $this.linkData.uid + "] .linkeditor-page-right-copy")
-                }
-                $("#linkeditor-layer-links [data-id-preview=" + $this.linkData.uid + "] .preview").removeClass("img")
-            /*}*/
         }
         this.setTransformOrigin($this.linkData)
 
@@ -355,7 +320,7 @@ LinkeditorPreviewLinks.prototype = {
         let polygon = "polygon("
         if(json.length > 0) {
             for(let i in json) {
-                polygon += (parseInt(x)+parseInt(json[i].x))+"px "+(parseInt(y)+parseInt(json[i].y))+"px"
+                polygon += parseInt(json[i].x)+"px "+parseInt(json[i].y)+"px"
                 if(+i+1 !== json.length) {
                     polygon += ','
                 }

diff --git a/resources/linkeditor/style/inc/_links.sass b/resources/linkeditor/style/inc/_links.sass
index 9ed7f901ce58b9bec19b1ec817d15ce985d03e0c..7aa3aec98cd380b11032370734da3591d4b9d1e7 100644 (file)
--- a/resources/linkeditor/style/inc/_links.sass
+++ b/resources/linkeditor/style/inc/_links.sass
@@ -23,6 +23,15 @@ body:not(.preview)
             display: none
 
 #linkeditor
+    .linkeditor-page-texts,
+    .linkeditor-page-images
+        position: absolute
+        width: 100%
+        height: 100%
+
+    .linkeditor-page-texts
+        z-index: 2
+
     .linkeditor-page-right-copy,
     .linkeditor-page-left-copy
         height: 100%