Page 2 of 2

Re: TravelRound

Posted: Sun Apr 07, 2019 7:37 pm
by davidvm97
Sprint 10

Fecha Inicial: Abril 1 de 2019
Fecha Final: Abril 8 de 2019

Repositorio: https://github.com/davidvm1/travelround

Evidencias de Meetup
Image
Image

Presentación de preentrega


Backlog:
  • Investigar sobre manejo de bases de datos en firebase y NOSQL (2)
    Historia:Yo como desarrollador entiendo y soy capaz de usar firebase para manejod e bases de datos
    Condición de satisfacción: Comprender como funciona firebase y ser capaz de usarlo para manejar informacion en bases de datos
  • Creacion de la vista de creacion de viajes (3)
    Historia:Yo como usuario puedo entrar a la vista de creacion de viajes
    Condición de satisfacción: Tener una vista para crear viajes acoplada a la aplicación
  • Implementación funcional de la creación de viajes(3)
    Historia:Yo usuario puedo crear viajes
    Condición de satisfacción: Poder crear viajes desde la aplicación y que estos se almacenen en una base de datos de firebase
  • Hacer demo funcional en el dispositivo(1)
    Historia:Yo como desarrollador puedo probar exitosamente el avance de la aplicacion en el dispositivo
    Condición de satisfacción: Las funcionalidades funcionan en el dispositivo
Velocidad Inicial: 9
Velocidad Final: 9

Burndown chart:
Image

Que hice?
  • Investigar sobre manejo de bases de datos en firebase y NOSQL (2)
    Image
    Image
  • Creacion de la vista de creacion de viajes (3)
    https://i.imgur.com/jPiGLir.jpg
  • Implementación funcional de la creación de viajes(3)

    Code: Select all

    <!doctype html>
    <html lang="en">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
        <link href="css/CreacionViaje.css" rel="stylesheet" />
        <title>Creacion Viaje</title>
    </head>
    <body>
        <div class="container">
    
            <div class="row">
                <img src="img/logoTravelRound.png" class="logo" />
            </div>
    
            <div class="row">
                <div class="login-wrap">
                    <div class="tituloCreacion">
                        <h1>Create Your Trip</h1>
                    </div>
                    <form class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="inputLugar3" class="col-sm-3 control-label">
                                Traveling Destiny
                            </label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="inputLugar" placeholder="Traveling Destiny" required>
                            </div>
                        </div>
                       
                        <div class="form-group last">
                            <div class="col-sm-offset-3 col-sm-9">
                                <button type="button" class="btn btn-success btn-sm" id="botonCrear" onclick="crearViaje()">
                                    Create Trip
                                </button>
                            </div>
                            <!--<div class="col-sm-offset-3 col-sm-9">
                                <button type="button" class="btn btn-success btn-sm" id="botonOut" onclick="logout()">
                                    Log out
                                </button>
                            </div>-->
                        </div>
                    </form>
                </div>
            </div>
        </div>
    
        <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    
        
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
        <script src="https://www.gstatic.com/firebasejs/5.9.1/firebase.js"></script>
        <script>
            // Initialize Firebase
            var config = {
                apiKey: "AIzaSyDc3tbBTQrgcjCvDRMgY1PYXBG8ssVaDxM",
                authDomain: "travelroundid.firebaseapp.com",
                databaseURL: "https://travelroundid.firebaseio.com",
                projectId: "travelroundid",
                storageBucket: "travelroundid.appspot.com",
                messagingSenderId: "58993751940"
            };
            firebase.initializeApp(config);
            var database = firebase.database();
        </script>
        <script src="js/CreacionViaje.js"></script>
    
    
    </body>
    </html>

    Code: Select all

    <!doctype html>
    <html lang="en">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
        <link href="css/CreacionViaje.css" rel="stylesheet" />
        <title>Creacion Viaje</title>
    </head>
    <body>
        <div class="container">
    
            <div class="row">
                <img src="img/logoTravelRound.png" class="logo" />
            </div>
    
            <div class="row">
                <div class="login-wrap">
                    <div class="tituloCreacion">
                        <h1>Create Your Trip</h1>
                    </div>
                    <form class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="inputLugar3" class="col-sm-3 control-label">
                                Traveling Destiny
                            </label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="inputLugar" placeholder="Traveling Destiny" required>
                            </div>
                        </div>
                       
                        <div class="form-group last">
                            <div class="col-sm-offset-3 col-sm-9">
                                <button type="button" class="btn btn-success btn-sm" id="botonCrear" onclick="crearViaje()">
                                    Create Trip
                                </button>
                            </div>
                            <!--<div class="col-sm-offset-3 col-sm-9">
                                <button type="button" class="btn btn-success btn-sm" id="botonOut" onclick="logout()">
                                    Log out
                                </button>
                            </div>-->
                        </div>
                    </form>
                </div>
            </div>
        </div>
    
        <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    
        
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
        <script src="https://www.gstatic.com/firebasejs/5.9.1/firebase.js"></script>
        <script>
            // Initialize Firebase
            var config = {
                apiKey: "AIzaSyDc3tbBTQrgcjCvDRMgY1PYXBG8ssVaDxM",
                authDomain: "travelroundid.firebaseapp.com",
                databaseURL: "https://travelroundid.firebaseio.com",
                projectId: "travelroundid",
                storageBucket: "travelroundid.appspot.com",
                messagingSenderId: "58993751940"
            };
            firebase.initializeApp(config);
            var database = firebase.database();
        </script>
        <script src="js/CreacionViaje.js"></script>
    
    
    </body>
    </html>

    Code: Select all

    var inputLugar = document.getElementById("inputLugar");
    var botonCrear = document.getElementById("botonCrear");
    
    function crearViaje() {
    
        var database = firebase.database().ref();
        var lugar = inputLugar.value;
    
        database.push().set(lugar);
    
    }
  • Hacer demo funcional en el dispositivo(1)
    Image
    Videos de avance funcional:


    https://www.youtube.com/watch?v=_Q28LYFqg84


    https://www.youtube.com/watch?v=ZKZ3vM5Pfaw
    Image
