import { Platform, Setting } from 'obsidian'
import type { LocatorSettings } from './utils'
import { saveSettings } from './utils'
import { htmlDescription } from './utils'
import type LocatorPlugin from 'src/main'

export function injectSettingsHttp(
  plugin: LocatorPlugin,
  settings: LocatorSettings,
  containerEl: HTMLElement
) {
  if (!Platform.isMobile) {
    new Setting(containerEl)
      .setName('API Access Through HTTP')
      .setHeading()
      .setDesc(
        htmlDescription(
          `Locator can be used through a simple HTTP server (<a href="https://publish.obsidian.md/locator/Public+API+%26+URL+Scheme#HTTP+Server">more information</a>).`
        )
      )

    new Setting(containerEl)
      .setName('Enable the HTTP server')
      .addToggle(toggle =>
        toggle.setValue(settings.httpApiEnabled).onChange(async v => {
          settings.httpApiEnabled = v
          if (v) {
            plugin.apiHttpServer.listen(settings.httpApiPort)
          } else {
            plugin.apiHttpServer.close()
          }
          await saveSettings(plugin)
        })
      )

    new Setting(containerEl).setName('HTTP Port').addText(component => {
      component
        .setValue(settings.httpApiPort)
        .setPlaceholder('51361')
        .onChange(async v => {
          if (parseInt(v) > 65535) {
            v = settings.httpApiPort
            component.setValue(settings.httpApiPort)
          }
          settings.httpApiPort = v
          if (settings.httpApiEnabled) {
            plugin.apiHttpServer.close()
            plugin.apiHttpServer.listen(settings.httpApiPort)
          }
          await saveSettings(plugin)
        })
    })
  }
}
