map the plugin settings to the horde settings

index.html

@@ -952,6 +952,10 @@
 
                         <!-- <img width="15px" height="15px" src="./icon/ftcopy.svg">   -->
                     </div>
+                    <img
+                        id="webp_container"
+                        src="https://www.keycdn.com/img/blog/convert-to-webp-the-successor-of-jpeg-lg.webp"
+                    />
                     <div class="prompts">
                         <!-- <sp-label slot="label">Prompt</sp-label> -->
                         <div class="">

index.js

@@ -2245,27 +2245,27 @@ async function imageToSmartObject() {
 
 // document.getElementById('btnNewLayer').addEventListener('click', imageToSmartObject )
 
-async function placeEmbedded(image_path) {
+async function placeEmbedded(image_name, dir_entery) {
     //silent importer
 
     try {
-        console.log('placeEmbedded(): image_path: ', image_path)
+        // console.log('placeEmbedded(): image_path: ', image_path)
 
         const formats = require('uxp').storage.formats
         const storage = require('uxp').storage
         const fs = storage.localFileSystem
-        const names = image_path.split('/')
+        // const names = image_path.split('/')
-        const length = names.length
+        // const length = names.length
-        const image_name = names[length - 1]
+        // const image_name = names[length - 1]
-        const project_name = names[length - 2]
+        // const project_name = names[length - 2]
-        let pluginFolder = await fs.getPluginFolder()
+        let image_dir = dir_entery
-        const image_dir = `./server/python_server/output/${project_name}`
+        // const image_dir = `./server/python_server/output/${project_name}`
         // image_path = "output/f027258e-71b8-430a-9396-0a19425f2b44/output- 1674323725.126322.png"
 
-        let img_dir = await pluginFolder.getEntry(image_dir)
+        // let img_dir = await .getEntry(image_dir)
         // const file = await img_dir.createFile('output- 1674298902.0571606.png', {overwrite: true});
 
-        const file = await img_dir.createFile(image_name, { overwrite: true })
+        const file = await image_dir.createFile(image_name, { overwrite: true })
 
         const img = await file.read({ format: formats.binary })
         const token = await storage.localFileSystem.createSessionToken(file)
@@ -2489,7 +2489,7 @@ async function base64ToFile(b64Image) {
     return place_event_result
 }
 
-async function placeImageB64ToLayer(image_path) {
+async function placeImageB64ToLayer(image_path, entery) {
     //silent importer
 
     try {
@@ -3482,7 +3482,7 @@ document
         }
     })
 
-async function downloadIt(link) {
+async function downloadIt(link, format = 'png') {
     const image = await fetch(link)
     console.log(link)
     const storage = require('uxp').storage
@@ -3492,7 +3492,9 @@ async function downloadIt(link) {
         const img = await image.arrayBuffer()
         // const file = await fs.getFileForSaving("image.png");
         const folder = await storage.localFileSystem.getTemporaryFolder()
-        const file = await folder.createFile('image.png', { overwrite: true })
+        const file = await folder.createFile(`image.${format}`, {
+            overwrite: true,
+        })
         // const file = await fs.getTempFolder()
 
         await file.write(img)
@@ -3516,10 +3518,10 @@ async function downloadIt(link) {
     }
 }
 
-async function downloadItExe(link) {
+async function downloadItExe(link, format = 'png') {
     await executeAsModal(async () => {
         try {
-            await downloadIt(link)
+            await downloadIt(link, format)
         } catch (e) {
             console.warn(e)
         }
@@ -3620,3 +3622,56 @@ async function prmoptForUpdate() {
 document.getElementById('btnUpdate').addEventListener('click', async () => {
     await prmoptForUpdate()
 })
+
+function a() {
+    var webp = document.getElementById('webp_container')
+    var canvas = document.createElement('canvas')
+    document.body.appendChild(canvas)
+    canvas.width = webp.width
+    canvas.height = webp.height
+    var ctx = canvas.getContext('2d')
+    ctx.drawImage(webp, 0, 0)
+    webp.parentNode.removeChild(webp)
+    return
+}
+
+function urlToImg(img_url) {
+    var xhr = new XMLHttpRequest()
+
+    // Use JSFiddle logo as a sample image to avoid complicating
+    // this example with cross-domain issues.
+    // xhr.open('GET', 'http://fiddle.jshell.net/img/logo.png', true)
+
+    xhr.open('GET', img_url, true)
+
+    // Ask for the result as an ArrayBuffer.
+    xhr.responseType = 'arraybuffer'
+
+    xhr.onload = function (e) {
+        // Obtain a blob: URL for the image data.
+        var arrayBufferView = new Uint8Array(this.response)
+        var blob = new Blob([arrayBufferView], { type: 'image/png' })
+        var urlCreator = window.URL || window.webkitURL
+        var imageUrl = urlCreator.createObjectURL(blob)
+        var img = document.getElementById('webp_container')
+        img.src = imageUrl
+    }
+
+    xhr.send()
+}
+
+function webpToJpg(id) {
+    var image = new Image()
+
+    image.onload = function () {
+        var canvas = document.createElement('canvas')
+        canvas.width = this.naturalWidth
+        canvas.height = this.naturalHeight
+        canvas.getContext('2d').drawImage(this, 0, 0)
+        document.getElementById(id).src = canvas.toDataURL('image/jpeg')
+    }
+
+    image.src = document.getElementById(id).src
+}
+
+webpToJpg('webp_container')

utility/html_manip.js

@@ -543,7 +543,7 @@ function addHistoryButtonsHtml(img_html) {
         //set init image event listener, use when settion is active
         let image_path = img_html.dataset.path
         const image_path_escape = image_path.replace(/\o/g, '/o') //escape string "\o" in "\output"
-        // await placeEmbedded(image_path_escape)
+
         // load the image from "data:image/png;base64," base64_str
         const base64_image = img_html.src.replace('data:image/png;base64,', '')
         await base64ToFile(base64_image)

utility/sdapi/horde_native.js

@@ -1,8 +1,69 @@
+const webui_to_horde_samplers = {
+    'Euler a': 'k_euler_a',
+    Euler: 'k_euler',
+    LMS: 'k_lms',
+    Heun: 'k_heun',
+    DPM2: 'k_dpm_2',
+    'DPM2 a': 'k_dpm_2_a',
+    'DPM++ 2S a': 'k_dpmpp_2s_a',
+    'DPM++ 2M': 'k_dpmpp_2m',
+    'DPM++ SDE': 'k_dpmpp_sde',
+    'DPM fast': 'k_dpm_fast',
+    'DPM adaptive': 'k_dpm_adaptive',
+    'LMS Karras': 'k_lms',
+    'DPM2 Karras': 'k_dpm_2',
+    'DPM2 a Karras': 'k_dpm_2_a',
+    'DPM++ 2S a Karras': 'k_dpmpp_2s_a',
+    'DPM++ 2M Karras': 'k_dpmpp_2m',
+    'DPM++ SDE Karras': 'k_dpmpp_sde',
+    DDIM: 'ddim',
+    PLMS: 'plms',
+}
+
 //get workers
 //select a worker
 //send a request => requestHorde(horde_settings)
 //check for progress => requestHordeCheck(request_id)
 //when progress is full, request the result => requestHordeStatus(request_id)
+
+function mapPluginSettingsToHorde(plugin_settings) {
+    const { getModelHorde } = require('../sd_scripts/horde')
+    const ps = plugin_settings // for shortness
+    const sampler = webui_to_horde_samplers[ps['sampler_index']]
+    const model = getModelHorde()
+    let horde_payload = {
+        prompt: ps['prompt'],
+        params: {
+            sampler_name: sampler,
+            toggles: [1, 4],
+            cfg_scale: ps['cfg_scale'],
+            denoising_strength: ps['denoising_strength'],
+            // seed: 'string',
+            height: ps['height'],
+            width: ps['width'],
+            seed_variation: 1,
+            post_processing: ['GFPGAN'],
+            karras: false,
+            tiling: false,
+            steps: parseInt(ps['steps']),
+            n: 1,
+        },
+        nsfw: false,
+        trusted_workers: true,
+        censor_nsfw: false,
+        // workers: ['4c79ab19-8e6c-4054-83b3-773b7ce71ece'],
+        // workers: workers_ids,
+        // models: ['stable_diffusion'],
+        models: [model],
+        // source_image: 'string',
+        // source_processing: 'img2img',
+        // source_mask: 'string',
+        r2: true,
+        shared: false,
+    }
+    return horde_payload
+}
+
 function getWorkerID(workers_json) {
     let workers_ids = []
     for (worker of workers_json) {
@@ -33,36 +94,38 @@ async function requestHorde(payload) {
     const workers = await getWorkers()
 
     const workers_ids = getWorkerID(workers)
-
+    const settings = await getSettings()
-    payload = {
+    payload = mapPluginSettingsToHorde(settings)
-        prompt: 'string',
+    payload['workers'] = workers_ids
-        params: {
+    // payload = {
-            sampler_name: 'k_lms',
+    //     prompt: 'string',
-            toggles: [1, 4],
+    //     params: {
-            cfg_scale: 5,
+    //         sampler_name: 'k_lms',
-            denoising_strength: 0.75,
+    //         toggles: [1, 4],
-            seed: 'string',
+    //         cfg_scale: 5,
-            height: 512,
+    //         denoising_strength: 0.75,
-            width: 512,
+    //         // seed: 'string',
-            seed_variation: 1,
+    //         height: 512,
-            post_processing: ['GFPGAN'],
+    //         width: 512,
-            karras: false,
+    //         seed_variation: 1,
-            tiling: false,
+    //         post_processing: ['GFPGAN'],
-            steps: 5,
+    //         karras: false,
-            n: 1,
+    //         tiling: false,
-        },
+    //         steps: 5,
-        nsfw: false,
+    //         n: 1,
-        trusted_workers: true,
+    //     },
-        censor_nsfw: false,
+    //     nsfw: false,
-        // workers: ['4c79ab19-8e6c-4054-83b3-773b7ce71ece'],
+    //     trusted_workers: true,
-        workers: workers_ids,
+    //     censor_nsfw: false,
-        models: ['stable_diffusion'],
+    //     // workers: ['4c79ab19-8e6c-4054-83b3-773b7ce71ece'],
-        // source_image: 'string',
+    //     workers: workers_ids,
-        // source_processing: 'img2img',
+    //     models: ['stable_diffusion'],
-        // source_mask: 'string',
+    //     // source_image: 'string',
-        r2: true,
+    //     // source_processing: 'img2img',
-        shared: false,
+    //     // source_mask: 'string',
-    }
+    //     r2: true,
+    //     shared: false,
+    // }
     try {
         console.log('requestHorde():')
 
@@ -163,11 +226,29 @@ async function startCheckingProgress() {
         g_interval_id = setInterval(async () => {
             try {
                 const check_json = await requestHordeCheck(g_id)
-                if (check_json['done'] && !g_b_request_result) {
+                if (
+                    check_json['done'] &&
+                    g_interval_id
+                    // !g_b_request_result
+                ) {
+                    clearTimeout(g_interval_id)
                     console.log('horde request is done')
-                    g_b_request_result = true
+                    // g_b_request_result = true
-                    g_horde_generation_result = await requestHordeStatus(g_id)
+                    const temp_id = g_id //g_id will reset
-                    cancelRequestClientSide()
+                    // cancelRequestClientSide()
+                    g_horde_generation_result = await requestHordeStatus(
+                        temp_id
+                    )
+
+                    const generations = g_horde_generation_result.generations
+                    for (image_horde_container of generations) {
+                        try {
+                            const url = image_horde_container.img
+                            await downloadItExe(url, 'webp') //
+                        } catch (e) {
+                            console.warn(e)
+                        }
+                    }
                 }
             } catch (e) {
                 console.warn(e)