@innovastudio/contentbox 1.5.64 → 1.5.66

package/public/contentbox/contentbox.esm.js

@@ -13799,7 +13799,7 @@ class EditBox {
     } else if (s === 'video') {
       const chooseVideoBg = currentVideo => {
         // Choose random video
-        let videoList = this.builder.media.bg_videos;
+        let videoList = this.builder.media.videos;
         let randomIndex;
 
         if (currentVideo) {
@@ -13810,13 +13810,13 @@ class EditBox {
           randomIndex = Math.floor(Math.random() * videoList.length);
         }
 
-        return videoList[randomIndex];
+        return this.builder.mediaPath + videoList[randomIndex];
       };
 
       let video = chooseVideoBg();
       code = `
             <video id="{id}" class="is-video-bg" muted loop playsinline autoplay>
-                <source src="${this.builder.media.blank_video}" data-default="${video}">
+                <source src="${this.builder.mediaPath + this.builder.media.blank_video}" data-default="${video}">
             </video>
             <div class="is-overlay-video" style="opacity:0.05"></div>
             <script>
@@ -15138,6 +15138,10 @@ class EditBox {
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
 var rangyCore = {exports: {}};
 
 /**
@@ -92532,7 +92536,13 @@ class Lib$1 {
   }
 }
 
-// import RecordRTC  from 'recordrtc';
+var recorder_min = {exports: {}};
+
+(function (module, exports) {
+!function(e,t){module.exports=t();}("undefined"!=typeof self?self:commonjsGlobal,(function(){return function(e){var t={};function o(n){if(t[n])return t[n].exports;var i=t[n]={i:n,l:!1,exports:{}};return e[n].call(i.exports,i,i.exports,o),i.l=!0,i.exports}return o.m=e,o.c=t,o.d=function(e,t,n){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n});},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0});},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)o.d(n,i,function(t){return e[t]}.bind(null,i));return n},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=0)}([function(e,t,o){(function(t){function o(e,t){if(null==e)return {};var o,n,i=function(e,t){if(null==e)return {};var o,n,i={},r=Object.keys(e);for(n=0;n<r.length;n++)o=r[n],t.indexOf(o)>=0||(i[o]=e[o]);return i}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(n=0;n<r.length;n++)o=r[n],t.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(i[o]=e[o]);}return i}var n=t.AudioContext||t.webkitAudioContext,i=function e(){var t=this,o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!e.isRecordingSupported())throw new Error("Recording is not supported in this browser");this.state="inactive",this.config=Object.assign({bufferLength:4096,encoderApplication:2049,encoderFrameSize:20,encoderPath:"encoderWorker.min.js",encoderSampleRate:48e3,maxFramesPerPage:40,mediaTrackConstraints:!0,monitorGain:0,numberOfChannels:1,recordingGain:1,resampleQuality:3,streamPages:!1,wavBitDepth:16,sourceNode:{context:null}},o),this.encodedSamplePosition=0,this.initAudioContext(),this.initialize=this.initWorklet().then((function(){return t.initEncoder()}));};i.isRecordingSupported=function(){var e=t.navigator&&t.navigator.mediaDevices&&t.navigator.mediaDevices.getUserMedia;return n&&e&&t.WebAssembly},i.version="8.0.5",i.prototype.clearStream=function(){this.stream&&(this.stream.getTracks?this.stream.getTracks().forEach((function(e){return e.stop()})):this.stream.stop());},i.prototype.close=function(){return this.monitorGainNode.disconnect(),this.recordingGainNode.disconnect(),this.sourceNode&&this.sourceNode.disconnect(),this.clearStream(),this.encoder&&(this.encoderNode.disconnect(),this.encoder.postMessage({command:"close"})),this.config.sourceNode.context?Promise.resolve():this.audioContext.close()},i.prototype.encodeBuffers=function(e){if("recording"===this.state){for(var t=[],o=0;o<e.numberOfChannels;o++)t[o]=e.getChannelData(o);this.encoder.postMessage({command:"encode",buffers:t});}},i.prototype.initAudioContext=function(){this.audioContext=this.config.sourceNode.context?this.config.sourceNode.context:new n,this.monitorGainNode=this.audioContext.createGain(),this.setMonitorGain(this.config.monitorGain),this.recordingGainNode=this.audioContext.createGain(),this.setRecordingGain(this.config.recordingGain);},i.prototype.initEncoder=function(){var e=this;this.audioContext.audioWorklet?(this.encoderNode=new AudioWorkletNode(this.audioContext,"encoder-worklet",{numberOfOutputs:0}),this.encoder=this.encoderNode.port):(console.log("audioWorklet support not detected. Falling back to scriptProcessor"),this.encodeBuffers=function(){return delete e.encodeBuffers},this.encoderNode=this.audioContext.createScriptProcessor(this.config.bufferLength,this.config.numberOfChannels,this.config.numberOfChannels),this.encoderNode.onaudioprocess=function(t){var o=t.inputBuffer;return e.encodeBuffers(o)},this.encoderNode.connect(this.audioContext.destination),this.encoder=new t.Worker(this.config.encoderPath));},i.prototype.initSourceNode=function(){var e=this;return this.config.sourceNode.context?(this.sourceNode=this.config.sourceNode,Promise.resolve()):t.navigator.mediaDevices.getUserMedia({audio:this.config.mediaTrackConstraints}).then((function(t){e.stream=t,e.sourceNode=e.audioContext.createMediaStreamSource(t);}))},i.prototype.initWorker=function(){var e=this,t=(this.config.streamPages?this.streamPage:this.storePage).bind(this);return this.recordedPages=[],this.totalLength=0,new Promise((function(n){e.encoder.addEventListener("message",(function o(i){var r=i.data;switch(r.message){case"ready":n();break;case"page":e.encodedSamplePosition=r.samplePosition,t(r.page);break;case"done":e.encoder.removeEventListener("message",o),e.finish();}})),e.encoder.start&&e.encoder.start();var i=e.config,r=(i.sourceNode,o(i,["sourceNode"]));e.encoder.postMessage(Object.assign({command:"init",originalSampleRate:e.audioContext.sampleRate,wavSampleRate:e.audioContext.sampleRate},r));}))},i.prototype.initWorklet=function(){return this.audioContext.audioWorklet?this.audioContext.audioWorklet.addModule(this.config.encoderPath):Promise.resolve()},i.prototype.pause=function(e){var t=this;if("recording"===this.state)return this.state="paused",this.recordingGainNode.disconnect(),e&&this.config.streamPages?new Promise((function(e){t.encoder.addEventListener("message",(function o(n){"flushed"===n.data.message&&(t.encoder.removeEventListener("message",o),t.onpause(),e());})),t.encoder.start&&t.encoder.start(),t.encoder.postMessage({command:"flush"});})):(this.onpause(),Promise.resolve())},i.prototype.resume=function(){"paused"===this.state&&(this.state="recording",this.recordingGainNode.connect(this.encoderNode),this.onresume());},i.prototype.setRecordingGain=function(e){this.config.recordingGain=e,this.recordingGainNode&&this.audioContext&&this.recordingGainNode.gain.setTargetAtTime(e,this.audioContext.currentTime,.01);},i.prototype.setMonitorGain=function(e){this.config.monitorGain=e,this.monitorGainNode&&this.audioContext&&this.monitorGainNode.gain.setTargetAtTime(e,this.audioContext.currentTime,.01);},i.prototype.start=function(){var e=this;return "inactive"===this.state?(this.state="loading",this.encodedSamplePosition=0,this.audioContext.resume().then((function(){return e.initialize})).then((function(){return Promise.all([e.initSourceNode(),e.initWorker()])})).then((function(){e.state="recording",e.encoder.postMessage({command:"getHeaderPages"}),e.sourceNode.connect(e.monitorGainNode),e.sourceNode.connect(e.recordingGainNode),e.monitorGainNode.connect(e.audioContext.destination),e.recordingGainNode.connect(e.encoderNode),e.onstart();})).catch((function(t){throw e.state="inactive",t}))):Promise.resolve()},i.prototype.stop=function(){var e=this;return "paused"===this.state||"recording"===this.state?(this.state="inactive",this.recordingGainNode.connect(this.encoderNode),this.monitorGainNode.disconnect(),this.clearStream(),new Promise((function(t){e.encoder.addEventListener("message",(function o(n){"done"===n.data.message&&(e.encoder.removeEventListener("message",o),t());})),e.encoder.start&&e.encoder.start(),e.encoder.postMessage({command:"done"});}))):Promise.resolve()},i.prototype.storePage=function(e){this.recordedPages.push(e),this.totalLength+=e.length;},i.prototype.streamPage=function(e){this.ondataavailable(e);},i.prototype.finish=function(){if(!this.config.streamPages){var e=new Uint8Array(this.totalLength);this.recordedPages.reduce((function(t,o){return e.set(o,t),t+o.length}),0),this.ondataavailable(e);}this.onstop();},i.prototype.ondataavailable=function(){},i.prototype.onpause=function(){},i.prototype.onresume=function(){},i.prototype.onstart=function(){},i.prototype.onstop=function(){},e.exports=i;}).call(this,o(1));},function(e,t){var o;o=function(){return this}();try{o=o||new Function("return this")();}catch(e){"object"==typeof window&&(o=window);}e.exports=o;}])}));
+}(recorder_min));
+
+var Recorder = /*@__PURE__*/getDefaultExportFromCjs(recorder_min.exports);
 
 const dom$l = new Dom();
 class Dictation {
@@ -92967,10 +92977,16 @@ class Dictation {
     //     track.stop();
     // });
 
-    // Using mediaRecorder
-    if (this.mediaRecorder && this.mediaRecorder.state !== 'inactive') {
-      this.mediaRecorder.stop();
-      this.localStream.getTracks().forEach(track => track.stop()); // Stop the tracks to release the resources
+    if (this.builder.useMediaRecorder) {
+      // Using mediaRecorder
+      if (this.mediaRecorder && this.mediaRecorder.state !== 'inactive') {
+        this.mediaRecorder.stop();
+        this.localStream.getTracks().forEach(track => track.stop()); // Stop the tracks to release the resources
+      }
+    } else {
+      // Using Recorder
+      if (this.recorder) this.recorder.stop();
+      if (this.localStream) this.localStream.getTracks().forEach(track => track.stop()); // Stop the tracks to release the resources
     }
 
     if (this.websocket && this.websocket.readyState === WebSocket.OPEN) {
@@ -93020,30 +93036,46 @@ class Dictation {
         return;
       }
       const sampleRate = 16000;
+      if (this.builder.useMediaRecorder) {
+        // Using mediaRecorder
+        navigator.mediaDevices.getUserMedia({
+          audio: {
+            sampleSize: 16,
+            channelCount: 1,
+            sampleRate: sampleRate
+          }
+        }).then(stream => {
+          this.localStream = stream;
+          this.mediaRecorder = new MediaRecorder(stream);
+          this.mediaRecorder.addEventListener('dataavailable', event => {
+            if (this.aborted) return;
+
+            // console.log(event.data);
+            // if (event.data.size > 0) {
+            // }
+            this.websocket.send(event.data);
+          });
 
-      // Using mediaRecorder
-      navigator.mediaDevices.getUserMedia({
-        audio: {
-          sampleSize: 16,
-          channelCount: 1,
-          sampleRate: sampleRate
-        }
-      }).then(stream => {
-        this.localStream = stream;
-        this.mediaRecorder = new MediaRecorder(stream);
-        this.mediaRecorder.addEventListener('dataavailable', event => {
-          if (this.aborted) return;
-
-          // console.log(event.data);
-          // if (event.data.size > 0) {
-          // }
-          this.websocket.send(event.data);
+          // this.mediaRecorder.start(1000);
+        }).catch(error => {
+          console.log(error);
         });
-
-        // this.mediaRecorder.start(1000);
-      }).catch(error => {
-        console.log(error);
-      });
+      } else {
+        // Using Recorder
+        this.recorder = new Recorder({
+          encoderPath: 'https://cdnjs.cloudflare.com/ajax/libs/opus-recorder/8.0.5/encoderWorker.min.js',
+          leaveStreamOpen: true,
+          numberOfChannels: 1,
+          // OPUS options
+          encoderSampleRate: sampleRate,
+          streamPages: true,
+          maxBuffersPerPage: 1
+        });
+        this.recorder.ondataavailable = e => {
+          if (this.aborted) return;
+          this.websocket.send(e.buffer);
+        };
+      }
 
       /*
       // Using RecordRTC
@@ -93077,7 +93109,11 @@ class Dictation {
         if (message.event === 'can-open-mic') {
           //this.recorder.startRecording(); // Using RecordRTC
 
-          this.mediaRecorder.start(1000); // Using mediaRecorder
+          if (this.builder.useMediaRecorder) {
+            this.mediaRecorder.start(1000); // Using mediaRecorder
+          } else {
+            this.recorder.start(); // Using Recorder
+          }
 
           // console.log('Start Dictation');
           this.aborted = false;
@@ -93920,6 +93956,7 @@ class ContentBuilder {
       commandPlaceholderText: '',
       enableShortCommands: true,
       speechRecognitionLang: 'en-US',
+      useMediaRecorder: false,
       headlineList: ['We create simple and effective designs.', 'Ultimate Experiences With Story, Emotion, And Purpose.', 'Build Anything Beautifully', 'With Less Stuff and More Compassion', 'We\'re [CompanyName]. Full stack development with a spark of creativity.', 'Transforming your digital experience with [CompanyName]. Achieve your online goals with our customized solutions.', 'Revolutionizing web development with [CompanyName]. Unleash your digital potential with our high-performance solutions.', 'Creative and Inspiring'],
       shortCommandList: {
         undo: ['undo'],
@@ -108593,6 +108630,10 @@ class Lib {
             description: 'If requested to add a list with numbering.'
           },
           //-----
+          change_color_individual_text: {
+            type: 'boolean',
+            description: 'User requests to change the color of a headline, paragraph of specific element/text.'
+          },
           change_content_dark: {
             type: 'boolean',
             description: 'If requested to change text/content color to dark/black.'
@@ -109162,7 +109203,7 @@ Important: Do not change the 'div.is-container' element!
 
     let newMedia = mediaList[randomIndex];
     this.builder.currentMedia = newMedia;
-    return newMedia;
+    return this.builder.mediaPath + newMedia;
   }
 
   getTypographyClass(html) {
@@ -109673,7 +109714,7 @@ class Command {
             return;
           }
 
-          if (args.change_content_light) {
+          if (args.change_content_light && !args.change_color_individual_text) {
             this.builder.editor.saveForUndo();
             this.builder.editor.lib.updateContentColor(activeBox, 'light');
             this.builder.settings.onChange();
@@ -109681,7 +109722,7 @@ class Command {
             return false;
           }
 
-          if (args.change_content_dark) {
+          if (args.change_content_dark && !args.change_color_individual_text) {
             this.builder.editor.saveForUndo();
             this.builder.editor.lib.updateContentColor(activeBox, 'dark');
             this.builder.settings.onChange();
@@ -109970,10 +110011,12 @@ class Command {
             } // Replace {{_IMAGEURL}}
 
 
-            const gallery = this.builder.media.images;
-            const imageList = gallery.square;
-            const imageUrl = this.lib.chooseMedia(imageList);
-            context = context.replaceAll('{{_IMAGEURL}}', imageUrl);
+            if (context.includes('{{_IMAGEURL}}')) {
+              const gallery = this.builder.media.images;
+              const imageList = gallery.square;
+              const imageUrl = this.lib.chooseMedia(imageList);
+              context = context.replaceAll('{{_IMAGEURL}}', imageUrl);
+            }
           } else if (args.new_section_two_boxes || args.new_section_three_boxes || args.new_section_four_boxes) {
             if (args.new_section_two_boxes) {
               context = cl.new_section_two_boxes;
@@ -110000,13 +110043,15 @@ class Command {
               context += '\n\n' + cl.update_section_article_with_image;
             } else if (args.add_article) {
               context += '\n\n' + cl.update_section_article_with_image;
-            } else ; //Replace {{_IMAGEURL}}
-
+            } else ;
 
-            const gallery = this.builder.media.images;
-            const imageList = gallery.square;
-            const imageUrl = this.lib.chooseMedia(imageList);
-            context = context.replaceAll('{{_IMAGEURL}}', imageUrl);
+            if (context.includes('{{_IMAGEURL}}')) {
+              //Replace {{_IMAGEURL}}
+              const gallery = this.builder.media.images;
+              const imageList = gallery.square;
+              const imageUrl = this.lib.chooseMedia(imageList);
+              context = context.replaceAll('{{_IMAGEURL}}', imageUrl);
+            }
           }
         } else {
           //if(args.redesign_layout || args.change_text || args.change_style) {
@@ -110085,13 +110130,15 @@ ${currentHtml}
             } else if (args.add_article) {
               context += '\n' + cl.update_section_article_with_image;
             } else ;
-          } //Replace {{_IMAGEURL}}
-
+          }
 
-          const gallery = this.builder.media.images;
-          const imageList = gallery.square;
-          const imageUrl = this.lib.chooseMedia(imageList);
-          context = context.replaceAll('{{_IMAGEURL}}', imageUrl);
+          if (context.includes('{{_IMAGEURL}}')) {
+            //Replace {{_IMAGEURL}}
+            const gallery = this.builder.media.images;
+            const imageList = gallery.square;
+            const imageUrl = this.lib.chooseMedia(imageList);
+            context = context.replaceAll('{{_IMAGEURL}}', imageUrl);
+          }
         } // Check elements and add relevant context
 
 
@@ -110151,7 +110198,7 @@ ${currentHtml}
             // New Section
             // html = this.fixIcons(html);
             html = this.fixButtons(html);
-            html = this.fixBgImage(html);
+            html = this.fixBgImage(html); // only if box has inline bg image, which is incorrect
 
             if (args.section_background && args.section_background === 'image') {
               html = this.setBgImage(html, true); // Change the bg image (also fix incorrect structure)
@@ -111247,99 +111294,132 @@ ${currentHtml}`;
 
       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'move_content_left') {
+    }
+    /*else if(intent==='move_content_left') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'left');
-      this.builder.settings.onChange();
+       this.builder.editor.lib.moveContent(activeBox, 'left');
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'move_content_center') {
+      
+    } else if(intent==='move_content_center') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'center'); // this.builder.editor.lib.moveContent(activeBox, 'middle');
-
-      this.builder.settings.onChange();
+       this.builder.editor.lib.moveContent(activeBox, 'center');
+      // this.builder.editor.lib.moveContent(activeBox, 'middle');
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'move_content_right') {
+      
+    } else if(intent==='move_content_right') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'right');
-      this.builder.settings.onChange();
+       this.builder.editor.lib.moveContent(activeBox, 'right');
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'move_content_top') {
+      
+    } else if(intent==='move_content_top') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'top');
-      this.builder.settings.onChange();
+       this.builder.editor.lib.moveContent(activeBox, 'top');
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'move_content_middle') {
+      
+    } else if(intent==='move_content_middle') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'middle');
-      this.builder.settings.onChange();
+       this.builder.editor.lib.moveContent(activeBox, 'middle');
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'move_content_bottom') {
+      
+    } else if(intent==='move_content_bottom') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'bottom');
-      this.builder.settings.onChange();
+       this.builder.editor.lib.moveContent(activeBox, 'bottom');
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'make_content_center') {
-      // This
+      
+    } else if(intent==='make_content_center') { // This
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'center');
+       this.builder.editor.lib.moveContent(activeBox, 'center');
       this.builder.editor.lib.moveContent(activeBox, 'middle');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_top_left') {
+      
+    } else if(intent==='align_content_top_left') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'top');
+       this.builder.editor.lib.moveContent(activeBox, 'top');
       this.builder.editor.lib.moveContent(activeBox, 'left');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_top_center') {
+      
+    } else if(intent==='align_content_top_center') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'top');
+       this.builder.editor.lib.moveContent(activeBox, 'top');
       this.builder.editor.lib.moveContent(activeBox, 'center');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_top_right') {
+      
+    } else if(intent==='align_content_top_right') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'top');
+       this.builder.editor.lib.moveContent(activeBox, 'top');
       this.builder.editor.lib.moveContent(activeBox, 'right');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_middle_left') {
+      
+    } else if(intent==='align_content_middle_left') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'middle');
+       this.builder.editor.lib.moveContent(activeBox, 'middle');
       this.builder.editor.lib.moveContent(activeBox, 'left');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_middle_center') {
+      
+    } else if(intent==='align_content_middle_center') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'middle');
+       this.builder.editor.lib.moveContent(activeBox, 'middle');
       this.builder.editor.lib.moveContent(activeBox, 'center');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_middle_right') {
+      
+    } else if(intent==='align_content_middle_right') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'middle');
+       this.builder.editor.lib.moveContent(activeBox, 'middle');
       this.builder.editor.lib.moveContent(activeBox, 'right');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_bottom_left') {
+      
+    } else if(intent==='align_content_bottom_left') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'bottom');
+       this.builder.editor.lib.moveContent(activeBox, 'bottom');
       this.builder.editor.lib.moveContent(activeBox, 'left');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_bottom_center') {
+      
+    } else if(intent==='align_content_bottom_center') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'bottom');
+       this.builder.editor.lib.moveContent(activeBox, 'bottom');
       this.builder.editor.lib.moveContent(activeBox, 'center');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'align_content_bottom_right') {
+      
+    } else if(intent==='align_content_bottom_right') {
+      
       this.builder.editor.saveForUndo();
-      this.builder.editor.lib.moveContent(activeBox, 'bottom');
+       this.builder.editor.lib.moveContent(activeBox, 'bottom');
       this.builder.editor.lib.moveContent(activeBox, 'right');
-      this.builder.settings.onChange();
+       this.builder.settings.onChange();
       return false;
-    } else if (intent === 'increase_space') {
+      
+    } */
+    else if (intent === 'increase_space') {
       let elm = this.builder.editor.activeElement;
 
       if (elm) {
@@ -111471,7 +111551,7 @@ ${currentHtml}`;
       randomIndex = Math.floor(Math.random() * imageList.length);
     }
 
-    return imageList[randomIndex];
+    return this.builder.mediaPath + imageList[randomIndex];
   } // Not Used
 
 
@@ -111686,31 +111766,7 @@ ${currentHtml}`;
       let overlayCode = overlay.querySelector('.is-overlay-content');
       if (overlayCode) overlayCode.parentNode.removeChild(overlayCode);
       let sectionBox = false;
-      if (box.classList.contains('is-section')) sectionBox = true; // Choose random image
-
-      let bgImageUrl;
-      let imageList;
-
-      if (sectionBox) {
-        const gallery = this.builder.media.bg_images;
-        imageList = gallery.section_text_left;
-        const container = box.querySelector('.is-container');
-
-        if (container) {
-          if (container.classList.contains('is-content-left')) {
-            imageList = gallery.section_text_left;
-          } else if (container.classList.contains('is-content-right')) {
-            imageList = gallery.section_text_right;
-          } else {
-            imageList = gallery.section_text_center;
-          }
-        }
-      } else {
-        const gallery = this.builder.media.bg_images;
-        imageList = gallery.box;
-      }
-
-      bgImageUrl = this.lib.chooseMedia(imageList); // Check/fix if container misplaced
+      if (box.classList.contains('is-section')) sectionBox = true; // Check/fix if container misplaced
 
       const container = overlay.querySelector('.is-container');
 
@@ -111721,6 +111777,30 @@ ${currentHtml}`;
       }
 
       if (overlayBg) {
+        // Choose random image
+        let bgImageUrl;
+        let imageList;
+
+        if (sectionBox) {
+          const gallery = this.builder.media.bg_images;
+          imageList = gallery.section_text_left;
+          const container = box.querySelector('.is-container');
+
+          if (container) {
+            if (container.classList.contains('is-content-left')) {
+              imageList = gallery.section_text_left;
+            } else if (container.classList.contains('is-content-right')) {
+              imageList = gallery.section_text_right;
+            } else {
+              imageList = gallery.section_text_center;
+            }
+          }
+        } else {
+          const gallery = this.builder.media.bg_images;
+          imageList = gallery.box;
+        }
+
+        bgImageUrl = this.lib.chooseMedia(imageList);
         overlayBg.style.backgroundImage = `url('${bgImageUrl}')`;
         overlayBg.style.backgroundImage = `url('${bgImageUrl}')`;
         overlayBg.style.backgroundPosition = '50% 60%';
@@ -112013,12 +112093,16 @@ ${currentHtml}`;
   fixHtml(html) {
     // Fix overlay structure when "is-overlay" containing background image in the style attribute
     let regex = /<div class="is-overlay"([^>]*)style="([^"]*background-image:[^;"]+;)([^"]*)"([^>]*)>/g;
-    html = html.replace(regex, '<div class="is-overlay"$1$4>\n    <div class="is-overlay-bg" style="$2"></div>'); // Fix {{IMAGEURL}} that failed to replace
+    html = html.replace(regex, '<div class="is-overlay"$1$4>\n    <div class="is-overlay-bg" style="$2"></div>');
+
+    if (html.includes('{{_IMAGEURL}}')) {
+      // Fix {{IMAGEURL}} that failed to replace
+      const gallery = this.builder.media.images;
+      const imageList = gallery.square;
+      const imageUrl = this.lib.chooseMedia(imageList);
+      html = html.replaceAll('{{IMAGEURL}}', imageUrl);
+    } // Fix {{ICONCLASS}} that failed to replace
 
-    const gallery = this.builder.media.images;
-    const imageList = gallery.square;
-    const imageUrl = this.lib.chooseMedia(imageList);
-    html = html.replaceAll('{{IMAGEURL}}', imageUrl); // Fix {{ICONCLASS}} that failed to replace
 
     html = html.replaceAll('{{ICONCLASS}}', 'ion-checkmark');
     html = this.replaceButtonsWithAnchorTags(html);
@@ -115049,6 +115133,7 @@ class ContentBox {
       //0.4,
       topP: 0.9,
       //0.6,
+      useMediaRecorder: false,
       commandPlaceholderText: 'Create a section containing a short article with ideas for outdoor activities.',
       disclaimerAI: `The feature you're about to use utilizes AI in some of its processes. 
             It's important to understand that AI systems have limitations.
@@ -115061,42 +115146,42 @@ class ContentBox {
       similarityThreshold: 0.65,
       // for commandList similarity checking
       headlineList: ['We\'re [CompanyName]. Full stack development with a spark of creativity.', 'Transforming your digital experience with [CompanyName]. Achieve your online goals with our customized solutions.', 'Revolutionizing web development with [CompanyName]. Unleash your digital potential with our high-performance solutions.'],
+      mediaPath: 'assets/gallery/',
       media: {
-        slider: ['assets/templates-simple/images/img-030.jpg', 'assets/templates-simple/images/img-025.jpg'],
-        blank_video: 'assets/templates-simple/videos/blank.mp4',
-        bg_videos: ['assets/templates-simple/videos/beach1.mp4', 'assets/templates-simple/videos/beach2.mp4'],
-        videos: ['assets/templates-simple/videos/beach1.mp4', 'assets/templates-simple/videos/beach2.mp4'],
+        slider: ['slide-01.jpg', 'slide-02.jpg'],
+        blank_video: 'blank.mp4',
+        videos: ['beach1.mp4', 'beach2.mp4'],
         youtube_videos: ['https://www.youtube.com/embed/P5yHEKqx86U?rel=0'],
         maps: ['https://www.youtube.com/embed/P5yHEKqx86U?rel=0'],
-        audios: ['assets/minimalist-blocks/example.mp3'],
+        audios: ['example.mp3'],
         images: {
-          square: ['assets/gallery/person-01.jpg', 'assets/gallery/person-02.jpg', 'assets/gallery/person-03.jpg', 'assets/gallery/person-04.jpg', 'assets/gallery/person-05.jpg', 'assets/gallery/person-06.jpg', 'assets/gallery/person-08.jpg']
+          square: ['person-01.jpg', 'person-02.jpg', 'person-03.jpg', 'person-04.jpg', 'person-05.jpg', 'person-06.jpg', 'person-08.jpg']
         },
         bg_images: {
-          box: ['assets/gallery/person-01.jpg', 'assets/gallery/person-02.jpg', 'assets/gallery/person-03.jpg', 'assets/gallery/person-04.jpg', 'assets/gallery/person-05.jpg', 'assets/gallery/person-06.jpg', 'assets/gallery/person-07.jpg', 'assets/gallery/person-08.jpg', 'assets/gallery/person-09.jpg', 'assets/gallery/person-10.jpg', 'assets/gallery/building.jpg', 'assets/gallery/desk.jpg', 'assets/gallery/chair.jpg', 'assets/gallery/coffee.jpg', 'assets/gallery/product.jpg', 'assets/gallery/table.jpg'],
-          small_box: ['assets/gallery/person-01.jpg', 'assets/gallery/person-03.jpg', 'assets/gallery/person-04.jpg', 'assets/gallery/person-05.jpg', 'assets/gallery/person-10.jpg', 'assets/gallery/chair.jpg', 'assets/gallery/coffee.jpg', 'assets/gallery/product.jpg', 'assets/gallery/table.jpg'],
+          box: ['person-01.jpg', 'person-02.jpg', 'person-03.jpg', 'person-04.jpg', 'person-05.jpg', 'person-06.jpg', 'person-07.jpg', 'person-08.jpg', 'person-09.jpg', 'person-10.jpg', 'building.jpg', 'desk.jpg', 'chair.jpg', 'coffee.jpg', 'product.jpg', 'table.jpg'],
+          small_box: ['person-01.jpg', 'person-03.jpg', 'person-04.jpg', 'person-05.jpg', 'person-10.jpg', 'chair.jpg', 'coffee.jpg', 'product.jpg', 'table.jpg'],
           // section: [
-          //     'assets/gallery/header-01.jpg',
-          //     'assets/gallery/header-02.jpg',
-          //     'assets/gallery/header-03.jpg',
-          //     'assets/gallery/header-04.jpg',
-          //     'assets/gallery/header-05.jpg',
-          //     'assets/gallery/header-06.jpg',
-          //     'assets/gallery/header-07.jpg',
-          //     'assets/gallery/header-08.jpg',
-          //     'assets/gallery/header-09.jpg',
-          //     'assets/gallery/header-10.jpg',
-          //     'assets/gallery/header-11.jpg',
-          //     'assets/gallery/header-12.jpg',
-          //     'assets/gallery/header-13.jpg',
-          //     'assets/gallery/header-14.jpg',
-          //     'assets/gallery/header-15.jpg',
+          //     'header-01.jpg',
+          //     'header-02.jpg',
+          //     'header-03.jpg',
+          //     'header-04.jpg',
+          //     'header-05.jpg',
+          //     'header-06.jpg',
+          //     'header-07.jpg',
+          //     'header-08.jpg',
+          //     'header-09.jpg',
+          //     'header-10.jpg',
+          //     'header-11.jpg',
+          //     'header-12.jpg',
+          //     'header-13.jpg',
+          //     'header-14.jpg',
+          //     'header-15.jpg',
           // ],
-          section_text_left: ['assets/gallery/header-01.jpg', 'assets/gallery/header-02.jpg', 'assets/gallery/header-03.jpg', 'assets/gallery/header-05.jpg', 'assets/gallery/header-08.jpg', 'assets/gallery/header-10b.jpg', // 'assets/gallery/header-13.jpg',
-          'assets/gallery/header-14.jpg' // 'assets/gallery/header-15b.jpg',
+          section_text_left: ['header-01.jpg', 'header-02.jpg', 'header-03.jpg', 'header-05.jpg', 'header-08.jpg', 'header-10b.jpg', // 'header-13.jpg',
+          'header-14.jpg' // 'header-15b.jpg',
           ],
-          section_text_center: ['assets/gallery/header-07.jpg', 'assets/gallery/header-11.jpg', 'assets/gallery/header-12.jpg', 'assets/gallery/header-13.jpg'],
-          section_text_right: ['assets/gallery/header-04.jpg', 'assets/gallery/header-05b.jpg', 'assets/gallery/header-06.jpg', 'assets/gallery/header-08b.jpg', 'assets/gallery/header-09.jpg', 'assets/gallery/header-10.jpg', 'assets/gallery/header-14b.jpg', 'assets/gallery/header-15.jpg']
+          section_text_center: ['header-07.jpg', 'header-11.jpg', 'header-12.jpg', 'header-13.jpg'],
+          section_text_right: ['header-04.jpg', 'header-05b.jpg', 'header-06.jpg', 'header-08b.jpg', 'header-09.jpg', 'header-10.jpg', 'header-14b.jpg', 'header-15.jpg']
         }
       },
       shortCommandList: {
@@ -115551,6 +115636,7 @@ Provide an engaging headline.`, 'Create a new section showcasing a photo gallery
       commandInfo: this.settings.commandInfo,
       commandPlaceholderText: this.settings.commandPlaceholderText,
       similarityThreshold: this.settings.similarityThreshold,
+      useMediaRecorder: this.settings.useMediaRecorder,
       container: '.is-container',
       page: '.is-wrapper',
       deleteConfirm: this.settings.deleteConfirm,