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