LeClubInfo / ci-site2016

Commit 8ae24f57edeec7a58824dbe93dc5c685f7f71499

Authored by Geoffrey PREUD'HOMME
1 parent 894b21fa

Liste des membres 

Les membres du Club Info seront désormais appelés les nerds ^^
L'ajout et la supression des membres est surtout un test, je pense pas
qu'on la gardera, vu que ça sera super souvent ^^ on pourra faire ça à
la main.

D'après https://scotch.io/tutorials/creating-a-single-page-todo-app-with-node-and-angular
Showing 9 changed files with 175 additions and 60 deletions   Show diff stats
Inline Side-by-side
app/models/nerd.js
  Show/Hide comments   View file @8ae24f5
... ... @@ -5,8 +5,20 @@ var mongoose = require('mongoose');
5 5 // define our nerd model
6 6 // module.exports allows us to pass this to other files when it is called
7 7 module.exports = mongoose.model('Nerd', {
8   - name: {
  8 + login: {
9 9 type: String,
10   - default: ''
  10 + default: 'login'
  11 + },
  12 + section: {
  13 + type: String,
  14 + default: 'IMA'
  15 + },
  16 + promo: {
  17 + type: Number,
  18 + default: 2017
  19 + },
  20 + role: {
  21 + type: String,
  22 + default: 'Membre'
11 23 }
12 24 });
13 25 \ No newline at end of file
... ...
app/routes.js
  Show/Hide comments   View file @8ae24f5
1   - // app/routes.js
2   -
3   - // grab the nerd model we just created
4   - var Nerd = require('./models/nerd');
5   -
6   - module.exports = function (app) {
7   -
8   - // server routes ===========================================================
9   - // handle things like api calls
10   - // authentication routes
11   -
12   - // sample api route
13   - app.get('/api/nerds', function (req, res) {
14   - // use mongoose to get all nerds in the database
15   - Nerd.find(function (err, nerds) {
16   -
17   - // if there is an error retrieving, send the error.
18   - // nothing after res.send(err) will execute
19   - if (err)
20   - res.send(err);
21   -
22   - res.json(nerds); // return all nerds in JSON format
23   - });
24   - });
25   -
26   - // route to handle creating goes here (app.post)
27   - // route to handle delete goes here (app.delete)
28   -
29   - // frontend routes =========================================================
30   - // route to handle all angular requests
31   - app.get('*', function (req, res) {
32   - res.sendfile('./public/views/index.html'); // load our public/index.html file
33   - });
34   -
35   - };
36 1 \ No newline at end of file
  2 +// app/routes.js
  3 +
  4 +// grab the nerd model we just created
  5 +var Nerd = require('./models/nerd');
  6 +
  7 +module.exports = function (app) {
  8 +
  9 + // server routes ===========================================================
  10 + // handle things like api calls
  11 + // authentication routes
  12 +
  13 + // sample api route
  14 + app.get('/api/nerds', function (req, res) {
  15 + // use mongoose to get all nerds in the database
  16 + Nerd.find(function (err, nerds) {
  17 + if (err)
  18 + res.send(err);
  19 + res.json(nerds);
  20 + });
  21 + });
  22 + app.post('/api/nerds', function (req, res) {
  23 + Nerd.create({
  24 + login: req.body.login,
  25 + role: req.body.role,
  26 + section: req.body.section,
  27 + }, function (err, nerd) {
  28 + if (err)
  29 + res.send(err);
  30 + Nerd.find(function (err, nerds) {
  31 + if (err)
  32 + res.send(err);
  33 + res.json(nerds);
  34 + });
  35 + });
  36 + });
  37 + app.delete('/api/nerds/:nerd_id', function (req, res) {
  38 + Nerd.remove({
  39 + _id: req.params.nerd_id
  40 + }, function (err, nerd) {
  41 + if (err)
  42 + res.send(err);
  43 + Nerd.find(function (err, nerds) {
  44 + if (err)
  45 + res.send(err);
  46 + res.json(nerds);
  47 + });
  48 + })
  49 + })
  50 +
  51 + // route to handle creating goes here (app.post)
  52 + // route to handle delete goes here (app.delete)
  53 +
  54 + // frontend routes =========================================================
  55 + // route to handle all angular requests
  56 + app.get('*', function (req, res) {
  57 + res.sendfile('./public/views/index.html'); // load our public/index.html file
  58 + });
  59 +
  60 +};
37 61 \ No newline at end of file
... ...
package.json
  Show/Hide comments   View file @8ae24f5
... ... @@ -5,6 +5,7 @@
5 5 "body-parser": "^1.12.0",
6 6 "express": "^4.12.2",
7 7 "method-override": "^2.3.1",
8   - "mongoose": "^3.8.25"
  8 + "mongoose": "^3.8.25",
  9 + "morgan": "^1.5.1"
9 10 }
10 11 }
... ...
public/css/style.css 0 → 100644
  Show/Hide comments   View file @8ae24f5