Que voy a hacer?
  • Planear el siguiente sprint
Que problemas tuve?
No se presentaron problemas

Re: TravelRound

Posted: Mon Apr 22, 2019 3:08 pm
by davidvm97
SPRINT 11

Fecha Inicial: Abril 22 de 2019
Fecha Final: Abril 29 de 2019

Repositorio: https://github.com/davidvm1/travelround


Backlog:
  • Crear vista para ver los viajes creados (3)
    Historia:Yo como usuario puedo ver esteticamente como se ve la ventana donde se ven los viajes creados
    Condición de satisfacción: Tener una vista lista en cuanto a apariencia para la visualizacion de viajes creados
  • Implementacion de la funcionalidad de listar los viajes creados (3)
    Historia:Yo como usuario puedo ver los viajes que se he creado en la aplicacion
    Condición de satisfacción: Tener una funcionalidad lista donde se pueda listar todos los viajes que se han creado
  • Hacer demo de en el dispositivo(2)
    Historia:Yo usuario puedo usar la vista que lsita los viajes que tengo en el dispositivo movil
    Condición de satisfacción: La vista de listar los viajes funciona en el dispositivo movil

    Velocidad Inicial: 8
    Velocidad Final: 7

    Burndown chart:
    Image

    Que hice?
    • Crear vista para ver los viajes creados (3)

      Code: Select all

      <!doctype html>
      <html lang="en">
      <head>
          <!-- Required meta tags -->
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      
          <!-- Bootstrap CSS -->
          <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
          <link href="css/VentanaViajes.css" rel="stylesheet" />
      
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
          <title>Creacion Viaje</title>
      
      </head>
      <body>
          <div class="container">
      
              <div class="row">
                  <div class="col-md-4">
                      <div class="panel panel-default">
                          <div class="panel-heading">
                              <h3 class="panel-title">
                                  Panel Default
                              </h3>
                          </div>
                          <ul class="list-group" id="listaViajes">
                              
                          </ul>
                      </div>
                  </div>
              </div>
      
          </div>
      
          <!-- Optional JavaScript -->
          <!-- jQuery first, then Popper.js, then Bootstrap JS -->
      
      
          <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
          <script src="https://www.gstatic.com/firebasejs/5.9.1/firebase.js"></script>
          <script>
              // Initialize Firebase
              var config = {
                  apiKey: "AIzaSyDc3tbBTQrgcjCvDRMgY1PYXBG8ssVaDxM",
                  authDomain: "travelroundid.firebaseapp.com",
                  databaseURL: "https://travelroundid.firebaseio.com",
                  projectId: "travelroundid",
                  storageBucket: "travelroundid.appspot.com",
                  messagingSenderId: "58993751940"
              };
              firebase.initializeApp(config);
              var database = firebase.database();
          </script>
         
          <script src="js/VentanaViajes.js"></script>
      
      
      </body>
      </html>
      

      Code: Select all

      body {
          padding-top: 20px;
          background-color: #F7F7F7;
      }
      
      .panel > .list-group {
          margin-bottom: 0;
      }
      
          .panel > .list-group .list-group-item {
              border-width: 1px 0;
          }
      
              .panel > .list-group .list-group-item:first-child {
                  border-top-right-radius: 0;
                  border-top-left-radius: 0;
              }
      
              .panel > .list-group .list-group-item:last-child {
                  border-bottom: 0;
              }
      
      .panel-heading + .list-group .list-group-item:first-child {
          border-top-width: 0;
      }
      
      .panel-default .list-group-item.active {
          color: #000;
          background-color: #DDD;
          border-color: #DDD;
      }
      
      .panel-primary .list-group-item.active {
          color: #FFF;
          background-color: #428BCA;
          border-color: #428BCA;
      }
      
      .panel-success .list-group-item.active {
          color: #3C763D;
          background-color: #DFF0D8;
          border-color: #D6E9C6;
      }
      
      .panel-info .list-group-item.active {
          color: #31708F;
          background-color: #D9EDF7;
          border-color: #BCE8F1;
      }
      
      .panel-warning .list-group-item.active {
          color: #8A6D3B;
          background-color: #FCF8E3;
          border-color: #FAEBCC;
      }
      
      .panel-danger .list-group-item.active {
          color: #A94442;
          background-color: #F2DEDE;
          border-color: #EBCCD1;
      }
      
      .panel a.list-group-item.active:hover, a.list-group-item.active:focus {
          color: #000;
          background-color: #DDD;
          border-color: #DDD;
      }
      
    • Implementacion de la funcionalidad de listar los viajes creados (3)

      Code: Select all

      $(document).ready(function () {
      
          var rootRef = firebase.database().ref();
      
          rootRef.on("child_added", snap => {
      
              $("#listaViajes").append("<a href='#' class='list - group - item'>" + snap.val() + "</a>");
             
      
      
          });
      
      
      });
      
    • Hacer demo de en el dispositivo(2)



      https://www.youtube.com/watch?v=_nprAAW-z994
    Que voy a hacer?
    • Planear el siguiente sprint
      Corregir problema de estilos
    Que problemas tuve?
    El unico problema que tuve fue que en la vista creada no se estan aplicando los estilos correctamente


    Actividad Día de la Tierra
    Diagrama de Casos de Uso
    Image
    Diagrama de Flujo
    Image
    Diagrama de Tecnologias
    Image

    Informe de Code review: Construapp

    Hola compañero, elegi el proyecto suyo porque es similar al mio entonces puedo hacer correcciones de forma mas objetiva.
    • Veo que tienes una clase cemento y otra producto, seria mejor crear una clase producto y que productos individuales sean hijos de esta.
    • Es recomendable usar framwork7 para todas las vistas para tener mas homogeneidad de codigo
    • Es buena idea tener un archivo de variables
    • Al crear instancias de Framework7 es mejor inicializar con el nombre de la aplicacion enves de my app
    • Personalizar los mensajes de error

