You can access Stable Diffusion UI from other devices in your network. To do this, enable network access in the settings
- above, and open Stable Diffusion UI in a browser using the server's IP. You can use this button to get your server's address.
-
-
+
+
+
+
+
+
+
+
+
@@ -358,7 +359,7 @@ async function init() {
await getAppConfig()
await loadModifiers()
await loadUIPlugins()
- await getDevices()
+ await getSystemInfo()
setInterval(healthCheck, HEALTH_PING_INTERVAL * 1000)
healthCheck()
diff --git a/ui/media/js/main.js b/ui/media/js/main.js
index 2a10166f..dab71f34 100644
--- a/ui/media/js/main.js
+++ b/ui/media/js/main.js
@@ -196,34 +196,6 @@ function playSound() {
})
}
}
-function setSystemInfo(devices) {
- let cpu = devices.all.cpu.name
- let allGPUs = Object.keys(devices.all).filter(d => d != 'cpu')
- let activeGPUs = Object.keys(devices.active)
-
- function ID_TO_TEXT(d) {
- let info = devices.all[d]
- if ("mem_free" in info && "mem_total" in info) {
- return `${info.name} (${d}) (${info.mem_free.toFixed(1)}Gb free / ${info.mem_total.toFixed(1)} Gb total)`
- } else {
- return `${info.name} (${d}) (no memory info)`
- }
- }
-
- allGPUs = allGPUs.map(ID_TO_TEXT)
- activeGPUs = activeGPUs.map(ID_TO_TEXT)
-
- let systemInfo = `
-
-
${cpu}
-
${allGPUs.join('')}
-
-
${activeGPUs.join('')}
-
`
-
- let systemInfoEl = document.querySelector('#system-info')
- systemInfoEl.innerHTML = systemInfo
-}
async function healthCheck() {
try {
@@ -258,7 +230,7 @@ async function healthCheck() {
break
}
if (serverState.devices) {
- setSystemInfo(serverState.devices)
+ setDeviceInfo(serverState.devices)
}
serverState.time = Date.now()
} catch (e) {
diff --git a/ui/media/js/parameters.js b/ui/media/js/parameters.js
index f8b1aaa4..62203002 100644
--- a/ui/media/js/parameters.js
+++ b/ui/media/js/parameters.js
@@ -219,9 +219,6 @@ let confirmDangerousActionsField = document.querySelector("#confirm_dangerous_ac
let saveSettingsBtn = document.querySelector('#save-system-settings-btn')
-let getServerIPBtn = document.querySelector('#get-server-ip')
-let ipInfoContainer = document.querySelector('#ip-info')
-
async function changeAppConfig(configDelta) {
try {
@@ -340,14 +337,45 @@ async function getDiskPath() {
}
}
-async function getDevices() {
+function setDeviceInfo(devices) {
+ let cpu = devices.all.cpu.name
+ let allGPUs = Object.keys(devices.all).filter(d => d != 'cpu')
+ let activeGPUs = Object.keys(devices.active)
+
+ function ID_TO_TEXT(d) {
+ let info = devices.all[d]
+ if ("mem_free" in info && "mem_total" in info) {
+ return `${info.name} (${d}) (${info.mem_free.toFixed(1)}Gb free / ${info.mem_total.toFixed(1)} Gb total)`
+ } else {
+ return `${info.name} (${d}) (no memory info)`
+ }
+ }
+
+ allGPUs = allGPUs.map(ID_TO_TEXT)
+ activeGPUs = activeGPUs.map(ID_TO_TEXT)
+
+ let systemInfoEl = document.querySelector('#system-info')
+ systemInfoEl.querySelector('#system-info-cpu').innerText = cpu
+ systemInfoEl.querySelector('#system-info-gpus-all').innerHTML = allGPUs.join('')
+ systemInfoEl.querySelector('#system-info-rendering-devices').innerHTML = activeGPUs.join('')
+}
+
+function setHostInfo(hosts) {
+ let port = listenPortField.value
+ hosts = hosts.map(addr => `http://${addr}:${port}/`).map(url => `
`)
+ document.querySelector('#system-info-server-hosts').innerHTML = hosts.join('')
+}
+
+async function getSystemInfo() {
try {
- let res = await fetch('/get/devices')
+ let res = await fetch('/get/system_info')
if (res.status === 200) {
res = await res.json()
+ let devices = res['devices']
+ let hosts = res['hosts']
- let allDeviceIds = Object.keys(res['all']).filter(d => d !== 'cpu')
- let activeDeviceIds = Object.keys(res['active']).filter(d => d !== 'cpu')
+ let allDeviceIds = Object.keys(devices['all']).filter(d => d !== 'cpu')
+ let activeDeviceIds = Object.keys(devices['active']).filter(d => d !== 'cpu')
if (activeDeviceIds.length === 0) {
useCPUField.checked = true
@@ -365,11 +393,11 @@ async function getDevices() {
useCPUField.disabled = true // no compatible GPUs, so make the CPU mandatory
}
- autoPickGPUsField.checked = (res['config'] === 'auto')
+ autoPickGPUsField.checked = (devices['config'] === 'auto')
useGPUsField.innerHTML = ''
allDeviceIds.forEach(device => {
- let deviceName = res['all'][device]['name']
+ let deviceName = devices['all'][device]['name']
let deviceOption = ``
useGPUsField.insertAdjacentHTML('beforeend', deviceOption)
})
@@ -380,6 +408,9 @@ async function getDevices() {
} else {
$('#use_gpus').val(activeDeviceIds)
}
+
+ setDeviceInfo(devices)
+ setHostInfo(hosts)
}
} catch (e) {
console.log('error fetching devices', e)
@@ -407,17 +438,3 @@ saveSettingsBtn.addEventListener('click', function() {
saveSettingsBtn.classList.add('active')
asyncDelay(300).then(() => saveSettingsBtn.classList.remove('active'))
})
-
-getServerIPBtn.addEventListener('click', async function() {
- ipInfoContainer.innerHTML = "Retrieving server addresses..."
- let list = "
List of server addresses
If there is more than one result, not all of them might be reachable from other devices.
"
- let res = await fetch('/get/ip_config')
- let data = await res.json()
- let port = listenPortField.value
- // Merge hostname (field 0) into list of IPs (field 2)
- data[2].push(data[0])
- data[2].forEach((addr) => { let url=`http://${addr}:${port}/`; list+=`