@innovastudio/contentbuilder 1.3.33 → 1.3.35

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@innovastudio/contentbuilder",
   "type": "module",
-  "version": "1.3.33",
+  "version": "1.3.35",
   "description": "",
   "main": "public/contentbuilder/contentbuilder.esm.js",
   "files": [

package/public/contentbuilder/contentbuilder.esm.js

@@ -17225,7 +17225,7 @@ const renderQuickAdd = builder => {
     elm = quickadd.querySelector('.add-button');
     if (elm) dom.addEventListener(elm, 'click', () => {
       const mode = quickadd.getAttribute('data-mode');
-      let html = `<div>
+      let html = `<div style="white-space: nowrap;">
                 <a href="#" role="button" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 mt-2 mb-2 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 tracking-50 uppercase py-2 size-14 px-6 font-semibold text-gray-600 leading-relaxed">Read More</a>
             </div>`;
 
@@ -17238,7 +17238,7 @@ const renderQuickAdd = builder => {
     elm = quickadd.querySelector('.add-twobutton');
     if (elm) dom.addEventListener(elm, 'click', () => {
       const mode = quickadd.getAttribute('data-mode');
-      let html = `<div>
+      let html = `<div style="white-space: nowrap;">
                 <a href="#" role="button" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 mt-2 mb-2 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 tracking-50 uppercase py-2 size-14 px-6 font-semibold text-gray-600 leading-relaxed">Read More</a>
                 <a href="#" role="button" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 mt-2 mb-2 rounded tracking-50 uppercase py-2 size-14 px-6 border-current hover:border-transparent hover:text-white font-semibold text-indigo-500 hover:bg-indigo-500 leading-relaxed">Get Started</a>
             </div>`;
@@ -49415,6 +49415,12 @@ class Image$1 {
                     </div>
                 </div>
 
+                <div class="is-modal mediaselect" style="z-index:10005" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
+                    <div style="max-width:800px;height:80%;padding:0;">
+                        <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
+                    </div>
+                </div>
+
                 <div id="divImageResizerOverlay" class="is-tool">
                 </div>
                 <div id="divImageResizer" data-x=0 data-y=0 class="is-tool moveable resizable">
@@ -58607,7 +58613,7 @@ class ColumnTool {
       } // Select image (opens Asset Manager plugin or custom dialog)
 
 
-      if (this.builder.opts.onImageSelectClick || this.builder.opts.imageselect || this.builder.opts.onFileSelectClick || this.builder.opts.fileselect) {
+      if (this.builder.opts.onMediaSelectClick || this.builder.opts.mediaSelect || this.builder.opts.onImageSelectClick || this.builder.opts.imageselect) {
         const inpSrc = this.cellSettings.querySelector('.input-src');
         elm = this.divCellClick.querySelector('.input-select');
         if (elm) dom.addEventListener(elm, 'click', () => {
@@ -58620,36 +58626,34 @@ class ColumnTool {
 
           this.builder.targetAssetType = 'media'; //---/default
 
-          if (this.builder.opts.onFileSelectClick) {
-            this.builder.opts.onFileSelectClick({
+          if (this.builder.opts.onMediaSelectClick) {
+            this.builder.opts.onMediaSelectClick({
               targetInput: inpSrc,
               theTrigger: elm
-            });
-            dom.observeElement(inpSrc, 'value', () => {
-              this.applyClick();
-            });
+            }); // dom.observeElement(inpSrc, 'value', () => {
+            //     this.applyClick();
+            // });
           } else if (this.builder.opts.onImageSelectClick) {
             this.builder.opts.onImageSelectClick({
               targetInput: inpSrc,
               theTrigger: elm
-            });
-            dom.observeElement(inpSrc, 'value', () => {
-              this.applyClick();
-            });
-          } else if (this.builder.opts.fileselect) {
-            let modalFileSelect = builderStuff.querySelector('.is-modal.fileselect');
-            let iframe = modalFileSelect.querySelector('iframe');
+            }); // dom.observeElement(inpSrc, 'value', () => {
+            //     this.applyClick();
+            // });
+          } else if (this.builder.opts.mediaSelect) {
+            let modalMediaSelect = builderStuff.querySelector('.is-modal.mediaselect');
+            let iframe = modalMediaSelect.querySelector('iframe');
 
             if (this.builder.opts.assetRefresh) {
-              iframe.src = this.builder.opts.fileselect;
+              iframe.src = this.builder.opts.mediaSelect;
               this.builder.opts.assetRefresh = false;
             }
 
             if (iframe.src === 'about:blank') {
-              iframe.src = this.builder.opts.fileselect;
+              iframe.src = this.builder.opts.mediaSelect;
             }
 
-            util.showModal(modalFileSelect, false, () => {
+            util.showModal(modalMediaSelect, false, () => {
               elm.removeAttribute('data-focus');
               elm.focus();
             });
@@ -58706,7 +58710,9 @@ class ColumnTool {
         dom.addClass(frmUpload, 'please-wait');
         this.cellSettings.querySelector('#hidRefId4').value = this.builder.opts.customval;
 
-        if (this.builder.opts.onLargerImageUpload) {
+        if (this.builder.opts.onMediaUpload) {
+          this.builder.opts.onMediaUpload(e);
+        } else if (this.builder.opts.onLargerImageUpload) {
           this.builder.opts.onLargerImageUpload(e);
         } else {
           frmUpload.submit();
@@ -64856,6 +64862,7 @@ class ElementTool {
   pos() {
     let elementTool = this.elementTool;
     let elm = this.builder.activeElement;
+    if (elm.closest('.is-dock')) return;
     let top, left;
 
     if (!this.builder.iframe) {
@@ -74127,6 +74134,12 @@ class ContentBuilder {
       // onAdd: function(){},
       largerImageHandler: '',
       // onLargerImageUpload: function(){},
+      imageHandler: '',
+      // NEW: for image
+      // onImageUpload: function(){}, // NEW: for image
+      fileHandler: '',
+      // NEW: for file/document
+      // onFileUpload: function(){}, // NEW: for file/document
       mediaHandler: '',
       // onMediaUpload: function(){},
       videoHandler: '',
@@ -74156,6 +74169,7 @@ class ContentBuilder {
       // onFileSelectClick: function () { },
       // onVideoSelectClick: function () { },
       // onAudioSelectClick: function () { },
+      // onMediaSelectClick: function () { }, // NEW: for image & video
       // onPluginsLoaded: function () { },
       // onImageBrowseClick: function () { },
       // onImageSettingClick: function () { },
@@ -74184,6 +74198,8 @@ class ContentBuilder {
       fileSelect: '',
       videoSelect: '',
       audioSelect: '',
+      mediaSelect: '',
+      // NEW: for image & video
       assetRefresh: false,
       // asset manager specified in imageSelect, fileSelect & videoSelect will always refreshed on click/open
       customTags: [],
@@ -74645,18 +74661,34 @@ class ContentBuilder {
       this.opts.videoselect = this.opts.videoSelect;
     } else if (this.opts.videoselect !== '') {
       this.opts.videoSelect = this.opts.videoselect;
+    } // if(this.opts.largerImageHandler!=='') {
+    //     this.opts.mediaHandler = this.opts.largerImageHandler;
+    // } else if(this.opts.mediaHandler!=='') {
+    //     this.opts.largerImageHandler = this.opts.mediaHandler;
+    // }
+    // if(this.opts.onLargerImageUpload) {
+    //     this.opts.onMediaUpload = this.opts.onLargerImageUpload;
+    // } else if(this.opts.onMediaUpload) {
+    //     this.opts.onLargerImageUpload = this.opts.onMediaUpload;
+    // }
+    // Just in case
+
+
+    if (!this.opts.onImageUpload && !this.opts.onLargerImageUpload) {
+      this.opts.onImageUpload = this.opts.onMediaUpload;
     }
 
-    if (this.opts.largerImageHandler !== '') {
-      this.opts.mediaHandler = this.opts.largerImageHandler;
-    } else if (this.opts.mediaHandler !== '') {
-      this.opts.largerImageHandler = this.opts.mediaHandler;
+    if (!this.opts.imageHandler && !this.opts.largerImageHandler) {
+      this.opts.imageHandler = this.opts.mediaHandler;
+    } // Currently used: largerImageHandler & onLargerImageUpload (as in elementimage.js)
+
+
+    if (this.opts.imageHandler !== '') {
+      this.opts.largerImageHandler = this.opts.imageHandler;
     }
 
-    if (this.opts.onLargerImageUpload) {
-      this.opts.onMediaUpload = this.opts.onLargerImageUpload;
-    } else if (this.opts.onMediaUpload) {
-      this.opts.onLargerImageUpload = this.opts.onMediaUpload;
+    if (this.opts.onImageUpload) {
+      this.opts.onLargerImageUpload = this.opts.onImageUpload;
     } // useButtonPlugin
 
 
@@ -75867,6 +75899,8 @@ class ContentBuilder {
       if (modal) this.hideModal(modal);
       modal = document.querySelector('.is-modal.audioselect.active');
       if (modal) this.hideModal(modal);
+      modal = document.querySelector('.is-modal.mediaselect.active');
+      if (modal) this.hideModal(modal);
     }
   }
 
@@ -75935,9 +75969,9 @@ class ContentBuilder {
   }
 
   openAsset(targetInput, targetAssetType, theTrigger) {
-    if (targetAssetType === 'media' && (this.opts.onFileSelectClick || this.opts.onImageSelectClick)) {
-      if (this.opts.onFileSelectClick) {
-        this.opts.onFileSelectClick({
+    if (targetAssetType === 'media' && (this.opts.onMediaSelectClick || this.opts.onImageSelectClick)) {
+      if (this.opts.onMediaSelectClick) {
+        this.opts.onMediaSelectClick({
           targetInput: targetInput,
           theTrigger: theTrigger
         });
@@ -75957,6 +75991,11 @@ class ContentBuilder {
         targetInput: targetInput,
         theTrigger: theTrigger
       });
+    } else if (targetAssetType === 'audio' && this.opts.onAudioSelectClick) {
+      this.opts.onAudioSelectClick({
+        targetInput: targetInput,
+        theTrigger: theTrigger
+      });
     } else if (targetAssetType === 'all' && this.opts.onFileSelectClick) {
       this.opts.onFileSelectClick({
         targetInput: targetInput,
@@ -75967,9 +76006,12 @@ class ContentBuilder {
       let modal;
 
       if (targetAssetType === 'media') {
-        modal = this.builderStuff.querySelector('.is-modal.fileselect');
+        modal = this.builderStuff.querySelector('.is-modal.mediaselect');
         iframe = modal.querySelector('iframe');
-        if (iframe.src === 'about:blank') iframe.src = this.opts.fileSelect;
+
+        if (iframe.src === 'about:blank') {
+          if (this.opts.mediaSelect) iframe.src = this.opts.mediaSelect;else if (this.opts.imageSelect) iframe.src = this.opts.imageSelect;
+        }
       } else if (targetAssetType === 'video') {
         modal = this.builderStuff.querySelector('.is-modal.videoselect');
         iframe = modal.querySelector('iframe');
@@ -75978,6 +76020,10 @@ class ContentBuilder {
         modal = this.builderStuff.querySelector('.is-modal.imageselect');
         iframe = modal.querySelector('iframe');
         if (iframe.src === 'about:blank') iframe.src = this.opts.imageSelect;
+      } else if (targetAssetType === 'audio') {
+        modal = this.builderStuff.querySelector('.is-modal.audioselect');
+        iframe = modal.querySelector('iframe');
+        if (iframe.src === 'about:blank') iframe.src = this.opts.audioSelect;
       } else if (targetAssetType === 'all') {
         modal = this.builderStuff.querySelector('.is-modal.fileselect');
         iframe = modal.querySelector('iframe');