Proper angular usage + Using webpack + Small code refactor + Start Au…

…thorization

.eslintrc.json

@@ -1,25 +1,25 @@
 {
     "env": {
         "browser": true,
+        "commonjs": true,
         "es6": true,
-		"jquery": true
+        "node": true,
+        "jest": true
     },
-    "extends": "eslint:recommended",
     "parserOptions": {
         "sourceType": "module"
     },
     "rules": {
-        "linebreak-style": [
-            "error",
-            "windows"
-        ],
-        "quotes": [
-            "error",
-            "single"
-        ],
-        "semi": [
-            "error",
-            "always"
-        ]
+        "no-const-assign": "warn",
+        "no-this-before-super": "warn",
+        "no-undef": "warn",
+        "no-unreachable": "warn",
+        "no-unused-vars": "off",
+        "constructor-super": "warn",
+        "valid-typeof": "warn"
+    },
+    "globals": {
+        "inject": false,
+        "angular": true
     }
 }

app.js

@@ -1,20 +1,16 @@
 'use strict';
 const express = require('express');
 const path = require('path');
-const favicon = require('serve-favicon');
+//const favicon = require('serve-favicon');
 const logger = require('morgan');
 const cookieParser = require('cookie-parser');
 const bodyParser = require('body-parser');
 
-const routes = require('./routes/index');
-const users = require('./routes/users');
 const http = require('http');
 const app = express();
 const server = http.createServer(app);
 const io = require('socket.io').listen(server);
 
-const Middlewares = require('./server/api/config/middlewares/base/MiddlewaresBase');
-
 const mongoose = require('mongoose'),
     db = mongoose.connection,
     User = require('./server/models/user');
@@ -31,10 +27,6 @@ db.once('open', function () {
 //app.set('views', path.join(__dirname, 'views'));
 app.set('view engine', 'ejs');
 
-app.use('/auth', (req, res) => {
-    Middlewares.configuration; //Niet af...
-});
-
 server.listen(8085, () => {
     console.log('App listening at http://localhost:8085');
 });
@@ -50,12 +42,12 @@ app.use(cookieParser());
 
 //app.use(express.static('./build/'));
 //app.use('/*', express.static('./build/index.html')); //Always keep as last route
-app.use('/js', express.static(__dirname + 'build/'));
-app.use('/css', express.static(__dirname + 'build/'));
-app.get('/*', function (req, res) {
+//app.use('/', express.static(__dirname + '/build'));
+/*app.use('/*', function (req, res) {
+    console.log("AllRouter");
     res.sendFile(__dirname + '/build/index.html');
 });
-
+*/
 
 io.on('connection', (socket) => {
     socket.emit('test', 'Connectedddd');

public/app/app.js → client/app/app.js

@@ -8,19 +8,30 @@ import 'angular-ui-router';
 // Import our templates file (generated by Gulp)
 import './config/app.templates';
 // Import our app functionaity
+import './layout';
 import './components';
-import './services';
 import './home';
+import './services'
 import './auth';
+import './canvas';
+import './normalize.css';
+import './style.css';
+import 'angular-material';
 
+// Create and bootstrap application
 const requires = [
-    'ui.router',
-    'app.components',
-    'app.services',
-    'app.home',
-    'app.auth'
+  'ui.router',
+  'templates',
+  'app.layout',
+  'app.components',
+  'app.home',
+  'app.services',
+  'app.auth',
+  'app.canvas',
+  'ngMaterial'
 ];
 
+// Mount on window for testing
 window.app = angular.module('app', requires);
 
 angular.module('app').constant('AppConstants', constants);
@@ -30,5 +41,5 @@ angular.module('app').config(appConfig);
 angular.module('app').run(appRun);
 
 angular.bootstrap(document, ['app'], {
-    strictDi: true
+  strictDi: true
 });

client/app/auth/auth.config.js

@@ -0,0 +1,33 @@
+function AuthConfig($stateProvider, $httpProvider) {
+  'ngInject';
+
+  // Define the routes
+  $stateProvider
+
+  .state('app.login', {
+    url: '/login',
+	controller: 'AuthCtrl as $ctrl',
+    templateUrl: 'auth/auth.html',
+    title: 'Sign in',
+	resolve: {
+		auth: function(User) {
+			return User.ensureAuthIs(false);
+		}
+	}
+  })
+
+  .state('app.register', {
+    url: '/register',
+	controller: 'AuthCtrl as $ctrl',
+    templateUrl: 'auth/auth.html',
+    title: 'Sign up',
+	resolve: {
+		auth: function(User) {
+			return User.ensureAuthIs(false);
+		}
+	}
+  });
+
+};
+
+export default AuthConfig;

public/app/auth/auth.html → client/app/auth/auth.html

@@ -1,10 +1,8 @@
 <div class="auth-page">
-  <div class="container page">
     <div class="row">
 
-      <div class="col-md-6 offset-md-3 col-xs-12">
-        <h1 class="text-xs-center" ng-bind="::$ctrl.title"></h1>
-        <p class="text-xs-center">
+        <h1 class="auth-title" ng-bind="::$ctrl.title"></h1>
+        <p>
           <a ui-sref="app.login" ng-show="$ctrl.authType === 'register'">
             Have an account?
           </a>
@@ -18,42 +16,32 @@ <h1 class="text-xs-center" ng-bind="::$ctrl.title"></h1>
         <form ng-submit="$ctrl.submitForm()">
           <fieldset ng-disabled="$ctrl.isSubmitting">
 
-            <fieldset class="form-group" ng-show="$ctrl.authType === 'register'">
-              <input class="form-control form-control-lg"
+            <fieldset ng-show="$ctrl.authType === 'register'">
+              <input class="auth-input"
                 type="text"
                 placeholder="Username"
                 ng-model="$ctrl.formData.username" />
             </fieldset>
 
-            <fieldset class="form-group">
-              <input class="form-control form-control-lg"
+            <fieldset>
+              <input class="auth-input"
                 type="email"
                 placeholder="Email"
                 ng-model="$ctrl.formData.email" />
             </fieldset>
 
-            <fieldset class="form-group">
-              <input class="form-control form-control-lg"
+            <fieldset>
+              <input class="auth-input"
                 type="password"
                 placeholder="Password"
                 ng-model="$ctrl.formData.password" />
             </fieldset>
-
-              <!--<fieldset class="form-group">
-              <input class="form-control form-control-lg"
-                type="password"
-                placeholder="Confirm Password"
-                ng-model="$ctrl.formData.password" />
-            </fieldset>-->
 
-            <button class="btn btn-lg btn-primary pull-xs-right"
+            <button class="auth-button"
               type="submit" ng-bind="$ctrl.title">
             </button>
 
           </fieldset>
         </form>
-      </div>
-
-    </div>
   </div>
 </div>

client/app/canvas/canvas.config.js

@@ -0,0 +1,19 @@
+function CanvasConfig($stateProvider) {
+  'ngInject';
+
+  $stateProvider
+  .state('app.canvas', {
+    url: '/canvas',
+    controller: 'CanvasCtrl as $ctrl',
+    templateUrl: 'canvas/canvas.html',
+    title: 'Canvas',
+	resolve: {
+			auth: function(User) {
+				return User.ensureAuthIs(true);
+			}
+	}
+  });
+
+};
+
+export default CanvasConfig;