server and webapp working

server/.gitignore

@@ -0,0 +1,41 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules
+jspm_packages
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history

server/config.js

@@ -0,0 +1,8 @@
+module.exports = {
+    /*'secret': process.env.SECRET,// production version
+    'database': process.env.MONGO_DSN,*/
+    'secret': 'secretfortoken',// local version
+    'database': 'mongodb://localhost/meanseed',
+    "port" : process.env.PORT || 3000,
+    "pageSize": 20
+};

server/controllers/userController.js

@@ -0,0 +1,237 @@
+//File: controllers/userController.js
+var mongoose = require('mongoose');
+var userModel = mongoose.model('userModel');
+
+var config = require('../config');
+var pageSize = config.pageSize;
+
+/* */
+var jwt = require('jsonwebtoken'); // used to create, sign, and verify tokens
+var express = require("express");
+var app = express();
+var config = require('../config'); // get our config file
+app.set('superSecret', config.secret); // secret variable
+
+var crypto = require('crypto');
+/* */
+
+var request = require('request');
+
+function getRand(min, max) {
+    min = Math.ceil(min);
+    max = Math.floor(max);
+    return Math.floor(Math.random() * (max - min + 1)) + min; //The maximum is inclusive and the minimum is inclusive
+}
+
+function getAvatar(n) {
+    switch (n) {
+        case 1:
+            avatar = "img/avatars/racoon.png";
+            break;
+        case 2:
+            avatar = "img/avatars/duck.png";
+            break;
+        case 3:
+            avatar = "img/avatars/clown-fish.png";
+            break;
+        case 4:
+            avatar = "img/avatars/tiger.png";
+            break;
+        case 5:
+            avatar = "img/avatars/sloth.png";
+            break;
+        case 6:
+            avatar = "img/avatars/penguin.png";
+            break;
+        case 7:
+            avatar = "img/avatars/owl.png";
+            break;
+        case 8:
+            avatar = "img/avatars/chameleon.png";
+            break;
+        case 9:
+            avatar = "img/avatars/siberian-husky.png";
+            break;
+        case 10:
+            avatar = "img/avatars/toucan.png";
+            break;
+        default:
+            avatar = "img/avatars/racoon.png";
+    }
+    return avatar;
+}
+
+//POST - Insert a new User in the DB
+exports.signup = function(req, res) {
+    //get random avatar
+    var r = getRand(1, 10);
+    randAvatar = getAvatar(r);
+
+
+    var user = new userModel({
+        username: req.body.username,
+        password: crypto.createHash('sha256').update(req.body.password).digest('base64'),
+        description: req.body.description,
+        avatar: randAvatar,
+        email: req.body.email,
+        phone: req.body.phone
+    });
+    if (user.username == undefined) {
+        return res.status(500).jsonp("empty inputs");
+    } else if (user.password == undefined) {
+        return res.status(500).jsonp("empty inputs");
+    } else if (user.email == undefined) {
+        return res.status(500).jsonp("empty inputs");
+    }
+
+    user.save(function(err, user) {
+        if (err) return res.send(500, err.message);
+
+        exports.login(req, res);
+    });
+};
+
+
+//POST - auth user
+exports.login = function(req, res) {
+    // find the user
+    userModel.findOne({
+            username: req.body.username
+        })
+        .select('+password')
+        .exec(function(err, user) {
+
+            if (err) throw err;
+
+            if (!user) {
+                res.json({
+                    success: false,
+                    message: 'Authentication failed. User not found.'
+                });
+            } else if (user) {
+
+                req.body.password = crypto.createHash('sha256').update(req.body.password).digest('base64');
+
+                // check if password matches
+                if (user.password != req.body.password) {
+                    res.json({
+                        success: false,
+                        message: 'Authentication failed. Wrong password.'
+                    });
+                } else {
+
+                    // if user is found and password is right
+                    // create a token
+                    var token = jwt.sign({
+                        foo: 'bar'
+                    }, app.get('superSecret'), {
+                        //expiresInMinutes: 1440 // expires in 24 hours
+                        //expiresIn: '60m'
+                    });
+                    user.token = token;
+                    user.save(function(err, user) {
+                        if (err) return res.send(500, err.message);
+                        //res.status(200).jsonp(travel);
+                        console.log(user);
+                        // return the information including token as JSON
+                        user.password = "";
+                        res.json({
+                            success: true,
+                            message: 'Enjoy your token!',
+                            token: token,
+                            user: user
+                        });
+                    });
+
+                }
+
+            }
+
+        });
+};
+
+//GET - Return all Users in the DB
+exports.getAllUsers = function(req, res) {
+    userModel.find()
+        .limit(pageSize)
+        .skip(pageSize * Number(req.query.page))
+        .exec(function(err, users) {
+            if (err) return res.send(500, err.message);
+            res.status(200).jsonp(users);
+        });
+};
+
+exports.getUserById = function(req, res) {
+    userModel.findOne({
+            _id: req.params.userid
+        })
+        .lean()
+        .populate('validatedBy', 'username')
+        .populate('travels', 'title from to date type')
+        .exec(function(err, user) {
+            if (err) return res.send(500, err.message);
+            if (!user) {
+                res.json({
+                    success: false,
+                    message: 'User not found.'
+                });
+            } else if (user) {
+                res.status(200).jsonp(user);
+            }
+        });
+};
+exports.getUserByToken = function(req, res) {
+    userModel.findOne({
+            'token': req.headers['x-access-token']
+        })
+        .lean()
+        .populate('travels', 'title from to date')
+        .exec(function(err, user) {
+            if (err) return res.send(500, err.message);
+            if (!user) {
+                res.json({
+                    success: false,
+                    message: 'User not found.'
+                });
+            } else if (user) {
+
+                res.status(200).jsonp(user);
+            }
+        });
+};
+
+
+function getRandomInt(min, max) {
+    min = Math.ceil(min);
+    max = Math.floor(max);
+    return Math.floor(Math.random() * (max - min)) + min; //The maximum is exclusive and the minimum is inclusive
+}
+
+
+function updateUserWithNewImages(req, res, imgUrl) {
+    //adding random number to the url, to force ionic reload the image
+    req.body.avatar = imgUrl + "?" + getRandomInt(1, 9999);
+    userModel.update({
+            'token': req.headers['x-access-token']
+        }, req.body,
+        function(err) {
+            if (err) return console.log(err);
+            exports.getUserByToken(req, res);
+        });
+}
+exports.updateUser = function(req, res) {
+    updateUserWithNewImages(req, res, req.body.avatar);
+};
+
+//DELETE - Delete a user with specified ID
+exports.deleteUser = function(req, res) {
+    userModel.findOne({
+            'token': req.headers['x-access-token']
+        })
+        .exec(function(err, user) {
+            user.remove(function(err) {
+                if (err) return res.send(500, err.message);
+                res.status(200).jsonp("deleted");
+            })
+        });
+};

