wat is this.

caleb-lab/.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["es2015"]
+}

caleb-lab/.eslintrc

@@ -0,0 +1,25 @@
+{
+  "rules": {
+    "quotes": ["error", "single", { "allowTemplateLiterals": true }],
+    "comma-dangle": ["off"],
+    "no-console": "off",
+    "indent": [ "error", 2 ],
+    "semi": [0]
+  },
+  "env": {
+    "es6": true,
+    "node": true,
+    "mocha": true,
+    "jasmine": true
+  },
+  "globals": {
+    "__API_URI__": false,
+    "__DEBUG__": false
+  },
+  "ecmaFeatures": {
+    "modules": true,
+    "experimentalObjectRestSpread": true,
+    "impliedStrict": true
+  },
+  "extends": "eslint:recommended"
+}

caleb-lab/.gitignore

@@ -0,0 +1,3 @@
+build
+node_modules
+.env

caleb-lab/app/component/landing/login/login.html

@@ -0,0 +1,38 @@
+<section>
+  <form
+    name="loginForm"
+    ng-submit="loginCtrl.login()"
+    novalidate>
+    <div
+      ng-class="{
+        'error': loginForm.username.$invalid,
+        'success': loginForm.username.$valid
+      }">
+      <input
+      type="text"
+      name="username"
+      placeholder="username"
+      ng-minlength="6"
+      ng-model="loginCtrl.user.username" required>
+
+      <input type="text" placeholder="email">
+    </div>
+
+    <div
+      ng-class="{
+        'error': loginForm.password.$invalid && loginForm.$submitted,
+        'success': loginForm.password.$valid
+      }">
+      <input
+      type="password"
+      name="password"
+      ng-disabled="loginForm.username.$invalid"
+      placeholder="password"
+      ng-minlength="8"
+      ng-model="loginCtrl.user.password" required>
+    </div>
+
+    <button type="btn-std">sign-in</button>
+  </form>
+
+</section>

caleb-lab/app/component/landing/login/login.js

@@ -0,0 +1,18 @@
+'use strict'
+
+// require('_login.scss')
+
+module.exports = {
+  template: require('./login.html'),
+  controller: ['$log', '$location', 'authService', LoginController],
+  controllerAs: 'loginCtrl'
+}
+
+function LoginController($log, $location, authService){
+  $log.debug('#LoginController')
+  authService.getToken().then(() => $location.url('/home'))
+  this.login = function(){
+    $log.debug('loginCtrl.login')
+    authService.login(this.user).then(() => $location.url('/home'))
+  }
+}

caleb-lab/app/component/landing/signup/signup.html

@@ -0,0 +1,25 @@
+<section>
+  <form
+    ng-submit="signupCtrl.signup(signupCtrl.user)"
+    novalidate>
+    <input
+    type="text"
+    placeholder="name"
+    ng-minlength="6"
+    ng-model="signupCtrl.user.username"
+    required>
+
+    <input
+    type="text"
+    placeholder="email"
+    ng-model="signupCtrl.user.email">
+
+    <input
+    type="password"
+    placeholder="password"
+    ng-minlength="8"
+    ng-model="signupCtrl.user.password">
+
+    <button type="submit" value="sign-up">sign-up</button>
+  </form>
+</section>

caleb-lab/app/component/landing/signup/signup.js

@@ -0,0 +1,16 @@
+'use strict'
+
+module.exports = {
+  template: require('./signup.html'),
+  controller: ['$log', '$location', 'authService', SignupController],
+  controllerAs: 'signupCtrl',
+}
+function SignupController($log, $location, authService){
+  $log.debug('#signupCtrl')
+  authService.getToken().then(() => $location.url('/home'))
+
+  this.signup = function(user){
+    $log.debug('#signupCtrl.signup')
+    authService.signup(user).then(() => $location.url('/home'))
+  }
+}

caleb-lab/app/config/router-config.js

@@ -0,0 +1,36 @@
+'use strict'
+
+module.exports = [
+  '$stateProvider',
+  '$urlRouterProvider',
+  function($stateProvider, $urlRouterProvider){
+    $urlRouterProvider.when('', '/join#signup')
+    $urlRouterProvider.when('/', '/john#signup')
+    $urlRouterProvider.when('/signup', '/join#signup')
+    $urlRouterProvider.when('/login', '/join#login')
+    let routes = [
+      {
+        name: 'home',
+        url: '/home',
+        template: require('../view/home/home.html'),
+        controller: 'HomeController',
+        controllerAs: 'homeCtrl'
+      },
+      {
+        name: 'landing',
+        url: '/join',
+        template: require('../view/landing/landing.html'),
+        controller: 'LandingController',
+        controllerAs: 'landingCtrl'
+      },
+      {
+        name: 'gallery',
+        url: '/gallery',
+        template: require('../view/gallery/gallery.html'),
+        controller: 'GalleryController',
+        controllerAs: 'galleryCtrl'
+      }
+    ]
+    routes.forEach($stateProvider.state)
+  }
+]

caleb-lab/app/entry.js

@@ -0,0 +1,23 @@
+'use strict'
+
+require('./scss/main.scss')
+
+const path = require('path')
+const camelcase = require('camelcase')
+const pascalcase = require('pascalcase')
+const angular = require('angular')
+const uiRouter = require('@uirouter/angularjs')
+
+const cfgram = angular.module('cfgram', ['ui.router'])
+
+let context = require.context('./config/', true, /\.js$/)
+context.keys().forEach(path => cfgram.config(context(path)))
+//for each key in the config files, mount the config for the cfgram
+context = require.context('./view/', true, /\.js$/)
+context.keys().forEach(key => cfgram.controller(pascalcase(path.basename(key, '.js')), context(key)))
+
+context = require.context('./service', true, /\.js$/)
+context.keys().forEach(key => cfgram.service(camelcase(path.basename(key, '.js')), context(key)))
+
+context = require.context('./component/', true, /\.js$/)
+context.keys().forEach(key => cfgram.component(camelcase(path.basename(key, '.js')), context(key)))