Re: TravelRound

Posted: Mon Apr 22, 2019 5:02 pm
by davidv.m
Informe de revisión de código

Buenas tardes compañero, elegí tu proyecto porque estas trabajando con la misma plataforma, framework y lenguaje que yo.
Después de revisar el codigo, tengo estas recomendaciones:
  • Para mejor uso del framework te recomiento usar una carpeta donde se pongan todos los archivos de framework7.
  • En el archivo framework7.js en la funcion factory, las dos primeras lineas sobran.
  • En ese mismo archivo puedes crear otra función de rutas para no tener que ponerlas siempre.
  • Te recomiendo usar la capeta de los iconos de framework7 que veo que no la tienes y sirve mucho.
  • En el archivo framework7.css en la variable de los botones puedes usar una clase o dos ids.
  • Creo que la version de jquery que estas usando es muy vieja.


Re: TravelRound

Posted: Mon May 06, 2019 10:39 am
by davidvm97
SPRINT 12

Fecha Inicial: Abril 29 de 2019
Fecha Final: Mayo 6 de 2019

Repositorio: https://github.com/davidvm1/travelround


Backlog:
  • Modificar la agregacion y obtencion de viajes para usar firestore(3)
    Historia:Yo como usuario puedo crear y ver viajes en tiempo real de forma eficiente
    Condición de satisfacción: Hacer uso de firestore para el manejod de base de datos exitosamente
  • Crear funcionalidad de borrar viajes (3)
    Historia:Yo como usuario puedo borrar viajes dentro de la aplicacion
    Condición de satisfacción: Tener una funcionalidad borrado que elimine viaje exitosamente
  • Hacer demo de en el dispositivo(2)
    Historia:Yo usuario puedo usar la funcion de borrar viajes en el dispositivo
    Condición de satisfacción: La funcion de borrado funciona en el dispositivo

    Velocidad Inicial: 8
    Velocidad Final: 8

    Burndown chart:
    Image

    Que hice?
    • Modificar la agregacion y obtencion de viajes para usar firestore(3)

      Codigo de vista de viajes

      Code: Select all

      const listaViajes = document.querySelector('#listaViajes');
      
      //crear elementos y renderizar 
      function renderViajes(doc) {
      
          let li = document.createElement('li');
          let lugar = document.createElement('span');
          let cross = document.createElement('div');
      
          li.setAttribute('data-id', doc.id);
          lugar.textContent = doc.data().place;
          cross.textContent = 'x';
      
          li.appendChild(lugar);
          li.appendChild(cross);
      
          listaViajes.appendChild(li);
      
          //borrar data
          cross.addEventListener('click', (e) => {
      
              e.stopPropagation();
              let id = e.target.parentElement.getAttribute('data-id');
              db.collection('Viajes').doc(id).delete();
      
          });
      
      }
      
      //obtener data
      /*db.collection('Viajes').get().then((snapshot) => {
      
          snapshot.docs.forEach(doc => {
              renderViajes(doc);
          });
      
      });*/
      
      //real tiem listener
      db.collection('Viajes').orderBy('place').onSnapshot(snapshot => {
      
          let cambios = snapshot.docChanges();
          cambios.forEach(cambio => {
              if (cambio.type == 'added') {
      
                  renderViajes(cambio.doc);
      
              }
              else if (cambio.type == 'removed') {
                  let li = listaViajes.querySelector('[data-id=' + cambio.doc.id + ']');
                  listaViajes.removeChild(li);
              }
          });
      
      });
      
      
      
      /*$(document).ready(function () {
      
          var rootRef = firebase.database().ref();
      
          rootRef.on("child_added", snap => {
      
              $("#listaViajes").append("<div clas='row'><div class='col - md - 4'><a href='#' class='list - group - item'>" + snap.val() + "</a></div>" + "<div class='col - md - 4'><button type='button' class='btn btn - light'>Borrar</button id='button"  +  + "'></div></div>");
      
          });
      
      
      });*/
      
      Codigo de agregacion de viajes

      Code: Select all

      const form = document.querySelector('#agregarViajes');
      
      form.addEventListener('submit', (e) => {
      
          e.preventDefault();
          db.collection('Viajes').add({
      
              place: form.lugar.value
      
          });
      
      });
      
      
      /*var inputLugar = document.getElementById("inputLugar");
      var botonCrear = document.getElementById("botonCrear");
      
      function crearViaje() {
      
          var database = firebase.database().ref();
          var lugar = inputLugar.value;
      
          database.push().set(lugar);
      
      }*/
      
    • Crear funcionalidad de borrar viajes (3)

      Code: Select all

      const listaViajes = document.querySelector('#listaViajes');
      
      //crear elementos y renderizar 
      function renderViajes(doc) {
      
          let li = document.createElement('li');
          let lugar = document.createElement('span');
          let cross = document.createElement('div');
      
          li.setAttribute('data-id', doc.id);
          lugar.textContent = doc.data().place;
          cross.textContent = 'x';
      
          li.appendChild(lugar);
          li.appendChild(cross);
      
          listaViajes.appendChild(li);
      
          //borrar data
          cross.addEventListener('click', (e) => {
      
              e.stopPropagation();
              let id = e.target.parentElement.getAttribute('data-id');
              db.collection('Viajes').doc(id).delete();
      
          });
      
      }
      
      db.collection('Viajes').orderBy('place').onSnapshot(snapshot => {
      
          let cambios = snapshot.docChanges();
          cambios.forEach(cambio => {
              if (cambio.type == 'added') {
      
                  renderViajes(cambio.doc);
      
              }
              else if (cambio.type == 'removed') {
                  let li = listaViajes.querySelector('[data-id=' + cambio.doc.id + ']');
                  listaViajes.removeChild(li);
              }
          });
      
      });
      
      
      Image
      Gif de la funcionalidad de borrado en tiempo real en la aplicacion y la base de datos de firebase
    • Hacer demo de en el dispositivo(2)

      Video de prueba en dispositivo: Funcion de borrado

      https://www.youtube.com/watch?v=uTvYNNnDs7w
    Que voy a hacer?

    Planear el siguiente sprint

    Que problemas tuve?
    Tengo que solucionar el problema de los estilos que no se estan aplicando en la vnetana de viajes