server/models/userModel.js

@@ -0,0 +1,18 @@
+var mongoose = require('mongoose'),
+    Schema   = mongoose.Schema;
+
+var mongooseUniqueValidator = require('mongoose-unique-validator');
+
+
+var userSchema = new Schema({
+    username: { type: String, required: true, unique: true },
+    password: { type: String, required: true, select: false },
+    token: { type: String, select: false },
+    description:   { type: String, default: "Hello world" },
+    avatar:   { type: String, default: "img/avatars/racoon.png" },
+    email:   { type: String, required: true, select: false },
+    phone: { type: String }
+})
+
+userSchema.plugin(mongooseUniqueValidator);
+module.exports = mongoose.model('userModel', userSchema);

server/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "MEANseed",
+  "version": "0.0.1",
+  "description": "MEANseed",
+  "repository": "https://github.com/arnaucode/MEANseed",
+  "contributors": [
+    {
+      "name": "Arnau",
+      "web": "arnaucode.com"
+    }
+  ],
+  "main": "server.js",
+  "scripts": {
+    "prestart": "npm install",
+    "start": "node server.js"
+  },
+  "dependencies": {
+    "body-parser": "latest",
+    "express": "^4.7.1",
+    "jsonwebtoken": "latest",
+    "method-override": "^2.1.2",
+    "mongoose": "latest",
+    "mongoose-unique-validator": "^1.0.2",
+    "morgan": "latest",
+    "request": "^2.81.0"
+  }
+}

server/server.js

@@ -0,0 +1,110 @@
+var express = require("express"),
+    app = express(),
+    bodyParser = require("body-parser"),
+    methodOverride = require("method-override"),
+    mongoose = require('mongoose');
+
+
+var morgan = require('morgan');
+var jwt = require('jsonwebtoken'); // used to create, sign, and verify tokens
+var config = require('./config'); // get our config file
+
+mongoose.Promise = global.Promise;
+// Connection to DB
+mongoose.connect(config.database, function(err, res) {
+    if (err) throw err;
+    console.log('Connected to Database');
+});
+app.set('superSecret', config.secret); // secret variable
+
+// Middlewares
+/*app.use(bodyParser.urlencoded({
+    extended: false
+}));
+app.use(bodyParser.json());*/
+
+app.use(bodyParser.json({limit: '50mb'}));
+app.use(bodyParser.urlencoded({limit: '50mb', extended: true}));
+app.use(methodOverride());
+
+// use morgan to log requests to the console
+app.use(morgan('dev'));
+
+// Import Models and controllers
+var userMdl = require('./models/userModel')(app, mongoose);
+var userCtrl = require('./controllers/userController');
+
+app.use(express.static(__dirname + '/../webapp'));
+
+
+//CORS
+app.use(function(req, res, next) {
+    res.header("Access-Control-Allow-Origin", "*");
+    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
+    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, X-Access-Token");
+    next();
+});
+
+// API routes ------------------------------------------------------
+var apiRoutes = express.Router();
+
+apiRoutes.route('/login')
+    .post(userCtrl.login);
+apiRoutes.route('/signup')
+    .post(userCtrl.signup);
+apiRoutes.route('/users')
+    .get(userCtrl.getAllUsers);
+apiRoutes.route('/users/id/:userid')
+    .get(userCtrl.getUserById);
+
+// OJU AQUÏ TREC la verificació de token temporalment, per fer les proves des de l'app
+// route middleware to verify a token
+apiRoutes.use(function(req, res, next) {
+
+    // check header or url parameters or post parameters for token
+    var token = req.body.token || req.query.token || req.headers['x-access-token'];
+
+    // decode token
+    if (token) {
+        // verifies secret and checks exp
+        jwt.verify(token, app.get('superSecret'), function(err, decoded) {
+            if (err) {
+                return res.send(204,
+                {
+                    success: false,
+                    message: 'Failed to authenticate token.'
+                });
+            } else {
+                // if everything is good, save to request for use in other routes
+                req.decoded = decoded;
+                //console.log("decoded " + decoded);
+                next();
+            }
+        });
+
+    } else {
+
+        // if there is no token
+        // return an error
+        return res.status(204).send({
+            success: false,
+            message: 'No token provided.'
+        });
+
+    }
+}); //fi verificació de token
+
+apiRoutes.route('/users/token')
+    .get(userCtrl.getUserByToken);
+apiRoutes.route('/users')//agafa l'user a partir del token
+    .put(userCtrl.updateUser)//no comprovat
+    .delete(userCtrl.deleteUser);
+
+
+app.use('/api', apiRoutes);
+// end of API routes -------------------------------------
+
+// Start server
+app.listen(config.port, function() {
+    console.log("Node server running on port" + config.port);
+});