caleb-lab/app/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html ng-app="cfgram">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viweport" content="width=device-width, initial-scale=1">
+    <title>Route my App</title>
+  </head>
+  <body>
+    <header>
+      <h1>Welcome to the routes app</h1>
+    </header>
+    <main>
+      <ui-view></ui-view>
+    </main>
+    <footer></footer>
+  </body>
+</html>

caleb-lab/app/scss/main.scss

@@ -0,0 +1,8 @@
+html{
+  background-color: #444444;
+  color: #999999;
+}
+a{
+  text-decoration: none;
+  color: #FFFFFF;
+}

caleb-lab/app/service/auth-service.js

@@ -0,0 +1,84 @@
+'use strict'
+
+module.exports = [
+  '$q',
+  '$log',
+  '$http',
+  '$window',
+  function($q, $log, $http, $window, authService) {
+    $log.debug('authService')
+
+    let service = {}
+    let token = null
+
+    function setToken(_token) {
+      $log.debug('authService.setToken()')
+
+      if(!_token) return $q.reject(new Error('No token'))
+      $window.localStorage.setItem('token', _token)
+      token = _token
+
+      return $q.resolve(token)
+    }
+
+    service.getToken = function() {
+      $log.debug('authService.getToken()')
+
+      if(token) return $q.resolve(token)
+      token = $window.localStorage.getItem('token')
+      if(token) return $q.resolve(token)
+
+      return $q.reject(new Error('Token not found'))
+    }
+
+    service.logout = function() {
+      $log.debug('authService.logout()')
+      $window.localStorage.removeItem('token')
+      token = null
+      return $q.resolve()
+    }
+
+    service.signup = function(user) {
+      $log.debug('authService.signup()')
+      let url = `${__API_URL__}/api/signup`
+      let config = {
+        headers: {
+          'Content-Type': 'application/json',
+          'Accept': 'application/json'
+        }
+      }
+      return $http.post(url, user, config)
+      .then(res => {
+        $log.log('success', res.data)
+        return setToken(res.data)
+      })
+      .catch(err => {
+        $log.error('failure', err)
+        return $q.reject(err)
+      })
+    }
+
+    service.login = function(user) {
+      $log.debug('authService.login()')
+      let url = `${__API_URL__}/api/login`
+      let base64 = $window.btoa(`${user.username}:${user.password}`)
+      let config = {
+        headers: {
+          Accept: 'application/json',
+          Authorization: `Basic ${base64}`
+        }
+      }
+
+      return $http.get(url, config)
+      .then(res => {
+        $log.log('success', res.data)
+        return setToken(res.data)
+      })
+      .catch(err => {
+        $log.error('failure', err.message)
+        return $q.reject(err)
+      })
+    }
+    return service
+  }
+]

caleb-lab/app/view/gallery/gallery-controller.js

@@ -0,0 +1,11 @@
+'use strict'
+
+module.exports = [
+  '$log',
+  function($log) {
+    $log.debug('GalleryController')
+    this.$onInit = () => {
+      this.title = 'Gallery'
+    }
+  }
+]

caleb-lab/app/view/gallery/gallery.html

@@ -0,0 +1,6 @@
+<section>
+  <h2>{{galleryCtrl.title}}</h2>
+  <a href="/#!/home">Home</a>
+  <a href="/#!/signup">Sign-up</a>
+  <a href="/#!/gallery">Gallery</a>
+</section>

caleb-lab/app/view/home/home-controller.js

@@ -0,0 +1,11 @@
+'use strict'
+
+module.exports = [
+  '$log',
+  function($log) {
+    $log.debug('HomeController')
+    this.$onInit = () => {
+      this.title = 'Welcome to Hell'
+    }
+  }
+]

caleb-lab/app/view/home/home.html

@@ -0,0 +1,6 @@
+<section>
+  <h2>{{homeCtrl.title}}</h2>
+  <a href="/#!/home">Home</a>
+  <a href="/#!/signup">Sign-up</a>
+  <a href="/#!/gallery">Gallery</a>
+</section>

caleb-lab/app/view/landing/landing-controller.js

@@ -0,0 +1,15 @@
+'use strict'
+
+module.exports = [
+  '$log',
+  '$location',
+  '$rootScope',
+  function($log, $location, $rootScope) {
+    $log.debug('#LandingController')
+    let url = $location.url($rootScope)
+    this.showSignup = url === '/join#signup' || url === '/join'
+    this.$onInit = () => {
+      this.title = 'Signup'
+    }
+  }
+]

caleb-lab/app/view/landing/landing.html

@@ -0,0 +1,24 @@
+<section>
+  <div
+    ng-if="landingCtrl.showSignup">
+    <div>
+      <signup></signup>
+      <p>already a member?</p>
+      <a href="/#!/login"
+        ng-click="landingCtrl.showSignup=false">
+        sign-in here
+      </a>
+    </div>
+  </div>
+  <div
+    ng-if="!landingCtrl.showSignup">
+    <div>
+      <login></login>
+      <p>want to sign-up?</p>
+      <a href="/#!/signup"
+        ng-click="landingCtrl.showSignup=true">
+        sign-up here
+      </a>
+    </div>
+  </div>
+</section>