... ... @@ -0,0 +1,9 @@
  1 +html {
  2 + overflow-y: scroll;
  3 +}
  4 +body {
  5 + padding-top: 50px;
  6 +}
  7 +#nerd-list {
  8 + width: 90 %;
  9 +}
0 10 \ No newline at end of file
... ...
public/js/controllers/NerdCtrl.js
  Show/Hide comments   View file @8ae24f5
1 1 // public/js/controllers/NerdCtrl.js
2   -angular.module('NerdCtrl', []).controller('NerdController', function ($scope) {
  2 +angular.module('NerdCtrl', []).controller('NerdController', function ($scope, $http) {
  3 + $scope.formData = {};
3 4  
4   - $scope.tagline = 'Nothing beats a pocket protector!';
  5 + // when landing on the page, get all Nerds and show them
  6 + $http.get('/api/nerds')
  7 + .success(function (data) {
  8 + $scope.nerds = data;
  9 + console.log(data);
  10 + })
  11 + .error(function (data) {
  12 + console.log('Error: ' + data);
  13 + });
  14 +
  15 + // when submitting the add form, send the text to the node API
  16 + $scope.createNerd = function () {
  17 + console.log('Adding', $scope.formData);
  18 + $http.post('/api/nerds', $scope.formData)
  19 + .success(function (data) {
  20 + $scope.formData = {}; // clear the form so our user is ready to enter another
  21 + $scope.nerds = data;
  22 + })
  23 + .error(function (data) {
  24 + console.log('Error: ' + data);
  25 + });
  26 + };
  27 +
  28 + // delete a Nerd after checking it
  29 + $scope.deleteNerd = function (id) {
  30 + $http.delete('/api/nerds/' + id)
  31 + .success(function (data) {
  32 + $scope.nerds = data;
  33 + console.log(data);
  34 + })
  35 + .error(function (data) {
  36 + console.log('Error: ' + data);
  37 + });
  38 + };
5 39  
6 40 });
7 41 \ No newline at end of file
... ...
public/js/services/NerdService.js
  Show/Hide comments   View file @8ae24f5
... ... @@ -7,9 +7,6 @@ angular.module('NerdService', []).factory('Nerd', ['$http',
7 7 get: function () {
8 8 return $http.get('/api/nerds');
9 9 },
10   -
11   -
12   - // these will work when more API routes are defined on the Node side of things
13 10 // call to POST and create a new nerd
14 11 create: function (nerdData) {
15 12 return $http.post('/api/nerds', nerdData);
... ...
public/views/index.html
  Show/Hide comments   View file @8ae24f5
1   -<!-- public/index.html -->
2 1 <!doctype html>
3   -<html lang="en">
  2 +<html lang="fr">
4 3 <head>
5   - <meta charset="UTF-8">
  4 + <!-- META -->
  5 + <meta charset="utf-8">
6 6 <base href="/">
7   - <title>Starter Node and Angular</title>
  7 + <meta name="viewport" content="width=device-width, initial-scale=1">
  8 + <title>Club Informatique de Polytech Lille</title>
8 9 <!-- CSS -->
9 10 <link rel="stylesheet" href="libs/bootstrap/dist/css/bootstrap.min.css">
10 11 <link rel="stylesheet" href="css/style.css"> <!-- custom styles -->
11 12 <!-- JS -->
  13 + <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
12 14 <script src="libs/angular/angular.min.js"></script>
13 15 <script src="libs/angular-route/angular-route.min.js"></script>
14   - <!-- ANGULAR CUSTOM -->
15 16 <script src="js/controllers/MainCtrl.js"></script>
16 17 <script src="js/controllers/NerdCtrl.js"></script>
17 18 <script src="js/services/NerdService.js"></script>
... ... @@ -20,17 +21,14 @@
20 21 </head>
21 22 <body ng-app="sampleApp" ng-controller="NerdController">
22 23 <div class="container">
23   - <!-- HEADER -->
24 24 <nav class="navbar navbar-inverse">
25 25 <div class="navbar-header">
26   - <a class="navbar-brand" href="/">Stencil: Node and Angular</a>
  26 + <a class="navbar-brand" href="/">Club Info</a>
27 27 </div>
28   - <!-- LINK TO OUR PAGES. ANGULAR HANDLES THE ROUTING HERE -->
29 28 <ul class="nav navbar-nav">
30 29 <li><a href="/nerds">Nerds</a></li>
31 30 </ul>
32 31 </nav>
33   - <!-- ANGULAR DYNAMIC CONTENT -->
34 32 <div ng-view></div>
35 33 </div>
36 34 </body>
... ...
public/views/nerd.html
  Show/Hide comments   View file @8ae24f5
1   -<!-- public/views/nerd.html -->
2   -
3   -<div class="jumbotron text-center">
4   - <h1>Nerds and Proud</h1>
5   -
6   - <p>{{ tagline }}</p>
7   -</div>
  1 +<div class="container">
  2 + <!-- HEADER AND TODO COUNT -->
  3 + <div class="jumbotron text-center">
  4 + <h1>Il y a <span class="label label-info">{{ nerds.length }}</span> personnes au Club Info !</h1>
  5 + </div>
  6 + <table id="nerd-list">
  7 + <thead>
  8 + <tr>
  9 + <th>Nom</th>
  10 + <th>Section</th>
  11 + <th>Rôle</th>
  12 + <th>Action</th>
  13 + </tr>
  14 + </thead>
  15 + <tbody ng-repeat="nerd in nerds">
  16 + <tr>
  17 + <td>{{ nerd.login }}</td>
  18 + <td>{{ nerd.section }}</td>
  19 + <td>{{ nerd.role }}</td>
  20 + <td><button type="button" class="btn btn-danger" aria-label="Expulser" ng-click="deleteNerd(nerd._id)">
  21 + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
  22 + </button>
  23 + </td>
  24 + </tr>
  25 + </tbody>
  26 + <tfoot id="nerd-form">
  27 + <tr class="form-group">
  28 + <td>
  29 + <input type="text" class="form-control input-lg" placeholder="Login" ng-model="formData.login">
  30 + </td>
  31 + <td class="form-inline">
  32 + <input type="text" class="form-control input-lg" placeholder="Section" ng-model="formData.section"><input type="number" class="form-control input-lg" placeholder="2015" ng-model="formData.promo">
  33 + </td>
  34 + <td>
  35 + <input type="text" class="form-control input-lg" placeholder="Rôle" ng-model="formData.role">
  36 + </td>
  37 + <td>
  38 + <button type="submit" class="btn btn-primary" aria-label="Ajouter" ng-click="createNerd()">
  39 + <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
  40 + </button>
  41 + </td>
  42 + </tr>
  43 + </tfoot>
  44 + </table>
  45 +</div>
8 46 \ No newline at end of file
... ...
server.js
  Show/Hide comments   View file @8ae24f5
... ... @@ -3,6 +3,8 @@
3 3 // modules =================================================
4 4 var express = require('express');
5 5 var app = express();
  6 +var mongoose = require('mongoose');
  7 +var morgan = require('morgan');
6 8 var bodyParser = require('body-parser');
7 9 var methodOverride = require('method-override');
8 10  
... ... @@ -16,7 +18,7 @@ var port = process.env.PORT || 8080;
16 18  
17 19 // connect to our mongoDB database
18 20 // (uncomment after you enter in your own credentials in config/db.js)
19   -// mongoose.connect(db.url);
  21 +mongoose.connect(db.url);
20 22  
21 23 // get all data/stuff of the body (POST) parameters
22 24 // parse application/json
... ...