My Menu / Self-Training

Self Training – My Menu

En el marco de este self-training estuve experimentando con varias tecnologías en las que quería profundizar. Próximamente espero realizar una serie de posts con mis impresiones sobre cada una y de la interacción entre ellas.

Las tecnologías

  • KnockoutJS – Librería de JavaScript para facilitar la creación de interfaces web ricas y dinámicas mediante el patrón de MVVM, bindings y observables.
  • TypeScript – Súper conjunto de JavaScript que le añade tipado opcional, clases y módulos. Al compilarse genera código JavaScript limpio y basado en estándares.
  • Twitter Bootstrap – Framework CSS para desarrollar aplicaciones web rápidamente, con un estilo consistente, simple y agradable. También incluye algunas utilidades extensiones JavaScript.
  • NuGet – Extensión de Visual Studio para instalar y actualizar librerías de terceros (en realidad lo que me interesaba a mi era la publicación de paquetes).
  • Moment.js – Librería JavaScript para parseo, validación, manipulación, y formateo de fechas.

El sistema

El objetivo, a la vez de aprender, era desarrollar un sistema para simplificar la gestión de los pedidos diarios de comida realizados en la empresa.

El sistema se empezó a construir sin apuro, con la idea de investigar, experimentar y probar lo aprendido en un entorno real. Entre tanto, dado que ocurrieron algunos inconvenientes con los pedidos, en tiempo récord JF implementó e implantó un sistema con similar objetivo, el cual está cumpliendo muy bien su cometido. Por lo tanto, es probable que mi sistema nunca salga a producción.

De cualquier manera, está disponible para ser probado en AppHarbor y, para los empleados de la empresa, como parte del sistema de uso interno CommonJobs.

El problema

Cada día, antes de las 10 de la mañana, los empleados pueden elegir la comida del día entre 3 opciones (Normal, Light, Vegetariano). Los platos correspondientes a cada opción son diferentes cada día durante 5 semanas (pasados los cuales los platos se repiten).

Originalmente, estábamos utilizando una planilla de Google Docs para marcar las preferencias de cada empleado en cada día de las 5 semanas. Pero dado que esa planilla era compartida, no se permitía acceso de edición a todos y era complicado realizar modificaciones. Por otro lado, solía ocurrir que por una situación particular un empleado cancelara el menú de un día, y pasadas las 5 semanas no recibiera su comida ya que alguien olvidó quitar la “cancelación”.

Otra característica que me interesaba incluir, era la posibilidad de seleccionar el lugar donde comer. No es tan común, pero a veces ocurre que, un empleado, un día en particular, por ejemplo por una reunión, no coma en la oficina de siempre sino en otra, por lo que sería bueno que la comida se le envíe allí.

UI del empleado

Cuando el empleado entra al sistema, ve una pantalla con su selección para el día actual.Image

Si ya ha pasado la hora límite para cambiar el pedido, se le indica con una barra amarilla que el pedido ya se realizó. Si aún hay tiempo para modificarlo, se le indica con una barra verde.Image

El empleado puede marcar sus preferencias (menú y lugar) para cada día de las 5 semanas. Las fechas que se observan a la derecha son solo referencias: La configuración del Lunes de la semana 2 será válida tanto para el 28 de Enero 2013 como para el 4 de Marzo.Image

Se puede modificar la elección para días particulares, sobrescribiendo la elección semanal. Por ejemplo, si el empleado sabe que el día 9 de Enero de 2013 (dentro de dos meses o mañana) no estará presente, puede cancelarlo indicando la fecha. De la misma manera puede modificarse el menú o lugar para una fecha puntual.Image

Por último, todos los empleados pueden ver el resumen y detalle completo del pedido, lo cual es muy útil si alguno de ellos no puede acceder al sistema o hay que resolver una discusión acerca de un plato faltante.Image

UI de administración

El administrador del menú, además de ver el pedido del día, antes de las 10 de la mañana, puede generarlo por anticipado; O bien, luego de las 10, puede volver a generar un pedido en base a la selección actual de cada empleado.Image

También puede editar las selecciones de cualquier empleado.Image

Definir los platos correspondientes a cada día del menú.Image

Y redefinir completamente el menú: modificar o agregar opciones y lugares, cambiar las fechas y la cantidad de semanas.Image

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s