wikijs/views/configure/index.pug

doctype html
html
  head
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    meta(charset='UTF-8')
    title Wiki.js | Configure

    // Favicon
    each favsize in [32, 96, 16]
      link(rel='icon', type='image/png', sizes=favsize + 'x' + favsize, href='/favicons/favicon-' + favsize + 'x' + favsize + '.png')

    // CSS
    link(type='text/css', rel='stylesheet', href='/css/libs.css')
    link(type='text/css', rel='stylesheet', href='/css/configure.css')

    // JS
    script(type='text/javascript', src='/js/libs.js')
    script(type='text/javascript', src='/js/configure.js')

    block head

  body
    #root
      #header-container
        nav.nav#header
          .nav-left
            a.nav-item
              h1
                i.icon-layers
                | Wiki.js
      main
        .container
          transition(name='tst-welcome')
            .welcome(style={'padding-bottom': '5px'}, v-if='state === "welcome"')
              img(src='/favicons/android-icon-96x96.png', alt='Wiki.js')
              h1 Welcome to Wiki.js!
              h2(style={'margin-bottom': 0}) A modern, lightweight and powerful wiki app built on NodeJS, Git and Markdown
          .content(v-cloak)
            template(v-if='state === "welcome"')
              .panel
                h2.panel-title.is-featured
                  span Introduction
                  i(v-if='loading')
                .panel-content.is-text
                  p This installation wizard will guide you through the steps needed to get your wiki up and running in no time!
                  p Detailed information about installation and usage can be found on the #[a(href='https://docs.wiki.requarks.io/') official documentation site]. #[br] Should you have any question or would like to report something that doesn't look right, feel free to create a new issue on the #[a(href='https://github.com/Requarks/wiki/issues') GitHub project].
                .panel-footer
                  button.button.is-indigo(v-on:click='proceedToSyscheck', v-bind:disabled='loading') Start

            template(v-else-if='state === "syscheck"')
              .panel
                h2.panel-title.is-featured
                  span System Check
                  i(v-if='loading')
                .panel-content.is-text
                  p(v-if='loading') #[i.icon-loader.animated.rotateIn.infinite] Checking your system for compatibility...
                  p(v-if='!loading && syscheck.ok') #[i.icon-check] Looks great! No issues so far.
                  p(v-if='!loading && !syscheck.ok') #[i.icon-square-cross] Error: {{ syscheck.error }}
                .panel-footer
                  button.button.is-indigo.is-outlined(v-on:click='proceedToWelcome', v-bind:disabled='loading') Back
                  button.button.is-teal(v-on:click='proceedToSyscheck', v-if='!loading && !syscheck.ok') Check Again
                  button.button.is-indigo(v-on:click='proceedToGeneral', v-if='loading || syscheck.ok', v-bind:disabled='loading') Continue

            template(v-else-if='state === "general"')
              .panel
                h2.panel-title.is-featured
                  span General
                  i(v-if='loading')
                .panel-content.form-sections
                  section
                    p.control.is-fullwidth
                      label.label Site Title
                      input(type='text', placeholder='e.g. Wiki', v-model='conf.title')
                      p.desc The site title will appear in the top left corner on every page and within the window title bar.
                  section
                    p.control.is-fullwidth
                      label.label Host
                      input(type='text', placeholder='http://', v-model='conf.host')
                      p.desc The full URL to your wiki, without the trailing slash. E.g.: http://wiki.domain.com. Note that sub-folders are not supported.
                  section
                    p.control
                      label.label Port
                      input(type='text', placeholder='e.g. 80', v-model='conf.port')
                      p.desc The port on which Wiki.js will listen to. Usually port 80 if connecting directly, or a random port (e.g. 3000) if using a web server in front of it.
                  section
                    p.control
                      label.label Site UI Language
                      select(v-model='conf.lang')
                        option(value='en') English
                      p.desc The language in which navigation, help and other UI elements will be displayed.
                .panel-footer
                  button.button.is-indigo.is-outlined(v-on:click='proceedToSyscheck', v-bind:disabled='loading') Back
                  button.button.is-indigo(v-on:click='proceedToDb', v-bind:disabled='loading') Continue

            template(v-else-if='state === "db"')
              .panel
                h2.panel-title.is-featured
                  span Database
                  i(v-if='loading')
                .panel-content.form-sections
                  section
                    p.control.is-fullwidth
                      label.label MongoDB Connection String
                      input(type='text', placeholder='e.g. mongodb://localhost:27017/wiki', v-model='conf.db')
                      p.desc The connection string to your MongoDB server. Leave the default localhost value if MongoDB is installed on the same server.
                .panel-footer
                  button.button.is-indigo.is-outlined(v-on:click='proceedToGeneral', v-bind:disabled='loading') Back
                  button.button.is-indigo(v-on:click='proceedToSyscheck', v-bind:disabled='loading') Connect

      footer.footer
        span
          | Powered by 
          a(href='https://github.com/Requarks/wiki') Wiki.js
          | .
    block outside