From 607463eacc43f78cfb0c95582ac0f343cb0885c3 Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Sat, 16 Dec 2017 18:18:03 -0600 Subject: [PATCH 01/10] Subiendo primeras funciones --- js/app.js | 77 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) diff --git a/js/app.js b/js/app.js index 895ae2dd..983eadea 100644 --- a/js/app.js +++ b/js/app.js @@ -1,6 +1,83 @@ /* * Funcionalidad de tu producto */ + /*---- Función para seleccionar sede y promoción, y generar datos------*/ + var select = document.getElementById("filtro-sedes"); + select.addEventListener("change", seleccionarOpcion); + function seleccionarOpcion() { + var sede = select.value; + var generacion = select.options[select.selectedIndex].dataset.generacion; + var generacionEstudiantes = data[sede][generacion]["students"].length; + + //-----Código para acceder a las alumnas activas por sede y generacióne specificas + var count =0; + var counter =0; + for (var i = 0; i< generacionEstudiantes; i++){ + console.log(generacionEstudiantes.length); + console.log (data[sede][generacion].students[i].active); + var activeStudents = data[sede][generacion].students[i].active; + if(activeStudents === true){ + counter ++; + } else { + count ++; + } + + } + console.log("El valor es de activas: "+counter); + console.log("El valor es de inactivas: "+count); + + } + + + + + + + /* --------------------------------------------------------------- + -----Funcion de Tabuladores*/ + function mostrarOcultar(event) { + var tabSeleccionado = event.target.dataset.tabSeleccionado; + var overflow = document.getElementById("overviewTab"); + var students = document.getElementById("studentsTab"); + var teachers = document.getElementById("teachersTab"); + if(tabSeleccionado === "tabOverview"){ + console.log("overflow"); + students.style.display = "none"; + teachers.style.display = "none"; + //muestra el tab + overflow.style.display = "block"; + + }else if (tabSeleccionado === "tabStudents") { + console.log("studen"); + teachers.style.display = "none"; + overflow.style.display = "none"; + //muestra la tab + students.style.display = "block"; + + }else if (tabSeleccionado === "tabTeachers") { + console.log("tecaher"); + students.style.display = "none"; + overflow.style.display = "none"; + //muestra la tab + teachers.style.display = "block"; + } + + } + var cargarPagina = function() { + var overflow = document.getElementById("overviewTab"); + var students = document.getElementById("studentsTab"); + var teachers = document.getElementById("teachersTab"); + overflow.style.display = "none"; + students.style.display = "none"; + teachers.style.display = "none"; + + var elementosTab = document.getElementsByClassName("tab"); + for (var i = 0; i < elementosTab.length; i++) { + elementosTab[i].addEventListener("click",mostrarOcultar); + } + } + + cargarPagina(); // Puedes hacer uso de la base de datos a través de la variable `data` console.log(data); From 03dca7724995e0060dd41819eb98692b38dc0825 Mon Sep 17 00:00:00 2001 From: DanivonneCaSan Date: Sun, 17 Dec 2017 09:41:55 -0600 Subject: [PATCH 02/10] revision --- index.html | 2 + js/app.js | 140 +++++++++++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 137 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 8930fa03..ca67dc60 100644 --- a/index.html +++ b/index.html @@ -10,5 +10,7 @@ + + diff --git a/js/app.js b/js/app.js index 895ae2dd..ffcc4771 100644 --- a/js/app.js +++ b/js/app.js @@ -1,6 +1,136 @@ -/* - * Funcionalidad de tu producto - */ +window.addEventListener("load", session); -// Puedes hacer uso de la base de datos a través de la variable `data` -console.log(data); +function session (event){ +var newDivForm= document.createElement("div"); +newDivForm.setAttribute("Id", "form"); +newDivForm.classList.add("form"); + +var inputUser = document.createElement("input"); +inputUser.setAttribute("type", "text"); +inputUser.setAttribute("value", ""); +inputUser.setAttribute("Id", "inputUser"); +inputUser.setAttribute("placeholder", "User"); +newDivForm.appendChild(inputUser); + +var inputPswd = document.createElement("input"); +inputPswd.setAttribute("type", "password"); +inputPswd.setAttribute("value", ""); +inputPswd.setAttribute("Id", "inputPassword"); +inputPswd.setAttribute("placeholder", "Password"); +inputPswd.setAttribute("maxlength", "11"); +newDivForm.appendChild(inputPswd); + +var sendButton = document.createElement ("button"); +sendButton.setAttribute("value", "Send"); +sendButton.setAttribute("Id","btnSnd"); +sendButton.innerText = "Send"; +newDivForm.appendChild(sendButton); +document.body.appendChild(newDivForm); + +document.getElementById("btnSnd").addEventListener("click", createSession); + +function createSession (event){ + var userValue = document.getElementById("inputUser").value; + console.log(userValue); + + var pswdValue = document.getElementById("inputPassword").value; + console.log(pswdValue); + + /* Usuarios registrados + Usuario :Jonathan + Password: Laboratoria */ + if(userValue === "Jonathan" || pswdValue === "Laboratoria"){ + alert("continua"); + inputUser.value = ""; + inputPswd.value = ""; + } else { + alert("Falso"); + inputUser.value = ""; + inputPswd.value = ""; + } + } +} +/*var sede= data[] + +data.AQP["2016-2"].students[0].active + +for(var i=1; i <= numsede.length; i++){ + for(var j=0; j<=data.AQP[i].students.length; j´++) + { + console.log(data.AQP[i].students[j].name)} } +*/ +var arraySede = Object.keys(data); +// Obtiene la cantidad de sedes (4) +var numSede =arraySede.length; +var counter=0; +//var arrayGen = Object.keys(numSede[0]); + +/*for( var i = 0; i<=numSede; i++){ + var cantGen = Object.keys(data[arraySede[i]]); + console.log(cantGen); + for (var j = 0; j<=cantGen.length; j++){ + var totalStudents = data[arraySede[i]][cantGen[j]].students.length; + for(var k= 0; k<= totalStudents; k++){ + var activeStudents = data[arraySede[i]][cantGen[j]][students[0]]; + + if(activeStudents === true){ + + counter = counter ++; + } + console.log(counter); + } + } +}*/ +var count =0; +var countTotal = 0; +//data[sede][generacion].students +for (var i in data.AQP["2016-2"].students){ + countTotal ++; + console.log (data.AQP["2016-2"].students[i].active); + var activeStudents = data.AQP["2016-2"].students[i].active; + + if(activeStudents === true){ + counter ++; + } else { + count ++; + } + +} +console.log("El valor es de: "+counter); +console.log("El valor es de inactivas: "+count); +console.log("Studiantes por generación"+ countTotal); + +var countTotalStudents = 0; +var statusInd = 0; +var countTotalActive = 0; +var countTotalInact = 0; +for(var indexSede in data ){ + //console.log (data[indexSede]); + for (var indexGen in data[indexSede]){ + //console.log( indexGen); //Obtiene el valor del número de la generación + for (var indexPropGen in data[indexSede][indexGen]){ + //console.log(indexPropGen); //entra a estudiantes y ratings + if (indexPropGen === "students"){ + //console.log (indexPropGen); + for(var indexStudents in data[indexSede][indexGen][indexPropGen]){ + // console.log(indexStudents["students"]); + //onsole.log(indexStudents); + countTotalStudents++; + statusInd = data[indexSede][indexGen][indexPropGen][indexStudents].active; + if(statusInd === true){ + countTotalActive ++; + } else { + countTotalInact ++; + } + + } + } + + //countTotalStudents ++; + // } + } + } +} +console.log ("totales estudiantes "+ countTotalStudents); +console.log("activastotales " + countTotalActive); +console.log("inactivastotales "+ countTotalInact); From 76a720e15f547a29fa7ee37267727832ad99c8fc Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Sun, 17 Dec 2017 18:10:42 -0600 Subject: [PATCH 03/10] Subiendo html --- index.html | 162 +++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 156 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 8930fa03..0f34feaa 100644 --- a/index.html +++ b/index.html @@ -2,13 +2,163 @@ + + + + Data Dashboard + + - - - - - - +
+
+ logo-laboratoria + foto de perfil + + +
+ +
+ + + +
+ +
+ + +
+ + + + + + +
+ +
+ + +
+ + +
+ PORCENTAJE DE DESERCION +
+
+

-

+

# ALUMNAS MATRICULADAS

+
+
+

-

+

% DESERCION

+
+
+
+
+ + +
+ META (ALUMNAS) +
+
+

-

+

# ALUMNAS (Cumple Meta)

+
+
+

-

+

% TOTAL(Cumple Meta)

+
+
+
+
+
+ + + + + + + + +
+
+

TEACHERS AND JEDIS

+
+ +
+ +
+ + + + + + + + From f82a20d318ab89626938c7e730053a5f0d4c7a14 Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Sun, 17 Dec 2017 18:15:49 -0600 Subject: [PATCH 04/10] Subiendo estilos --- css/main.css | 188 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 188 insertions(+) diff --git a/css/main.css b/css/main.css index 6355c827..8ec486e6 100644 --- a/css/main.css +++ b/css/main.css @@ -1,3 +1,191 @@ /* * Estilos de tu proyecto */ + + * { + box-sizing: border-box; /*justas un elemento con box-sizing: border-box*/ + margin: 0; + padding: 0; +} + +header{ + text-align: center; +} + +header div img{ + width: 300px; +} +.imagen-profile { + width: 40%; + margin-top: 50px; +} + +.imagen-lab{ + width:80%; + background-color: white; +} + +#barra-lateral{ + position:fixed; /* Hacemos que la posición en pantalla sea fija para que siempre se muestre en pantalla*/ + left: 0; /* Establecemos la barra en la izquierda */ + /*z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */ + background-color: #2B2B2B; + width: 200px; + height: 100%; + +} +/* boton de seleccion*/ +#barra-menus{ + background-color: #d4cecb; + width: 100%; + height: 150px; +} + +/* boton de seleccion*/ +#filtro-sedes{ + + text-align: center; + width: 150px; + float:left; + margin-top: 200px; + margin-left: 40px; +} + +/*Tabuladores*/ +/* Menu Over student teachers*/ +#contenido-tab { + margin: 0px; +padding: 0px; +font-family: ; +font-weight: 500; +font-family: 'Montserrat', sans-serif; +} +.cont-tabs{ + margin-top: 150px; + list-style: none; + display: block; +} + + +.cont-tabs li { + width: 100%; + height: 50px; + border-bottom: 1px solid #323232 ; + overflow: hidden; +} +.cont-tabs a { + position: relative; + padding: 16px; + padding-right: 25px; + float: right; + color: white; + opacity: .6; + font-size: 18px; +} + + +.barra { + position: absolute; /*se pone para que los p no se encimen*/ + height: 50px; + width: 0px; + background-color: #aaa; + opacity: .1; +} + +li:hover div.barra { +width: 200px; +} + + +/*--------------------CONTENIDOSS---------------*/ + +/*--SECCION OVERVIEW (ESTILOS DE GRAFICA)*/ +#overviewTab { + overflow: auto; +} + +.graficasTotal { + background-color: #fff; + float: left; + height: 500px; + margin: 40px 100px; + vertical-align: top; + width: 500px; + box-shadow: 4px 4px 4px #c4c4c4; + margin-right: 1%; + overflow: hidden; +} + +.graficasTotañ span { + font-size: 1.5em; + font-weight: bold; + padding: 20px; +} + +.contenedor-cajas { + padding: 1em; +} + +.contenedor-grafica { + background-color: #f7b617; + float: left; + text-align: center; + vertical-align: top; + width: 40%; + height: 150px; + padding: 0.8em; + border-radius: 3px; + box-shadow: 2px 2px 2px #aaa8a8; + margin-right: 1em; +} +.grafica { + margin-top: 150px; +} + +.grafica img { + padding-left: 1em; + padding-bottom: 0.8em; +} +.datoText { + font-size: 3.4em; + font-weight: 300; + border-bottom: 1px solid #ffff; + width: 2.7em; + height: 1.2em; +} + +#dropout-porcentaje { + color: red; +} + +.cajaTexto { + font-size: .8em; + padding-top: 1em; +} +.number-boxes { + font-size: 3.5em; + font-weight: 300; + border-bottom: 1px solid #ffffff; +} + + +/* SECCION ALUMNAS */ +#overviewTab { + overflow: auto; +} + +.especializacion { + float: left; + vertical-align: top; + background-color: #ffffff; + width: 30%; + padding: 1em; + box-shadow: 2px 2px 2px #aaa8a8; +} + +.especializacion h4 { + font-weight: 700; + margin-bottom: 1em; + font-size: 1.2em; + color: #4C4743; +} From 54b07aa85098d0ae1cb326462ced67073e0b37f6 Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Mon, 18 Dec 2017 20:30:33 -0600 Subject: [PATCH 05/10] Subiendo cambios --- css/main.css | 10 +++++++--- index.html | 35 +++++++++++++++-------------------- 2 files changed, 22 insertions(+), 23 deletions(-) diff --git a/css/main.css b/css/main.css index 8ec486e6..19cc55a7 100644 --- a/css/main.css +++ b/css/main.css @@ -16,13 +16,15 @@ header div img{ width: 300px; } .imagen-profile { - width: 40%; + width: 70%; margin-top: 50px; } .imagen-lab{ width:80%; background-color: white; + margin-top: 10%; + } #barra-lateral{ @@ -102,6 +104,7 @@ width: 200px; /*--SECCION OVERVIEW (ESTILOS DE GRAFICA)*/ #overviewTab { overflow: auto; + margin-left: 220px; } .graficasTotal { @@ -110,13 +113,13 @@ width: 200px; height: 500px; margin: 40px 100px; vertical-align: top; - width: 500px; + width: 800px; box-shadow: 4px 4px 4px #c4c4c4; margin-right: 1%; overflow: hidden; } -.graficasTotañ span { +.graficasTotal span { font-size: 1.5em; font-weight: bold; padding: 20px; @@ -140,6 +143,7 @@ width: 200px; } .grafica { margin-top: 150px; + } .grafica img { diff --git a/index.html b/index.html index 0f34feaa..c532a401 100644 --- a/index.html +++ b/index.html @@ -14,6 +14,7 @@ Data Dashboard + @@ -21,9 +22,11 @@
logo-laboratoria foto de perfil +
- -
+
+ +
- +
-
-
-
+ - - - -
From ac0325a58a5259fcac972d53f4c999b101385445 Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Tue, 19 Dec 2017 12:50:30 -0600 Subject: [PATCH 06/10] subiendo cambios --- assets/images/Jonh-Parra-imagen-profile.jfif | Bin 0 -> 5087 bytes assets/images/logo-lab.png | Bin 0 -> 7538 bytes assets/images/logolab2.png | Bin 0 -> 1508 bytes css/main.css | 213 +++++++-- index.html | 210 ++++++--- js/app.js | 437 +++++++++++++++---- 6 files changed, 685 insertions(+), 175 deletions(-) create mode 100644 assets/images/Jonh-Parra-imagen-profile.jfif create mode 100644 assets/images/logo-lab.png create mode 100644 assets/images/logolab2.png diff --git a/assets/images/Jonh-Parra-imagen-profile.jfif b/assets/images/Jonh-Parra-imagen-profile.jfif new file mode 100644 index 0000000000000000000000000000000000000000..5bd0103b8f21f39225d435acb38bf69177f6856d GIT binary patch literal 5087 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 literal 0 HcmV?d00001 diff --git a/assets/images/logo-lab.png b/assets/images/logo-lab.png new file mode 100644 index 0000000000000000000000000000000000000000..f376c336b85ce3e17cfe4b8856c1b70d4cc06250 GIT binary patch literal 7538 zcmcJUXIK+K_vjM{B{XT$OQcEfH6SH)q>B;hkrFx)LhoIwL5hHM5NQI^J1BxQ>4?&i zDhQznp>uivpWb_)dq3XYnLWEZzcXj%?Cw0zIU8rFuSrhAL;?T+$hEc9i~#_k;N7_c zG2z|ua5=ifJu~w z7=+q$5)(B#a3$4CC`K6;##K^}!Fu1i zkhotcgdmDibW*_j(vW`0Z|%3!DW46fmT&;j!Pt1wUns0h<*8~3=w+agMaEKl%gWS_pB3Oq&Q&FJ%lmvGea;^6GZ4cp|G` z>BRdU_Ar7T?jA5%acz#-8hF(u{Ia9w2i`5vm0?Gmf}j+^SVP1V_Gf_XNGVXFmPMBR z3?fQ+_UJ&<&#Rg`yGJ|`5&sYa2P`w~9FY-?a7mJ_c}Ic;dqu5eGJC}DE>stTO|#Ja zL8G!ZoETQQ5B1e!|KJ(fy!$!dfzOu!FBO*B_h0EnTtMwQP0Ji`9ZLsUOTK#C!ehW- zDPCL7aguc%wICcYI9;*WG?)Tr`Fp1lJY)Z(a`?bfb%Vp`n!KOkRnnfGvUTS-pG8nc zU>4oVUQeszy`^)<8C%gzvMYhPw+zessrXF*5s=Dwcuuwf{(PmI!mP?%IAf1{k76~M zo-+MGQQ#;E?ZK@1_xc5|Y$M&tyq+${sWZ@Yc{83sB*ZjcI!P%q;TPYDg2BKDq?@{# z)sK4nG^9=90KOs$L3v*)96WuN|6mL7p%_T@;hrgxAbG?JIVTq=FC2vd6=&S>|*^srr%<%ZJTrkt`^F(f1?R0HcRztOuPCVz&2nXfZji z%;hBU$0KU2HSY(oZAL8Lg?jEqLj367I5AmWWp+ zK&3Gk&<$1NGdk~;)Ny4Opgv(2F-v%aY%fxnpi9NXrW0RQLZ#EYSeIS~@QgsER@f=H z0N7!!w2TbL(%f$ev5eptF!0^;A)cGIa@AcAn>D1|a_g~}^|=QB@&(SeUp4}~!pB;X z2Cz$f5!m(AtcG=gp-pgDkkV+u&nhlF7whS~jeh@obs-^f{XK6;<`4=)FFd(WY|g{2 zS?C@09UHxwk=S(Y4+AAn$Q=o9gb$dfc@dk@Z1Lzkgt9~}jq^`y4#fByl&uq;cYHpc z6286{&YACMp0Hv5MyO{iTt4hIKyM>&ql+CJMAt%k#_XF)T2 z-Ve?GzF{sMXC$%!Ua`2*FlxKKDEP9ahu;+wb(V6SR>R|m3z0|BP;Y)K8f=*EaaV=~ z7_4|0F$ZPbTxus&RvHq=n2oNM~=wIRe<{Qu__Jig9dS;zR!`|6cJ#SNDrsyuU z*|S+^3r8jTJKyD>ma=}IqzN|wj`8?4vrN*8s76W(Uiy@HyLn}9~+@;t^Xdw zxyF6HPpBqAERoQ2xt<-+-hAB1;tNS&XuOgVPgON6+a^c&$lN;H@HR_1q)HM(bG2J7 z)Wr@`;R%<1qdNCTN{bVy=eKKQ)hLYXK+<#s8viKZJwKDZcdef~*iH>AEe>gAGtFFK z90S}YNbZR3TU{1)T_~;)DMM5Bg@_o+`kyxT9D!zN*Wa~Kg84&N958N|dJVYU#sK*Z z1vrrXJu1dY8D>Wq&v2$^OF0UrI)hPyHdr=sfcz3Pw8$#{GTWGz z9$v$d|5IrHy6FwQX>7Z+AHBbx6WQb&IG|fg6sW6_YR+4g0aPN~SHo-j7QCdsXZq?w zC5K0nuoUvF-(Plb{*(M%d0Bqi!(nflAiEb1e9lbON+-EbFPSMAku9Ijqms<4&L$!?IHNu9(%S>$Q=h*B93k zzDUsRvxVT@x}x3vtoJB!@UNYq7=s5iC-SmS#s#q80dJ!;lmc?HoD9`m8JndQ#=5m6 z^RGRG^yKheSiZw#`N_?rH*bE%ZUmV?+*V;Y4r^6Lm?|P2$fg!~%c;!d=e?dYszL+T z{BvY|kIIT)zjrBzEQB&zUZV!}wYGH@&a4F2}cb~Zn3B#qS%-&H#M5Oxvf z!8zsq(HDDm9FTI*L1wxhyck8eq;~Ov5nL&p_WF;;5OJl>&Qj;M-hIm^e`{>S$VPxD zxzqH``bDS~e#`63+M^w6$v>m&X6Z^)Y@i^9p^KooMX%fVxsqbjd2*hmN*auNshvEql1D-JKLN!QnB|Pe_!%qj@ETJhDZdlF>6Me2E|#|ltr;(3gK6r zA0Q9^{aEEK)2Rh!;VA|}LLbY)iz!TfX8OI8KRQYuUrXAC7Z((GCE{;>b@yUtlGX0z zfMVb)q|vH;``vu~HDT<=Ymw3&fs5fhtr&+KLKC8`OBSvMSlfi%iD{MY`=NL0X1kG} zYLG_T=7Ji$SNWAE2{U2u2S!fia_npYuZXL^JBry-7+cY;zBn!JSdzxW0wmMOcb-eh{h3dhnV;-0jcH5u^&N{xCk%ve_B*RBAPtkLv_ zMY^=#rL&i={2NkmO#jQk=&?$9tLHarl0NRp3S#x6{@Y3|(cE|n7ymEqp`_WF)togi zlY}2OkbvO2hPg2r^`T)oPKD%42`2M3cu0uK$Uy$7T472!HRx7R@h2^Z@pOf(m8Rfcy z*?P_a0)p6LHJV*Lm_YtU%iGmlKP-2VKo>qq`N8^UXRb_rP4P9pBfM_bR<)3b-^2Q& zB~OYUJ6Xs(h+&7N8_c{IjTeKS%EUrvrS^fjWIb!vA{~(7-0_M9m4UA=nxiZ9nCuHK zYUAf5YhSYmNw8GY(-WXcd$VyV;CK`yC1FcS7;Tuq+-ZfUfkM-fQ z8$R?*AFE{W&{QKy3dgtfH#Z6vQT;LTV!d?W0XzEM`IAEDh^-v!Xt>T+ar&S^%4W9Dk960G!WR-tM zJWOav?Jm&9&f*8vlt}guO=_OZ>B~&uLzwtN7v^2azMN+-Nmp_jnhsGp)+OUUvh2_p z6w6llPq(t>bPU)}mg_e-GxU1|<3;}tySOSJ_;vwddUx+`amh>Zf;#=@xs2=j0pFlr zzVqhxOtgwNcV=^sAmPB@q+PLo)vtNqR?<_EJ@HC&xfpuCWlm$XznUDEbDowEQT@+9 zy$($6QI{J9V^>r?1ap*7Wf`;=fj4yGw}fhB8rgC-F7#!*rHMLOskRDdwihqY{qgIR zlQl+9R44Y++Sb-JrBn4E#lDdAP%WgydfB@xGwm|+D*WbIY14(Cyme?u+Ei8Je69K? zkkjlzK(@-yI7^|Wf^$)l#DCH5baFn=IIZ(&Xn(Ry-FD;CD2sqWeqQJN9pLP4x`+MR9)yyB)p-Qpqz9N_c24GD0$go9neltZoejw zq{hmT+(Tdm{lN)5mDh1yJSh4Y8WCjGE0+4Tw(s4{vH?1LQ>Ed{)e9w~Gss7Q9K%HZ zxW?YqrDtOhAY9jUHMoiV2V-r!L+NMPH?*vg@!l=UiNOW=HU1{Hc#+QiQq^ zK_YW<#IQ@%)T@h?YE1{5H`^O5#wzp(lOekznm(R}{JJWd#hGgjTGPzwXAZPT+UT2J zW^Kx*)viEt@JA$rokFWPcyFtN*=b4Q6=9hOUf0h=$;4&O&uFNbm8+Wc-h`H4ZXD=m za2DDbpG@G%OTme(_w;?|CUxm{oFs$_{C@}t3%cq);BYhpzE8EQCh!M>M4BsH(j53F zSgDu|TlBg24iuPVB;HtwQohip)rVC^#TqdL97)!lRRiHN$vIP5UeVVib2GPY4cRL$ z77sav*5M`J6PYxaX8nqc`U_ukQCUR_7qvajG5dIxHq>q@u=8?dfKBaLdIr^EeP)z* z*%PK2iMX=oY^7-ZD5O)`V>wBi7lEl`D)5EZDRq=2l`QeV4wk`^;qV#GE%Xji-rE}j zt`@oi`%%(C4OcR{=Xo%1+b9PL!e8W?H221 zf^?Xz>sCKVdw1wqxUt52D!?{=!D05RJDLNylQP4IQ@6fbDwUli_m#yc>jy<1y}p~Z zSWA@qowpwd{|+RMdY0j6XqTDYWb9LPG*j_Oi?zm~Mm@gFr!Lpg3XO5bP9+mQj*0RM z>3U>q?N%tt>G=L1#X-Qphq7v!MYU!rsg>gn5meG zw?cepvujC4Ij{~+LT3~9)TAmF%OFkP=SL;@ z{zz>ctSigMPqg13#Na6J!{1@FWtoKligKR%$ieHu>kFxzl^qqQhl+pLt|W?hW_cS} zHys+r4i=T?0Z|#tRBM;r@t;!4I+tP|tD1lA`IWVPUif>YNR(7ruGG-4VuX`+|8WrE zdGwWM2*9z-koT_vf~_pprib}uJ}1B3Yp(8xf_(LS`L!P3e#NpO8iJm8_$KD_p(KaC zo1b8F|M4-V*J!~g@XM43lVRe!nnQHq0`4Vn^7;DWC^sTP9(N6ze$XFi{YVcH zGvjO;F76ZaH<_o23Op=Lu%V*!qU-DTHA~*^RoT%_HG*L-uAn*U40^70{lwsFV%6PV zvjljnYPMl!?^zU9iplNIFE2>mc=242zo@^O92H?*lfryEKqMxj=bQ zI;Zc{EM{7PhCEM+Qc9?w1BiO)na6q;u$xhnRJYWl$n=l-;D?{8(nIw3dJQeK`H3Tn zW&^(L1krAoe?0D>dLMa>Ct5mkY?e~nEeOXYpnxIjOG0|nwE6KqZQYF~oqqNVu@tG- z1vqbt4c3Zia6P$t)ulxg4a|P1NnkE6G${1m!43j!gzK3{ebPMKiW=jcqq>KJNf*Gsp2$VpZIfs(%Lh=O@8ber&;yug3okmpu8X zmC%+Plx-IZ`vVI;SKVLs2+z|AUb-*8`66!1LzVSZHZ5b*6q{!|Ubivm=x}MplN&JI ztw|NYH!_9>dy0#YMc6Qt=q#}8vJ4wm#Ebal=SD!cqPA8Hh`Jg4WpwFv!1 z@Mb(7{tQ{v(nJ&iF?|g+rkQl7@H%-(GI5>kVpwwBMvc3{*U{c1ZOs~Zh{8v?P=Z3- z%SDMM549NBwM}FdBXn^f9brc)l)mKvlNP5(B!MZy0rV&EHtb zPxo2^WB(Nl+R8@RD}?p0$?ao#Bz;a*<9j3TVoX@DxWdjpZ^;I&SH#=CC$MDAh)|wr z^M$q))WriSSxo89Ba6J100MB#Ws1q8d*I0N{`{!v?t|^}x0kJZgtV#~@4Nzw^%@XA zKQ|jzG1S_wtS@*_sNqph+h}qkFFdEqe-!FJB0m@A@f&*{-q8N%zDY0PH1LZhwtif& zW8r!}*&%CjG4QKi=0{%h{zt3rXDzQ{I7QOpVx_fx z_89(#)?4euDxlI)7rqnQGDPHRE=6Pmw7wOv)Tk#h3BnbkAg2Z3HTu3echQ&E>rz~a z_h54m%dU~dimf1_23IwhtZw(-?D^CH!IL-xA8RhkwXR{Zqu|@0jh`zUUqKiSN}m{@ z+?0*~(XShP|M~jLs^Af3xlk!QU4>~vjFzo|k>ss$(}oWEVoUe%^eDi8TeZyF=(hQqXNTpJ{~m9jHMDDI z{E-~#yyaf^`fFgiK^+3G+OOA|m&HF9mF6yMzWYqLtCxOzTPJF!g#HbA(}%H-(+|37 zUryGY5Z{06P zdld+rH&n#Q8}cWN-+Hmsee)W~F$Yu~I&3c9<>=z0uJb1ZsV|VFob?A(?!8LG_Z+*#q1qizv@`gOZD}8s@Sa%Ft%&OeI7zD%r z-;$DcOQav~nE5#>HuLVU8aGjIG$ zmKK&1l7ZZrloS$`xHAJW5|f5FqR}X*h={MRudvg9=(~DH3wwAX!>8(d?|NkTPmd;! z-fl0TP&E%*Z#R2)G!$xhhk60TKHRp8{2$E!*n~nI?VXU0Xn>TAtdBL@;QyU@=46L< z1c*t?$`Z6MG~Y3d|7A(Ytt5Ssr&o;U^E`B_p}`Y{Z~8v1?zu36{5nx7hL100-O?eBab;)C!Madmnjf^tNO zc%c!VXm6CQha1WsZ7<@Da`iyid5P#EUU+yS&>o&n2y0yrq=)d`xRkRY$9KH~wAJ<1 Js$n(}{|nBU{V7edxzsnoik_<+q$K@E+`x_&a7dus+flhBr@$078t?YdT zR$^#tMZx-X^7KmaEX1Kq2;5}Rv9#b1-~}4yb4WXaZgi97SHY_Ejhc2x40KXur5l(k z(eaw=$1s+K8(_7X`q;3so4;k^Sb>D9h6KV=ApZpnC?%v0J@uq-8-qA?k3Ty+G6&+N zFPRP_aCHL3gkCx?jL&AE4vh07*BV)V)9HO7@#8Pd@zKN!2GFHD=1@#h#j|vvNLCPo%iQJvO%L zkwyE!!L|D@CAv)=yl_tQ_$~8&bgma|K*@%hRSBQz&04E_vo>PHs3jEXxjCj;@qPH5 zJ=nsYq@JTHQp2QoPjlJTXUk4M9=!M(+-@y+^|3F>E?|a>`>2X3Hwf>$GT-{y0q&oh zW&l3jze6v^Qs1%tXMk>YH|)VroU(Y_y-ZQ##fpKTzY^ z6|h~Rg$M_>p6ULjk$%>Q`Qs&Ms7EEtb0giDVNW2t4~pDTMnjn9L|*nEX%kW@ z#~(h)32O_m|8(oyZ)S2@M@t9XFb)P&QCG4DDV-;KkQH`Zclo_uMY6_4aV2nwG{y`O;U_=t{Q7 zlzG>5X51^Hus_AtZXA!oChcD$+P35uzJ^--T%8!y0Gkck`b8L9La6gxPY~U4nVAA>oRcB?t zjTp=MqGeUDjodAs&P;aAzlFiIWkycSXXxq;4jl&OW?ldHd zO*XRcvF5ZEeSnpwZ2U7L!5{NBfUb1G*Xg}>DuGNLAPk7TT*{>9?-xr8ilkQ)I>?b- zH-8MJ$iXGxmMShwcv8W>eHU6a^or*TCWQl zJ*qG-2IrK0ijbqZLX)qjx|2x?6)}=4V)|}XW;e?>S5S=|@#Pu0%v~xJ7IVG*r#eBK zlg;R~4@tz}?;A0T`kxaxCB%ZG@`mNK7BmhO$&xjtijtBf%NQ{# z^*Y4tE@-qTg-sD6uhDQS0`Z)+Mh)Y>(6M|XA~$p)i2C3$Re{vFlU`zl169KUznE{; z9d}LNmq}P4>U{vubgd#>XhuT2uV?6`?-^?IEum6)>M>P x{&GW@FbL2VUdt`?ts(t9`af=Pvm*CcSJuwz_l$S+jNE*0fUC2+Qx!6p{4ecO-Vy)+ literal 0 HcmV?d00001 diff --git a/css/main.css b/css/main.css index 19cc55a7..4ed41ea9 100644 --- a/css/main.css +++ b/css/main.css @@ -16,14 +16,17 @@ header div img{ width: 300px; } .imagen-profile { - width: 70%; - margin-top: 50px; + width: 40%; + margin-top: 5px; + border-radius: 50%; + } .imagen-lab{ - width:80%; - background-color: white; - margin-top: 10%; + width:90%; + height: + background-color: #2B2B2B; + margin-top: 5px; } @@ -32,25 +35,19 @@ header div img{ left: 0; /* Establecemos la barra en la izquierda */ /*z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */ background-color: #2B2B2B; - width: 200px; + width: 250px; height: 100%; - -} -/* boton de seleccion*/ -#barra-menus{ - background-color: #d4cecb; - width: 100%; - height: 150px; } + /* boton de seleccion*/ #filtro-sedes{ text-align: center; width: 150px; float:left; - margin-top: 200px; - margin-left: 40px; + margin-top: 100px; + margin-left: 80px; } /*Tabuladores*/ @@ -58,14 +55,16 @@ header div img{ #contenido-tab { margin: 0px; padding: 0px; -font-family: ; font-weight: 500; font-family: 'Montserrat', sans-serif; +cursor: pointer; + } .cont-tabs{ margin-top: 150px; list-style: none; display: block; + } @@ -81,10 +80,31 @@ font-family: 'Montserrat', sans-serif; padding-right: 25px; float: right; color: white; - opacity: .6; + opacity: .5; font-size: 18px; } +.fa-home, +.fa-graduation-cap, +.fa-pie-chart, +.fa-code { + color: #F7B617; +} + +.fa-home{ +margin-left:-8%; +} + +.fa-graduation-cap{ + margin-left: -15%; +} + +.fa-pie-chart{ + margin-left: 2%; +} +.fa-code{ + margin-left:-15%; +} .barra { position: absolute; /*se pone para que los p no se encimen*/ @@ -95,33 +115,45 @@ font-family: 'Montserrat', sans-serif; } li:hover div.barra { -width: 200px; +width: 250px; } /*--------------------CONTENIDOSS---------------*/ /*--SECCION OVERVIEW (ESTILOS DE GRAFICA)*/ -#overviewTab { +#overviewTab, +#studentsTab, +#teachersTab { overflow: auto; - margin-left: 220px; + margin-left: 270px; } + .graficasTotal { background-color: #fff; float: left; height: 500px; margin: 40px 100px; vertical-align: top; - width: 800px; + width: 600px; box-shadow: 4px 4px 4px #c4c4c4; margin-right: 1%; overflow: hidden; + font-family: 'Montserrat', sans-serif; } .graficasTotal span { font-size: 1.5em; - font-weight: bold; + font-family: 'Montserrat', sans-serif; + font-weight: 900; + padding: 20px; +} + +.graficasTotal .texTbox{ + font-size: .8em; + font-family: 'Montserrat', sans-serif; + font-weight: 700; padding: 20px; } @@ -130,28 +162,32 @@ width: 200px; } .contenedor-grafica { - background-color: #f7b617; + /*background-color: trans;*/ float: left; text-align: center; vertical-align: top; - width: 40%; + width: 35%; height: 150px; padding: 0.8em; border-radius: 3px; box-shadow: 2px 2px 2px #aaa8a8; margin-right: 1em; } + + .grafica { margin-top: 150px; - + margin-left: 50px; } .grafica img { padding-left: 1em; padding-bottom: 0.8em; } + + .datoText { - font-size: 3.4em; + font-size: 3em; font-weight: 300; border-bottom: 1px solid #ffff; width: 2.7em; @@ -162,34 +198,117 @@ width: 200px; color: red; } +#achievement-porcentaje { + color:red; +} + +#acumulativo-nps { + color:red; +} +#promoters, +#passive, +#detractor { + color:red; + line-height: 1.5; + margin-top: 15px; + font-size: 1em; + font-weight: 300; + + +} + .cajaTexto { font-size: .8em; - padding-top: 1em; + font-family: 'Montserrat', sans-serif; + font-weight: 700; + padding: 20px; + +/* font-size: .8em; + padding-top: 1em;*/ } + .number-boxes { font-size: 3.5em; font-weight: 300; - border-bottom: 1px solid #ffffff; -} + border-bottom: 1px solid #ffffff; + } -/* SECCION ALUMNAS */ -#overviewTab { - overflow: auto; -} + /* SECCION ALUMNAS */ + /*#studentsTab { + overflow: auto; + }*/ -.especializacion { - float: left; - vertical-align: top; - background-color: #ffffff; - width: 30%; - padding: 1em; - box-shadow: 2px 2px 2px #aaa8a8; -} -.especializacion h4 { - font-weight: 700; - margin-bottom: 1em; - font-size: 1.2em; - color: #4C4743; -} + .contenedor-coders{ + float: right; + width: 800px; + margin-right: 200px; + } + .coders{ + width: 600px; + margin: 20px 20px; + } + .info-coders{ + float: right; + } + + .foto{ + width: 150px; + height: 150px; + } + + .nombre{ + font-size: 30px; + margin-left: 200px; + text-align:justify; + } + + .tech { + font-size: 20px; + margin-top: 50px; + } + + + + + /* SECCION TEACHERS */ + + /*#teachersTab { + overflow: auto; + }*/ + + .contenedor-teacher{ + width: 900px; + margin-left: 400px; + } + .contenedor-teacher div{ + display:inline-block; + margin: 20px 20px; + } + + .contenedor-teacher div img{ + width: 200px; + height: 200px; + } + + .info{ + float: right; + margin-bottom: 20px; + } + + #teachersTab hr{ + width: 800px; + text-align: center; + margin-top: 40px; + margin: 0 auto; + } + + #teachersTab h4{ + text-align: center; + margin-top: 50px; + } + + .cajas-graficas-teacher{ + margin-top: 80px; + } diff --git a/index.html b/index.html index c532a401..04f68ac9 100644 --- a/index.html +++ b/index.html @@ -20,7 +20,7 @@
- logo-laboratoria + logo-laboratoria-transparente foto de perfil
@@ -58,14 +58,21 @@
DASHBOARD +
  • - + STUDENTS
  • + STUDENTS DATA
  • @@ -97,63 +104,166 @@

    # ALUMNAS MATRICULADAS

    • -

    -

    -

    % DESERCION

    +

    -

    +

    % DESERCION

    -
    - META (ALUMNAS) -
    -
    -

    -

    -

    # ALUMNAS (Cumple Meta)

    -
    -
    -

    -

    -

    % TOTAL(Cumple Meta)

    -
    +
    + META (ALUMNAS) +
    +
    +

    -

    +

    # ALUMNAS (Cumple Meta)

    +
    +
    +

    -

    +

    % TOTAL(Cumple Meta)

    +
    +
    +
    +
    + + +
    + NET PROMOTER SCORE (NPS) +
    +
    +

    -

    +

    % ACUMULATIVO NPS

    +
    +
    +

    +

    +

    -
    - +
    +
    + + +
    +
    +

    ESPECIALIZACION

    +
    + UX Design + Front end developer +
    +
    + - - - - -
    -
    -

    TEACHERS AND JEDIS

    -
    - -
    -
    -
    - - - - - - - - + + +
    + +
    +
    + +
    +
    Jonathan "John"
    +

    Teacher & Jedi Master

    +

    jonathan@laboratoria.la

    +
    +
    + +
    + +
    +
    Emmanuel "Manu"
    +

    Lead Teacher

    +

    emmanuel@laboratoria.la

    +
    +
    + +
    + +
    +
    Ameli "Meme"
    +

    Teacher

    +

    ameli@laboratoria.la

    +
    +
    + +
    + +
    +
    Amalia
    +

    Teacher

    +

    amalia@laboratoria.la

    +
    +
    + +
    + +
    +
    Yesenia "Inti"
    +

    Teacher

    +

    yesenia@laboratoria.la

    +
    +
    +
    + +
    +
    Karla "Karlis"
    +

    Teacher

    +

    karla.n@laboratoria.la

    +
    +
    +
    +
    +

    GRAFICAS DE CALIFICACION (TEACHER & JEDI MASTER)

    + + +
    + +
    + CALIFICACION TEACHER +
    +
    +

    -

    +

    CALIFICACION GENERAL TEACHER

    +
    +
    +
    +
    + + +
    + CALIFICACION "JEDI MASTER" +
    +
    +

    -

    +

    CALIFICACION GENERAL JEDI MASTER

    +
    +
    +
    +
    + +
    +
    + + + + + + + + + + diff --git a/js/app.js b/js/app.js index 983eadea..1c9d5409 100644 --- a/js/app.js +++ b/js/app.js @@ -1,83 +1,364 @@ -/* - * Funcionalidad de tu producto - */ - /*---- Función para seleccionar sede y promoción, y generar datos------*/ - var select = document.getElementById("filtro-sedes"); - select.addEventListener("change", seleccionarOpcion); - function seleccionarOpcion() { - var sede = select.value; - var generacion = select.options[select.selectedIndex].dataset.generacion; - var generacionEstudiantes = data[sede][generacion]["students"].length; - - //-----Código para acceder a las alumnas activas por sede y generacióne specificas - var count =0; - var counter =0; - for (var i = 0; i< generacionEstudiantes; i++){ - console.log(generacionEstudiantes.length); - console.log (data[sede][generacion].students[i].active); - var activeStudents = data[sede][generacion].students[i].active; - if(activeStudents === true){ - counter ++; - } else { - count ++; - } - - } - console.log("El valor es de activas: "+counter); - console.log("El valor es de inactivas: "+count); - - } - - - - - - - /* --------------------------------------------------------------- - -----Funcion de Tabuladores*/ - function mostrarOcultar(event) { - var tabSeleccionado = event.target.dataset.tabSeleccionado; - var overflow = document.getElementById("overviewTab"); - var students = document.getElementById("studentsTab"); - var teachers = document.getElementById("teachersTab"); - if(tabSeleccionado === "tabOverview"){ - console.log("overflow"); - students.style.display = "none"; - teachers.style.display = "none"; - //muestra el tab - overflow.style.display = "block"; - - }else if (tabSeleccionado === "tabStudents") { - console.log("studen"); - teachers.style.display = "none"; - overflow.style.display = "none"; - //muestra la tab - students.style.display = "block"; - - }else if (tabSeleccionado === "tabTeachers") { - console.log("tecaher"); - students.style.display = "none"; - overflow.style.display = "none"; - //muestra la tab - teachers.style.display = "block"; - } +/*---- Función para seleccionar sede y promoción, y generar datos------*/ +var select = document.getElementById("filtro-sedes"); +select.addEventListener("change", seleccionarOpcion); +function seleccionarOpcion() { + var sede = select.value; + var generacion = select.options[select.selectedIndex].dataset.generacion; + var generacionEstudiantes = data[sede][generacion]["students"].length; + var arrayEstudiantes = data[sede][generacion]["students"]; + var calificacionesNps = data[sede][generacion]["ratings"]; //arrayRartings + + + console.log(generacionEstudiantes); + console.log(arrayEstudiantes); + console.log(calificacionesNps); + + + +/*----------------------- CODIGO PARA LA SECCION DEL OVERVIEW ------------------------*/ + + +//Código para acceder a las alumnas activas por sede y generacióne specificas + +var counterActivo = 0; +var counterInactivo = 0; + +for (var i = 0; i< generacionEstudiantes; i++){ + console.log(generacionEstudiantes.length); + console.log (data[sede][generacion].students[i].active); + var activeStudents = data[sede][generacion].students[i].active; + console.log(activeStudents); + if(activeStudents === true){ + counterActivo ++; //contador Activo + } else { + counterInactivo ++; //contador Inactivo + } + } + + console.log("El valor es de activas: "+ counterActivo); + console.log("El valor es de inactivas: "+ counterInactivo); + /*---- Estudiantes que desertaron (Porcentaje)------*/ + + var inactivoPorcentaje = ((counterInactivo / generacionEstudiantes) * 100).toFixed(1) + '%'; + console.log(inactivoPorcentaje); + + // Total de estudiantes en su contenedor + var enrollmentStudents = document.getElementById("caja-enrollment"); + enrollmentStudents.textContent = generacionEstudiantes; + + console.log(enrollmentStudents); + + // Porcentaje de estudiantes que desertaron en su contenedor + var dropoutPorcentaje = document.getElementById("dropout-porcentaje"); + dropoutPorcentaje.textContent = counterInactivo; + + + /*------- ACHIEVEMENT (Meta de Estudiantes Tectico y HSE)----------------*/ + var metaStudent= 0; + var scoreTech = 0; + var scoreHSE = 0; + var totalActTech =0; + var totalActHSE =0; + + for (var i = 0; i < generacionEstudiantes; i++) { + console.log(activeStudents); + + if(activeStudents === true){ + for (var j = 0; j < arrayEstudiantes[i]["sprints"].length; j++) { + scoreTech += arrayEstudiantes[i]["sprints"][j]["score"]["tech"]; + scoreHSE += arrayEstudiantes[i]["sprints"][j]["score"]["hse"]; + console.log(scoreHSE); } - var cargarPagina = function() { - var overflow = document.getElementById("overviewTab"); - var students = document.getElementById("studentsTab"); - var teachers = document.getElementById("teachersTab"); - overflow.style.display = "none"; - students.style.display = "none"; - teachers.style.display = "none"; - - var elementosTab = document.getElementsByClassName("tab"); - for (var i = 0; i < elementosTab.length; i++) { - elementosTab[i].addEventListener("click",mostrarOcultar); - } + + var promedioTech = scoreTech / arrayEstudiantes[i]["sprints"].length; + var promedioHSE = scoreHSE / arrayEstudiantes[i]["sprints"].length; + console.log(promedioTech); + console.log(promedioHSE); + + totalActTech += promedioTech; + totalActHSE += promedioHSE; + + console.log("El valor es de Tech: "+ promedioTech); + console.log("El valor es de HSE: "+ promedioHSE); + + } + var promTotalActTech = totalActTech/ counterActivo; + var promTotalActTHSE = totalActHSE /counterActivo; + + if (promTotalActTech >= 1260 && promTotalActTHSE >= 840) { + metaStudent++; + } + } + console.log("El valor es de Tech: "+ totalActTech); + console.log("El valor es de HSE: "+ totalActHSE); + + var cajaAchievement = document.getElementById("caja-achievement"); + cajaAchievement.textContent = metaStudent; + + var percentajeTotal = document.getElementById("achievement-porcentaje"); + percentajeTotal.textContent = ((metaStudent / generacionEstudiantes) * 100).toFixed(1); + + + + /*------- El Net Promoter Score (NPS) promedio de los sprints cursados----------------*/ + + var promptersNps = document.getElementById("promoters"); + var passiveNps = document.getElementById("passive"); + var detractorNps = document.getElementById("detractor"); + var nps = document.getElementById("acumulativo-nps"); + console.log(nps); + var promoters = 0 / generacionEstudiantes * 100; + var passives = 0 / generacionEstudiantes * 100; + var detractors = 0 / generacionEstudiantes * 100; + for (i = 0; i < calificacionesNps.length; i++) { + promoters += (calificacionesNps[i]["nps"]["promoters"]) / calificacionesNps.length; + passives += (calificacionesNps[i]["nps"]["passive"]) / calificacionesNps.length; + detractors += (calificacionesNps[i]["nps"]["detractors"]) / calificacionesNps.length; + + promptersNps.textContent = promoters.toFixed(1) + "% Promoters"; + passiveNps.textContent = passives.toFixed(1) + "% Passives"; + detractorNps.textContent = detractors.toFixed(1) + "% Detractors"; + + nps.textContent = (promoters - detractors).toFixed(1); + } + + + + + + + /*----------------------- CODIGO PARA LA SECCION DE ESTUDIANTES ------------------------*/ + /* Agregar funcion para que aparezcan lista de estudiantes*/ + /*Funcion para que aparezcan lista de estudiantes*/ + document.getElementById("studentsTab").innerHTML = ""; + var scoreTech = 0; + var scoreHSE = 0; + + for (var l = 0; l 5) { + jediCalif.style.color = 'green'; + } else { + jediCalif.style.color = 'black'; + } + } + + + /*----------------------- SECCION DE GRAFICAS (Google Charts) -----------------*/ + + function drawChart() { + /*---- Graficas de Overview ---*/ + + //DESERCION (Grafica) + var data1 = new google.visualization.DataTable(); + data1.addColumn('string', 'name'); + data1.addColumn('number', 'students'); + data1.addRows([ + ['Desertoras', counterInactivo], + ['Asisten a clases', generacionEstudiantes - counterInactivo], + ]); + + var options1 = {'title': 'Alumnas (Activas) vs Alumnas que han desertado', + 'width': 500, + 'height': 300, + 'colors':['#000000','#F7B617'], + 'is3D': true}; + + var chart1 = new google.visualization.PieChart(document.getElementById("enrollment-draw")); + chart1.draw(data1, options1); + + + //CUMPLIO META (Grafica) + var data2 = new google.visualization.DataTable(); + data2.addColumn('string', 'name'); + data2.addColumn('number', 'students'); + data2.addRows([ + ['No Cumple meta', generacionEstudiantes - metaStudent], + ['Cumple meta', metaStudent], + ]); + + var options2 = {'title': 'Estudiantes la meta de puntaje establecido (Sprint)', + 'width': 500, + 'height': 300, + 'colors':['#000000','#F7B617'], + 'is3D': true}; + + var chart2 = new google.visualization.PieChart(document.getElementById("achieven-draw")); + chart2.draw(data2, options2); + + //El Net Promoter Score (NPS) + var data3 = new google.visualization.DataTable(); + data3.addColumn('string', 'logro'); + data3.addColumn('number', 'puntaje'); + data3.addRows([ + ['Detractors', detractors / 100 * generacionEstudiantes], + ['Passives', passives / 100 * generacionEstudiantes], + ['Promoters', promoters / 100 * generacionEstudiantes] + ]); + + var options3 = {'title': '¿Recomendarías LABORATORIA a otras personas?', + 'width': 500, + 'height': 300, + 'colors':['#000000','#2B2B2B','#F7B617'], + 'is3D': true}; + + var chart3 = new google.visualization.PieChart(document.getElementById("nps-draw")); + chart3.draw(data3, options3); + + + + /*--- Graficas de Teachers y Jedis ----*/ + var dataTeacher = new google.visualization.DataTable(); + dataTeacher.addColumn('string', 'logro'); + dataTeacher.addColumn('number', 'puntaje'); + dataTeacher.addRows([ + ['Puntaje No Otorgado', 5 - ratingsGeneralTeacher], + ['Puntaje Otorgado (Promedio)', ratingsGeneralTeacher], + ]); + + var optionsTeacher = {'title': 'Rating otorgado por las alumnas a sus junior y master teachers', + 'width': 500, + 'height': 300, + 'colors':['#83d202','#004411'], + 'is3D': true}; + + var chartTeacher = new google.visualization.PieChart(document.getElementById("teacher-draw")); + chartTeacher.draw(dataTeacher, optionsTeacher); + + + //JEDI MASTER + + var dataJedi = new google.visualization.DataTable(); + dataJedi.addColumn('string', 'logro'); + dataJedi.addColumn('number', 'puntaje'); + dataJedi.addRows([ + ['Puntaje No Otorgado', 5 - jediMaster], + ['Puntaje Otorgado Promedio', jediMaster], + ]); + + var optionsJedi = {'title': 'Rating otorgado por las alumnas a sus Jedi Master', + 'width': 500, + 'height': 300, + 'colors':['#83d202','#004411'], + 'is3D': true}; + + var chartJedi = new google.visualization.PieChart(document.getElementById("jedi-draw")); + chartJedi.draw(dataJedi, optionsJedi); + + + + } + google.charts.setOnLoadCallback(drawChart); + } + + /* ------------------Funcion de Tabuladores-------------------*/ + function mostrarOcultar(event) { + var tabSeleccionado = event.target.dataset.tabSeleccionado; + var overflow = document.getElementById("overviewTab"); + var students = document.getElementById("studentsTab"); + var teachers = document.getElementById("teachersTab"); + if(tabSeleccionado === "tabOverview"){ + console.log("overflow"); + students.style.display = "none"; + teachers.style.display = "none"; + //muestra el tab + overflow.style.display = "block"; + + }else if (tabSeleccionado === "tabStudents") { + console.log("studen"); + teachers.style.display = "none"; + overflow.style.display = "none"; + //muestra la tab + students.style.display = "block"; + }else if (tabSeleccionado === "tabTeachers") { + console.log("tecaher"); + students.style.display = "none"; + overflow.style.display = "none"; + //muestra la tab + teachers.style.display = "block"; + } + + } + var cargarPagina = function() { + var overflow = document.getElementById("overviewTab"); + var students = document.getElementById("studentsTab"); + var teachers = document.getElementById("teachersTab"); + overflow.style.display = "none"; + students.style.display = "none"; + teachers.style.display = "none"; + + var elementosTab = document.getElementsByClassName("tab"); + for (var i = 0; i < elementosTab.length; i++) { + elementosTab[i].addEventListener("click",mostrarOcultar); + } + } + + cargarPagina(); From 78afe63e69c53f2c26331dc46688881f80970d1d Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Tue, 19 Dec 2017 14:26:16 -0600 Subject: [PATCH 07/10] =?UTF-8?q?subiendo=20cambios=20maquetado-dise=C3=B1?= =?UTF-8?q?o?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- js/app.js | 802 +++++++++++++++++++++--------------------------------- 1 file changed, 308 insertions(+), 494 deletions(-) diff --git a/js/app.js b/js/app.js index 14dd14ff..8da6ce90 100644 --- a/js/app.js +++ b/js/app.js @@ -1,4 +1,4 @@ -<<<<<<< HEAD + /*---- Función para seleccionar sede y promoción, y generar datos------*/ var select = document.getElementById("filtro-sedes"); select.addEventListener("change", seleccionarOpcion); @@ -26,544 +26,358 @@ var counterInactivo = 0; for (var i = 0; i< generacionEstudiantes; i++){ console.log(generacionEstudiantes.length); - console.log (data[sede][generacion].students[i].active); - var activeStudents = data[sede][generacion].students[i].active; - console.log(activeStudents); - if(activeStudents === true){ - counterActivo ++; //contador Activo - } else { - counterInactivo ++; //contador Inactivo - } - } - - console.log("El valor es de activas: "+ counterActivo); - console.log("El valor es de inactivas: "+ counterInactivo); -======= - -window.addEventListener("load", session); - -function session (event){ -var newDivForm= document.createElement("div"); -newDivForm.setAttribute("Id", "form"); -newDivForm.classList.add("form"); - -var inputUser = document.createElement("input"); -inputUser.setAttribute("type", "text"); -inputUser.setAttribute("value", ""); -inputUser.setAttribute("Id", "inputUser"); -inputUser.setAttribute("placeholder", "User"); -newDivForm.appendChild(inputUser); - -var inputPswd = document.createElement("input"); -inputPswd.setAttribute("type", "password"); -inputPswd.setAttribute("value", ""); -inputPswd.setAttribute("Id", "inputPassword"); -inputPswd.setAttribute("placeholder", "Password"); -inputPswd.setAttribute("maxlength", "11"); -newDivForm.appendChild(inputPswd); - -var sendButton = document.createElement ("button"); -sendButton.setAttribute("value", "Send"); -sendButton.setAttribute("Id","btnSnd"); -sendButton.innerText = "Send"; -newDivForm.appendChild(sendButton); -document.body.appendChild(newDivForm); - -document.getElementById("btnSnd").addEventListener("click", createSession); - -function createSession (event){ - var userValue = document.getElementById("inputUser").value; - console.log(userValue); - - var pswdValue = document.getElementById("inputPassword").value; - console.log(pswdValue); - - /* Usuarios registrados - Usuario :Jonathan - Password: Laboratoria */ - if(userValue === "Jonathan" || pswdValue === "Laboratoria"){ - alert("continua"); - inputUser.value = ""; - inputPswd.value = ""; + console.log (data[sede][generacion].students[i].active); + var activeStudents = data[sede][generacion].students[i].active; + console.log(activeStudents); + if(activeStudents === true){ + counterActivo ++; //contador Activo } else { - alert("Falso"); - inputUser.value = ""; - inputPswd.value = ""; + counterInactivo ++; //contador Inactivo } - } } -/*var sede= data[] - -data.AQP["2016-2"].students[0].active - -for(var i=1; i <= numsede.length; i++){ - for(var j=0; j<=data.AQP[i].students.length; j´++) - { - console.log(data.AQP[i].students[j].name)} } -*/ -var arraySede = Object.keys(data); -// Obtiene la cantidad de sedes (4) -var numSede =arraySede.length; -var counter=0; -//var arrayGen = Object.keys(numSede[0]); - -/*for( var i = 0; i<=numSede; i++){ - var cantGen = Object.keys(data[arraySede[i]]); - console.log(cantGen); - for (var j = 0; j<=cantGen.length; j++){ - var totalStudents = data[arraySede[i]][cantGen[j]].students.length; - for(var k= 0; k<= totalStudents; k++){ - var activeStudents = data[arraySede[i]][cantGen[j]][students[0]]; + +console.log("El valor es de activas: "+ counterActivo); +console.log("El valor es de inactivas: "+ counterInactivo); + +/*---- Estudiantes que desertaron (Porcentaje)------*/ + +var inactivoPorcentaje = ((counterInactivo / generacionEstudiantes) * 100).toFixed(1) + '%'; +console.log(inactivoPorcentaje); + +// Total de estudiantes en su contenedor + var enrollmentStudents = document.getElementById("caja-enrollment"); + enrollmentStudents.textContent = generacionEstudiantes; + + console.log(enrollmentStudents); + + // Porcentaje de estudiantes que desertaron en su contenedor + var dropoutPorcentaje = document.getElementById("dropout-porcentaje"); + dropoutPorcentaje.textContent = counterInactivo; + + +/*------- ACHIEVEMENT (Meta de Estudiantes Tectico y HSE)----------------*/ + var metaStudent= 0; + var scoreTech = 0; + var scoreHSE = 0; + var totalActTech =0; + var totalActHSE =0; + + for (var i = 0; i < generacionEstudiantes; i++) { + console.log(activeStudents); if(activeStudents === true){ + for (var j = 0; j < arrayEstudiantes[i]["sprints"].length; j++) { + scoreTech += arrayEstudiantes[i]["sprints"][j]["score"]["tech"]; + scoreHSE += arrayEstudiantes[i]["sprints"][j]["score"]["hse"]; + console.log(scoreHSE); + } + + var promedioTech = scoreTech / arrayEstudiantes[i]["sprints"].length; + var promedioHSE = scoreHSE / arrayEstudiantes[i]["sprints"].length; + console.log(promedioTech); + console.log(promedioHSE); + + totalActTech += promedioTech; + totalActHSE += promedioHSE; + + console.log("El valor es de Tech: "+ promedioTech); + console.log("El valor es de HSE: "+ promedioHSE); - counter = counter ++; } - console.log(counter); + var promTotalActTech = totalActTech/ counterActivo; + var promTotalActTHSE = totalActHSE /counterActivo; + + if (promTotalActTech >= 1260 && promTotalActTHSE >= 840) { + metaStudent++; } - } -}*/ -var count =0; -var countTotal = 0; -//data[sede][generacion].students -for (var i in data.AQP["2016-2"].students){ - countTotal ++; - console.log (data.AQP["2016-2"].students[i].active); - var activeStudents = data.AQP["2016-2"].students[i].active; + } + console.log("El valor es de Tech: "+ totalActTech); + console.log("El valor es de HSE: "+ totalActHSE); - if(activeStudents === true){ - counter ++; - } else { - count ++; - } + var cajaAchievement = document.getElementById("caja-achievement"); + cajaAchievement.textContent = metaStudent; -} -console.log("El valor es de: "+counter); -console.log("El valor es de inactivas: "+count); -console.log("Studiantes por generación"+ countTotal); - -var countTotalStudents = 0; -var statusInd = 0; -var countTotalActive = 0; -var countTotalInact = 0; -for(var indexSede in data ){ - //console.log (data[indexSede]); - for (var indexGen in data[indexSede]){ - //console.log( indexGen); //Obtiene el valor del número de la generación - for (var indexPropGen in data[indexSede][indexGen]){ - //console.log(indexPropGen); //entra a estudiantes y ratings - if (indexPropGen === "students"){ - //console.log (indexPropGen); - for(var indexStudents in data[indexSede][indexGen][indexPropGen]){ - // console.log(indexStudents["students"]); - //onsole.log(indexStudents); - countTotalStudents++; - statusInd = data[indexSede][indexGen][indexPropGen][indexStudents].active; - if(statusInd === true){ - countTotalActive ++; - } else { - countTotalInact ++; - } + var percentajeTotal = document.getElementById("achievement-porcentaje"); + percentajeTotal.textContent = ((metaStudent / generacionEstudiantes) * 100).toFixed(1); - } - } - //countTotalStudents ++; - // } + + /*------- El Net Promoter Score (NPS) promedio de los sprints cursados----------------*/ + + var promptersNps = document.getElementById("promoters"); + var passiveNps = document.getElementById("passive"); + var detractorNps = document.getElementById("detractor"); + var nps = document.getElementById("acumulativo-nps"); + console.log(nps); + + + var promoters = 0 / generacionEstudiantes * 100; + var passives = 0 / generacionEstudiantes * 100; + var detractors = 0 / generacionEstudiantes * 100; + for (i = 0; i < calificacionesNps.length; i++) { + promoters += (calificacionesNps[i]["nps"]["promoters"]) / calificacionesNps.length; + passives += (calificacionesNps[i]["nps"]["passive"]) / calificacionesNps.length; + detractors += (calificacionesNps[i]["nps"]["detractors"]) / calificacionesNps.length; + + promptersNps.textContent = promoters.toFixed(1) + "% Promoters"; + passiveNps.textContent = passives.toFixed(1) + "% Passives"; + detractorNps.textContent = detractors.toFixed(1) + "% Detractors"; + + nps.textContent = (promoters - detractors).toFixed(1); } + + + + + + +/*----------------------- CODIGO PARA LA SECCION DE ESTUDIANTES ------------------------*/ + + +/* Agregar funcion para que aparezcan lista de estudiantes*/ +/*Funcion para que aparezcan lista de estudiantes*/ +document.getElementById("studentsTab").innerHTML = ""; +var scoreTech = 0; +var scoreHSE = 0; + +for (var l = 0; l 5) { + jediCalif.style.color = 'green'; + } else { + jediCalif.style.color = 'black'; + } + } + + +/*----------------------- SECCION DE GRAFICAS (Google Charts) -----------------*/ + +function drawChart() { +/*---- Graficas de Overview ---*/ - /* --------------------------------------------------------------- - -----Funcion de Tabuladores*/ - function mostrarOcultar(event) { - var tabSeleccionado = event.target.dataset.tabSeleccionado; - var overflow = document.getElementById("overviewTab"); - var students = document.getElementById("studentsTab"); - var teachers = document.getElementById("teachersTab"); - if(tabSeleccionado === "tabOverview"){ - console.log("overflow"); - students.style.display = "none"; - teachers.style.display = "none"; - //muestra el tab - overflow.style.display = "block"; +//DESERCION (Grafica) +var data1 = new google.visualization.DataTable(); + data1.addColumn('string', 'name'); + data1.addColumn('number', 'students'); + data1.addRows([ + ['Desertoras', counterInactivo], + ['Asisten a clases', generacionEstudiantes - counterInactivo], + ]); - }else if (tabSeleccionado === "tabStudents") { - console.log("studen"); - teachers.style.display = "none"; - overflow.style.display = "none"; - //muestra la tab - students.style.display = "block"; + var options1 = {'title': 'Alumnas (Activas) vs Alumnas que han desertado', + 'width': 500, + 'height': 300, + 'colors':['#000000','#F7B617'], + 'is3D': true}; - }else if (tabSeleccionado === "tabTeachers") { - console.log("tecaher"); - students.style.display = "none"; - overflow.style.display = "none"; - //muestra la tab - teachers.style.display = "block"; - } ->>>>>>> 30ac44e7e3669bef3bc6204d01ada32a3f54848a + var chart1 = new google.visualization.PieChart(document.getElementById("enrollment-draw")); + chart1.draw(data1, options1); - /*---- Estudiantes que desertaron (Porcentaje)------*/ - var inactivoPorcentaje = ((counterInactivo / generacionEstudiantes) * 100).toFixed(1) + '%'; - console.log(inactivoPorcentaje); +//CUMPLIO META (Grafica) +var data2 = new google.visualization.DataTable(); + data2.addColumn('string', 'name'); + data2.addColumn('number', 'students'); + data2.addRows([ + ['No Cumple meta', generacionEstudiantes - metaStudent], + ['Cumple meta', metaStudent], + ]); - // Total de estudiantes en su contenedor - var enrollmentStudents = document.getElementById("caja-enrollment"); - enrollmentStudents.textContent = generacionEstudiantes; + var options2 = {'title': 'Estudiantes la meta de puntaje establecido (Sprint)', + 'width': 500, + 'height': 300, + 'colors':['#000000','#F7B617'], + 'is3D': true}; - console.log(enrollmentStudents); + var chart2 = new google.visualization.PieChart(document.getElementById("achieven-draw")); + chart2.draw(data2, options2); - // Porcentaje de estudiantes que desertaron en su contenedor - var dropoutPorcentaje = document.getElementById("dropout-porcentaje"); - dropoutPorcentaje.textContent = counterInactivo; +//El Net Promoter Score (NPS) +var data3 = new google.visualization.DataTable(); + data3.addColumn('string', 'logro'); + data3.addColumn('number', 'puntaje'); + data3.addRows([ + ['Detractors', detractors / 100 * generacionEstudiantes], + ['Passives', passives / 100 * generacionEstudiantes], + ['Promoters', promoters / 100 * generacionEstudiantes] + ]); + var options3 = {'title': 'Recomendarias LABORATORIA a otras personas', + 'width': 500, + 'height': 300, + 'colors':['#000000','#2B2B2B','#F7B617'], + 'is3D': true}; - /*------- ACHIEVEMENT (Meta de Estudiantes Tectico y HSE)----------------*/ - var metaStudent= 0; - var scoreTech = 0; - var scoreHSE = 0; - var totalActTech =0; - var totalActHSE =0; + var chart3 = new google.visualization.PieChart(document.getElementById("nps-draw")); + chart3.draw(data3, options3); - for (var i = 0; i < generacionEstudiantes; i++) { - console.log(activeStudents); - if(activeStudents === true){ - for (var j = 0; j < arrayEstudiantes[i]["sprints"].length; j++) { - scoreTech += arrayEstudiantes[i]["sprints"][j]["score"]["tech"]; - scoreHSE += arrayEstudiantes[i]["sprints"][j]["score"]["hse"]; - console.log(scoreHSE); - } - var promedioTech = scoreTech / arrayEstudiantes[i]["sprints"].length; - var promedioHSE = scoreHSE / arrayEstudiantes[i]["sprints"].length; - console.log(promedioTech); - console.log(promedioHSE); +/*--- Graficas de Teachers y Jedis ----*/ +var dataTeacher = new google.visualization.DataTable(); + dataTeacher.addColumn('string', 'logro'); + dataTeacher.addColumn('number', 'puntaje'); + dataTeacher.addRows([ + ['Puntaje No Otorgado', 5 - ratingsGeneralTeacher], + ['Puntaje Otorgado (Promedio)', ratingsGeneralTeacher], + ]); - totalActTech += promedioTech; - totalActHSE += promedioHSE; - - console.log("El valor es de Tech: "+ promedioTech); - console.log("El valor es de HSE: "+ promedioHSE); - - } - var promTotalActTech = totalActTech/ counterActivo; - var promTotalActTHSE = totalActHSE /counterActivo; + var optionsTeacher = {'title': 'Rating otorgado por las alumnas a sus junior y master teachers', + 'width': 500, + 'height': 300, + 'colors':['#83d202','#004411'], + 'is3D': true}; - if (promTotalActTech >= 1260 && promTotalActTHSE >= 840) { - metaStudent++; - } - } - console.log("El valor es de Tech: "+ totalActTech); - console.log("El valor es de HSE: "+ totalActHSE); + var chartTeacher = new google.visualization.PieChart(document.getElementById("teacher-draw")); + chartTeacher.draw(dataTeacher, optionsTeacher); - var cajaAchievement = document.getElementById("caja-achievement"); - cajaAchievement.textContent = metaStudent; +//JEDI MASTER - var percentajeTotal = document.getElementById("achievement-porcentaje"); - percentajeTotal.textContent = ((metaStudent / generacionEstudiantes) * 100).toFixed(1); +var dataJedi = new google.visualization.DataTable(); + dataJedi.addColumn('string', 'logro'); + dataJedi.addColumn('number', 'puntaje'); + dataJedi.addRows([ + ['Puntaje No Otorgado', 5 - jediMaster], + ['Puntaje Otorgado Promedio', jediMaster], + ]); + var optionsJedi = {'title': 'Rating otorgado por las alumnas a sus Jedi Master', + 'width': 500, + 'height': 300, + 'colors':['#83d202','#004411'], + 'is3D': true}; - - /*------- El Net Promoter Score (NPS) promedio de los sprints cursados----------------*/ - - var promptersNps = document.getElementById("promoters"); - var passiveNps = document.getElementById("passive"); - var detractorNps = document.getElementById("detractor"); - var nps = document.getElementById("acumulativo-nps"); - console.log(nps); - var promoters = 0 / generacionEstudiantes * 100; - var passives = 0 / generacionEstudiantes * 100; - var detractors = 0 / generacionEstudiantes * 100; - for (i = 0; i < calificacionesNps.length; i++) { - promoters += (calificacionesNps[i]["nps"]["promoters"]) / calificacionesNps.length; - passives += (calificacionesNps[i]["nps"]["passive"]) / calificacionesNps.length; - detractors += (calificacionesNps[i]["nps"]["detractors"]) / calificacionesNps.length; - - promptersNps.textContent = promoters.toFixed(1) + "% Promoters"; - passiveNps.textContent = passives.toFixed(1) + "% Passives"; - detractorNps.textContent = detractors.toFixed(1) + "% Detractors"; - - nps.textContent = (promoters - detractors).toFixed(1); - } - + var chartJedi = new google.visualization.PieChart(document.getElementById("jedi-draw")); + chartJedi.draw(dataJedi, optionsJedi); + + + + } + google.charts.setOnLoadCallback(drawChart); +} - /*----------------------- CODIGO PARA LA SECCION DE ESTUDIANTES ------------------------*/ - /* Agregar funcion para que aparezcan lista de estudiantes*/ - /*Funcion para que aparezcan lista de estudiantes*/ - document.getElementById("studentsTab").innerHTML = ""; - var scoreTech = 0; - var scoreHSE = 0; - for (var l = 0; l 5) { - jediCalif.style.color = 'green'; - } else { - jediCalif.style.color = 'black'; - } - } - - - /*----------------------- SECCION DE GRAFICAS (Google Charts) -----------------*/ - - function drawChart() { - /*---- Graficas de Overview ---*/ - - //DESERCION (Grafica) - var data1 = new google.visualization.DataTable(); - data1.addColumn('string', 'name'); - data1.addColumn('number', 'students'); - data1.addRows([ - ['Desertoras', counterInactivo], - ['Asisten a clases', generacionEstudiantes - counterInactivo], - ]); - - var options1 = {'title': 'Alumnas (Activas) vs Alumnas que han desertado', - 'width': 500, - 'height': 300, - 'colors':['#000000','#F7B617'], - 'is3D': true}; - - var chart1 = new google.visualization.PieChart(document.getElementById("enrollment-draw")); - chart1.draw(data1, options1); - - - //CUMPLIO META (Grafica) - var data2 = new google.visualization.DataTable(); - data2.addColumn('string', 'name'); - data2.addColumn('number', 'students'); - data2.addRows([ - ['No Cumple meta', generacionEstudiantes - metaStudent], - ['Cumple meta', metaStudent], - ]); - - var options2 = {'title': 'Estudiantes la meta de puntaje establecido (Sprint)', - 'width': 500, - 'height': 300, - 'colors':['#000000','#F7B617'], - 'is3D': true}; - - var chart2 = new google.visualization.PieChart(document.getElementById("achieven-draw")); - chart2.draw(data2, options2); - - //El Net Promoter Score (NPS) - var data3 = new google.visualization.DataTable(); - data3.addColumn('string', 'logro'); - data3.addColumn('number', 'puntaje'); - data3.addRows([ - ['Detractors', detractors / 100 * generacionEstudiantes], - ['Passives', passives / 100 * generacionEstudiantes], - ['Promoters', promoters / 100 * generacionEstudiantes] - ]); - - var options3 = {'title': '¿Recomendarías LABORATORIA a otras personas?', - 'width': 500, - 'height': 300, - 'colors':['#000000','#2B2B2B','#F7B617'], - 'is3D': true}; - - var chart3 = new google.visualization.PieChart(document.getElementById("nps-draw")); - chart3.draw(data3, options3); - - - - /*--- Graficas de Teachers y Jedis ----*/ - var dataTeacher = new google.visualization.DataTable(); - dataTeacher.addColumn('string', 'logro'); - dataTeacher.addColumn('number', 'puntaje'); - dataTeacher.addRows([ - ['Puntaje No Otorgado', 5 - ratingsGeneralTeacher], - ['Puntaje Otorgado (Promedio)', ratingsGeneralTeacher], - ]); - - var optionsTeacher = {'title': 'Rating otorgado por las alumnas a sus junior y master teachers', - 'width': 500, - 'height': 300, - 'colors':['#83d202','#004411'], - 'is3D': true}; - - var chartTeacher = new google.visualization.PieChart(document.getElementById("teacher-draw")); - chartTeacher.draw(dataTeacher, optionsTeacher); - - - //JEDI MASTER - - var dataJedi = new google.visualization.DataTable(); - dataJedi.addColumn('string', 'logro'); - dataJedi.addColumn('number', 'puntaje'); - dataJedi.addRows([ - ['Puntaje No Otorgado', 5 - jediMaster], - ['Puntaje Otorgado Promedio', jediMaster], - ]); - - var optionsJedi = {'title': 'Rating otorgado por las alumnas a sus Jedi Master', - 'width': 500, - 'height': 300, - 'colors':['#83d202','#004411'], - 'is3D': true}; - - var chartJedi = new google.visualization.PieChart(document.getElementById("jedi-draw")); - chartJedi.draw(dataJedi, optionsJedi); - - - - } - google.charts.setOnLoadCallback(drawChart); - } - - /* ------------------Funcion de Tabuladores-------------------*/ - function mostrarOcultar(event) { - var tabSeleccionado = event.target.dataset.tabSeleccionado; - var overflow = document.getElementById("overviewTab"); - var students = document.getElementById("studentsTab"); - var teachers = document.getElementById("teachersTab"); - if(tabSeleccionado === "tabOverview"){ - console.log("overflow"); - students.style.display = "none"; - teachers.style.display = "none"; - //muestra el tab - overflow.style.display = "block"; - - }else if (tabSeleccionado === "tabStudents") { - console.log("studen"); - teachers.style.display = "none"; - overflow.style.display = "none"; - //muestra la tab - students.style.display = "block"; - }else if (tabSeleccionado === "tabTeachers") { - console.log("tecaher"); - students.style.display = "none"; - overflow.style.display = "none"; - //muestra la tab - teachers.style.display = "block"; - } - - } - var cargarPagina = function() { - var overflow = document.getElementById("overviewTab"); - var students = document.getElementById("studentsTab"); - var teachers = document.getElementById("teachersTab"); - overflow.style.display = "none"; - students.style.display = "none"; - teachers.style.display = "none"; - - var elementosTab = document.getElementsByClassName("tab"); - for (var i = 0; i < elementosTab.length; i++) { - elementosTab[i].addEventListener("click",mostrarOcultar); - } - } - - cargarPagina(); -======= ->>>>>>> 30ac44e7e3669bef3bc6204d01ada32a3f54848a +/* ------------------Funcion de Tabuladores-------------------*/ + function mostrarOcultar(event) { + var tabSeleccionado = event.target.dataset.tabSeleccionado; + var overflow = document.getElementById("overviewTab"); + var students = document.getElementById("studentsTab"); + var teachers = document.getElementById("teachersTab"); + if(tabSeleccionado === "tabOverview"){ + console.log("overflow"); + students.style.display = "none"; + teachers.style.display = "none"; + //muestra el tab + overflow.style.display = "block"; + + }else if (tabSeleccionado === "tabStudents") { + console.log("studen"); + teachers.style.display = "none"; + overflow.style.display = "none"; + //muestra la tab + students.style.display = "block"; + + }else if (tabSeleccionado === "tabTeachers") { + console.log("tecaher"); + students.style.display = "none"; + overflow.style.display = "none"; + //muestra la tab + teachers.style.display = "block"; + } + + } + var cargarPagina = function() { + var overflow = document.getElementById("overviewTab"); + var students = document.getElementById("studentsTab"); + var teachers = document.getElementById("teachersTab"); + overflow.style.display = "none"; + students.style.display = "none"; + teachers.style.display = "none"; + + var elementosTab = document.getElementsByClassName("tab"); + for (var i = 0; i < elementosTab.length; i++) { + elementosTab[i].addEventListener("click",mostrarOcultar); + } + } + + cargarPagina(); From 1c707c44980ec5ae4ad2c8287028dc131951dc57 Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Wed, 20 Dec 2017 00:19:33 -0600 Subject: [PATCH 08/10] subiendo cambios css --- css/main.css | 18 +++++++++-- js/app.js | 85 ++++++++++++++++++++++++++-------------------------- 2 files changed, 59 insertions(+), 44 deletions(-) diff --git a/css/main.css b/css/main.css index 4ed41ea9..41e49356 100644 --- a/css/main.css +++ b/css/main.css @@ -280,7 +280,13 @@ width: 250px; .contenedor-teacher{ width: 900px; - margin-left: 400px; + margin-left: 100px; + margin-top: 100px; + font-family: 'Montserrat', sans-serif; + } + + .contenedor-teacher h2{ + margin-left: 200px; } .contenedor-teacher div{ display:inline-block; @@ -297,6 +303,14 @@ width: 250px; margin-bottom: 20px; } +#teachersTab h4 { + font-size: 2em; + font-family: 'Montserrat', sans-serif; + font-weight: 700; + padding: 20px; + +} + #teachersTab hr{ width: 800px; text-align: center; @@ -307,7 +321,7 @@ width: 250px; #teachersTab h4{ text-align: center; margin-top: 50px; - } + } .cajas-graficas-teacher{ margin-top: 80px; diff --git a/js/app.js b/js/app.js index 8da6ce90..f0b19160 100644 --- a/js/app.js +++ b/js/app.js @@ -52,45 +52,39 @@ console.log(inactivoPorcentaje); // Porcentaje de estudiantes que desertaron en su contenedor var dropoutPorcentaje = document.getElementById("dropout-porcentaje"); - dropoutPorcentaje.textContent = counterInactivo; + dropoutPorcentaje.textContent = inactivoPorcentaje; /*------- ACHIEVEMENT (Meta de Estudiantes Tectico y HSE)----------------*/ - var metaStudent= 0; - var scoreTech = 0; - var scoreHSE = 0; - var totalActTech =0; - var totalActHSE =0; - - for (var i = 0; i < generacionEstudiantes; i++) { - console.log(activeStudents); - - if(activeStudents === true){ - for (var j = 0; j < arrayEstudiantes[i]["sprints"].length; j++) { - scoreTech += arrayEstudiantes[i]["sprints"][j]["score"]["tech"]; - scoreHSE += arrayEstudiantes[i]["sprints"][j]["score"]["hse"]; - console.log(scoreHSE); - } - - var promedioTech = scoreTech / arrayEstudiantes[i]["sprints"].length; - var promedioHSE = scoreHSE / arrayEstudiantes[i]["sprints"].length; - console.log(promedioTech); - console.log(promedioHSE); - - totalActTech += promedioTech; - totalActHSE += promedioHSE; - - console.log("El valor es de Tech: "+ promedioTech); - console.log("El valor es de HSE: "+ promedioHSE); +var metaStudent= 0; + +var totalActTech =0; +var totalActHSE =0; + +for (var i = 0; i < generacionEstudiantes; i++) { + var scoreTech = 0; + var scoreHSE = 0; + var activeStudents = data[sede][generacion].students[i].active; + if(activeStudents === true){ + console.log(activeStudents); + + for (var j = 0; j < arrayEstudiantes[i]["sprints"].length; j++) { + scoreTech += arrayEstudiantes[i]["sprints"][j]["score"]["tech"]; + scoreHSE += arrayEstudiantes[i]["sprints"][j]["score"]["hse"]; + console.log("puntaje HSE " + scoreHSE); + console.log("puntaje TE " + scoreTech); + } - } - var promTotalActTech = totalActTech/ counterActivo; - var promTotalActTHSE = totalActHSE /counterActivo; + var promedioTech = scoreTech / arrayEstudiantes[i]["sprints"].length; + var promedioHSE = scoreHSE / arrayEstudiantes[i]["sprints"].length; + console.log("promT " +promedioTech); + console.log("promHSE "+ promedioHSE); - if (promTotalActTech >= 1260 && promTotalActTHSE >= 840) { - metaStudent++; - } - } + if (promedioTech >= 1260 && promedioHSE >= 840) { + metaStudent++; + } + } +} console.log("El valor es de Tech: "+ totalActTech); console.log("El valor es de HSE: "+ totalActHSE); @@ -143,18 +137,20 @@ var scoreHSE = 0; for (var l = 0; l Date: Wed, 20 Dec 2017 06:07:59 -0600 Subject: [PATCH 09/10] =?UTF-8?q?subiendo=20actualizaci=C3=B3n=20css?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/main.css | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/css/main.css b/css/main.css index 41e49356..1a624b8e 100644 --- a/css/main.css +++ b/css/main.css @@ -93,17 +93,21 @@ cursor: pointer; .fa-home{ margin-left:-8%; +margin-top: 4%; } .fa-graduation-cap{ margin-left: -15%; + margin-top: 4%; } .fa-pie-chart{ margin-left: 2%; + margin-top: 4%; } .fa-code{ - margin-left:-15%; + margin-left:-18%; + margin-top: 4%; } .barra { @@ -162,7 +166,7 @@ width: 250px; } .contenedor-grafica { - /*background-color: trans;*/ + background-color: #fffd7c; float: left; text-align: center; vertical-align: top; @@ -239,11 +243,10 @@ width: 250px; overflow: auto; }*/ - .contenedor-coders{ float: right; - width: 800px; - margin-right: 200px; + width: 700px; + margin-right: 150px; } .coders{ width: 600px; @@ -251,6 +254,11 @@ width: 250px; } .info-coders{ float: right; + font-family: 'Montserrat', sans-serif; + } + + .info-coders p { + text-align: right; } .foto{ From 1b6e786c6bbb1f491f3c9dfebb1ba1243f8d0255 Mon Sep 17 00:00:00 2001 From: AnettTruMa Date: Wed, 20 Dec 2017 10:35:19 -0600 Subject: [PATCH 10/10] Actualizando data-dashboard --- css/main.css | 320 +++++++++++++++++++++++++++------------------------ index.html | 15 +-- js/app.js | 140 ++++++++++++++++------ 3 files changed, 281 insertions(+), 194 deletions(-) diff --git a/css/main.css b/css/main.css index 1a624b8e..ff123dfc 100644 --- a/css/main.css +++ b/css/main.css @@ -2,138 +2,139 @@ * Estilos de tu proyecto */ - * { - box-sizing: border-box; /*justas un elemento con box-sizing: border-box*/ - margin: 0; - padding: 0; +* { + box-sizing: border-box; + /*justas un elemento con box-sizing: border-box*/ + margin: 0; + padding: 0; + font-family: 'Montserrat', sans-serif; } -header{ +header { text-align: center; } -header div img{ +header div img { width: 300px; } + .imagen-profile { width: 40%; margin-top: 5px; border-radius: 50%; - } -.imagen-lab{ - width:90%; - height: - background-color: #2B2B2B; +.imagen-lab { + width: 90%; + height: background-color: #2B2B2B; margin-top: 5px; - } -#barra-lateral{ - position:fixed; /* Hacemos que la posición en pantalla sea fija para que siempre se muestre en pantalla*/ - left: 0; /* Establecemos la barra en la izquierda */ - /*z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */ +#barra-lateral { + position: fixed; + /* Hacemos que la posición en pantalla sea fija para que siempre se muestre en pantalla*/ + left: 0; + /* Establecemos la barra en la izquierda */ + /*z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */ background-color: #2B2B2B; width: 250px; height: 100%; } - /* boton de seleccion*/ -#filtro-sedes{ +#filtro-sedes { text-align: center; width: 150px; - float:left; + float: left; margin-top: 100px; margin-left: 80px; + border: 2px solid #F7B617; + font-weight: 700; + font-family: 'Montserrat', sans-serif; } /*Tabuladores*/ + /* Menu Over student teachers*/ + #contenido-tab { margin: 0px; -padding: 0px; -font-weight: 500; -font-family: 'Montserrat', sans-serif; -cursor: pointer; - + padding: 0px; + font-weight: 500; + font-family: 'Montserrat', sans-serif; + cursor: pointer; } -.cont-tabs{ - margin-top: 150px; - list-style: none; - display: block; +.cont-tabs { + margin-top: 150px; + list-style: none; + display: block; } - .cont-tabs li { width: 100%; - height: 50px; - border-bottom: 1px solid #323232 ; - overflow: hidden; + height: 50px; + border-bottom: 1px solid #323232; + overflow: hidden; } + .cont-tabs a { position: relative; - padding: 16px; - padding-right: 25px; - float: right; - color: white; - opacity: .5; - font-size: 18px; + padding: 16px; + padding-right: 25px; + float: right; + color: white; + opacity: .5; + font-size: 18px; } -.fa-home, -.fa-graduation-cap, -.fa-pie-chart, -.fa-code { +.fa-home, .fa-graduation-cap, .fa-pie-chart, .fa-code { color: #F7B617; } -.fa-home{ -margin-left:-8%; -margin-top: 4%; +.fa-home { + margin-left: -8%; + margin-top: 4%; } -.fa-graduation-cap{ +.fa-graduation-cap { margin-left: -15%; margin-top: 4%; } -.fa-pie-chart{ +.fa-pie-chart { margin-left: 2%; margin-top: 4%; } -.fa-code{ - margin-left:-18%; + +.fa-code { + margin-left: -18%; margin-top: 4%; } .barra { - position: absolute; /*se pone para que los p no se encimen*/ - height: 50px; - width: 0px; - background-color: #aaa; - opacity: .1; + position: absolute; + /*se pone para que los p no se encimen*/ + height: 50px; + width: 0px; + background-color: #aaa; + opacity: .1; } li:hover div.barra { -width: 250px; + width: 250px; } - /*--------------------CONTENIDOSS---------------*/ /*--SECCION OVERVIEW (ESTILOS DE GRAFICA)*/ -#overviewTab, -#studentsTab, -#teachersTab { + +#overviewTab, #studentsTab, #teachersTab { overflow: auto; margin-left: 270px; } - .graficasTotal { background-color: #fff; float: left; @@ -150,11 +151,11 @@ width: 250px; .graficasTotal span { font-size: 1.5em; font-family: 'Montserrat', sans-serif; - font-weight: 900; + font-weight: 700; padding: 20px; } -.graficasTotal .texTbox{ +.graficasTotal .texTbox { font-size: .8em; font-family: 'Montserrat', sans-serif; font-weight: 700; @@ -166,7 +167,7 @@ width: 250px; } .contenedor-grafica { - background-color: #fffd7c; + background-color:#FFFFFF; float: left; text-align: center; vertical-align: top; @@ -178,7 +179,6 @@ width: 250px; margin-right: 1em; } - .grafica { margin-top: 150px; margin-left: 50px; @@ -189,36 +189,38 @@ width: 250px; padding-bottom: 0.8em; } - .datoText { font-size: 3em; font-weight: 300; - border-bottom: 1px solid #ffff; + border-bottom: 2px solid #ffff; width: 2.7em; height: 1.2em; } +#saludo{ + color: white; + font-size: 16px; + font-weight: 500px; +} + #dropout-porcentaje { - color: red; + color: green; } #achievement-porcentaje { - color:red; + color: green; } #acumulativo-nps { - color:red; + color: green; } -#promoters, -#passive, -#detractor { - color:red; + +#promoters, #passive, #detractor { + color: green; line-height: 1.5; margin-top: 15px; font-size: 1em; font-weight: 300; - - } .cajaTexto { @@ -226,111 +228,125 @@ width: 250px; font-family: 'Montserrat', sans-serif; font-weight: 700; padding: 20px; - -/* font-size: .8em; + /* font-size: .8em; padding-top: 1em;*/ } .number-boxes { font-size: 3.5em; font-weight: 300; - border-bottom: 1px solid #ffffff; - } + border-bottom: 1px solid #ffffff; +} +/* SECCION ALUMNAS */ - /* SECCION ALUMNAS */ - /*#studentsTab { - overflow: auto; - }*/ +#studentsTab { + overflow: inherit; +} - .contenedor-coders{ - float: right; - width: 700px; - margin-right: 150px; - } - .coders{ - width: 600px; - margin: 20px 20px; - } - .info-coders{ - float: right; - font-family: 'Montserrat', sans-serif; - } +.contenedor-coders { + float: right; + width: 850px; + margin-right: 150px; +} - .info-coders p { - text-align: right; - } +.coders { + width: 690px; + margin: 15px 10px 15px 15px; +} - .foto{ - width: 150px; - height: 150px; - } +.skillList li { + float: right; + list-style: none; + width: 85px; + font-size: 12px; + color: white; + text-align: center; + border: solid 2px #999999; + background-color: #999999; +} - .nombre{ - font-size: 30px; - margin-left: 200px; - text-align:justify; - } +.status{ + float: left; + font-weight: 500px; +} +.info-coders { + float: right; + font-family: 'Montserrat', sans-serif; + width: 500px; +} - .tech { - font-size: 20px; - margin-top: 50px; - } +.info-coders p { + text-align: right; +} +.foto { + width: 150px; + height: 150px; +} +.nombre { + font-size: 30px; + margin-left: 200px; + text-align: justify; +} +.tech { + font-size: 20px; + margin-top: 20px; +} - /* SECCION TEACHERS */ +/* SECCION TEACHERS */ - /*#teachersTab { +/*#teachersTab { overflow: auto; }*/ - .contenedor-teacher{ - width: 900px; - margin-left: 100px; - margin-top: 100px; - font-family: 'Montserrat', sans-serif; - } - - .contenedor-teacher h2{ - margin-left: 200px; - } - .contenedor-teacher div{ - display:inline-block; - margin: 20px 20px; - } - - .contenedor-teacher div img{ - width: 200px; - height: 200px; - } - - .info{ - float: right; - margin-bottom: 20px; - } +.contenedor-teacher { + width: 900px; + margin-left: 100px; + margin-top: 100px; + font-family: 'Montserrat', sans-serif; +} + +.contenedor-teacher h2 { + margin-left: 200px; +} + +.contenedor-teacher div { + display: inline-block; + margin: 20px 20px; +} + +.contenedor-teacher div img { + width: 200px; + height: 200px; +} + +.info { + float: right; + margin-bottom: 20px; +} #teachersTab h4 { font-size: 2em; font-family: 'Montserrat', sans-serif; font-weight: 700; padding: 20px; - } - #teachersTab hr{ - width: 800px; - text-align: center; - margin-top: 40px; - margin: 0 auto; - } +#teachersTab hr { + width: 800px; + text-align: center; + margin-top: 40px; + margin: 0 auto; +} - #teachersTab h4{ - text-align: center; - margin-top: 50px; - } +#teachersTab h4 { + text-align: center; + margin-top: 50px; +} - .cajas-graficas-teacher{ - margin-top: 80px; - } +.cajas-graficas-teacher { + margin-top: 80px; +} diff --git a/index.html b/index.html index 49f3a56b..b293404c 100644 --- a/index.html +++ b/index.html @@ -21,6 +21,7 @@
    logo-laboratoria-transparente foto de perfil +

    ¡Bienvenido, John!

    @@ -148,13 +149,7 @@
    -
    -

    ESPECIALIZACION

    -
    - UX Design - Front end developer -
    -
    + +
    diff --git a/js/app.js b/js/app.js index f0b19160..b00fae81 100644 --- a/js/app.js +++ b/js/app.js @@ -138,7 +138,12 @@ for (var l = 0; l