File size: 7,734 Bytes
4450790
1
{"version":3,"file":"userSelection-C6c30qSU.js","sources":["../../src/scripts/ui/spinner.ts","../../src/scripts/ui/userSelection.ts"],"sourcesContent":["import './spinner.css'\n\nexport function createSpinner() {\n  const div = document.createElement('div')\n  div.innerHTML = `<div class=\"lds-ring\"><div></div><div></div><div></div><div></div></div>`\n  return div.firstElementChild\n}\n","// @ts-strict-ignore\nimport { api } from '../api'\nimport { $el } from '../ui'\nimport { createSpinner } from './spinner'\nimport './userSelection.css'\n\ninterface SelectedUser {\n  username: string\n  userId: string\n  created: boolean\n}\n\nexport class UserSelectionScreen {\n  async show(users, user): Promise<SelectedUser> {\n    const userSelection = document.getElementById('comfy-user-selection')\n    userSelection.style.display = ''\n    return new Promise((resolve) => {\n      const input = userSelection.getElementsByTagName('input')[0]\n      const select = userSelection.getElementsByTagName('select')[0]\n      const inputSection = input.closest('section')\n      const selectSection = select.closest('section')\n      const form = userSelection.getElementsByTagName('form')[0]\n      const error = userSelection.getElementsByClassName('comfy-user-error')[0]\n      const button = userSelection.getElementsByClassName(\n        'comfy-user-button-next'\n      )[0]\n\n      let inputActive = null\n      input.addEventListener('focus', () => {\n        inputSection.classList.add('selected')\n        selectSection.classList.remove('selected')\n        inputActive = true\n      })\n      select.addEventListener('focus', () => {\n        inputSection.classList.remove('selected')\n        selectSection.classList.add('selected')\n        inputActive = false\n        select.style.color = ''\n      })\n      select.addEventListener('blur', () => {\n        if (!select.value) {\n          select.style.color = 'var(--descrip-text)'\n        }\n      })\n\n      form.addEventListener('submit', async (e) => {\n        e.preventDefault()\n        if (inputActive == null) {\n          error.textContent =\n            'Please enter a username or select an existing user.'\n        } else if (inputActive) {\n          const username = input.value.trim()\n          if (!username) {\n            error.textContent = 'Please enter a username.'\n            return\n          }\n\n          // Create new user\n          // Property 'readonly' does not exist on type 'HTMLSelectElement'.ts(2339)\n          // Property 'readonly' does not exist on type 'HTMLInputElement'. Did you mean 'readOnly'?ts(2551)\n          input.disabled =\n            select.disabled =\n            // @ts-expect-error\n            input.readonly =\n            // @ts-expect-error\n            select.readonly =\n              true\n          const spinner = createSpinner()\n          button.prepend(spinner)\n          try {\n            const resp = await api.createUser(username)\n            if (resp.status >= 300) {\n              let message =\n                'Error creating user: ' + resp.status + ' ' + resp.statusText\n              try {\n                const res = await resp.json()\n                if (res.error) {\n                  message = res.error\n                }\n              } catch (error) {}\n              throw new Error(message)\n            }\n\n            resolve({ username, userId: await resp.json(), created: true })\n          } catch (err) {\n            spinner.remove()\n            error.textContent =\n              err.message ??\n              err.statusText ??\n              err ??\n              'An unknown error occurred.'\n            // Property 'readonly' does not exist on type 'HTMLSelectElement'.ts(2339)\n            // Property 'readonly' does not exist on type 'HTMLInputElement'. Did you mean 'readOnly'?ts(2551)\n            input.disabled =\n              select.disabled =\n              // @ts-expect-error\n              input.readonly =\n              // @ts-expect-error\n              select.readonly =\n                false\n            return\n          }\n        } else if (!select.value) {\n          error.textContent = 'Please select an existing user.'\n          return\n        } else {\n          resolve({\n            username: users[select.value],\n            userId: select.value,\n            created: false\n          })\n        }\n      })\n\n      if (user) {\n        const name = localStorage['Comfy.userName']\n        if (name) {\n          input.value = name\n        }\n      }\n      if (input.value) {\n        // Focus the input, do this separately as sometimes browsers like to fill in the value\n        input.focus()\n      }\n\n      const userIds = Object.keys(users ?? {})\n      if (userIds.length) {\n        for (const u of userIds) {\n          $el('option', { textContent: users[u], value: u, parent: select })\n        }\n        select.style.color = 'var(--descrip-text)'\n\n        if (select.value) {\n          // Focus the select, do this separately as sometimes browsers like to fill in the value\n          select.focus()\n        }\n      } else {\n        userSelection.classList.add('no-users')\n        input.focus()\n      }\n    }).then((r: SelectedUser) => {\n      userSelection.remove()\n      return r\n    })\n  }\n}\n"],"names":["error"],"mappings":"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"}