...
 
Commits (70)
......@@ -3,6 +3,7 @@ const Contribution = require('../models/contribution');
const router = express.Router();
// Get all contributions of a given debate
router.get('/:debateId', (req, res) => {
const debateId = req.params.debateId;
......@@ -11,4 +12,28 @@ router.get('/:debateId', (req, res) => {
});
});
// Get all contributions of a given synthese
router.get('/synthese/:syntheseId', (req, res) => {
const syntheseId = req.params.syntheseId;
Contribution.allsynthese(req.db, syntheseId, (err, contributions) => {
res.json(contributions);
});
});
router.get('/:debateId/:end', (req, res) => {
const debateId = req.params.debateId;
const end = req.params.end;
Contribution.getByDate(req.db, debateId, end, (err, contributions) => {
res.json(contributions);
});
});
router.get('/:debateId/stat/stat', (req, res) => {
const debateId = req.params.debateId;
const end = req.params.end;
Contribution.countByDay(req.db, debateId, (err, contributions) => {
res.json(contributions);
});
});
module.exports = router;
......@@ -4,5 +4,6 @@ const router = express.Router();
router.use('/debates', require('./debate'));
router.use('/contributions', require('./contribution'));
router.use('/syntheses', require('./synthese'));
module.exports = router;
const express = require('express');
const Synthese = require('../models/synthese');
const router = express.Router();
// Get all syntheses of a given debate
router.get('/:debateId', (req, res) => {
const debateId = req.params.debateId;
Synthese.alldebate(req.db, debateId, (err, syntheses) => {
res.json(syntheses);
});
});
// Get all syntheses
router.get('/', (req, res) => {
Synthese.all(req.db, (err, syntheses) => {
res.json(syntheses);
});
});
module.exports = router;
......@@ -11,18 +11,6 @@ const router = express.Router();
// Create a new contribution
router.post('/', (req, res) => {
var dateNewContrib = new Date();
var jour = dateNewContrib.getDate();
var mois = dateNewContrib.getMonth()+1;
var annee = dateNewContrib.getFullYear();
var heure = dateNewContrib.getHours();
var minute = dateNewContrib.getMinutes();
var seconde = dateNewContrib.getSeconds();
var contribDateHeure =jour+'/'+mois+'/'+annee+':'+heure+'H'+minute+'min'+seconde+'s';
const obj = {
debate: req.body.debate,
parent: req.body.parent,
......@@ -30,7 +18,7 @@ router.post('/', (req, res) => {
name: req.body.name,
value: req.body.value,
auteur: req.body.auteur,
timestamp: contribDateHeure
timestamp: new Date()
};
Contribution.new(req.db, obj, (err) => {
......
......@@ -64,16 +64,22 @@ router.get('/new', (req, res) => {
);
});
// Show debate
//Show debate
router.get('/show/:id', async (req, res) => {
const id = req.params.id;
const debate = await getJSON(`http://localhost:3000/api/debates/${id}`);
const contributions = await getJSON(`http://localhost:3000/api/contributions/${id}`);
const syntheses = await getJSON(`http://localhost:3000/api/syntheses/${id}`);
const stats = await getJSON(`http://localhost:3000/api/contributions/${id}/stat/stat`);
res.render(
'pages/debate/debate', {
title: debate.question,
debate: debate,
contributions: contributions,
syntheses: syntheses,
stats: stats
},
);
});
......
......@@ -4,12 +4,11 @@ const router = express.Router();
router.use('/debates', require('./debate'));
router.use('/contributions', require('./contribution'));
router.use('/syntheses', require('./synthese'));
// Home page
router.get('/', (req, res) => {
res.render('index', {
title: 'AgoraViz',
});
res.redirect('/debates');
});
// About page
......
const express = require('express');
const getJSON = require('get-json');
const Synthese = require('../models/synthese');
const router = express.Router();
/*
CRUD
*/
// Create a new synthese
router.post('/', (req, res) => {
var dateNewSynthese = new Date();
var jour = dateNewSynthese.getDate();
var mois = dateNewSynthese.getMonth()+1;
var annee = dateNewSynthese.getFullYear();
var heure = dateNewSynthese.getHours();
var minute = dateNewSynthese.getMinutes();
var seconde = dateNewSynthese.getSeconds();
var syntheseDateHeure =jour+'/'+mois+'/'+annee+':'+heure+'H'+minute+'min'+seconde+'s';
/*
contribsToInsert = [];
req.body.contributions.forEach(function (c){
contribsToInsert.push(ObjectId(c));
})*/
const obj = {
description: req.body.description,
contributions: req.body.contributions,
debate: req.body.debate,
auteur: req.body.auteur,
timestamp: syntheseDateHeure,
};
Synthese.new(req.db, obj, (err) => {
if (err) {
res.send('Error when trying to create a synthese');
}
res.redirect('/debates');
});
});
// Delete a synthese
router.post('/delete/:id', (req, res) => {
const id = req.params.id;
Synthese.delete(req.db, id, (err) => {
if (err) {
res.send('Error trying to delete a synthese')
}
res.redirect('/debates');
});
});
module.exports = router;
......@@ -12,6 +12,47 @@ exports.all = (db, debate, cb) => {
});
};
exports.getByDate = (db, debate, end, cb) => {
const debateId = debate;
db.get('contribcollection').find({
debate: ObjectId(debateId),
timestamp:{$lte:new Date(end)}
}, {}, (err, docs) => {
return err ?
cb(err)
: cb(null, docs);
});
};
exports.countByDay = (db, debate, cb) => {
const debateId = debate;
db.get('contribcollection').aggregate(
[{
$group: {
_id: {
month: {
$month: "$timestamp"
},
day: {
$dayOfMonth: "$timestamp"
},
year: {
$year: "$timestamp"
}
},
count: {
$sum: 1
}
}
}], (err, docs) => {
return err ?
cb(err) :
cb(null, docs);
})
};
// Create a new contribution
exports.new = (db, obj, cb) => {
db.get('contribcollection').insert({
......
const ObjectId = require('mongodb').ObjectID;
// Get all syntheses of a given debate
exports.alldebate = (db, debate, cb) => {
const debateId = debate;
db.get('synthesecollection').find({
debate: ObjectId(debateId),
}, {}, (err, docs) => {
return err ?
cb(err)
: cb(null, docs);
});
};
// Get all syntheses
exports.all = (db, cb) => {
db.get('synthesecollection').find({}, {}, (err, docs) => {
if (err) return cb(err);
return cb(null, docs);
});
};
// Get one synthese
exports.one = (db, id, cb) => {
db.get('synthesecollection').findOne({
_id: id,
}, {}, (err, doc) => {
return err ?
cb(err)
: cb(null, doc);
});
};
// Create a new synthese
exports.new = (db, obj, cb) => {
db.get('synthesecollection').insert({
description: obj.description,
contributions: obj.contributions,
debate: ObjectId(obj.debate),
auteur: obj.auteur,
timestamp: obj.timestamp,
}, {}, (err, doc) => {
db.get('contribcollection').find({}).each(function (contrib) {
var synthese = db.get('synthesecollection').find({ description : obj.description});
if (obj.contributions.includes(JSON.stringify(contrib.name))) {
console.log(synthese._id);
db.get('contribcollection').update({ _id: contrib._id},{$set: {synthese: obj.description}});
}},{}, (err, doc) => {
return err ?
cb(err)
: cb(null, doc);
});
return err ?
cb(err)
: cb(null, doc);
});
};
// Delete a synthese
exports.delete = (db, id, cb) => {
db.get('synthesecollection').remove({
_id: id,
}, {}, (err) => {
return err ?
cb(err)
: cb(null);
});
};
.line {
fill: none;
stroke: steelblue;
stroke-width: 2px;
}
.node circle {
fill: #fff;
stroke: #FF69B4;
stroke-width: 1.5px;
}
.node {
......@@ -12,15 +17,161 @@
stroke-width: 1.5px;
}
div.tooltip {
position: absolute;
text-align: center;
width: 260px;
height: 90px;
padding: 2px;
font: 12px sans-serif;
background: lightsteelblue;
border: 0px;
border-radius: 8px;
pointer-events: none;
}
\ No newline at end of file
div.tooltip {
position: absolute;
text-align: center;
width: 260px;
height: 90px;
padding: 2px;
font: 12px sans-serif;
background: lightsteelblue;
border: 0px;
border-radius: 8px;
pointer-events: none;
}
#addNode {
visibility: hidden;
}
.draggable {
cursor: move;
}
#leTitre{
height: 100px;
}
#fondnavbar{
width : 100%;
height : 50px;
background : linear-gradient(#ffffff,#cbcbcb);
border-radius : 4px 4px 4px 4px;
box-shadow: 0px 0px 2px 2px rgba(120,120,120,0.5),
0px 1px 0px 1px rgba(255, 255, 255,0.5) inset,
0px -3px 0px 1px rgba(120,120,120,0.1) inset;
}
#navbar{
font-family: "Trebuchet MS";
margin-right: auto;
margin-left: auto;
margin-top: 0;
display: table;
padding: 0;
}
#navbar li{
display: table-cell;
width : 180px;
transition: 1s;
}
#navbar li:hover{
width: 190px;
transition: 1s;
}
#navbar a{
color: #3b3b3b;
text-decoration: none;
display: block;
line-height : 50px;
text-align: center;
text-shadow: 0 1px 0px rgba(0,0,0,0.2);
transition: 1s;
}
#navbar a:hover{
color : black;
text-shadow: 0 1px 0px rgba(0,0,0,0.5);
background: rgba(255, 255, 255, 0.5);
transition: 1s;
}
#grandFond{
background : linear-gradient(#ffffff,#e0e0e0);
box-shadow: 0px 0px 2px 2px rgba(120,120,120,0.5),
0px 1px 0px 1px rgba(255, 255, 255,0.5) inset,
0px -3px 0px 1px rgba(120,120,120,0.1) inset;
}
#colGauche{
background: #e0e0e0;
}
#colDroite{
background: #e0e0e0;
}
#menuResume li{
display: table;
width:100px;
height: 20px;
border-radius: 2px 2px 2px 2px;
float:left;
}
#lContrib{
display: none;
}
#lContrib li{
display: table;
height: 70px;
}
#lSynth{
display: none;
}
#lSynth li{
display: table;
height: 70px;
}
#definitions{
display: none;
}
#sources{
display: none;
}
#dateForm{
display: none;
}
#label{
width:100%;
}
#comment{
width:100%;
}
#auteur{
width:100%;
}
#description{
width:100%;
}
#auteursynthese{
width:100%;
}
#NewDebatContainer{
margin-top: 50px;
}
#listAddDebat li{
display: table-row;
height: 50px;
}
#inputDebatQuestion{
width:400px;
}
#basPage{
position: absolute;
bottom: 0px;
width: 90%;
}
#basPage p{
text-align: center;
}
$(document).ready(function () {
$('#debates').DataTable();
})
function addCircleDraggable(){
var offset, x, y;
$("#newNode").remove();
d3.select("g").append("circle")
.attr("r", 4.5)
.style('fill', function() { return color($('#type').val());})
.attr("class", "draggable")
.attr("id", "newNode")
.attr("cx", 700)
.attr("cy", 400)
.attr("transform", function() { return "translate(-200 -200)"; })
.call(d3.drag()
.on("start", dragstarted)
.on("drag", dragged)
.on("end", dragended)
);
function dragstarted(d) {
x=+d3.event.x;
y=+d3.event.y;
d3.select(this).raise().classed("active", true);
offset=d3.event;
offset.x -= parseFloat(d3.select(this).attr("cx"));
offset.y -= parseFloat(d3.select(this).attr("cx"));
}
function dragged(d) {
console.log("start");
d3.select(this).attr("cx", d3.event.x - offset.x);
d3.select(this).attr("cy", d3.event.y - offset.y);
$(this).css({
'pointer-events' : 'none'
})
}
function dragended(d) {
console.log("ended");
d3.select(this).classed("active", false);
$(this).css({
'pointer-events' : 'auto'
})
}
/*
d3.selectAll(".node").on("mouseover", handle)
function handle(d){
console.log("you", d);
selected=d;
$("#addNode").click();
}
*/
}
var data=[
{ "date":"01-01-2019",
"count":7
},
{ "date":"02-02-2019",
"count":5
},
{ "date":"03-02-2019",
"count":1
},
{ "date":"10-02-2019",
"count":6
},
{ "date":"20-02-2019",
"count":5
},
{ "date":"21-02-2019",
"count":3
},
{ "date":"22-02-2019",
"count":6
},
]
var margin = {top: 20, right: 20, bottom: 30, left: 50},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
// parse the date / time
var parseTime = d3.timeParse("%d-%m-%Y");
// set the ranges
var x = d3.scaleTime().range([0, width]);
var y = d3.scaleLinear().range([height, 0]);
var bisect = d3.bisector(function (data) {
return data.date;
}).right;
createLine(stats);
function createLine(data){
// define the line
var valueline = d3.line()
.x(function(d) { console.log("x", x(d.date)); return x(d.date); })
.y(function(d) { console.log("y", y(d.count)); return y(d.count); })
.curve(d3.curveMonotoneX)
// append the svg obgect to the body of the page
// appends a 'group' element to 'svg'
// moves the 'group' element to the top left margin
$("#affTreeMap").append('<svg width="672" id="stat" height="372"></svg>')
var svg = d3.select("#stat")
// .attr("width", width + margin.left + margin.right)
// .attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform",
"translate(" + margin.left + "," + margin.bottom + ") scale(0.6,0.45)")
// format the data
data.forEach(function(d) {
// d.date = parseTime(d.date);
d.date = parseTime(d._id.day+"-"+d._id.month+"-"+d._id.year)
d.count = +d.count;
});
// Scale the range of the data
x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain([0, d3.max(data, function(d) { return d.count; })]);
// Add the valueline path.
svg.append("path")
.data([data])
.attr("class", "line")
.attr("d", valueline);
// Add the X Axis
svg.append("g")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x));
// Add the Y Axis
svg.append("g")
.call(d3.axisLeft(y));
svg
.append("g")
.selectAll("circle")
.data(data)
.enter().append("circle")
.attr("r", 4.5)
.attr("class", "plot")
.attr("cx", function(d) { console.log(d.date); return x(d.date); })
.attr("cy", function(d) { console.log(d.count); return y(d.count); })
.style("fill", "white")
.style("stroke", "blue")
.on("click", handleCircle)
$(svg).css({
'pointer-events' : 'auto'
})
function handleCircle(d){
var x= d.date;
var y= d.count;
var month = d.date.getMonth() <10 ? "0"+d.date.getMonth().toString() : d.date.getMonth().toString();
var day = d.date.getDay() <10 ? "0"+d.date.getDay().toString() : d.date.getDay().toString();
console.log( d.date.getMonth()<10, d.date.getFullYear()+"-"+month+"-"+day);
$("#dateValue").val(d.date.getFullYear()+"-"+month+"-"+day)
//$("#end").click();
}
}
\ No newline at end of file
function showHideContrib() {
var x = document.getElementById("lContrib");
if (x.style.display == 'none')
{
x.style.display = 'block';
}else
{
x.style.display = 'none';
}
}
function showHideSynth() {
var x = document.getElementById("lSynth");
if (x.style.display == 'none')
{
x.style.display = 'block';
}else
{
x.style.display = 'none';
}
}
function showDefs() {
var x = document.getElementById("definitions");
if (x.style.display == 'none')
{
x.style.display = 'block';
}else
{
x.style.display = 'none';
}
}
function showSources() {
var x = document.getElementById("sources");
if (x.style.display == 'none')
{
x.style.display = 'block';
}else
{
x.style.display = 'none';
}
}
function showDateForm() {
var x = document.getElementById("dateForm");
if (x.style.display == 'none')
{
x.style.display = 'block';
}else
{
x.style.display = 'none';
}
}
This diff is collapsed.
......@@ -67,7 +67,9 @@ fieldset {
background:#00BCD4;
height:40px;
display:inline-block;
border-radius:0px;
border-radius:5px;
border-width:5px;
border-color: #2087a6;
margin:5px 0px;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
......@@ -93,6 +95,7 @@ fieldset {
}
.form-container .btn.submit-form{
margin-left:20px;
margin-top:15px;
padding:12px;
background:#00BCD4;
......
......@@ -9,6 +9,7 @@
<p>Bienvenue sur Agoraviz !</p>
<header>
<% include ./partials/header %>
</header>
<hr>
......@@ -18,5 +19,6 @@
</footer>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript" src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>
</body>
</html>
......@@ -10,13 +10,16 @@
<body>
<header>
<% include ../partials/header %>
<h1>
<%= title %>
</h1>
<h2>
<br><%= title %>
</h2>
</header>
<hr>
<p> AgoraViz vous permet de visualiser des débats dans l'Internet disruptif 3.0 digitalisé de la transformation numérique.
</p>
<p style="text-indent:2em"> AgoraViz est un projet mené dans le cadre de l’UV NF28 “Ingénierie des systèmes interactifs”. L’enjeu de cette UV est de comprendre les problématiques de conception, d’évaluation et d’implémentation de systèmes interactifs, notamment en réalisant un projet mettant en oeuvre ces questions propres à l’Interaction Homme-Machine.
<p style="text-indent:2em">Pour correspondre à cet enjeu, l’application AgoraViz propose un service de délibération numérique dont la nouveauté repose sur la possibilité d’interagir et de naviguer dans un espace de visualisation des débats, encourageant l’échange constructif plutôt que la confrontation stérile.</p>
<p style="text-indent:2em">Les deux objectifs auxquels AgoraViz tente de répondre sont : </p>
<p style="text-indent:4em">1. Concevoir une application proposant de visualiser et comprendre l’évolution d’un débat, dont chaque contribution est située par rapport aux autres, peut être enrichie de sources et de définitions.</p>
<p style="text-indent:4em">2. Donner la possibilité d’interagir sur chaque contribution et de se positionner facilement dans un débat, ainsi que de coopérer pour relier des contributions et trouver des points d’accord.</p>
<footer>
<% include ../partials/footer %>
</footer>
......
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
<link rel="stylesheet" type="text/css" href="/static/stylesheet/style.css">
<% include ../../partials/head %>
<title><%= title%></title>
</head>
<body>
<header>
<% include ../../partials/header %>
</header>
<h1>Agoraviz</h1>
<br>
<h1><%= debate.question%></h1>
<br>
<div id="form-container" class="container col-md-4">
<h2 id="form-title"><%= debate.question%></h2>
<div class="row">
Type:
<select id="type" name="type">
<option value="ouicar">Oui, car...</option>
<option value="ouimais">Oui, mais...</option>
<option value="noncar">Non, car...</option>
<option value="nonmais">Non, mais...</option>
</select>
</div>
<div class="row">
Titre :
<input type="text" id="label"><br>
</div>
<div class="row">
Commentaire : <br>
<textarea id="comment"></textarea> <br>
</div>
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
<div id="grandFond" class="container-fluid">
<div class="row">
Auteur.e :
<input type="text" id="auteur"><br>
</div>
<div class="row submit-row">
<button class="btn btn-block submit-form" id="addNode">Ajouter ma contribution</button>
<div id="colGauche" class="col-md-2">
<div class="container">
<br>
<br>
<div class="container">
<br><br>
<button class="btn btn-block btn-primary" onClick="showDefs()">Définitions</button>
<div id="definitions">
<br>
<p class="text-center"><%= debate.definitions%></p>
</div>
<br>
<button class="btn btn-block btn-primary" onClick="showSources()">Sources</button>
<div id="sources">
<br>
<p class="text-center"><%= debate.sources%></p>
</div>
<br>
<button class="btn btn-block btn-primary" onClick="showDateForm()">Remonter le temps</button>
<div id="dateForm">
<br>
<div class="text-center">
<input id="dateValue" type="date"><br><br>
<button class="btn btn-block btn-primary text-center" id="end" >Afficher</button>
</div>
</div>
</div>
</div>
</div>
<div id="affTreeMap" class="container col-md-8">
<svg width="1200" height="1000"></svg>
</div>
<div id="colDroite" class="col-md-2">
<div class="container">
<br><br><br><br><br>
<button class="btn btn-block btn-primary" onClick="showHideContrib()">Contribuer</button>
<br>
<ul id="lContrib">
<li>
<label>Type :</label>
<select id="type" name="type">
<option value="ouicar">Oui, car...</option>
<option value="ouimais">Oui, mais...</option>
<option value="noncar">Non, car...</option>
<option value="nonmais">Non, mais...</option>
</select>
</li>
<li>
<label>Titre :</label>
<input type="text" id="label"><br>
</li>
<li>
<label>Commentaire :</label>
<textarea id="comment"></textarea> <br>
</li>
<li>
<label>Auteur.e :</label>
<input type="text" id="auteur"><br>
</li>
<li>
<div class="row submit-row">
<button class="btn btn-block btn-primary submit-form" id="addNode">Ajouter ma contribution</button>
</div>
<div class="row submit-row">
<button class="btn btn-block btn-primary submit-form" id="addCircle">Ajouter ma contribution</button>
</div>
</li>
</ul>
<button class="btn btn-block btn-primary" onClick="showHideSynth()">Synthétiser</button>
<br>
<ul id="lSynth">
<li>
<h4 id="form-title">Synthétiser plusieurs noeuds</h4>
Tu as trouvé des points d'accord ? Super ! Sélectionne plusieurs noeuds et propose une synthèse.
<br><hr><br>
</li>
<li>
<label>Corps de la synthèse :</label>
<textarea id="description"></textarea> <br>
</li>
<li>
<label>Auteur.e :</label>
<input type="text" id="auteursynthese"><br>
</li>
<li>
<div class="row submit-row">
<button class="btn btn-block btn-primary submit-form" id="addSynthese">Ajouter ma synthèse</button>
</div>
</li>
</ul>
</div>
</div>
<!--
<div class="container">
<table id="syntheses" class="table table-striped table-bordered">
<thead>
<tr>
<th>Contributions synthétisées</th>
<th>Description</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<% if(locals.syntheses) { %>
<% syntheses.forEach(function(synthese) { %>
<tr>
<td><%= synthese.contributions %></td>
<td><%= synthese.description %></td>
<td><%= synthese.timestamp %></td>
<td>
<form id="deleteSynthese/<%= synthese._id %>" method="POST" action="/syntheses/delete/<%= synthese._id %>"></form>
<a onClick="document.forms['deleteSynthese/<%= synthese._id %>'].submit()" class="btn btn-danger">
<i class="fas fa-trash-alt">
Delete
</i>
</a>
</td>
</tr>
<% }); %>
<% } %>
</tbody>
</table>
</div>-->
</div>
</div>
<div class=" container col-md-8">
<svg width="960" height="960"></svg>
</div>
<script type="text/javascript" src="/static/javascript/jquery.min.js"></script>
<script>
var contributions = <%- JSON.stringify(contributions) %>;
const debate = <%- JSON.stringify(debate) %>;
var contributions = <%- JSON.stringify(contributions) %>;
const debate = <%- JSON.stringify(debate) %>;
const definitions = <%- JSON.stringify(debate.definitions) %>;
const sources = <%- JSON.stringify(debate.sources) %>;
var stats = <%- JSON.stringify(stats) %>;
console.log("stats", stats);
</script>
<script type="text/javascript" src="/static/javascript/d3.v4.min.js"></script>
<script type="text/javascript" src="/static/javascript/radialTreeMap.js"></script>
<script type="text/javascript" src="/static/javascript/menuDebat.js"></script>
<script type="text/javascript" src="/static/javascript/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script type="text/javascript" src="/static/javascript/d3.v4.min.js"></script>
<script type="text/javascript" src="/static/javascript/line.js"></script>
<script type="text/javascript" src="/static/javascript/radialTreeMap.js"></script>
<script type="text/javascript" src="/static/javascript/dragndrop.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" />
<% include ../../partials/head %>
<title><%= title %></title>
</head>
<body>
<header>
<% include ../../partials/header %>
<h1>Débats en cours</h1>
</header>
<h1>Débats en cours</h1>
<div class="container-fluid">
<br>
<div class="row">
<div class="col-md-12">
<table id="debates" class="table table-striped table-bordered">
<table id="debates" class="display" style="width:100%">
<thead>
<tr>
<th>Titre</th>
......@@ -32,27 +39,28 @@
<form id="showDebate/<%= debate._id %>" method="GET" action="/debates/show/<%= debate._id %>"></form>
<a onClick="document.forms['deleteDebate/<%= debate._id %>'].submit()" class="btn btn-danger">
<i class="fas fa-trash-alt">
Delete
Supprimer
</i>
</a>
<a onClick="document.forms['showDebate/<%= debate._id %>'].submit()" class="btn btn-info">
<i class="far fa-comments">
Participate
Participer
</i>
</a>
</td>
</tr>
<% }); %>
</tbody>
</table>
</div>
</div>
</div>
<footer>
<% include ../../partials/footer %>
</footer>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/static/javascript/debates.js"></script>
</body>
</html>
</html>
<!DOCTYPE html>
<html>
<head>
<head>
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
<% include ../../partials/head %>
<title><%= title %></title>
</head>
<body>
<h1>Lancer un nouveau débat</h1>
<header>
<title><%= title%></title>
</head>
<body>
<header>
<% include ../../partials/header %>
</header>
</header>
<div id="NewDebatContainer">
<form id="formAddDebat" name="adddebat" method="post" action="/debates/">
<input id="inputDebatQuestion" type="text" placeholder="Question" name="question" />
<input id="inputDebatDefinitions" type="text" placeholder="Définitions" name="definitions" />
<input id="inputDebatSources" type="text" placeholder="Sources" name="sources" />
<button id="btnAddDebat" type="submit">Lancer le débat</button>
<ul id="listAddDebat">
<li>
<label>Donner la question/sujet du débat :</label><br>
<input id="inputDebatQuestion" type="text" placeholder="Question" name="question" />
</li>
<li>
<label>Vous pouvez donner la définitions de mots pour que les futurs contributeurs et vous même, partiez sur de bonnes bases :</label> <br>
<textarea id="inputDebatDefinitions" placeholder="Définitions" name="definitions"></textarea>
</li>
<li>
<label>Vous pouvez donner des sources :</label><br>
<textarea id="inputDebatSources" placeholder="Sources" name="sources"></textarea>
</li>
<li>
<br><button id="btnAddDebat" class="btn btn-primary" type="submit">Lancer le débat</button>
</li>
</ul>
</form>
</div>
<br>
......@@ -22,6 +37,17 @@
<% include ../../partials/footer %>
</footer>
<script type="text/javascript" src="/static/javascript/jquery.min.js"></script>
<script type="text/javascript" src="/static/javascript/d3.v4.min.js"></script>
<script type="text/javascript" src="/static/javascript/radialTreeMap.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>
</body>
</html>
......
<p class="text-center text-muted">Codé avec amour pour NF28</p>
\ No newline at end of file
<div id="basPage">
<p class="text-muted">AgoraViz - Audrey Guelou, Ninon Lizé-Masclef, Clément Brizard, Philémon Cantereau</p>
</div>
\ No newline at end of file
<meta charset="UTF-8">
<link rel='stylesheet' href='/static/stylesheet/style.css' />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
<div class="navbar-header">
<a class="navbar-brand" href="/">
<span class="glyphicon glyphicon glyphicon-tree-deciduous"></span>
Accueil
</a>
<ul class="nav navbar-nav">
<li><a href="/debates/">Liste des débats</a></li>
<li><a href="/debates/new">Lancer un nouveau débat</a></li>
<li><a href="/about">A propos</a></li>
</ul>
</div>
<div class="container" id="leTitre">
<h1>AgoraViz &nbsp; <i class="fas fa-tree"></i></h1>
</div>
<div id="fondnavbar">
<ul id="navbar">
<li><a href="/debates/">Liste des débats</a></li>
<li><a href="/debates/new">Nouveau débat</a></li>
<li><a href="/about">A propos</a></li>
</ul>
</div>
</nav>