webapp/.gitignore

@@ -0,0 +1,3 @@
+bower_components
+node_modules
+img

webapp/app.js

@@ -0,0 +1,71 @@
+'use strict';
+
+var urlapi = "http://localhost:3000/api/";
+
+// Declare app level module which depends on views, and components
+angular.module('MEANseed', [
+  'ngRoute',
+  'ngMessages',
+  'angularBootstrapMaterial',
+  'app.navbar',
+  'app.signup',
+  'app.login',
+  'app.main',
+  'app.user'
+]).
+config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
+  $locationProvider.hashPrefix('!');
+
+  //$routeProvider.otherwise({redirectTo: '/main'});
+  if((localStorage.getItem('meanseed_token')))
+    {
+      console.log(window.location.hash);
+      if((window.location.hash==='#!/login')||(window.location.hash==='#!/signup'))
+      {
+        window.location='#!/main';
+      }
+
+      $routeProvider.otherwise({redirectTo: '/main'});
+    }else{
+      if((window.location!=='#!/login')||(window.location!=='#!/signup'))
+      {
+        console.log('app, user no logged');
+
+        localStorage.removeItem('meanseed_token');
+        localStorage.removeItem('meanseed_userdata');
+        window.location='#!/login';
+        $routeProvider.otherwise({redirectTo: '/login'});
+      }
+    }
+}])
+
+.factory('httpInterceptor', function httpInterceptor () {
+  return {
+    request: function(config) {
+      return config;
+    },
+
+    requestError: function(config) {
+      return config;
+    },
+
+    response: function(res) {
+      return res;
+    },
+
+    responseError: function(res) {
+      return res;
+    }
+  };
+})
+.factory('api', function ($http) {
+	return {
+		init: function () {
+      $http.defaults.headers.common['X-Access-Token'] = localStorage.getItem('meanseed_token');
+      $http.defaults.headers.post['X-Access-Token'] = localStorage.getItem('meanseed_token');
+		}
+	};
+})
+.run(function (api) {
+	api.init();
+});

webapp/bower.json

@@ -0,0 +1,17 @@
+{
+    "name": "MEANseed-webapp",
+    "description": "MEANseed",
+    "version": "0.0.0",
+    "homepage": "https://github.com/arnaucode/MEANseed",
+    "license": "MIT",
+    "private": true,
+    "dependencies": {
+        "angular": "^1.6.2",
+        "angular-route": "^1.6.1",
+        "angular-chart.js": "^1.1.1",
+        "angular-bootstrap-material": "abm#^0.1.4",
+        "angular-bootstrap": "^2.5.0",
+        "angular-messages": "^1.6.5",
+        "components-font-awesome": "^4.7.0"
+    }
+}

webapp/css/colors.css

