extends ./layout

block title
  title HabitRPG | Gamify Your Life

block content
  div(ng-app='habitrpg')
    #wrap(ng-controller='AuthCtrl')
      //-include ./header
      .jumbotron.masthead
        .container
          h1
            img(src='/bower_components/habitrpg-shared/img/logo/habitrpg_pixel.png', alt='HabitRPG')
          p
            | A habit building program which treats your life like a Role Playing Game. Level up as you succeed, lose HP as you fail, earn money to buy weapons and armor.
          a.btn.btn-primary.btn-small(ng-click='playButtonClick()') Play
      .container
        p(style='height:600;')
          iframe(src='//player.vimeo.com/video/57639356', width='100%', height='539', frameborder='0', webkitallowfullscreen='', mozallowfullscreen='', allowfullscreen='')

      .modal.fade#login-modal(style='display:none')
        .modal-dialog
          .modal-content
            .modal-header
              button.close(type='button', data-dismiss='modal', aria-hidden='true') ×
              h4.modal-title Login / Register
            .modal-body
              //a(href='/auth/facebook')
                    img(src='/img/facebook-login-register.jpeg', alt='Login / Register With Facebook')
              //h3 Or
              ul.nav.nav-tabs
                li.active
                  a(data-toggle='tab',data-target='#login-tab') Login
                li
                  a(data-toggle='tab',data-target='#register-tab') Register

              .tab-content
                .tab-pane.active#login-tab
                  form(ng-submit='auth()')
                    .control-group
                      input(type='text', ng-model='loginUsername', placeholder='{{useUUID ? "UUID" : "Username"}}')
                    .control-group
                      input(type='{{useUUID ? "text" : "password"}}', ng-model='loginPassword', placeholder='{{useUUID ? "API Token" : "Password"}}')
                    .control-group
                      label.checkbox
                        input(type='checkbox', ng-click='useUUID = !useUUID')
                        | Use UUID / API Token (For Facebook Users)
                    .control-group
                      input.btn.btn-primary(type='submit', value='Login')

                .tab-pane#register-tab
                  form(ng-submit='register()', name='registrationForm')
                    .control-group
                      input(type='text', ng-model='registerVals.username', placeholder='Username', required)
                    .control-group
                      input(type='email', ng-model='registerVals.email', placeholder='Email', required)
                    .control-group
                      input(type='password', ng-model='registerVals.password', placeholder='Password', required)
                    .control-group
                      input(type='password', ng-model='registerVals.confirmPassword', placeholder='Password Confirm', required)
                    .control-group
                      input.btn.btn-primary(type='submit', value='Register')