Merge pull request 'test' (#7) from test into master

2022-05-24 06:19:03 +00:00 · 2022-05-24 06:19:03 +00:00 · ca9e97ae79
parent 4d495b16db 517a7077f1
commit ca9e97ae79
5 changed files with 100 additions and 40 deletions
--- a/clockIn.html
+++ b/clockIn.html
@ -27,7 +27,7 @@ and open the template in the editor.
                <div class="container">
                    <h2>Tus fichadas</h2>
                    <h3>Situación de los ultimos 7 días</h3> 
-                    <div class="total">Total: 7.7h</div>
+                    <div class="total"></div>
                    <ul class="listHorario">
                    </ul>
                </div>
--- a/config.js
+++ b/config.js
@ -4,5 +4,5 @@ var process = {
 };

 var config = {
-    urlBase: 'http://localhost:9090'
+    urlBase: 'http://localhost:8080'
 };
--- a/css/style.css
+++ b/css/style.css
@ -274,7 +274,7 @@ header{
 .listHorario .headerLi{
    width: 100%;
    overflow: hidden;
-    border-bottom: 1px solid #9EA7AC;
+    border-top: 1px solid #9EA7AC;
    padding-bottom: 10px;

 }
--- a/img/middle.png
+++ b/img/middle.png
--- a/js/clockIn.js
+++ b/js/clockIn.js
@ -87,44 +87,89 @@ function getInfo() {
        processData: false,
        success: function (data) {
            $('.footer').show();
-            printHorario(data);
+            printTimetable(data);
        }
    });
 }