@@ -0,0 +1,531 @@
+/* red */
+.c_red50{
+    background: #FFEBEE!important;
+    color: #000000!important;
+}
+.c_red100{
+    background: #FFCDD2!important;
+    color: #000000!important;
+}
+.c_red200{
+    background: #EF9A9A!important;
+    color: #000000!important;
+}
+.c_red300{
+    background: #E57373!important;
+    color: #ffffff!important;
+}
+.c_red400{
+    background: #EF5350!important;
+    color: #ffffff!important;
+}
+.c_red500{
+    background: #F44336!important;
+    color: #ffffff!important;
+}
+.c_red600{
+    background: #E53935!important;
+    color: #ffffff!important;
+}
+.c_red700{
+    background: #D32F2F!important;
+    color: #ffffff!important;
+}
+.c_red800{
+    background: #C62828!important;
+    color: #ffffff!important;
+}
+.c_red900{
+    background: #B71C1C!important;
+    color: #ffffff!important;
+}
+
+.ctext_red400{
+    color: #EF5350!important;
+}
+.ctext_red500{
+    color: #F44336!important;
+}
+.ctext_red600{
+    color: #E53935!important;
+}
+
+/* pink */
+.c_pink50{
+    background: #FCE4EC!important;
+    color: #000000!important;
+}
+.c_pink100{
+    background: #F8BBD0!important;
+    color: #000000!important;
+}
+.c_pink200{
+    background: #F48FB1!important;
+    color: #000000!important;
+}
+.c_pink300{
+    background: #F06292!important;
+    color: #ffffff!important;
+}
+.c_pink400{
+    background: #EC407A!important;
+    color: #ffffff!important;
+}
+.c_pink500{
+    background: #E91E63!important;
+    color: #ffffff!important;
+}
+.c_pink600{
+    background: #D81B60!important;
+    color: #ffffff!important;
+}
+.c_pink700{
+    background: #C2185B!important;
+    color: #ffffff!important;
+}
+.c_pink800{
+    background: #AD1457!important;
+    color: #ffffff!important;
+}
+.c_pink900{
+    background: #880E4F!important;
+    color: #ffffff!important;
+}
+
+/* deepPurple */
+.c_deepPurple50{
+    background: #EDE7F6!important;
+    color: #000000!important;
+}
+.c_deepPurple100{
+    background: #D1C4E9!important;
+    color: #000000!important;
+}
+.c_deepPurple200{
+    background: #B39DDB!important;
+    color: #000000!important;
+}
+.c_deepPurple300{
+    background: #9575CD!important;
+    color: #ffffff!important;
+}
+.c_deepPurple400{
+    background: #7E57C2!important;
+    color: #ffffff!important;
+}
+.c_deepPurple500{
+    background: #673AB7!important;
+    color: #ffffff!important;
+}
+.c_deepPurple600{
+    background: #5E35B1!important;
+    color: #ffffff!important;
+}
+.c_deepPurple700{
+    background: #512DA8!important;
+    color: #ffffff!important;
+}
+.c_deepPurple800{
+    background: #4527A0!important;
+    color: #ffffff!important;
+}
+.c_deepPurple900{
+    background: #311B92!important;
+    color: #ffffff!important;
+}
+
+.c_deepPurpleG000to200{
+    background: -moz-linear-gradient(0deg, #ffffff 0%, #D1C4E9 100%)!important; /* ff3.6+ */
+    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #ffffff), color-stop(100%, #D1C4E9))!important; /* safari4+,chrome */
+    background: -webkit-linear-gradient(0deg, #ffffff 0%, #D1C4E9 100%)!important; /* safari5.1+,chrome10+ */
+    background: -o-linear-gradient(0deg, #ffffff 0%, #D1C4E9 100%)!important; /* opera 11.10+ */
+    background: -ms-linear-gradient(0deg, #ffffff 0%, #D1C4E9 100%)!important; /* ie10+ */
+    background: linear-gradient(90deg, #ffffff 0%, #D1C4E9 100%)!important; /* w3c */
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#D1C4E9',GradientType=1 )!important; /* ie6-9 */
+}
+.c_deepPurpleG500to300{
+    background: -moz-linear-gradient(219deg, #9575CD 0%, #673AB7 100%)!important; /* ff3.6+ */
+    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #673AB7), color-stop(100%, #9575CD))!important; /* safari4+,chrome */
+    background: -webkit-linear-gradient(219deg, #9575CD 0%, #673AB7 100%)!important; /* safari5.1+,chrome10+ */
+    background: -o-linear-gradient(219deg, #9575CD 0%, #673AB7 100%)!important; /* opera 11.10+ */
+    background: -ms-linear-gradient(219deg, #9575CD 0%, #673AB7 100%)!important; /* ie10+ */
+    background: linear-gradient(231deg, #9575CD 0%, #673AB7 100%)!important; /* w3c */
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#673AB7', endColorstr='#9575CD',GradientType=1 )!important; /* ie6-9 */
+    color: #ffffff!important;
+}
+.c_deepPurpleG300to500{
+    background: -moz-linear-gradient(42deg, #9575CD 0%, #673AB7 100%)!important; /* ff3.6+ */
+    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #9575CD), color-stop(100%, #673AB7))!important; /* safari4+,chrome */
+    background: -webkit-linear-gradient(42deg, #9575CD 0%, #673AB7 100%)!important; /* safari5.1+,chrome10+ */
+    background: -o-linear-gradient(42deg, #9575CD 0%, #673AB7 100%)!important; /* opera 11.10+ */
+    background: -ms-linear-gradient(42deg, #9575CD 0%, #673AB7 100%)!important; /* ie10+ */
+    background: linear-gradient(48deg, #9575CD 0%, #673AB7 100%)!important; /* w3c */
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9575CD', endColorstr='#673AB7',GradientType=1 )!important; /* ie6-9 */
+    color: #ffffff!important;
+}
+
+/* indigo */
+.c_indigo50{
+    background:#E8EAF6!important;
+    color: #000000!important;
+}
+.c_indigo100{
+    background:#C5CAE9!important;
+    color: #000000!important;
+}
+.c_indigo200{
+    background:#9FA8DA!important;
+    color: #000000!important;
+}
+.c_indigo300{
+    background:#7986CB!important;
+    color: #ffffff!important;
+}
+.c_indigo400{
+    background:#5C6BC0!important;
+    color: #ffffff!important;
+}
+.c_indigo500{
+    background:#3F51B5!important;
+    color: #ffffff!important;
+}
+.c_indigo600{
+    background:#3949AB!important;
+    color: #ffffff!important;
+}
+.c_indigo700{
+    background:#303F9F!important;
+    color: #ffffff!important;
+}
+.c_indigo800{
+    background:#283593!important;
+    color: #ffffff!important;
+}
+.c_indigo900{
+    background:#1A237E!important;
+    color: #ffffff!important;
+}
+
+.ctext_indigo500{
+    color: #3F51B5!important;
+}
+
+/* blue */
+.c_blue50{
+    background: #E3F2FD!important;
+    color: #000000!important;
+}
+.c_blue100{
+    background: #BBDEFB!important;
+    color: #000000!important;
+}
+.c_blue200{
+    background: #90CAF9!important;
+    color: #000000!important;
+}
+.c_blue300{
+    background: #64B5F6!important;
+    color: #ffffff!important;
+}
+.c_blue400{
+    background: #42A5F5!important;
+    color: #ffffff!important;
+}
+.c_blue500{
+    background: #2196F3!important;
+    color: #ffffff!important;
+}
+.c_blue600{
+    background: #1E88E5!important;
+    color: #ffffff!important;
+}
+.c_blue700{
+    background: #1976D2!important;
+    color: #ffffff!important;
+}
+.c_blue800{
+    background: #1565C0!important;
+    color: #ffffff!important;
+}
+.c_blue900{
+    background: #0D47A1!important;
+    color: #ffffff!important;
+}
+
+
+/* cyan */
+.c_cyan50{
+    background: #E0F7FA!important;
+    color: #000000!important;
+}
+.c_cyan100{
+    background: #B2EBF2!important;
+    color: #000000!important;
+}
+.c_cyan200{
+    background: #80DEEA!important;
+    color: #000000!important;
+}
+.c_cyan300{
+    background: #4DD0E1!important;
+    color: #ffffff!important;
+}
+.c_cyan400{
+    background: #26C6DA!important;
+    color: #ffffff!important;
+}
+.c_cyan500{
+    background: #00BCD4!important;
+    color: #ffffff!important;
+}
+.c_cyan600{
+    background: #00ACC1!important;
+    color: #ffffff!important;
+}
+.c_cyan700{
+    background: #0097A7!important;
+    color: #ffffff!important;
+}
+.c_cyan800{
+    background: #00838F!important;
+    color: #ffffff!important;
+}
+.c_cyan900{
+    background: #006064!important;
+    color: #ffffff!important;
+}
+
+/* green */
+.c_green50{
+    background: #E8F5E9!important;
+    color: #000000!important;
+}
+.c_green100{
+    background: #C8E6C9!important;
+    color: #000000!important;
+}
+.c_green200{
+    background: #A5D6A7!important;
+    color: #000000!important;
+}
+.c_green300{
+    background: #81C784!important;
+    color: #ffffff!important;
+}
+.c_green400{
+    background: #66BB6A!important;
+    color: #ffffff!important;
+}
+.c_green500{
+    background: #4CAF50!important;
+    color: #ffffff!important;
+}
+.c_green600{
+    background: #43A047!important;
+    color: #ffffff!important;
+}
+.c_green700{
+    background: #388E3C!important;
+    color: #ffffff!important;
+}
+.c_green800{
+    background: #2E7D32!important;
+    color: #ffffff!important;
+}
+.c_green900{
+    background: #1B5E20!important;
+    color: #ffffff!important;
+}
+
+/* yellow */
+.c_yellow50{
+    background: #FFFDE7!important;
+    color: #000000!important;
+}
+.c_yellow100{
+    background: #FFF9C4!important;
+    color: #000000!important;
+}
+.c_yellow200{
+    background: #FFF59D!important;
+    color: #000000!important;
+}
+.c_yellow300{
+    background: #FFF176!important;
+    color: #ffffff!important;
+}
+.c_yellow400{
+    background: #FFEE58!important;
+    color: #ffffff!important;
+}
+.c_yellow500{
+    background: #FFEB3B!important;
+    color: #ffffff!important;
+}
+.c_yellow600{
+    background: #FDD835!important;
+    color: #ffffff!important;
+}
+.c_yellow700{
+    background: #FBC02D!important;
+    color: #ffffff!important;
+}
+.c_yellow800{
+    background: #F9A825!important;
+    color: #ffffff!important;
+}
+.c_yellow900{
+    background: #F57F17!important;
+    color: #ffffff!important;
+}
+
+/* orange */
+.c_orange50{
+    background: #FFF3E0!important;
+    color: #000000!important;
+}
+.c_orange100{
+    background: #FFE0B2!important;
+    color: #000000!important;
+}
+.c_orange200{
+    background: #FFCC80!important;
+    color: #000000!important;
+}
+.c_orange300{
+    background: #FFB74D!important;
+    color: #ffffff!important;
+}
+.c_orange400{
+    background: #FFA726!important;
+    color: #ffffff!important;
+}
+.c_orange500{
+    background: #FF9800!important;
+    color: #ffffff!important;
+}
+.c_orange600{
+    background: #FB8C00!important;
+    color: #ffffff!important;
+}
+.c_orange700{
+    background: #F57C00!important;
+    color: #ffffff!important;
+}
+.c_orange800{
+    background: #EF6C00!important;
+    color: #ffffff!important;
+}
+.c_orange900{
+    background: #E65100!important;
+    color: #ffffff!important;
+}
+
+/* grey */
+.c_grey50{
+    background: #FAFAFA!important;
+    color: #000000!important;
+}
+.c_grey100{
+    background: #F5F5F5!important;
+    color: #000000!important;
+}
+.c_grey200{
+    background: #EEEEEE!important;
+    color: #000000!important;
+}
+.c_grey300{
+    background: #E0E0E0!important;
+    color: #ffffff!important;
+}
+.c_grey400{
+    background: #BDBDBD!important;
+    color: #ffffff!important;
+}
+.c_grey500{
+    background: #9E9E9E!important;
+    color: #ffffff!important;
+}
+.c_grey600{
+    background: #757575!important;
+    color: #ffffff!important;
+}
+.c_grey700{
+    background: #616161!important;
+    color: #ffffff!important;
+}
+.c_grey800{
+    background: #424242!important;
+    color: #ffffff!important;
+}
+.c_grey900{
+    background: #212121!important;
+    color: #ffffff!important;
+}
+
+
+
+/* blue grey */
+.c_blueGrey50{
+    background: #ECEFF1!important;
+    color: #000000!important;
+}
+.c_blueGrey100{
+    background: #CFD8DC!important;
+    color: #000000!important;
+}
+.c_blueGrey200{
+    background: #B0BEC5!important;
+    color: #000000!important;
+}
+.c_blueGrey300{
+    background: #90A4AE!important;
+    color: #ffffff!important;
+}
+.c_blueGrey400{
+    background: #78909C!important;
+    color: #ffffff!important;
+}
+.c_blueGrey500{
+    background: #607D8B!important;
+    color: #ffffff!important;
+}
+.c_blueGrey600{
+    background: #546E7A!important;
+    color: #ffffff!important;
+}
+.c_blueGrey700{
+    background: #455A64!important;
+    color: #ffffff!important;
+}
+.c_blueGrey800{
+    background: #37474F!important;
+    color: #ffffff!important;
+}
+.c_blueGrey900{
+    background: #263238!important;
+    color: #ffffff!important;
+}
+
+
+.ctext_blueGrey500{
+    color: #607D8B!important;
+}
+
+.c_blueGradient1{
+    background: #2d4a56!important;
+    background: -moz-linear-gradient(left, #2d4a56 0%, #1c2b36 100%)!important;
+    background: -webkit-linear-gradient(left, #2d4a56 0%,#1c2b36 100%)!important;
+    background: linear-gradient(to right, #2d4a56 0%,#1c2b36 100%)!important;
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d4a56', endColorstr='#1c2b36',GradientType=1 )!important;
+
+    color: rgba(255,255,255,0.9)!important;
+}
+.c_blue2{
+    background: rgb(28,43,54)!important;
+    color: rgba(255,255,255,0.8)!important;
+}
+
+.cf_green2{
+    color: rgb(32,158,145)!important;
+}

webapp/index.html

@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>MEANseed</title>
+
+    <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Open+Sans:400,700'>
+    <!-- Material Design fonts -->
+    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700">
+    <link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
+
+    <link rel="stylesheet" href="bower_components/components-font-awesome/css/font-awesome.min.css">
+
+
+    <link href="css/style.css" rel="stylesheet">
+    <link href="css/colors.css" rel="stylesheet">
+
+    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
+    <link href="css/ionic.app.css" rel="stylesheet">
+    -->
+
+</head>
+
+<body ng-app="MEANseed">
+    <div ng-include="'views/navbar.html'"></div>
+
+    <div ng-view></div>
+
+
+
+    <!-- Angular js -->
+    <script src="bower_components/angular/angular.js"></script>
+    <script src="bower_components/angular-route/angular-route.js"></script>
+    <script src="bower_components/angular-messages/angular-messages.js"></script>
+
+    <!-- Bootstrap -->
+    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
+    <!-- Bootstrap Material Design -->
+    <link rel="stylesheet" href="bower_components/bootstrap-material-design/dist/css/bootstrap-material-design.css">
+    <link rel="stylesheet" href="bower_components/bootstrap-material-design/dist/css/ripples.css">
+
+    <script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
+    <script src="bower_components/angular-bootstrap-material/dist/angular-bootstrap-material.js"></script>
+
+    <!-- Angular Chart -->
+    <script src="bower_components/chart.js/dist/Chart.min.js"></script>
+    <script src="bower_components/angular-chart.js/dist/angular-chart.min.js"></script>
+
+
+
+
+    <!-- app's js -->
+    <script src="app.js"></script>
+    <script src="views/navbar.js"></script>
+    <script src="views/signup/signup.js"></script>
+    <script src="views/login/login.js"></script>
+    <script src="views/main/main.js"></script>
+    <script src="views/user/user.js"></script>
+</body>
+
+</html>

webapp/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "MEANseed-webapp",
+  "private": true,
+  "version": "0.0.0",
+  "description": "MEANseed",
+  "repository": "https://github.com/arnaucode/MEANseed",
+  "license": "MIT",
+  "devDependencies": {
+    "bower": "^1.7.7",
+    "http-server": "^0.9.0"
+  },
+  "scripts": {
+    "postinstall": "bower install",
+    "prestart": "npm install",
+    "start": "http-server -p 8080 -c-1 ./"
+  },
+  "dependencies": {
+    "bower": "latest",
+	"connect": "latest",
+	"serve-static": "latest"
+  }
+}

webapp/views/login/login.html

@@ -0,0 +1,32 @@
+<div class="container">
+    <div class="row">
+        <div class="col-sm-4">
+
+        </div>
+        <div class="col-sm-4">
+            <div class="panel-body">
+                <h2>MEANseed - webapp</h2>
+            </div>
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">Login</h3>
+                </div>
+                <div class="panel-body">
+                    <div class="form-group label-floating">
+                        <input ng-model="user.username" abmFormControl class="form-control" id="inputUsername" placeholder="Username" type="text">
+                    </div>
+                    <div class="form-group">
+                        <input ng-model="user.password" abmFormControl class="form-control" id="inputPassword" placeholder="Password" type="password">
+                    </div>
+                    <a ng-href="#!/signup" class="btn btn-raised c_grey500">Signup</a>
+                    <div ng-click="doLogin()" class="btn btn-raised c_blue300 pull-right">Login</div>
+                </div>
+            </div>
+        </div>
+
+
+        <div class="col-sm-4">
+
+        </div>
+    </div>
+</div>

webapp/views/login/login.js

@@ -0,0 +1,42 @@
+'use strict';
+
+angular.module('app.login', ['ngRoute'])
+
+.config(['$routeProvider', function($routeProvider) {
+  $routeProvider.when('/login', {
+    templateUrl: 'views/login/login.html',
+    controller: 'LoginCtrl'
+  });
+}])
+
+.controller('LoginCtrl', function($scope, $http, $routeParams) {
+    $scope.user = {};
+    $scope.doLogin = function() {
+      console.log('Doing login', $scope.user);
+
+      $http({
+          url: urlapi + 'login',
+          method: "POST",
+          data: $scope.user
+      })
+      .then(function(response) {
+              console.log("response: ");
+              console.log(response.data);
+              if (response.data.success == true)
+              {
+                  localStorage.setItem("meanseed_token", response.data.token);
+                  localStorage.setItem("meanseed_userdata", JSON.stringify(response.data.user));
+                  window.location.reload();
+              }else{
+                  console.log("login failed");
+              }
+
+
+      },
+      function(response) { // optional
+              // failed
+              console.log(response);
+      });
+
+    };
+});

webapp/views/main/main.html

@@ -0,0 +1,58 @@
+<div class="container">
+    <div class="row">
+        <div class="col-sm-4">
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">
+                        All users
+                        <span class="badge badge-secondary pull-right c_blue300">{{users.length}}</span>
+                    </h3>
+                </div>
+                <div class="panel-body" style="max-height: 500px;overflow-y: scroll;">
+                    <div class="list-group">
+                        <a ng-repeat="user in users" ng-href="#!/user/{{user._id}}" class="list-group-item">
+                            <div class="row-picture">
+                                <img class="circle" ng-src="{{user.avatar}}" alt="icon">
+                            </div>
+                            <div class="row-content">
+                                <h4 class="list-group-item-heading">
+                                    {{user.username}}
+                                    <span ng-show="user.validated" class="badge badge-secondary c_blue300">Validated</span>
+                                </h4>
+
+                                <p class="list-group-item-text">{{user.description}}</p>
+                                <p class="list-group-item-text">{{user.travels.length}} published travels</p>
+                                <p class="list-group-item-text">{{user.likes.length}} likes</p>
+                            </div>
+                            <div class="list-group-separator"></div>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-6">
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">
+                        All posts
+                        <span class="badge badge-secondary pull-right c_blue300">{{travels.length}}</span>
+                    </h3>
+                </div>
+                <div class="panel-body" style="max-height: 500px;overflow-y: scroll;">
+
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-2">
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">Actions</h3>
+                </div>
+                <div class="panel-body">
+                    <div class="btn btn-block btn-sm c_blue300">Create new post</div>
+                    <a href="#!/network" class="btn btn-block btn-sm c_blue300">View network</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

webapp/views/main/main.js

@@ -0,0 +1,26 @@
+'use strict';
+
+angular.module('app.main', ['ngRoute'])
+
+    .config(['$routeProvider', function($routeProvider) {
+        $routeProvider.when('/main', {
+            templateUrl: 'views/main/main.html',
+            controller: 'MainCtrl'
+        });
+    }])
+
+    .controller('MainCtrl', function($scope, $http) {
+        $scope.users = [];
+        $scope.loadMorePagination = true;
+        $scope.pageUsers = 0;
+        $http.get(urlapi + 'users?page=' + $scope.pageUsers)
+            .then(function(data) {
+                console.log('data success');
+                console.log(data);
+                $scope.users = data.data;
+
+            }, function(data) {
+                console.log('data error');
+            });
+
+    });

webapp/views/navbar.html

@@ -0,0 +1,44 @@
+<div ng-controller="NavbarCtrl">
+<div ng-show="storageuser" class="navbar c_grey700">
+    <div class="container-fluid">
+        <div class="navbar-header">
+            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+            <a class="navbar-brand" href="/">MEANseed Dashboard</a>
+        </div>
+        <div class="navbar-collapse collapse navbar-responsive-collapse">
+            <ul class="nav navbar-nav">
+                <li class="active"><a href="javascript:void(0)">Users</a></li>
+                <li><a href="#!/network">Network</a></li>
+                <li><a href="#!/userNetwork">User network</a></li>
+            </ul>
+            <form ng-submit="search()" class="navbar-form navbar-left">
+                <div class="form-group">
+                    <input ng-model="searchString" class="form-control col-md-8" placeholder="Search" type="text">
+                </div>
+            </form>
+            <ul class="nav navbar-nav navbar-right">
+                <li><a href="javascript:void(0)">Info</a></li>
+                <li class="dropdown">
+                    <a href="" data-target="#" class="dropdown-toggle" data-toggle="dropdown">Settings
+            <b class="caret"></b></a>
+                    <ul class="dropdown-menu">
+                        <li><a href="javascript:void(0)">Action</a></li>
+                        <li><a href="javascript:void(0)">Another action</a></li>
+                        <li><a href="javascript:void(0)">Something else here</a></li>
+                        <li class="divider"></li>
+                        <li><a href="javascript:void(0)">Separated link</a></li>
+                    </ul>
+                </li>
+                <li><a href="" ng-click="logout()">Logout</a></li>
+            </ul>
+        </div>
+    </div>
+</div>
+<!--
+<div ng-click="goBack()" class="btn"><span class="glyphicon glyphicon-arrow-left"></span> Back</div>
+-->
+</div>

webapp/views/navbar.js

@@ -0,0 +1,35 @@
+'use strict';
+
+angular.module('app.navbar', ['ngRoute'])
+
+    .config(['$routeProvider', function($routeProvider) {
+        $routeProvider.when('/navbar', {
+            templateUrl: 'views/navbar/navbar.html',
+            controller: 'NavbarCtrl'
+        });
+    }])
+
+    .controller('NavbarCtrl', function($scope, $http, $routeParams, $location) {
+        $scope.searchString = "";
+        $scope.locationHash = $location.path();
+        console.log($scope.locationHash);
+        $scope.goBack = function() {
+            console.log("goBack");
+            window.history.back();
+        };
+
+        $scope.search = function() {
+            console.log($scope.searchString);
+            window.location.href = "#!/search/" + $scope.searchString;
+        };
+        if (localStorage.getItem("meanseed_userdata")) {
+          $scope.storageuser = JSON.parse(localStorage.getItem("meanseed_userdata"));
+          console.log($scope.storageuser);
+        }
+
+        $scope.logout = function() {
+            localStorage.removeItem("meanseed_token");
+            localStorage.removeItem("meanseed_userdata");
+            window.location.reload();
+        };
+    });

webapp/views/signup/signup.html

@@ -0,0 +1,38 @@
+<div class="container">
+    <div class="row">
+        <div class="col-sm-4">
+
+        </div>
+        <div class="col-sm-4">
+            <div class="panel-body">
+                <h2>MEANseed - webapp</h2>
+            </div>
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">Signup</h3>
+                </div>
+                <div class="panel-body">
+                    <div class="form-group label-floating">
+                        <input ng-model="user.username" abmFormControl class="form-control" id="inputUsername" placeholder="Username" type="text">
+                    </div>
+                    <div class="form-group">
+                        <input ng-model="user.password" abmFormControl class="form-control" id="inputPassword" placeholder="Password" type="password">
+                    </div>
+                    <div class="form-group label-floating">
+                        <input ng-model="user.email" abmFormControl class="form-control" id="inputEmail" placeholder="Email" type="text">
+                    </div>
+                    <div class="form-group label-floating">
+                        <input ng-model="user.phone" abmFormControl class="form-control" id="inputPhone" placeholder="Phone" type="text">
+                    </div>
+                    <a ng-href="#!/login" class="btn btn-raised c_grey500">Back</a>
+                    <div ng-click="doLogin()" class="btn btn-raised c_blue300 pull-right">Signup</div>
+                </div>
+            </div>
+        </div>
+
+
+        <div class="col-sm-4">
+
+        </div>
+    </div>
+</div>

webapp/views/signup/signup.js

@@ -0,0 +1,42 @@
+'use strict';
+
+angular.module('app.signup', ['ngRoute'])
+
+.config(['$routeProvider', function($routeProvider) {
+  $routeProvider.when('/signup', {
+    templateUrl: 'views/signup/signup.html',
+    controller: 'SignupCtrl'
+  });
+}])
+
+.controller('SignupCtrl', function($scope, $http, $routeParams) {
+    $scope.user = {};
+    $scope.doLogin = function() {
+      console.log('Doing login', $scope.user);
+
+      $http({
+          url: urlapi + 'signup',
+          method: "POST",
+          data: $scope.user
+      })
+      .then(function(response) {
+              console.log("response: ");
+              console.log(response.data);
+              if (response.data.success == true)
+              {
+                  localStorage.setItem("meanseed_token", response.data.token);
+                  localStorage.setItem("meanseed_userdata", JSON.stringify(response.data.user));
+                  window.location.reload();
+              }else{
+                  console.log("login failed");
+              }
+
+
+      },
+      function(response) { // optional
+              // failed
+              console.log(response);
+      });
+
+    };
+});

webapp/views/user/user.html

@@ -0,0 +1,47 @@
+<div class="container">
+    <div class="row">
+        <div class="col-sm-6">
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">User profile</h3>
+                </div>
+                <div class="panel-body">
+                    <div class="list-group">
+                        <a class="list-group-item">
+                            <div class="row-picture">
+                                <img class="circle" ng-src="{{user.avatar}}" alt="icon">
+                            </div>
+                            <div class="row-content">
+                                <h4 class="list-group-item-heading">
+                                    {{user.username}}
+                                    <span ng-show="user.validated" class="badge badge-secondary c_blue300">Validated</span>
+                                </h4>
+
+                                <p class="list-group-item-text">{{user.description}}</p>
+                            </div>
+                        </a>
+                    </div>
+                    <p>
+                        {{user.email}}
+                    </p>
+                    <p>
+                        {{user.telegram}}
+                    </p>
+                    <p>
+                        {{user.phone}}
+                    </p>
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-6">
+            <div class="panel">
+                <div class="panel-heading c_blue300">
+                    <h3 class="panel-title">User posts</h3>
+                </div>
+                <div class="panel-body">
+
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

webapp/views/user/user.js

@@ -0,0 +1,23 @@
+'use strict';
+
+angular.module('app.user', ['ngRoute'])
+
+    .config(['$routeProvider', function($routeProvider) {
+        $routeProvider.when('/user/:userid', {
+            templateUrl: 'views/user/user.html',
+            controller: 'UserCtrl'
+        });
+    }])
+
+    .controller('UserCtrl', function($scope, $http, $routeParams) {
+        $scope.user = {};
+        $http.get(urlapi + 'users/id/' + $routeParams.userid)
+            .then(function(data, status, headers, config) {
+                console.log('data success');
+                console.log(data);
+
+                $scope.user = data.data;
+            }, function(data, status, headers, config) {
+                console.log('data error');
+            });
+    });