Re: TravelRound

Posted: Mon May 13, 2019 12:25 pm
by davidvm97
SPRINT 13

Fecha Inicial: Mayo 6 de 2019
Fecha Final: Mayo 13 de 2019

Repositorio: https://github.com/davidvm1/travelround

Presentacion:



Backlog:
  • Corregir estilos e interfaz de ventana de viajes(3)
    Historia:Yo como usuario puedo ver como queda la ventana de visualizacion de viajes
    Condición de satisfacción: Que la ventana de viajes sea funcional y tenga sus estilos correctos
  • Hacer demo en el dispositivo(2)
    Historia:Yo usuario puedo usar la ventana de viajes en el dispositivo
    Condición de satisfacción: La ventana de ventana de viajes funciona en el dispositivo
  • Crear ventana de funciones de viaje (3)
    Historia:Yo como usuario puedo ver como sera la ventana de funciones de viaje
    Condición de satisfacción: Tener la ventana de funciones de viaje lista


    Velocidad Inicial: 8
    Velocidad Final: 5

    Burndown chart:
    Image
    *Burndown chart para el sprint 13

    Que hice?
    • Corregir estilos e interfaz de ventana de viajes(3)
      Image
      *Captura de pantalla de la nueva interfaz de ventana de viajes
    • Hacer demo en el dispositivo(2)

      *Video de prueba en el dispositivo
    Que voy a hacer?

    Planear el siguiente sprint

    Que problemas tuve?
  • Crear ventana de funciones de viaje (3)
    No se pudo hacer porque mientras estaba trabajndo salio este error y no me dejo seguir haciendolo
    Image

Re: TravelRound

Posted: Mon May 20, 2019 8:51 pm
by davidvm97
SPRINT 14

Fecha Inicial: Mayo 13 de 2019
Fecha Final: Mayo 20 de 2019

Repositorio: https://github.com/davidvm1/travelround



Backlog:
  • Crear interfaz de viaje(3)
    Historia:Yo como usuario puedo ver como se ve la interfaz de viajes individuales
    Condición de satisfacción: Que la ventana de viaje quede terminada
  • Configurar el acceso a la interfaz para cada viaje individualmente (3)
    Historia:Yo como usuario puedo acceder a cada viaje individualmente
    Condición de satisfacción: Que s epuede individualemtne acceder a cada viaje con sus repectivos datos
  • Hacer demo en el dispositivo(2)
    Historia:Yo usuario puedo usar la ventana de viaje en el dispositivo
    Condición de satisfacción: La ventana de ventana de viaje funciona en el dispositivo



    Velocidad Inicial: 8
    Velocidad Final: 8

    Burndown chart:
    Image
    *Burndown chart para el sprint 14

    Que hice?
    • Crear interfaz de viaje(3)
      Image
      *Captura de pantalla de la nueva interfaz de viaje
    • Configurar el acceso a la interfaz para cada viaje individualmente (3)
      Image
    • Hacer demo en el dispositivo(2)

      *Video de prueba en el dispositivo
    Que voy a hacer?

    Planear el siguiente sprint

    Que problemas tuve?
    No hubo problemas