]> _ Git - fluidbook-toolbox.git/commitdiff
wip #6788 @3:00
authorsoufiane <soufiane@cubedesigners.com>
Mon, 25 Mar 2024 17:07:15 +0000 (18:07 +0100)
committersoufiane <soufiane@cubedesigners.com>
Mon, 25 Mar 2024 17:07:15 +0000 (18:07 +0100)
app/Http/Controllers/Admin/Operations/FluidbookPublication/LinksOperation.php
resources/linkeditor/js/linkeditor.js
resources/linkeditor/js/linkeditor.links.js
resources/linkeditor/js/linkeditor.zoom.js
resources/views/fluidbook_publication/link_editor.blade.php

index b2229f9d68dad43c7db57bf9f94e01f7a4d71d59..ac0302d9a0c1676df803213607f6a91ad1436769 100644 (file)
@@ -109,7 +109,7 @@ trait LinksOperation
                     FluidbookFontToWoff::fontline($filepath);
                 }
                 $i = \App\Fluidbook\Link\Link::getInstance($link['id'],$link,$compiler);
-                $css[$link['uid']]['inline'] = FluidbookFontToWoff::getCSS($i, $fontFile, $hash, $filepath, $w, $h);
+                $css[$link['uid']]['capHeight'] = FluidbookFontToWoff::getCSS($i, $fontFile, $hash, $filepath, $w, $h);
                 $css[$link['uid']]['font'] = $hash;
                 $css[$link['uid']]['hash'] = $final;
             }
index 8df7c79ea153a78a57191ab71b6f282612dfce59..630d753edb39f3919310b19fea0a0e1c7243020c 100644 (file)
@@ -125,6 +125,7 @@ LinkEditor.prototype = {
         this.initIcons();
         this.panels.init();
         this.zoom.reset();
+        this.links.loadFontSize();
     },
 
     initIcons: function () {
index fc48a19e0f44f50d8ce5fd317ef332ce2fbbdd02..4ae8f764c4dc4784e3ca58812c5eb93a7a9d385b 100644 (file)
@@ -573,6 +573,7 @@ LinkeditorLinks.prototype = {
         this.linkeditor.form.updateLinkForm();
         this.resizeLinkPos = null;
         this.linkeditor.hasChanged();
+        this.setFontSize(this.lastSelectedLinkData)
     },
 
     moveResizeLink: function () {
@@ -1548,6 +1549,7 @@ LinkeditorLinks.prototype = {
     preview: function() {
         let el = $("[data-action='links.preview']")
         el.toggleClass("active")
+
         if(el.hasClass("active")) {
             this.setPreview()
         } else {
@@ -1555,9 +1557,7 @@ LinkeditorLinks.prototype = {
         }
     },
 
-    setPreview: function(p) {
-        const links = this.getLinksOfPage(1)
-
+    loadFontSize: function() {
         $.ajax({
             url:  '/fluidbook-publication/' + FLUIDBOOK_DATA.id + '/generatefont',
             type: 'post',
@@ -1570,10 +1570,13 @@ LinkeditorLinks.prototype = {
                 $("head").append("<style id='extra-font-face'></style>")
                 for(let k in FONT_SIZE) {
                     $("#extra-font-face").append("@font-face{font-family:"+FONT_SIZE[k]['font']+";src:url('/fluidbook-publication/"+ FLUIDBOOK_DATA.id +"/edit/links/assets/"+FONT_SIZE[k]['hash']+"' ) format('woff');}")
-                    $("[data-id-preview=" + k + "]").text(links[k].to).attr('style', FONT_SIZE[k]['inline'])
                 }
             }
         });
+    },
+
+    setPreview: function(p) {
+        const links = this.getLinksOfPage(this.linkeditor.currentPage)
 
         const imageFormat = FLUIDBOOK_DATA.settings.imageFormat
 
@@ -1598,7 +1601,7 @@ LinkeditorLinks.prototype = {
                 /*gsapConfig.forEach(function(conf) {
                     gsap.to($("[data-id-preview="+linkData.uid+"]"),conf)
                 })*/
-            } else if(linkData.type === '15' || /\.([^.]+[jpg|png|svg|webp|avif])$/.exec(linkData.image)) {
+            } else if(linkData.type === '15' || /\.(jpg|png|svg|webp|avif)$/.exec(linkData.image)) {
                 let imgUrl = linkData.type === '15' ? ASSETS['uid_'+linkData.uid]['url'] : "/fluidbook-publication/"+FLUIDBOOK_DATA.id +"/edit/links/assets/"+linkData.image
                 let img = "<img src='"+imgUrl+"' />"
                 $("[data-id-preview="+linkData.uid+"]").append(img)
@@ -1610,6 +1613,39 @@ LinkeditorLinks.prototype = {
                     'background-size': '100% 100%',
                     'background-position': '0 0',
                 })
+            } else if(linkData.type === '35') {
+                this.setFontSize(linkData)
+                $("[data-id-preview=" + linkData.uid + "]").text(linkData.to).css({
+                    'font-family': FONT_SIZE[linkData.uid]['font'],
+                    'color': linkData.extra,
+                })
+            }
+        }
+    },
+
+    setFontSize: function(link) {
+        var pw = FLUIDBOOK_DATA.settings.width;
+        var ph = FLUIDBOOK_DATA.settings.height;
+
+        var fs = link.height * (1 * Math.min((567 / pw), (709 / ph) ));
+
+        $("[data-id-preview=" + link.uid + "]").text(link.to).css({
+            'font-size': Math.round((fs / FONT_SIZE[link.uid].capHeight))+'px',
+            'line-height': FONT_SIZE[link.uid]['capHeight']
+        })
+    },
+
+    updateColor: function() {
+
+    }
+
+    updateFontSize: function(zoom) {
+        for(let k in LINKS) {
+            if(LINKS[k].type === '35') {
+                $("[data-id-preview="+LINKS[k].uid+"]").css({
+                    transform: "scale("+zoom+")",
+                    'transform-origin': 'left top'
+                })
             }
         }
     },
index 57dc66f927d6187731033137ffee3e8458e7a702..a0a450a8a408c45a5c926539c08eb431b598476d 100644 (file)
@@ -128,6 +128,7 @@ LinkeditorZoom.prototype = {
             if (this.zoom === 1) {
                 $this.resetZoomDrag();
             }
+            $this.linkeditor.links.updateFontSize($this.zoom)
             $this.linkeditor.rulers.updateRulers();
         }, 10);
         return true;
index ca26ab7cfdb8f5ff04e29f770b75a57ed273fe61..91054e617619c7b28d33c82312febc3c48b6402e 100644 (file)
         var CAN_CONTAIN_LINKS = @json($canContainLinks);
         var DEPTH = @json($depths);
         var FONT_SIZE = @json([]);
+        var ZOOM = null;
     </script>
     <script
             src="/packages/linkeditor/js/linkeditor.js?v={{filemtime(public_path('packages/linkeditor/js/linkeditor.js'))}}"></script>