Skip to content

D
doodle
Commit e40fdfff by Simon
Options

Ca marche lo

parent 5e04ff7b
Showing with 155 additions and 29 deletions
assets/lib/doodle/js/doodle.js
......@@ -4,13 +4,17 @@
* @param item
* @param config
*/
let Doodle = function(item, config) {
this.item = item;
this.config = config;
this.json = null;
this.days = [];
this.hours = [];
const EDITMODE = this.config.editMode;
this.initLoad = () => {
this.getJsonData();
if(!this.json) {
......@@ -25,6 +29,8 @@
};
this.createTable = () => {
$(document).on('click', 'input[type=checkbox]', this.eventInput);
this.item.html(`
<table id="myTables">
${this.createHeaderTable()}
......@@ -41,24 +47,53 @@
* @returns {string}
*/
this.createBodyTable = () => {
let html = '';
for(let index in this.days) {
html += `
<tr>
<td>${this.days[index]}</td>
${this.createBodyContent(this.days[index])}
</tr>
`;
let $thead = $('<thead>');
let html, tbodyFinal;
if (EDITMODE) {
let dayLength = this.days.length;
for(let i = 0; i < (dayLength + 1); i++) {
let $tr = $('<tr>');
if (!(i == dayLength)) {
let formatDate = moment(this.days[index], 'DD/MM/YYYY').locale('fr').format('DD MMMM YYYY');
html = $tr.append('<td>' + formatDate + '</td>')
.append(this.createBodyContent(this.days[i]));
}
html = $tr.append('<td>+</td>');
tbodyFinal = $thead.append(html);
}
}
else {
for(let index in this.days) {
let $tr = $('<tr>');
let formatDate = moment(this.days[index], 'DD/MM/YYYY').locale('fr').format('DD MMMM YYYY');
html = $tr.append('<td>' + formatDate + '</td>')
.append(this.createBodyContent(this.days[index]));
tbodyFinal = $thead.append(html);
}
}
return html;
return tbodyFinal.html();
};
function createInputBox(hasTask, name, id, setDisabled) {
return "<input type='checkbox' id='" + id + "' name='" + name + "'" +
(hasTask ? " checked" : "") + (setDisabled ? " disabled" : "") + " />" +
"<label class='checkWrapper' for='" + id + "'></label>";
function createInputBox(hour, day) {
let dayFormat = moment(day, 'DD/MM/YYYY').format('DDMMYYYY');
console.log(dayFormat);
return "<input type='checkbox' data-check=" + dayFormat + '_' + hour + " />"
}
/**
......@@ -67,17 +102,21 @@
* @returns {string}
*/
this.createBodyContent = (index) => {
let html = '';
let html, plop;
let $td = $('<td>');
for(let key in this.hours) {
if(this.json[index].includes(this.hours[key])) {
html += '<td><input type="checkbox" /></td>';
html = '<td>' + createInputBox(this.hours[key], index) + '</td>';
} else {
html += '<td></td>';
}
html = '<td></td>';
}
plop = $td.append(html);
}
return html;
return plop.html();
};
/**
......@@ -89,12 +128,20 @@
let $tr = $('<tr>');
let html, theadFinal;
for(let index in this.hours) {
let hoursSorted = this.hours.sort();
for(let index in hoursSorted) {
//La première case est vide
if (index < 1)
if (index < 1) {
html = $tr.append('<th></th>');
}
html = $tr.append('<th>' + hoursSorted[index] + '</th>');
html = $tr.append('<th>' + this.hours[index] + '</th>');
if (index == this.hours.length - 1 && EDITMODE) {
html = $tr.append('<th>+</th>');
}
}
theadFinal = $thead.append(html);
......@@ -107,7 +154,6 @@
*/
this.getDays = () => {
this.days = Object.keys(this.json);
console.log(new Date(this.days[0]))
};
/**
......@@ -169,6 +215,77 @@
}
};
this.createJSON = (date, heure, isChecked) => {
/*let json = {};
console.log(isChecked);
if (localStorage.getItem('test')) {
console.log('YEnA');
json = JSON.parse(localStorage.getItem('test'));
} else {
console.log('Empty');
json = {
date : '',
hour: []
};
}
console.log(json.date);
/!**
* Check si je suis lo
*!/
if ($.inArray(heure, json.hour) === -1) {
console.log('Jsuis pas encore lo');
json.date = date;
json.hour.push(heure);
}
localStorage.setItem('test', JSON.stringify(json));
console.log(json);*/
let json = {};
if (localStorage.getItem('test')) {
console.log('YEnA');
json = JSON.parse(localStorage.getItem('test'));
}
if ($.inArray(heure, json[date]) === -1) {
console.log('Jsuis pas encore lo');
if (json[date] === undefined) {
json[date] = [ heure ];
} else {
json[date].push(heure);
}
}
localStorage.setItem('test', JSON.stringify(json));
console.log(json);
};
/**
* Event for input
* @param e event
*/
this.eventInput = (e) => {
let data = $(e.target).data('check').split('_');
let isChecked = $(e.target).is(':checked');
let date = data[0];
let hour = data[1];
this.createJSON(date, hour, isChecked);
};
/**
* Init
*/
......
assets/lib/doodle/js/moment.js 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
assets/lib/doodle/js/moment.min.js 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
index.html
<!DOCTYPE html>
<html lang="en"><head>
<html lang="fr"><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
......@@ -74,7 +74,9 @@
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous">
</script>
<script src="assets/lib/doodle/js/moment.js"></script>
<script src="assets/lib/doodle/js/doodle.js" type="text/javascript"></script>
<script src="js/app.js" type="text/javascript"></script>
</body></html>
js/app.js
$( document ).ready(function() {
$('.doodle').Doodle();
$('.doodle').Doodle({
editMode: false
});
});
\ No newline at end of file
json/data.json
{
"Vendredi 19 janvier": ["10", "11", "12"],
"Samedi 20 janvier": ["13", "14", "15"],
"Dimanche 21 janvier": ["10", "14", "17"]
"19/01/2018": ["10", "11", "12", "18"],
"20/01/2018": ["13", "14", "15"],
"21/01/2018": ["10", "14", "16", "17"],
"24/01/2018": ["10", "15", "17"],
"26/01/2018": ["10", "10", "13" ,"18"],
"20/02/2018": ["10", "10", "13" ,"18"]
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment