Calendario con registro de eventos (básico)

Descripción

Permite crear un calendario donde registrar eventos (feriados, citas, recordatorios, etc.).
Obtener un código HTML para insertarlo en su página web, foro y/o blog.
La posibilidad de editar eventos a necesidad.
La posibilidad de editar los estilos a necesidad (cómo se mostrará).


Índice


¿ Cómo crear el calendario?

1) Ingresar a la página http://gestionxls.webcindario.com/calendar/
2) En la sección 'Crear un calendario' (debajo a la izquierda) ingrese la contraseña que deberá utilizar para el acceso al panel de control.
3) Ingrese el código de verificación de dos dígitos (para saber si Ud. es un programa).
4) Pulse el botón 'Crear'.

(imagen 1-0)

Si el código de verificación es correcto y ha ingresado una contraseña, Ud. obtendrá una pantalla con:
1 --> El Id del calendario (izquierda-superior), deberá utilizar este dato junto con la contraseña cada vez que ingrese a editar eventos.
2 --> Un informe indicando que ha iniciado sesión (login) y se ha generado el calendario para los años 2.011-2.xxx.
3 --> La línea 'Pulse aquí para ver el código del calendario (a insertar)'.
4 --> La línea 'Pulse acá para seleccionar la zona horaria'.
5 --> La línea 'Pulse acá para ingresar/editar estilos o la URL de su hoja de estilos de su elección'.
6 --> La línea 'Editando eventos del año 2011' con un formulario vacío.
7 --> Un selector para cambiar de año.

(imagen 1-1)

Notas:
1) Con esto, se ha creado un calendario que incluye desde el año 2.011 (año que comenzó este servicio) hasta el año siguiente al momento de creación.
2) Para obtener el código para insertar en su página web se explica en ¿ Cómo obtengo el código para insertar en mi página web?
3) Para personalizar los estilos se explica en ¿ Cómo personalizar los estilos del calendario?
4) Ya está en condiciones de ingresar los primeros eventos.


¿ Cómo obtengo el código para insertar en mi página web?

Si pulsa donde dice 'Pulse aquí para ver el código del calendario (a insertar)' se mostrará un código que consta de dos componentes.

1) Código HTML que contiene el link al calendario. Este código deberá ser copiado tal cual en su página web (donde desea que aparezca).
2) Código CSS (estilos) del calendario; es decir, cómo se mostrará. Este código es editable en su web según su conveniencia (posicionamiento, tamaño, background, bordes, etc.), y debería adecuarlo al estilo de su página.

(imagen 2)


He cerrado sesión, ¿ cómo ingreso al panel de control del calendario?

1) Ingresar a la página http://gestionxls.webcindario.com/calendar/
2) En la sección 'Ingresar' (panel izquierdo) ingrese el id del calendario y la contraseña que utilizó para crear el calendario.
3) Ingrese el código de verificación de dos dígitos (para saber si Ud. es un programa).
4) Pulse el botón 'Ingresar'.

(imagen 3)


¿ Puedo definir una zona horaria?

Si pulsa donde dice 'Pulse acá para seleccionar la zona horaria.'.
- Se mostrará una lista con las zonas horarias ordenadas alfabéticamente (seleccionada la actual).
- Selecciona la que corresponda, y pulse el botón 'Aplicar'.

(imagen 4-0)

(imagen 4-1)

Aparecerá un párrafo comentando el resultado del cambio.


¿ Cómo personalizar los estilos del calendario?

Si pulsa donde dice 'Pulse acá para ingresar/editar estilos o la URL de su hoja de estilos de su elección' se mostrará la configuración actual de los estilos del calendario.

El calendario es una tabla compuesta de filas.
1ra fila: (de navegación) contiene links para navegar por los distintos períodos (meses), a la izquierda se accede al período anterior, a la derecha al siguiente.
2da fila: muestra el período actual (mes/año).
3ra fila: muestra los nombres de días (Domingo a Sábado).
Siguientes: muestra el calendario.

Tiene dos opciones de personalización:
a) Editar los estilos en línea (o en su computadora y luego los copia en el formulario).
b) Ingresar la URL de una hoja de estilos (archivo CSS que deberá estar alojada en su espacio web).
Una vez hecho los cambios, no olvide pulsar el botón 'Actualizar'.

En ambos casos deberá tener presente la estructura de las clases e identificadores es la siguiente:
- #calendar: es el id de la tabla que contiene el calendario.
- td#pea p y td#pes p: son las celdas de la fila superior, contienen el link al período anterior y siguiente (respectivamente).
- td#pea p.stop y td#pes p.stop: es la clase que adquiere el link de navegación de períodos cuando queda fuera del calendario.
- #calendar th: se refiere a las celdas que contienen los nombres de día (Do, Lu, Ma, Mi, Ju, Vi, Sa).
- td#actual: es la 3ra fila del calendario, y contiene el Mes/año que se está mostrando.
- #calendar td: se refiere a celdas de días (en general).
- td.domingo: son las celdas de la 1ra columna (generalmente los domingos se muestran en rojo).
- td.evento: son las celdas que contienen uno o más eventos (inicialmente se muestran en negrita).
- td#hoy: es la celda que indica el día presente (si está viendo el año y mes actual).

(imagen 5)


¿ Cómo editar eventos (crear/modificar/eliminar)?

(punto 1 de la imagen 6)
El formulario se cargará con los eventos que tenga registrados, más 10 líneas vacías para nuevos eventos.
Incluirá la cantidad de eventos registrados.
Edite a gusto (columnas para mes, día y evento).
Si desea quitar un evento de la lista, deje la fila vacía (o úsela para incluir otro evento).
Durante la edición, un código (JavaScript) detecta si ha ingresado un dato no válido; esto es un mes menor de 1 o mayor de 12, un día menor a 1 o mayor de la cantidad de días del mes (detecta bisiestos), y eventos sin descripción (texto vacío).
Pulse 'Aplicar' para guardar los cambios.

(punto 2 de la imagen 6)
Seleccione el año que desea editar; el selector no incluye el año actual (para evitar confusiones).

Notas
1) mientras edita un pequeño código JavaScript validará el mes y día de cada evento (con base en el año que está editando) marcando la celda en un tono rojizo si hay alguna inconsistencia (aún así podrá enviar el formulario).
2) el orden cronológico en que ingresa los eventos sólo importa a Ud. (el script los detecta sin necesidad de ordenarlos).
3) el servidor, antes de guardar los cambios validará los datos; los registros completos serán agregados sin más, los que presenten error (mes y/o día no válido y/o evento vacío) se devolverán luego en una tabla. Los eventos validados y aceptados ya quedan incluidos en el registro.
4) apenas guardados, los cambios se reflejarán en el calendario.

(imagen 6)


¿ Puedo cambiar la contraseña?

Sí, en el panel izquierdo ingrese la nueva contraseña dos veces y pulse el botón 'Actualizar' (punto 1 de la imagen 7)

(imagen 7)


Ya no tengo más que hacer, ¿ que hago?

Para cerrar sesión, pulse el botón 'Salir' (punto 2 de la imagen 7).


¿ Que límites técnicos hay?

Limitaciones
- Estilo del calendario: inicialmente, se cargarán los estilos predeterminados (que podrá editar o sustituir por una URL).
- Javascript: el calendario requiere que JavaScript esté habilitado ya que utiliza AJAX para cambiar de período; por otro lado, refrescar la pantalla con CTRL+F5 o F5 provocará que se cargue el mes actual.
- Actualmente hay 2 años para editar eventos (2.011 y 2.012), con cada año que pase automáticamente se incorporará uno nuevo.
- Eventos diarios: de momento, sólo mostrará un evento/día (el control del texto del evento no tiene limitación de caracteres, así que puede ingresar todo en uno).
- Sólo puede navegar por el formulario mes a mes (sin saltos de año).
- Exploradores: en ¿ Que exploradores son compatibles? hay un detalle con los resultados de pruebas de compatibilidad (funcionamiento comprobado).
- Tiempo de actualización de la información (performance): el funcionamiento está supeditado al estado del servidor de Webcindario (caído o saturado), y a las propias de la red (internet).
- El servicio se presta 'tal cual', sin garantías de ningún tipo; lo usa si gusta, sino, no está obligado.
- Mantenimiento: la correcciones (bugs) y mejoras se harán según disponibilidad.


¿ Que precauciones debe tomar?

Precauciones
- Tenga presente el id del calendario y la contraseña incluida al crearlo (al no poder enviar un mail desde este servidor -con esta información- no hay forma de recuperarla, por otro lado, la contraseña se guarda codificada con MD5).
- El almanaque quedará a la vista de gente (y bots), así que no incluya eventos que puedan afectar la sensibilidad; con todo (Ud., el creador) es responsable del contenido.


¿ Que exploradores son compatibles?

Estilos predefinidos: han sido testeados con las siguientes salvedades en los siguientes exploradores y versiones:
Firefox 2.0.20 ----------> No muestra bordes superior e izquierdo del iframe
Firefox 3.0.19 ----------> No muestra bordes superior e izquierdo del iframe
Firefox 3.5.19 ----------> No muestra bordes superior e izquierdo del iframe
Firefox 3.6.23 ----------> Ok
Firefox 4.0.1 -----------> Ok
Firefox 5.0.1 -----------> Ok
Firefox 6.0.2 -----------> Ok
Firefox 7.0.1 -----------> Ok
Firefox 9.0 (Aurora) ----> Ok
Firefox 10.0 (Nightly) --> Ok
IE 5.5 ------------------> Ok
IE 6.0 ------------------> Ok
IE 6.0.2900 -------------> Ok
IE 8.0.6001 -------------> Ok
Opera 9.64 --------------> Ok
Opera 11.51 -------------> Ok
Safari 5.1 --------------> Ok

JavaScript: el código ha sido testeado con éxito en los siguientes exploradores y versiones:
Firefox 2.0.20
Firefox 3.0.19
Firefox 3.5.19
Firefox 3.6.23
Firefox 4.0.1
Firefox 5.0.1
Firefox 6.0.2
Firefox 7.0.1
Firefox 9.0 (Aurora)
Firefox 10.0 (Nightly)
IE 5.5
IE 6.0
IE 6.0.2900
IE 8.0.6001
Opera 9.64
Opera 11.51
Safari 5.1