/** SD-UI Backend control and classes.
*/
;(function() {
"use strict"
const RETRY_DELAY_IF_BUFFER_IS_EMPTY = 1000 // ms
const RETRY_DELAY_IF_SERVER_IS_BUSY = 30 * 1000 // ms, status_code 503, already a task running
const RETRY_DELAY_ON_ERROR = 4000 // ms
const TASK_STATE_SERVER_UPDATE_DELAY = 1500 // ms
const SERVER_STATE_VALIDITY_DURATION = 90 * 1000 // ms - 90 seconds to allow ping to timeout more than once before killing tasks.
const HEALTH_PING_INTERVAL = 5000 // ms
const IDLE_COOLDOWN = 2500 // ms
const CONCURRENT_TASK_INTERVAL = 100 // ms
/** Connects to an endpoint and resumes connection after reaching end of stream until all data is received.
* Allows closing the connection while the server buffers more data.
*/
class ChunkedStreamReader {
#bufferedString = "" // Data received waiting to be read.
#url
#fetchOptions
#response
constructor(url, initialContent = "", options = {}) {
if (typeof url !== "string" && !(url instanceof String)) {
throw new Error("url is not a string.")
}
if (typeof initialContent !== "undefined" && typeof initialContent !== "string") {
throw new Error("initialContent is not a string.")
}
this.#bufferedString = initialContent
this.#url = url
this.#fetchOptions = Object.assign(
{
headers: {
"Content-Type": "application/json",
},
},
options
)
this.onNext = undefined
}
get url() {
if (this.#response.redirected) {
return this.#response.url
}
return this.#url
}
get bufferedString() {
return this.#bufferedString
}
get status() {
this.#response?.status
}
get statusText() {
this.#response?.statusText
}
parse(value) {
if (typeof value === "undefined") {
return
}
if (!isArrayOrTypedArray(value)) {
return [value]
}
if (value.length === 0) {
return value
}
if (typeof this.textDecoder === "undefined") {
this.textDecoder = new TextDecoder()
}
return [this.textDecoder.decode(value)]
}
onComplete(value) {
return value
}
onError(response) {
throw new Error(response.statusText)
}
onNext({ value, done }, response) {
return { value, done }
}
async *[Symbol.asyncIterator]() {
return this.open()
}
async *open() {
let value = undefined
let done = undefined
do {
if (this.#response) {
await asyncDelay(RETRY_DELAY_IF_BUFFER_IS_EMPTY)
}
this.#response = await fetch(this.#url, this.#fetchOptions)
if (!this.#response.ok) {
if (this.#response.status === 425) {
continue
}
// Request status indicate failure
console.warn("Stream %o stopped unexpectedly.", this.#response)
value = await Promise.resolve(this.onError(this.#response))
if (typeof value === "boolean" && value) {
continue
}
return value
}
const reader = this.#response.body.getReader()
done = false
do {
const readState = await reader.read()
value = this.parse(readState.value)
if (value) {
for (let sVal of value) {
;({ value: sVal, done } = await Promise.resolve(
this.onNext({ value: sVal, done: readState.done })
))
yield sVal
if (done) {
return this.onComplete(sVal)
}
}
}
if (done) {
return
}
} while (value && !done)
} while (!done && (this.#response.ok || this.#response.status === 425))
}
*readStreamAsJSON(jsonStr, throwOnError) {
if (typeof jsonStr !== "string") {
throw new Error("jsonStr is not a string.")
}
do {
if (this.#bufferedString.length > 0) {
// Append new data when required
if (jsonStr.length > 0) {
jsonStr = this.#bufferedString + jsonStr
} else {
jsonStr = this.#bufferedString
}
this.#bufferedString = ""
}
if (!jsonStr) {
return
}
// Find next delimiter
let lastChunkIdx = jsonStr.indexOf("}{")
if (lastChunkIdx >= 0) {
this.#bufferedString = jsonStr.substring(0, lastChunkIdx + 1)
jsonStr = jsonStr.substring(lastChunkIdx + 1)
} else {
this.#bufferedString = jsonStr
jsonStr = ""
}
if (this.#bufferedString.length <= 0) {
return
}
// hack for a middleman buffering all the streaming updates, and unleashing them on the poor browser in one shot.
// this results in having to parse JSON like {"step": 1}{"step": 2}{"step": 3}{"ste...
// which is obviously invalid and can happen at any point while rendering.
// So we need to extract only the next {} section
try {
// Try to parse
const jsonObj = JSON.parse(this.#bufferedString)
this.#bufferedString = jsonStr
jsonStr = ""
yield jsonObj
} catch (e) {
if (throwOnError) {
console.error(`Parsing: "${this.#bufferedString}", Buffer: "${jsonStr}"`)
}
this.#bufferedString += jsonStr
if (e instanceof SyntaxError && !throwOnError) {
return
}
throw e
}
} while (this.#bufferedString.length > 0 && this.#bufferedString.indexOf("}") >= 0)
}
}
const EVENT_IDLE = "idle"
const EVENT_STATUS_CHANGED = "statusChange"
const EVENT_UNHANDLED_REJECTION = "unhandledRejection"
const EVENT_TASK_QUEUED = "taskQueued"
const EVENT_TASK_START = "taskStart"
const EVENT_TASK_END = "taskEnd"
const EVENT_TASK_ERROR = "task_error"
const EVENT_UNEXPECTED_RESPONSE = "unexpectedResponse"
const EVENTS_TYPES = [
EVENT_IDLE,
EVENT_STATUS_CHANGED,
EVENT_UNHANDLED_REJECTION,
EVENT_TASK_QUEUED,
EVENT_TASK_START,
EVENT_TASK_END,
EVENT_TASK_ERROR,
EVENT_UNEXPECTED_RESPONSE,
]
Object.freeze(EVENTS_TYPES)
const eventSource = new GenericEventSource(EVENTS_TYPES)
function setServerStatus(msgType, msg) {
return eventSource.fireEvent(EVENT_STATUS_CHANGED, { type: msgType, message: msg })
}
const ServerStates = {
init: "Init",
loadingModel: "LoadingModel",
online: "Online",
rendering: "Rendering",
unavailable: "Unavailable",
}
Object.freeze(ServerStates)
let sessionId = Date.now()
let serverState = { status: ServerStates.unavailable, time: Date.now() }
async function healthCheck() {
if (Date.now() < serverState.time + HEALTH_PING_INTERVAL / 2 && isServerAvailable()) {
// Ping confirmed online less than half of HEALTH_PING_INTERVAL ago.
return true
}
if (Date.now() >= serverState.time + SERVER_STATE_VALIDITY_DURATION) {
console.warn("WARNING! SERVER_STATE_VALIDITY_DURATION has elapsed since the last Ping completed.")
}
try {
let res = undefined
if (typeof sessionId !== "undefined") {
res = await fetch("/ping?session_id=" + sessionId)
} else {
res = await fetch("/ping")
}
serverState = await res.json()
if (typeof serverState !== "object" || typeof serverState.status !== "string") {
console.error(`Server reply didn't contain a state value.`)
serverState = { status: ServerStates.unavailable, time: Date.now() }
setServerStatus("error", "offline")
return false
}
// Set status
switch (serverState.status) {
case ServerStates.init:
// Wait for init to complete before updating status.
break
case ServerStates.online:
setServerStatus("online", "ready")
break
case ServerStates.loadingModel:
setServerStatus("busy", "loading..")
break
case ServerStates.rendering:
setServerStatus("busy", "rendering..")
break
default:
// Unavailable
console.error("Ping received an unexpected server status. Status: %s", serverState.status)
setServerStatus("error", serverState.status.toLowerCase())
break
}
serverState.time = Date.now()
return true
} catch (e) {
console.error(e)
serverState = { status: ServerStates.unavailable, time: Date.now() }
setServerStatus("error", "offline")
}
return false
}
function isServerAvailable() {
if (typeof serverState !== "object") {
console.error("serverState not set to a value. Connection to server could be lost...")
return false
}
if (Date.now() >= serverState.time + SERVER_STATE_VALIDITY_DURATION) {
console.warn("SERVER_STATE_VALIDITY_DURATION elapsed. Connection to server could be lost...")
return false
}
switch (serverState.status) {
case ServerStates.loadingModel:
case ServerStates.rendering:
case ServerStates.online:
return true
default:
console.warn("Unexpected server status. Server could be unavailable... Status: %s", serverState.status)
return false
}
}
async function waitUntil(isReadyFn, delay, timeout) {
if (typeof delay === "number") {
const msDelay = delay
delay = () => asyncDelay(msDelay)
}
if (typeof delay !== "function") {
throw new Error("delay is not a number or a function.")
}
if (typeof timeout !== "undefined" && typeof timeout !== "number") {
throw new Error("timeout is not a number.")
}
if (typeof timeout === "undefined" || timeout < 0) {
timeout = Number.MAX_SAFE_INTEGER
}
timeout = Date.now() + timeout
while (
timeout > Date.now() &&
Date.now() < serverState.time + SERVER_STATE_VALIDITY_DURATION &&
!Boolean(await Promise.resolve(isReadyFn()))
) {
await delay()
if (!isServerAvailable()) {
// Can fail if ping got frozen/suspended...
if ((await healthCheck()) && isServerAvailable()) {
// Force a recheck of server status before failure...
continue // Continue waiting if last healthCheck confirmed the server is still alive.
}
throw new Error("Connection with server lost.")
}
}
if (Date.now() >= serverState.time + SERVER_STATE_VALIDITY_DURATION) {
console.warn("SERVER_STATE_VALIDITY_DURATION elapsed. Released waitUntil on stale server state.")
}
}
const TaskStatus = {
init: "init",
pending: "pending", // Queued locally, not yet posted to server
waiting: "waiting", // Waiting to run on server
processing: "processing",
stopped: "stopped",
completed: "completed",
failed: "failed",
}
Object.freeze(TaskStatus)
const TASK_STATUS_ORDER = [
TaskStatus.init,
TaskStatus.pending,
TaskStatus.waiting,
TaskStatus.processing,
//Don't add status that are final.
]
const task_queue = new Map()
const concurrent_generators = new Map()
const weak_results = new WeakMap()
class Task {
// Private properties...
_reqBody = {} // request body of this task.
#reader = undefined
#status = TaskStatus.init
#id = undefined
#exception = undefined
constructor(options = {}) {
this._reqBody = Object.assign({}, options)
if (typeof this._reqBody.session_id === "undefined") {
this._reqBody.session_id = sessionId
} else if (
this._reqBody.session_id !== SD.sessionId &&
String(this._reqBody.session_id) !== String(SD.sessionId)
) {
throw new Error("Use SD.sessionId to set the request session_id.")
}
this._reqBody.session_id = String(this._reqBody.session_id)
}
get id() {
return this.#id
}
_setId(id) {
if (typeof this.#id !== "undefined") {
throw new Error("The task ID can only be set once.")
}
this.#id = id
}
get exception() {
return this.#exception
}
async abort(exception) {
if (this.isCompleted || this.isStopped || this.hasFailed) {
return
}
if (typeof exception !== "undefined") {
if (typeof exception === "string") {
exception = new Error(exception)
}
if (typeof exception !== "object") {
throw new Error("exception is not an object.")
}
if (!(exception instanceof Error)) {
throw new Error("exception is not an Error or a string.")
}
}
const res = await fetch("/image/stop?task=" + this.id)
if (!res.ok) {
console.log("Stop response:", res)
throw new Error(res.statusText)
}
task_queue.delete(this)
this.#exception = exception
this.#status = exception ? TaskStatus.failed : TaskStatus.stopped
}
get reqBody() {
if (this.#status === TaskStatus.init) {
return this._reqBody
}
console.warn("Task reqBody cannot be changed after the init state.")
return Object.assign({}, this._reqBody)
}
get isPending() {
return TASK_STATUS_ORDER.indexOf(this.#status) >= 0
}
get isCompleted() {
return this.#status === TaskStatus.completed
}
get hasFailed() {
return this.#status === TaskStatus.failed
}
get isStopped() {
return this.#status === TaskStatus.stopped
}
get status() {
return this.#status
}
_setStatus(status) {
if (status === this.#status) {
return
}
const currentIdx = TASK_STATUS_ORDER.indexOf(this.#status)
if (currentIdx < 0) {
throw Error(`The task status ${this.#status} is final and can't be changed.`)
}
const newIdx = TASK_STATUS_ORDER.indexOf(status)
if (newIdx >= 0 && newIdx < currentIdx) {
throw Error(`The task status ${status} can't replace ${this.#status}.`)
}
this.#status = status
}
/** Send current task to server.
* @param {*} [timeout=-1] Optional timeout value in ms
* @returns the response from the render request.
* @memberof Task
*/
async post(url, timeout = -1) {
if (this.status !== TaskStatus.init && this.status !== TaskStatus.pending) {
throw new Error(`Task status ${this.status} is not valid for post.`)
}
this._setStatus(TaskStatus.pending)
Object.freeze(this._reqBody)
const abortSignal = timeout >= 0 ? AbortSignal.timeout(timeout) : undefined
let res = undefined
try {
this.checkReqBody()
do {
abortSignal?.throwIfAborted()
res = await fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(this._reqBody),
signal: abortSignal,
})
// status_code 503, already a task running.
} while (res.status === 503 && (await asyncDelay(RETRY_DELAY_IF_SERVER_IS_BUSY)))
} catch (err) {
this.abort(err)
throw err
}
if (!res.ok) {
const err = new Error(`Unexpected response HTTP${res.status}. Details: ${res.statusText}`)
this.abort(err)
throw err
}
return await res.json()
}
static getReader(url) {
const reader = new ChunkedStreamReader(url)
const parseToString = reader.parse
reader.parse = function(value) {
value = parseToString.call(this, value)
if (!value || value.length <= 0) {
return
}
return reader.readStreamAsJSON(value.join(""))
}
reader.onNext = function({ done, value }) {
// By default is completed when the return value has a status defined.
if (typeof value === "object" && "status" in value) {
done = true
}
return { done, value }
}
return reader
}
_setReader(reader) {
if (typeof this.#reader !== "undefined") {
throw new Error("The task reader can only be set once.")
}
this.#reader = reader
}
get reader() {
if (this.#reader) {
return this.#reader
}
if (!this.streamUrl) {
throw new Error("The task has no stream Url defined.")
}
this.#reader = Task.getReader(this.streamUrl)
const task = this
const onNext = this.#reader.onNext
this.#reader.onNext = function({ done, value }) {
if (value && typeof value === "object") {
if (
task.status === TaskStatus.init ||
task.status === TaskStatus.pending ||
task.status === TaskStatus.waiting
) {
task._setStatus(TaskStatus.processing)
}
if ("step" in value && "total_steps" in value) {
task.step = value.step
task.total_steps = value.total_steps
}
}
return onNext.call(this, { done, value })
}
this.#reader.onComplete = function(value) {
task.result = value
if (task.isPending) {
task._setStatus(TaskStatus.completed)
}
return value
}
this.#reader.onError = function(response) {
const err = new Error(response.statusText)
task.abort(err)
throw err
}
return this.#reader
}
async waitUntil({ timeout = -1, callback, status, signal }) {
const currentIdx = TASK_STATUS_ORDER.indexOf(this.#status)
if (currentIdx <= 0) {
return false
}
const stIdx = status ? TASK_STATUS_ORDER.indexOf(status) : currentIdx + 1
if (stIdx >= 0 && stIdx <= currentIdx) {
return true
}
if (stIdx < 0 && currentIdx < 0) {
return this.#status === (status || TaskStatus.completed)
}
if (signal?.aborted) {
return false
}
const task = this
switch (this.#status) {
case TaskStatus.pending:
case TaskStatus.waiting:
// Wait for server status to include this task.
await waitUntil(
async () => {
if (
task.#id &&
typeof serverState.tasks === "object" &&
Object.keys(serverState.tasks).includes(String(task.#id))
) {
return true
}
if ((await Promise.resolve(callback?.call(task))) || signal?.aborted) {
return true
}
},
TASK_STATE_SERVER_UPDATE_DELAY,
timeout
)
if (
this.#id &&
typeof serverState.tasks === "object" &&
Object.keys(serverState.tasks).includes(String(task.#id))
) {
this._setStatus(TaskStatus.waiting)
}
if ((await Promise.resolve(callback?.call(this))) || signal?.aborted) {
return false
}
if (stIdx >= 0 && stIdx <= TASK_STATUS_ORDER.indexOf(TaskStatus.waiting)) {
return true
}
// Wait for task to start on server.
await waitUntil(
async () => {
if (
typeof serverState.tasks !== "object" ||
serverState.tasks[String(task.#id)] !== "pending"
) {
return true
}
if ((await Promise.resolve(callback?.call(task))) || signal?.aborted) {
return true
}
},
TASK_STATE_SERVER_UPDATE_DELAY,
timeout
)
const state =
typeof serverState.tasks === "object" ? serverState.tasks[String(task.#id)] : undefined
if (state === "running" || state === "buffer" || state === "completed") {
this._setStatus(TaskStatus.processing)
}
if ((await Promise.resolve(callback?.call(task))) || signal?.aborted) {
return false
}
if (stIdx >= 0 && stIdx <= TASK_STATUS_ORDER.indexOf(TaskStatus.processing)) {
return true
}
case TaskStatus.processing:
await waitUntil(
async () => {
if (
typeof serverState.tasks !== "object" ||
serverState.tasks[String(task.#id)] !== "running"
) {
return true
}
if ((await Promise.resolve(callback?.call(task))) || signal?.aborted) {
return true
}
},
TASK_STATE_SERVER_UPDATE_DELAY,
timeout
)
await Promise.resolve(callback?.call(this))
default:
return this.#status === (status || TaskStatus.completed)
}
}
async enqueue(promiseGenerator, ...args) {
if (this.status !== TaskStatus.init) {
throw new Error(`Task is in an invalid status ${this.status} to add to queue.`)
}
this._setStatus(TaskStatus.pending)
task_queue.set(this, promiseGenerator)
await eventSource.fireEvent(EVENT_TASK_QUEUED, { task: this })
await Task.enqueue(promiseGenerator, ...args)
await this.waitUntil({ status: TaskStatus.completed })
if (this.exception) {
throw this.exception
}
return this.result
}
static async enqueue(promiseGenerator, ...args) {
if (typeof promiseGenerator === "undefined") {
throw new Error("To enqueue a concurrent task, a *Promise Generator is needed but undefined was found.")
}
//if (Symbol.asyncIterator in result || Symbol.iterator in result) {
//concurrent_generators.set(result, Promise.resolve(args))
if (typeof promiseGenerator === "function") {
concurrent_generators.set(asGenerator({ callback: promiseGenerator }), Promise.resolve(args))
} else {
concurrent_generators.set(promiseGenerator, Promise.resolve(args))
}
await waitUntil(() => !concurrent_generators.has(promiseGenerator), CONCURRENT_TASK_INTERVAL)
return weak_results.get(promiseGenerator)
}
static enqueueNew(task, classCtor, progressCallback) {
if (task.status !== TaskStatus.init) {
throw new Error("Task has an invalid status to add to queue.")
}
if (!(task instanceof classCtor)) {
throw new Error("Task is not a instance of classCtor.")
}
let promiseGenerator = undefined
if (typeof progressCallback === "undefined") {
promiseGenerator = classCtor.start(task)
} else if (typeof progressCallback === "function") {
promiseGenerator = classCtor.start(task, progressCallback)
} else {
throw new Error("progressCallback is not a function.")
}
return Task.prototype.enqueue.call(task, promiseGenerator)
}
static async run(promiseGenerator, { callback, signal, timeout = -1 } = {}) {
let value = undefined
let done = undefined
if (timeout < 0) {
timeout = Number.MAX_SAFE_INTEGER
}
timeout = Date.now() + timeout
do {
;({ value, done } = await Promise.resolve(promiseGenerator.next(value)))
if (value instanceof Promise) {
value = await value
}
if (callback) {
;({ value, done } = await Promise.resolve(callback.call(promiseGenerator, { value, done })))
}
if (value instanceof Promise) {
value = await value
}
} while (!done && !signal?.aborted && timeout > Date.now())
return value
}
static async *asGenerator({ callback, generator, signal, timeout = -1 } = {}) {
let value = undefined
let done = undefined
if (timeout < 0) {
timeout = Number.MAX_SAFE_INTEGER
}
timeout = Date.now() + timeout
do {
;({ value, done } = await Promise.resolve(generator.next(value)))
if (value instanceof Promise) {
value = await value
}
if (callback) {
;({ value, done } = await Promise.resolve(callback.call(generator, { value, done })))
if (value instanceof Promise) {
value = await value
}
}
value = yield value
} while (!done && !signal?.aborted && timeout > Date.now())
return value
}
}
const TASK_REQUIRED = {
session_id: "string",
prompt: "string",
negative_prompt: "string",
width: "number",
height: "number",
seed: "number",
sampler_name: "string",
use_stable_diffusion_model: "string",
clip_skip: "boolean",
num_inference_steps: "number",
guidance_scale: "number",
num_outputs: "number",
stream_progress_updates: "boolean",
stream_image_progress: "boolean",
show_only_filtered_image: "boolean",
output_format: "string",
output_quality: "number",
}
const TASK_DEFAULTS = {
sampler_name: "plms",
use_stable_diffusion_model: "sd-v1-4",
clip_skip: false,
num_inference_steps: 50,
guidance_scale: 7.5,
negative_prompt: "",
num_outputs: 1,
stream_progress_updates: true,
stream_image_progress: true,
show_only_filtered_image: true,
block_nsfw: false,
output_format: "png",
output_quality: 75,
output_lossless: false,
}
const TASK_OPTIONAL = {
device: "string",
init_image: "string",
mask: "string",
save_to_disk_path: "string",
use_face_correction: "string",
use_upscale: "string",
use_vae_model: "string",
use_hypernetwork_model: "string",
hypernetwork_strength: "number",
output_lossless: "boolean",
tiling: "string",
}
// Higher values will result in...
// pytorch_lightning/utilities/seed.py:60: UserWarning: X is not in bounds, numpy accepts from 0 to 4294967295
const MAX_SEED_VALUE = 4294967295
class RenderTask extends Task {
constructor(options = {}) {
super(options)
if (typeof this._reqBody.seed === "undefined") {
this._reqBody.seed = Math.floor(Math.random() * (MAX_SEED_VALUE + 1))
}
if (
typeof typeof this._reqBody.seed === "number" &&
(this._reqBody.seed > MAX_SEED_VALUE || this._reqBody.seed < 0)
) {
throw new Error(`seed must be in range 0 to ${MAX_SEED_VALUE}.`)
}
if ("use_cpu" in this._reqBody) {
if (this._reqBody.use_cpu) {
this._reqBody.device = "cpu"
}
delete this._reqBody.use_cpu
}
if (this._reqBody.init_image) {
if (typeof this._reqBody.prompt_strength === "undefined") {
this._reqBody.prompt_strength = 0.8
} else if (typeof this._reqBody.prompt_strength !== "number") {
throw new Error(
`prompt_strength need to be of type number but ${typeof this._reqBody
.prompt_strength} was found.`
)
}
}
if ("modifiers" in this._reqBody) {
if (Array.isArray(this._reqBody.modifiers) && this._reqBody.modifiers.length > 0) {
this._reqBody.modifiers = this._reqBody.modifiers.filter((val) => val.trim())
if (this._reqBody.modifiers.length > 0) {
this._reqBody.prompt = `${this._reqBody.prompt}, ${this._reqBody.modifiers.join(", ")}`
}
}
if (typeof this._reqBody.modifiers === "string" && this._reqBody.modifiers.length > 0) {
this._reqBody.modifiers = this._reqBody.modifiers.trim()
if (this._reqBody.modifiers.length > 0) {
this._reqBody.prompt = `${this._reqBody.prompt}, ${this._reqBody.modifiers}`
}
}
delete this._reqBody.modifiers
}
this.checkReqBody()
}
checkReqBody() {
for (const key in TASK_DEFAULTS) {
if (typeof this._reqBody[key] === "undefined") {
this._reqBody[key] = TASK_DEFAULTS[key]
}
}
for (const key in TASK_REQUIRED) {
if (typeof this._reqBody[key] !== TASK_REQUIRED[key]) {
throw new Error(
`${key} need to be of type ${TASK_REQUIRED[key]} but ${typeof this._reqBody[key]} was found.`
)
}
}
for (const key in this._reqBody) {
if (key in TASK_REQUIRED) {
continue
}
if (key in TASK_OPTIONAL) {
if (typeof this._reqBody[key] == "undefined") {
delete this._reqBody[key]
console.warn(`reqBody[${key}] was set to undefined. Removing optional key without value...`)
continue
}
if (typeof this._reqBody[key] !== TASK_OPTIONAL[key]) {
throw new Error(
`${key} need to be of type ${TASK_OPTIONAL[key]} but ${typeof this._reqBody[
key
]} was found.`
)
}
}
}
}
/** Send current task to server.
* @param {*} [timeout=-1] Optional timeout value in ms
* @returns the response from the render request.
* @memberof Task
*/
async post(timeout = -1) {
performance.mark("make-render-request")
if (performance.getEntriesByName("click-makeImage", "mark").length > 0) {
performance.measure("diff", "click-makeImage", "make-render-request")
console.log(
"delay between clicking and making the server request:",
performance.getEntriesByName("diff", "measure")[0].duration + " ms"
)
}
let jsonResponse = await super.post("/render", timeout)
if (typeof jsonResponse?.task !== "number") {
console.warn("Endpoint error response: ", jsonResponse)
const event = Object.assign({ task: this }, jsonResponse)
await eventSource.fireEvent(EVENT_UNEXPECTED_RESPONSE, event)
if ("continueWith" in event) {
jsonResponse = await Promise.resolve(event.continueWith)
}
if (typeof jsonResponse?.task !== "number") {
const err = new Error(jsonResponse?.detail || "Endpoint response does not contains a task ID.")
this.abort(err)
throw err
}
}
this._setId(jsonResponse.task)
if (jsonResponse.stream) {
this.streamUrl = jsonResponse.stream
}
this._setStatus(TaskStatus.waiting)
return jsonResponse
}
enqueue(progressCallback) {
return Task.enqueueNew(this, RenderTask, progressCallback)
}
*start(progressCallback) {
if (typeof progressCallback !== "undefined" && typeof progressCallback !== "function") {
throw new Error("progressCallback is not a function. progressCallback type: " + typeof progressCallback)
}
if (this.isStopped) {
return
}
this._setStatus(TaskStatus.pending)
progressCallback?.call(this, { reqBody: this._reqBody })
Object.freeze(this._reqBody)
// Post task request to backend
let renderRequest = undefined
try {
renderRequest = yield this.post()
yield progressCallback?.call(this, { renderResponse: renderRequest })
} catch (e) {
yield progressCallback?.call(this, { detail: e.message })
throw e
}
try {
// Wait for task to start on server.
yield this.waitUntil({
callback: function() {
return progressCallback?.call(this, {})
},
status: TaskStatus.processing,
})
} catch (e) {
this.abort(err)
throw e
}
// Update class status and callback.
const taskState = typeof serverState.tasks === "object" ? serverState.tasks[String(this.id)] : undefined
switch (taskState) {
case "pending": // Session has pending tasks.
console.error("Server %o render request %o is still waiting.", serverState, renderRequest)
//Only update status if not already set by waitUntil
if (this.status === TaskStatus.init || this.status === TaskStatus.pending) {
// Set status as Waiting in backend.
this._setStatus(TaskStatus.waiting)
}
break
case "running":
case "buffer":
// Normal expected messages.
this._setStatus(TaskStatus.processing)
break
case "completed":
if (this.isPending) {
// Set state to processing until we read the reply
this._setStatus(TaskStatus.processing)
}
console.warn("Server %o render request %o completed unexpectedly", serverState, renderRequest)
break // Continue anyway to try to read cached result.
case "error":
this._setStatus(TaskStatus.failed)
console.error("Server %o render request %o has failed", serverState, renderRequest)
break // Still valid, Update UI with error message
case "stopped":
this._setStatus(TaskStatus.stopped)
console.log("Server %o render request %o was stopped", serverState, renderRequest)
return false
default:
if (!progressCallback) {
const err = new Error("Unexpected server task state: " + taskState || "Undefined")
this.abort(err)
throw err
}
const response = yield progressCallback.call(this, {})
if (response instanceof Error) {
this.abort(response)
throw response
}
if (!response) {
return false
}
}
// Task started!
// Open the reader.
const reader = this.reader
const task = this
reader.onError = function(response) {
if (progressCallback) {
task.abort(new Error(response.statusText))
return progressCallback.call(task, { response, reader })
}
return Task.prototype.onError.call(task, response)
}
yield progressCallback?.call(this, { reader })
//Start streaming the results.
const streamGenerator = reader.open()
let value = undefined
let done = undefined
yield progressCallback?.call(this, { stream: streamGenerator })
do {
;({ value, done } = yield streamGenerator.next())
if (typeof value !== "object") {
continue
}
yield progressCallback?.call(this, { update: value })
} while (!done)
return value
}
static start(task, progressCallback) {
if (typeof task !== "object") {
throw new Error("task is not an object. task type: " + typeof task)
}
if (!(task instanceof Task)) {
if (task.reqBody) {
task = new RenderTask(task.reqBody)
} else {
task = new RenderTask(task)
}
}
return task.start(progressCallback)
}
static run(task, progressCallback) {
const promiseGenerator = RenderTask.start(task, progressCallback)
return Task.run(promiseGenerator)
}
}
class FilterTask extends Task {
constructor(options = {}) {}
/** Send current task to server.
* @param {*} [timeout=-1] Optional timeout value in ms
* @returns the response from the render request.
* @memberof Task
*/
async post(timeout = -1) {
let jsonResponse = await super.post("/filter", timeout)
//this._setId(jsonResponse.task)
this._setStatus(TaskStatus.waiting)
}
enqueue(progressCallback) {
return Task.enqueueNew(this, FilterTask, progressCallback)
}
*start(progressCallback) {
if (typeof progressCallback !== "undefined" && typeof progressCallback !== "function") {
throw new Error("progressCallback is not a function. progressCallback type: " + typeof progressCallback)
}
if (this.isStopped) {
return
}
}
static start(task, progressCallback) {
if (typeof task !== "object") {
throw new Error("task is not an object. task type: " + typeof task)
}
if (!(task instanceof Task)) {
if (task.reqBody) {
task = new FilterTask(task.reqBody)
} else {
task = new FilterTask(task)
}
}
return task.start(progressCallback)
}
static run(task, progressCallback) {
const promiseGenerator = FilterTask.start(task, progressCallback)
return Task.run(promiseGenerator)
}
}
const getSystemInfo = debounce(
async function() {
let systemInfo = {
devices: {
all: {},
active: {},
},
hosts: [],
}
try {
const res = await fetch("/get/system_info")
if (!res.ok) {
console.error("Invalid response fetching devices", res.statusText)
return systemInfo
}
systemInfo = await res.json()
} catch (e) {
console.error("error fetching system info", e)
}
return systemInfo
},
250,
true
)
async function getDevices() {
let systemInfo = getSystemInfo()
return systemInfo.devices
}
async function getHosts() {
let systemInfo = getSystemInfo()
return systemInfo.hosts
}
async function getModels() {
let models = {
"stable-diffusion": [],
vae: [],
}
try {
const res = await fetch("/get/models")
if (!res.ok) {
console.error("Invalid response fetching models", res.statusText)
return models
}
models = await res.json()
console.log("get models response", models)
} catch (e) {
console.log("get models error", e)
}
return models
}
function getServerCapacity() {
let activeDevicesCount = Object.keys(serverState?.devices?.active || {}).length
if (typeof window === "object" && window.document.visibilityState === "hidden") {
activeDevicesCount = 1 + activeDevicesCount
}
return activeDevicesCount
}
let idleEventPromise = undefined
function continueTasks() {
if (typeof navigator?.scheduling?.isInputPending === "function") {
const inputPendingOptions = {
// Report mouse/pointer move events when queue is empty.
// Delay idle after mouse moves stops.
includeContinuous: Boolean(task_queue.size <= 0 && concurrent_generators.size <= 0),
}
if (navigator.scheduling.isInputPending(inputPendingOptions)) {
// Browser/User still active.
return asyncDelay(CONCURRENT_TASK_INTERVAL)
}
}
const serverCapacity = getServerCapacity()
if (task_queue.size <= 0 && concurrent_generators.size <= 0) {
if (!idleEventPromise?.isPending) {
idleEventPromise = makeQuerablePromise(
eventSource.fireEvent(EVENT_IDLE, { capacity: serverCapacity, idle: true })
)
}
// Calling idle could result in task being added to queue.
// if (task_queue.size <= 0 && concurrent_generators.size <= 0) {
// return asyncDelay(IDLE_COOLDOWN).then(() => idleEventPromise)
// }
}
if (task_queue.size < serverCapacity) {
if (!idleEventPromise?.isPending) {
idleEventPromise = makeQuerablePromise(
eventSource.fireEvent(EVENT_IDLE, { capacity: serverCapacity - task_queue.size })
)
}
}
const completedTasks = []
for (let [generator, promise] of concurrent_generators.entries()) {
if (promise.isPending) {
continue
}
let value = promise.resolvedValue?.value || promise.resolvedValue
if (promise.isRejected) {
console.error(promise.rejectReason)
const event = { generator, reason: promise.rejectReason }
eventSource.fireEvent(EVENT_UNHANDLED_REJECTION, event)
if ("continueWith" in event) {
value = Promise.resolve(event.continueWith)
} else {
concurrent_generators.delete(generator)
completedTasks.push({ generator, promise })
continue
}
}
if (value instanceof Promise) {
promise = makeQuerablePromise(value.then((val) => ({ done: promise.resolvedValue?.done, value: val })))
concurrent_generators.set(generator, promise)
continue
}
weak_results.set(generator, value)
if (promise.resolvedValue?.done) {
concurrent_generators.delete(generator)
completedTasks.push({ generator, promise })
continue
}
promise = generator.next(value)
if (!(promise instanceof Promise)) {
promise = Promise.resolve(promise)
}
promise = makeQuerablePromise(promise)
concurrent_generators.set(generator, promise)
}
for (let [task, generator] of task_queue.entries()) {
const cTsk = completedTasks.find((item) => item.generator === generator)
if (cTsk?.promise?.rejectReason || task.hasFailed) {
eventSource.fireEvent(EVENT_TASK_ERROR, {
task,
generator,
reason: cTsk?.promise?.rejectReason || task.exception,
})
task_queue.delete(task)
continue
}
if (task.isCompleted || task.isStopped || cTsk) {
const eventEndArgs = { task, generator }
if (task.isStopped) {
eventEndArgs.stopped = true
}
eventSource.fireEvent(EVENT_TASK_END, eventEndArgs)
task_queue.delete(task)
continue
}
if (concurrent_generators.size > serverCapacity) {
break
}
if (!generator) {
if (typeof task.start === "function") {
generator = task.start()
}
} else if (concurrent_generators.has(generator)) {
continue
}
const event = { task, generator }
const beforeStart = eventSource.fireEvent(EVENT_TASK_START, event) // optional beforeStart promise to wait on before starting task.
const promise = makeQuerablePromise(beforeStart.then(() => Promise.resolve(event.beforeStart)))
concurrent_generators.set(event.generator, promise)
task_queue.set(task, event.generator)
}
const promises = Array.from(concurrent_generators.values())
if (promises.length <= 0) {
return asyncDelay(CONCURRENT_TASK_INTERVAL)
}
return Promise.race(promises).finally(continueTasks)
}
let taskPromise = undefined
function startCheck() {
if (taskPromise?.isPending) {
return
}
do {
if (taskPromise?.resolvedValue instanceof Promise) {
taskPromise = makeQuerablePromise(taskPromise.resolvedValue)
continue
}
if (typeof navigator?.scheduling?.isInputPending === "function" && navigator.scheduling.isInputPending()) {
return
}
const continuePromise = continueTasks().catch(async function(err) {
console.error(err)
await eventSource.fireEvent(EVENT_UNHANDLED_REJECTION, { reason: err })
await asyncDelay(RETRY_DELAY_ON_ERROR)
})
taskPromise = makeQuerablePromise(continuePromise)
} while (taskPromise?.isResolved)
}
const SD = {
ChunkedStreamReader,
ServerStates,
TaskStatus,
Task,
RenderTask,
FilterTask,
Events: EVENTS_TYPES,
init: async function(options = {}) {
if ("events" in options) {
for (const key in options.events) {
eventSource.addEventListener(key, options.events[key])
}
}
await healthCheck()
setInterval(healthCheck, HEALTH_PING_INTERVAL)
setInterval(startCheck, CONCURRENT_TASK_INTERVAL)
},
/** Add a new event listener
*/
addEventListener: (...args) => eventSource.addEventListener(...args),
/** Remove the event listener
*/
removeEventListener: (...args) => eventSource.removeEventListener(...args),
isServerAvailable,
getServerCapacity,
getSystemInfo,
getDevices,
getHosts,
getModels,
render: (...args) => RenderTask.run(...args),
filter: (...args) => FilterTask.run(...args),
waitUntil,
}
Object.defineProperties(SD, {
serverState: {
configurable: false,
get: () => serverState,
},
isAvailable: {
configurable: false,
get: () => isServerAvailable(),
},
serverCapacity: {
configurable: false,
get: () => getServerCapacity(),
},
sessionId: {
configurable: false,
get: () => sessionId,
set: (val) => {
if (typeof val === "undefined") {
throw new Error("Can't set sessionId to undefined.")
}
sessionId = val
},
},
MAX_SEED_VALUE: {
configurable: false,
get: () => MAX_SEED_VALUE,
},
activeTasks: {
configurable: false,
get: () => task_queue,
},
})
Object.defineProperties(getGlobal(), {
SD: {
configurable: false,
get: () => SD,
},
sessionId: {
//TODO Remove in the future in favor of SD.sessionId
configurable: false,
get: () => {
console.warn("Deprecated window.sessionId has been replaced with SD.sessionId.")
console.trace()
return SD.sessionId
},
set: (val) => {
console.warn("Deprecated window.sessionId has been replaced with SD.sessionId.")
console.trace()
SD.sessionId = val
},
},
})
})()