-function printHorario(horarios) {
-    var c = "in";
-    for (var i = 0; i < horarios.length; i++) {
-        if (i % 2 !== 0) {
-            c = "out";
-        } else {
-            c = "in";
-        }
-        if (horarios[i]["7_dias_antes"] === "total") {
-            if (horarios.length > (i + 1)) {
-                printTotalHours(horarios[i + 1]);
-            }
-            if (horarios.length > (i + 2)) {
-                $(".total").text('Total: ' + horarios[i + 2]["1_dia_antes"] + 'h');
-            }
-            break;
-        }
-        $(".listHorario").append('<li><div class="time ' + ifIsEmpty(horarios[i]["6_dias_antes"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["6_dias_antes"]) + '</p></div><div class="time ' + ifIsEmpty(horarios[i]["5_dias_antes"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["5_dias_antes"]) + '</p></div><div class="time ' + ifIsEmpty(horarios[i]["4_dias_antes"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["4_dias_antes"]) + '</p></div><div class="time ' + ifIsEmpty(horarios[i]["3_dias_antes"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["3_dias_antes"]) + '</p></div><div class="time ' + ifIsEmpty(horarios[i]["2_dias_antes"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["2_dias_antes"]) + '</p></div><div class="time ' + ifIsEmpty(horarios[i]["1_dia_antes"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["1_dia_antes"]) + '</p></div><div class="time ' + ifIsEmpty(horarios[i]["mismo_dia"]) + '"><img src="img/' + c + '.png" alt=""/><p>' + ifIsEmptyText(horarios[i]["mismo_dia"]) + '</p></div></li>');
-    }
+function printTimetable(timetable) {
    var listWeekName = printWeek();
-    $(".listHorario").prepend('<li class="headerLi"><label>' + listWeekName[5] + '</label><label>' + listWeekName[4] + '</label><label>' + listWeekName[3] + '</label><label>' + listWeekName[2] + '</label><label>' + listWeekName[1] + '</label><label>' + listWeekName[0] + '</label><label class="hoy">HOY</label></li>');
+    var dated = new Date();
+    dated.setDate(dated.getDate() - 6);
+
+    for (var i = 0; i < 6;  i++) {
+        $(".listHorario").append('<label>' + listWeekName[dated.getDay()] +'</label>');
+        dated.setDate(dated.getDate() + 1);
+    }
+   $(".listHorario").append('<label class="hoy">HOY</label>');
+   $(".listHorario").append('<li class="headerLi"></li>');
+   
+    for (var i = 0; i < timetable.length; i++) {
+         
+        $(".listHorario").append(
+            '<li>' +
+                '<div class="time ' + ifIsEmpty(timetable[i]["6daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["6daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["6daysAgo"]) + '</p>' +
+                '</div>' +
+                '<div class="time ' + ifIsEmpty(timetable[i]["5daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["5daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["5daysAgo"]) + '</p>'+
+                '</div>' +
+                '<div class="time ' + ifIsEmpty(timetable[i]["4daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["4daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["4daysAgo"]) + '</p>'+
+                '</div>' +
+                '<div class="time ' + ifIsEmpty(timetable[i]["3daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["3daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["3daysAgo"]) + '</p>'+
+                '</div>' +
+                '<div class="time ' + ifIsEmpty(timetable[i]["2daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["2daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["2daysAgo"]) + '</p>'+
+                '</div>' + 
+                '<div class="time ' + ifIsEmpty(timetable[i]["1daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["1daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["1daysAgo"]) + '</p>'+
+                '</div>' +
+                '<div class="time ' + ifIsEmpty(timetable[i]["0daysAgo"]) + '">' +
+                    '<img src="' + ifIsEmptyImage(timetable[i]["0daysAgoDirection"]) + '" />' +
+                    '<p>' + ifIsEmptyText(timetable[i]["0daysAgo"]) + '</p>'+
+                '</div>' +
+            '</li>'
+        );
+        
+    }
+    printTotalHours(timetable);
+   
 }

-function printTotalHours(horarios) {
-    $(".listHorario").append('<li><br><hr></li>');
-    $(".listHorario").append('<li><div class="time">' + ifIsEmptyText(horarios["6_dias_antes"])
-            + '</div><div class="time">' + ifIsEmptyText(horarios["5_dias_antes"])
-            + '</div><div class="time">' + ifIsEmptyText(horarios["4_dias_antes"])
-            + '</div><div class="time">' + ifIsEmptyText(horarios["3_dias_antes"])
-            + '</div><div class="time">' + ifIsEmptyText(horarios["2_dias_antes"])
-            + '</div><div class="time">' + ifIsEmptyText(horarios["1_dia_antes"])
-            + '</div><div class="time">' + ifIsEmptyText(horarios["mismo_dia"])
+function printTotalHours(timetable) {
+    if(timetable.length>0) {
+
+        $(".listHorario").append('<li class="headerLi"></li>');
+        $(".listHorario").append('<li><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["6daysAgoTotal"]))
+                + '</div><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["5daysAgoTotal"]))
+                + '</div><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["4daysAgoTotal"]))
+                + '</div><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["3daysAgoTotal"]))
+                + '</div><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["2daysAgoTotal"]))
+                + '</div><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["1daysAgoTotal"]))
+                + '</div><div class="time">' + secondsToHm(ifIsEmptyText(timetable[0]["0daysAgoTotal"]))
                + '</div></li>');
+    
+        $(".total").text('Total: ' + 
+            secondsToHm(Number(timetable[0]["6daysAgoTotal"] == null)+
+            Number(timetable[0]["5daysAgoTotal"])+            
+            Number(timetable[0]["4daysAgoTotal"]) +
+            Number(timetable[0]["3daysAgoTotal"]) +
+            Number(timetable[0]["2daysAgoTotal"]) +
+            Number(timetable[0]["1daysAgoTotal"]) +
+            Number(timetable[0]["0daysAgoTotal"]) 
+            ) + 'h');
+    } else{
+        $(".total").text('Total: 0h ');     
+    }
+
 }

 function printWeek() {
@ -139,12 +184,12 @@ function printWeek() {

 var weekDays = [
    'Domingo',
-    'Lunes',
-    'Martes',
-    'Miércoles',
-    'Jueves',
+    'Sábado',
    'Viernes',
-    'Sábado'
+    'Jueves',
+    'Miércoles',
+    'Martes',
+    'Lunes'
 ];

 function printErrores(errores) {
@ -165,6 +210,14 @@ function ifIsEmpty(value) {
    }
 }

+function ifIsEmptyImage(value) {
+    if (value.trim().length === 0) {
+        return "img/in.png";
+    } else {
+        return "img/" + value + ".png";
+    }
+}
+
 function ifIsEmptyText(value) {
    if (value.trim().length === 0) {
        return "00:00";
@ -180,3 +233,10 @@ function cerrar(){
    window.location='index.html';
    }, 200);
 }
+
+function secondsToHm(seconds) {
+    seconds = Number(seconds);
+    let hours = Math.floor(seconds / 3600);
+    let minutes = Math.floor(seconds % 3600 / 60);
+    return hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0'); 
+}