@innovastudio/contentbox 1.5.78 → 1.5.79

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@innovastudio/contentbox",
   "type": "module",
-  "version": "1.5.78",
+  "version": "1.5.79",
   "description": "",
   "main": "public/contentbox/contentbox.esm.js",
   "files": [
@@ -51,7 +51,7 @@
     "ws": "^8.13.0"
   },
   "dependencies": {
-    "@innovastudio/contentbuilder": "^1.4.99",
+    "@innovastudio/contentbuilder": "^1.4.100",
     "js-beautify": "^1.14.0"
   }
 }

package/public/contentbox/contentbox.esm.js

@@ -97131,31 +97131,56 @@ class ContentBuilder {
       }
     }
   }
+  async upscaleImage(src, callback) {
+    const width = 512;
+    const height = 512;
+    const img = new Image();
+    img.src = src;
+    img.onload = async () => {
+      const canvas = document.createElement('canvas');
+      canvas.width = width;
+      canvas.height = height;
+      const ctx = canvas.getContext('2d');
+      ctx.drawImage(img, 0, 0, width, height);
+      const resizedBase64 = canvas.toDataURL('image/jpeg');
+      let image = resizedBase64;
+      image = image.replace(/^data:image\/(png|jpeg);base64,/, '');
+      const messages = {
+        image: image,
+        folder_path: ''
+      };
+      const response = await fetch(this.upscaleImageUrl, {
+        signal: this.signal,
+        // Abort
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(messages)
+      });
+      const result = await response.json();
+      callback([result.url]);
+    };
+  }
   async generateImage(prompt, callback) {
     this.controller = new AbortController(); // Create a new AbortController
     this.signal = this.controller.signal; // Get a new signal object
 
-    let model = 'realistic-vision-v3';
-    let negative_prompt = '';
-    if (model.includes('realistic-vision')) {
-      if (negative_prompt === '') negative_prompt = 'duplicate, (deformed iris, deformed pupils, semi-realistic, cgi, 3d, render, sketch, cartoon, drawing, anime:1.4), text, close up, cropped, out of frame, worst quality, low quality, jpeg artifacts, ugly, duplicate, morbid, mutilated, extra fingers, mutated hands, poorly drawn hands, poorly drawn face, mutation, deformed, blurry, dehydrated, bad anatomy, bad proportions, extra limbs, cloned face, disfigured, gross proportions, malformed limbs, missing arms, missing legs, extra arms, extra legs, fused fingers, too many fingers, long neck, bad_prompt_version2, bad-hands-5, badhandv4, bad anatomy, deformed, mutated, amputated, missing finger, extra finger, fused fingers, missing leg, extra leg, fused legs, missing digit, extra digit, fused digits, missing hand, extra hand, fused hands, missing arm, extra arm, fused arms, missing limb, extra limb, fused limbs, fused bodies, merged bodies, extra bodies, dual bodies, extra navel, elongated body, missing joint, extra joint, fused joints, deformed hip, twisted limbs, twisted legs, twisted arms, missing head, extra head, double head, twins, missing ear, extra ear, deformed ear, black and white, monochrome, multiple views, blurry, text, signature, head out of frame, paintings, sketches, (worst quality:2), (low quality:2), (normal quality:2), lowres, grayscale, glans, bad hands, error, extra digit, fewer digits, cropped, jpeg artifacts, watermark, username, bad feet, poorly drawn hands, poorly drawn face, mutation, too many fingers, long neck, long body, long arms, cross-eyed, mutated hands, polar lowres, bad body, bad proportions, gross proportions, cropped head , bad eyes, extra breast, missing breast, fused breasts, unnatural proportions, necklace';
-    }
-    let width = 1024;
-    let height = 1024;
-    let steps = 25;
-    let guidance = 7.5;
-    let scheduler = 'dpmsolver++';
-    let output_format = 'jpeg';
+    let model = this.imageModel || 'realistic-vision-v3';
+    let negative_prompt = this.imageNegativePrompt || 'duplicate, (deformed iris, deformed pupils, semi-realistic, cgi, 3d, render, sketch, cartoon, drawing, anime:1.4), text, close up, cropped, out of frame, worst quality, low quality, jpeg artifacts, ugly, duplicate, morbid, mutilated, extra fingers, mutated hands, poorly drawn hands, poorly drawn face, mutation, deformed, blurry, dehydrated, bad anatomy, bad proportions, extra limbs, cloned face, disfigured, gross proportions, malformed limbs, missing arms, missing legs, extra arms, extra legs, fused fingers, too many fingers, long neck, bad_prompt_version2, bad-hands-5, badhandv4, bad anatomy, deformed, mutated, amputated, missing finger, extra finger, fused fingers, missing leg, extra leg, fused legs, missing digit, extra digit, fused digits, missing hand, extra hand, fused hands, missing arm, extra arm, fused arms, missing limb, extra limb, fused limbs, fused bodies, merged bodies, extra bodies, dual bodies, extra navel, elongated body, missing joint, extra joint, fused joints, deformed hip, twisted limbs, twisted legs, twisted arms, missing head, extra head, double head, twins, missing ear, extra ear, deformed ear, black and white, monochrome, multiple views, blurry, text, signature, head out of frame, paintings, sketches, (worst quality:2), (low quality:2), (normal quality:2), lowres, grayscale, glans, bad hands, error, extra digit, fewer digits, cropped, jpeg artifacts, watermark, username, bad feet, poorly drawn hands, poorly drawn face, mutation, too many fingers, long neck, long body, long arms, cross-eyed, mutated hands, polar lowres, bad body, bad proportions, gross proportions, cropped head , bad eyes, extra breast, missing breast, fused breasts, unnatural proportions, necklace';
+    let steps = this.imageSteps || 25;
+    let guidance = this.imageGuidance || 7.5;
+    let scheduler = this.imageScheduler || 'dpmsolver++';
     const messages = {
-      model: 'realistic-vision-v3',
+      model,
       prompt: prompt,
-      negative_prompt: negative_prompt,
-      width: width,
-      height: height,
-      steps: steps,
-      guidance: guidance,
-      scheduler: scheduler,
-      output_format: output_format,
+      negative_prompt,
+      width: 512,
+      height: 512,
+      steps,
+      guidance,
+      scheduler,
+      output_format: 'jpeg',
       folder_path: ''
     };
     try {
@@ -97175,7 +97200,9 @@ class ContentBuilder {
         return;
       }
       const imageUrl = result.url;
-      callback([imageUrl]);
+
+      //callback([imageUrl]);
+      this.upscaleImage(imageUrl, callback);
     } catch (error) {
       if (error.name === 'AbortError') ; else {
         // CORS or code errors goes here
@@ -111430,6 +111457,12 @@ ${blockContent}
 
           if (tagName === 'img') {
             this.builder.editor.saveForUndo();
+
+            elm.onload = async () => {
+              let divImageResizer = document.querySelector('#divImageResizer');
+              if (divImageResizer) divImageResizer.click();
+            };
+
             elm.setAttribute('src', src); //Trigger Change event
 
             this.builder.onChange();
@@ -117820,8 +117853,15 @@ class ContentBox {
       // renameFileUrl: '',
       // getMmodelsUrl: '',
       // textToImageUrl: '', // To enable AI image generation
-      // upscaleImageUrl: '',
+      // upscaleImageUrl: '', // To enable AI image generation
       // controlNetUrl: '',
+      // saveTextUrl: '',
+      // viewImageUrl: '',
+      // imageModel: 'realistic-vision-v3',
+      // imageNegativePrompt: '',
+      // imageSteps: 25,
+      // imageGuidance: 7.5,
+      // imageScheduler: 'dpmsolver++',
       speechTranscribeUrl: '',
       // http://localhost:8081
       autoSendDelay: 4000,
@@ -118386,7 +118426,13 @@ Add an image for each feature.`, 'Revise the headline, paragraph, and all the te
       textToImageUrl: this.settings.textToImageUrl,
       upscaleImageUrl: this.settings.upscaleImageUrl,
       controlNetUrl: this.settings.controlNetUrl,
-      imageViewUrl: this.settings.imageViewUrl,
+      saveTextUrl: this.settings.saveTextUrl,
+      viewImageUrl: this.settings.viewImageUrl,
+      imageModel: this.settings.imageModel,
+      imageNegativePrompt: this.settings.imageNegativePrompt,
+      imageSteps: this.settings.imageSteps,
+      imageGuidance: this.settings.imageGuidance,
+      imageScheduler: this.settings.imageScheduler,
       assetPanelReverse: this.settings.assetPanelReverse,
       assetFilesOnly: this.settings.assetFilesOnly,
       assetRefreshButton: this.settings.assetRefreshButton,