Explorar el Código

Merge pull request #25 from achrafbenyounes/refactor

Starting Angular FrontEnd
Gaël Métais hace 10 años
padre
commit
21cd0cb346

+ 2 - 1
Gruntfile.js

@@ -43,7 +43,8 @@ module.exports = function(grunt) {
                 'app/nodeControllers/*.js',
                 'app/public/scripts/*.js',
                 'phantomas_custom/**/*.js',
-                'test/**/*.js'
+                'test/**/*.js',
+                'front/src/js/**/*.js'
             ]
         },
         clean: {

+ 2 - 1
app/public/scripts/app.js

@@ -2,4 +2,5 @@ angular.module('YellowLabTools', [
   'Results',
   'ngModal',
   'ShowOffendersDirective'
-]);
+]);
+

+ 1 - 1
bin/server.js

@@ -16,7 +16,7 @@ app.use(apiLimitsMiddleware);
 
 // Initialize the controllers
 var apiController           = require('../lib/server/controllers/apiController')(app);
-var uiController            = require('../lib/server/controllers/uiController')(app);
+var frontController         = require('../lib/server/controllers/frontController')(app);
 
 
 // Let's start the server!

+ 3 - 1
bower.json

@@ -2,6 +2,8 @@
   "name": "yellowlabtools",
   "dependencies": {
     "angular": "~1.3.5",
-    "ngModal": "git://github.com/gmetais/ngModal.git#1.2.3"
+    "ngModal": "git://github.com/gmetais/ngModal.git#1.2.3",
+    "angular-route": "~1.3.6",
+    "angular-resource": "~1.3.6"
   }
 }

+ 30 - 0
front/src/js/app.js

@@ -0,0 +1,30 @@
+var yltApp = angular.module('YellowLabTools', [
+    'ngRoute',
+    'indexCtrl',
+    'aboutCtrl',
+    'dashboardCtrl'
+]);
+
+yltApp.config(['$routeProvider', '$locationProvider',
+    function($routeProvider, $locationProvider) {
+        $routeProvider.
+            when('/', {
+                templateUrl: 'front/views/index.html',
+                controller: 'IndexCtrl'
+            }).
+            when('/about', {
+                templateUrl: 'front/views/about.html',
+                controller: 'AboutCtrl'
+            }).
+            when('/results/:runId', {
+                templateUrl: 'front/views/dashboard.html',
+                controller: 'DashboardCtrl'
+            }).
+            otherwise({
+                redirectTo: '/'
+            });
+            
+            $locationProvider.html5Mode(true);
+    }
+]);
+

+ 5 - 0
front/src/js/controllers/aboutCtrl.js

@@ -0,0 +1,5 @@
+var aboutCtrl = angular.module('aboutCtrl', []);
+
+aboutCtrl.controller('AboutCtrl', ['$scope', function($scope) {
+    $scope.about = "this is about YLT";
+}]);

+ 10 - 0
front/src/js/controllers/dashboardCtrl.js

@@ -0,0 +1,10 @@
+var dashboardCtrl = angular.module('dashboardCtrl', ['resultsFactory']);
+
+dashboardCtrl.controller('DashboardCtrl', ['$scope', '$routeParams', 'Results', function($scope, $routeParams, Results) {
+    $scope.dashboard = "this is a dashboard";
+    $scope.runId = $routeParams.runId;
+    Results.get({runId: $routeParams.runId}, function(result) {
+        $scope.result = result;
+        console.log(result);
+    });
+}]);

+ 5 - 0
front/src/js/controllers/indexCtrl.js

@@ -0,0 +1,5 @@
+var indexCtrl = angular.module('indexCtrl', []);
+
+indexCtrl.controller('IndexCtrl', ['$scope', function($scope) {
+    $scope.toto = "Achraf";
+}]);

+ 7 - 0
front/src/js/models/resultsFactory.js

@@ -0,0 +1,7 @@
+var resultsFactory = angular.module('resultsFactory', ['ngResource']);
+
+resultsFactory.factory('Results', ['$resource', function($resource) {
+    return $resource('/api/results/:runId', {
+        'get': {method: 'GET', params: {runId: '@runId'}}
+    });
+}]);

+ 19 - 0
front/src/main.html

@@ -0,0 +1,19 @@
+<html>
+<head>
+	<title>index template</title>
+    <base href="/">
+    <script src="/bower_components/angular/angular.min.js"></script>
+    <script src="/bower_components/angular-route/angular-route.min.js"></script>
+    <script src="/bower_components/angular-resource/angular-resource.min.js"></script>
+    <script src="/front/js/app.js"></script>
+    <script src="/front/js/controllers/indexCtrl.js"></script>
+    <script src="/front/js/controllers/aboutCtrl.js"></script>
+    <script src="/front/js/controllers/dashboardCtrl.js"></script>
+    <script src="/front/js/models/resultsFactory.js"></script>
+<head>
+<body ng-app="YellowLabTools">
+  <div id="header">hello yellowlab tools, header</div>
+  <div id="body" ng-view>hello yellowlab, body</div>
+  <div id="footer">hello yellowlab, footer</div>
+</body>
+</html>

+ 1 - 0
front/src/views/about.html

@@ -0,0 +1 @@
+{{about}}

+ 2 - 0
front/src/views/dashboard.html

@@ -0,0 +1,2 @@
+<div>{{dashboard}}</div>
+<div>{{runId}}</div>

+ 1 - 0
front/src/views/index.html

@@ -0,0 +1 @@
+this is a html index by {{toto}}

+ 23 - 0
lib/server/controllers/frontController.js

@@ -0,0 +1,23 @@
+var path = require('path');
+var express = require('express');
+
+var FrontController = function(app) {
+    'use strict';
+ 
+    app.get('/', function(req, res) {
+        res.sendFile(path.join(__dirname, '../../../front/src/main.html')); 
+    });
+    
+    app.get('/about', function(req, res) {
+        res.sendFile(path.join(__dirname, '../../../front/src/main.html')); 
+    });
+    
+    app.get('/results/:runId', function(req, res) {
+        res.sendFile(path.join(__dirname, '../../../front/src/main.html')); 
+    });
+    
+    app.use('/front', express.static(path.join(__dirname, '../../../front/src')));
+    app.use('/bower_components', express.static(path.join(__dirname, '../../../bower_components')));
+};
+
+module.exports = FrontController;

+ 0 - 13
lib/server/controllers/uiController.js

@@ -1,13 +0,0 @@
-var UiController = function(app) {
-    'use strict';
-
-
-    // Create a new run
-    app.get('/', function(req, res) {
-
-        res.setHeader('Content-Type', 'text/html');
-        res.send('Test');
-    });
-};
-
-module.exports = UiController;