Implementando un ToDo con jQuery para tu aplicacion Web

Esto sería el equivalente a la usabilidad de los usuarios pero exclusivamente para los desarrolladores de aplicaciones web, a continuación describiré como aplicar un widget a tu aplicación web desde el cual podrás mantener registro de las tareas pendientes o realizadas. Y hablo de usabilidad porque la lista siempre se mantiene a la vista del desarrollador.

Normalmente siempre utilizamos una aplicación para llevar el rastreo de tareas y seguimiento de errores cuando trabajamos en grupo con otras personas (por ejemplo en Qbit Mexhico utilizamos Solar Bugs Report), pero algunas veces cuando trabajamos solos es un poco más difícil ya que entra en juego la decídia y que por comodidad decidimos no llevar control de tareas pendientes desde una aplicación externa.

Mi propuesta para llevar una organización alternativa al seguimiento de errores y tareas pendientes es implementar mediante jQuery, CSS y HTML una especie de widget que se debe de pegar en cada página de la aplicación de la cual se desea realizar seguimiento.

1. La definición del código CSS

.popNotification {
   border:3px solid red;
   padding:15px;
   position:fixed;
   right:0;
   width:480;
   bottom:0;
   z-index:1400;
   background-color:#000;
   color:#fff;
   filter:alpha(opacity=4);
   -moz-opacity:0.4;
   -khtml-opacity:0.4;
   opacity: 0.4;
}

2. Definición del Código Javascript con jQuery

$(document).ready(function() {
   $('.popNotification').css('opacity',0.4).hover(function(){
      $(this).fadeTo(200,1);
   }, function(){
      $(this).fadeTo(200,0.4);
   });
});

3. Definición del Código HTML

La idea es pegar este código antes del la etiqueta <body> y escribir la lista de tareas que se necesitan realizar.

<div class="popNotification">
   <h2>ToDo</h2>
   <ul>
      <li>Esta puede ser la tarea #1</li>
      <li>Esta puede ser la tarea #2</li>
      <li>Esta puede ser la tarea #n</li>
      <li>Y asi podemos definir nuestras tareas</li>
   </ul>
</div>

El widget se puede mejorar o extender su funcionalidad, yo cuando una de las tareas la he realizado lo que hago no es borrar la tarea de la lista, sino que incluyo la imagen de un check al inicio de esa tarea.. Con eso me doy cuenta de si o no una tarea ya fue realizada. [muchas veces repetí la palabra tarea ¬¬]

Co-fundador de Qbit Mexhico, usuario de linux, Developer en tecnologías web.. Nicaragüense, centro en basketball, primer centro en rugby y pintor los fines de semana. Ortögrafo y ambientalista psicológico (de escritorio).. ese soy yo!

Si te ha servido compártelo y difunde nuestro blog..

Twitter LinkedIn Flickr YouTube 

One thought on “Implementando un ToDo con jQuery para tu aplicacion Web

  1. Controlar los principales indicadores sobre la situación contable, financiera e impositiva de la empresa, el balance del negocio, es decir, el estado de sus activos y deudas, y cuál es la situación impositiva. Contar con un panorama previo será vital además para tomar decisiones a tiempo. https://www.excel-accounting-budget-analysis.com, herramienta con la que puedes contar para simplificar, a bajo costo, todo tipo de procesos contables

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *