Ejemplo Modulo joomla con control de calendario

Posted on by fitorec
Reply

En ocasiones requerimos en nuestros sitios datos insertados por los usuarios, afortunadamente Joomla! cuenta con una serie de elementos que hacen mas amena esta tarea, el día de hoy quiero explicar como insertar el calendario de Joomla! tal y como lo vemos en la parte administrativa en las opciones de publicación al editar un articulo.

calendario joomla

calendario joomla

Este articulo ha sido movido a:
http://www.mundosica.com/blog/2013/agregando-el-calendario-de-joomla-a-nuestras-campos-de-formularios/

Paginación de Twitter Bootstrap en WordPress

Posted on by fitorec
Reply

El twitter Bootstrap entre sus componente que tiene trae incorporado un sistema de paginación con links activos, normales y deshabilitados.

Paginación de twitterBootstrap en WordPress

Resultado Paginación de twitterBootstrap en WordPress

http://twitter.github.com/bootstrap/components.html#pagination

Por otra parte el sistema WordPress suele agregar la paginación de los posts en el archivo loop.php de la plantilla en cuestión, desgraciadamente la función paginate_links nos genera un código html algo diferente a lo que requerimos para adaptarlo al bootstrap.

Salida en HTML necesaria

Salida en HTML necesaria

http://codex.wordpress.org/Function_Reference/paginate_links

Navegando por Internet encontré algunas implementaciones, p.e:

http://panosgalatis.com/2012/08/14/wordrpess-and-twitter-bootstrap-pagination/#.UHvXCqyqyio

Sin embargo incluyen modificaciones al CSS, cuando este renderizado se puede hacer solo con PHP como se muestra continuación:

loop.php

loop.php

Hice un gists en github con el código fuente para que se pueda descargar:

Agregando Tooltips de Twitter Bootstrap al calendario de WordPress

Posted on by fitorec
Reply
Ejemplo Calendario con tooltip de twitterBoostrap

Ejemplo Calendario con tooltip de twitterBoostrap

El Twitter Boostrap trae integrado en su sección de javascript un plugin de JQuery (el ToolTip) el cual resulta muy útil e interesante a la hora de mostrar información extra sobre algún elemento o enlace de nuestro sitio.

Por otra parte WordPress nos proporciona un calendario que nos muestra los posts por fecha, el código html del calendario que nos interesa es básicamente este:

 
<table id="wp-calendar">
..
<td>
<a href="url" title="descripcion detallada">num día</a>
</td>
...
</table>

Conociendo el código HTML al que queremos acceder podemos acceder a estos elementos y agregarle el tooltip, como se muestra a continuación:

/** Le agregamos el toolTip a los elementos que nos interesan **/
$('#wp-calendar').find('td a').tooltip();

Queda a reflexión del lector por que use $('#wp-calendar').find('td a') en lugar de $('#wp-calendar td a').

Calcular tu Energía temporal Kua – Astrología china en JavaScript

Posted on by fitorec
2
Calculador de Kua

Calculador de Kua

Kua número que representan una energía que tiene una dimensión espacio/tiempo. Cada año del calendario chino está regido por un número Kua, definiendo nuestro elemento cósmico, signo chino, puntos favorables y puntos desfavorables (esto ultimo del del Feng-shui).

Ocho números Kua están relacionados a los siguiente puntos cardinales:

  • Norte
  • Sur
  • Este
  • Oeste
  • Noreste
  • Noroeste
  • Sureste
  • Suroeste

La fecha de nuestro nacimiento determina el año chino en el que nacimos y el número kua que nos rige, determina también nuestras orientaciones favorables y desfavorables y al mismo tiempo nuestro “signo chino“(Mono, pollo, perro, cerdo,etc..).

el problema que el calendario chino no va a la par con el calendario gregoriano que nos rige.


Como la polaridad del hombre y la mujer son diferentes, el kua para un mismo año difiere según tu sexo.

Hay dos grupos de personas:

  • las del Este
  • las del Oeste.

Mayores informes de la astrología china:
http://es.wikipedia.org/wiki/Astrolog%C3%ADa_china

Basándome en toda esta teoría me puse ha elaborar una pequeña herramienta la cual también la pueden usar en linea ó descargar y editar/usar a su gusto, esta herramienta por el momento nos permite calcular:

Datos generales:

  • Tu año chino de nacimiento.
  • Número Kua.
  • Número signo chino (Mono, pollo, perro, cerdo,etc..).
  • Tu Elemento (Agua, Tierra, Madera, Metal, Fuego).

Datos Feng-shui puntos favorables:

  • Sheng Chi Exito dirección para el trabajo.
  • Tien Yi Salud dirección para descansar.
  • Nien Yen Longevidad – dirección para el romance y buenas relaciones.
  • Fu Wei Armonía – dirección para el romance y buenas relaciones.

Datos Feng-shui puntos NO favorables:

  • Ho Hai Accidentes No hacer tareas delicadas en esta dirección.
  • Wu Kwei Cinco Fantasmas Acontecimientos inesperados
  • Lui Sha Seis Muertes Problemas de todo tipo, (enfermedad).
  • Chueh Ming Perdida totalEvitar a toda costa esta dirección.

Entre sus principales características es que esta hecha solamente con html, css y javascript no depende de ninguna librería(jQuery, mootools, etc.).

Visitar proyecto

http://fitorec.github.com/proyectos/calendario_chino/

¿Platícame ¿cual es tu signo chino y tu numero Kua?

Reloj regresivo en Javascript clockCountdown

Posted on by fitorec
Reply

En ocasiones es necesario un reloj que cuente de forma regresiva(clockCountdown), por ejemplo si estamos esperando algún evento del cual faltan no sé 5 días(por ejemplo), entonces este reloj podría servir para indicar que faltan 5 días, 0 horas, 0minutos y 0 segundos posteriormente se desincrementaría quedando en 4 días, 23 horas, 59minutos y 59 segundos y así sucesivamente:

Imagen del reloj regresivo

Relog regresivo en acción

Principales características

  • Javascript puro apegado al ECMAScript
  • No depende de ninguna librería(jQuery, mootools, etc…).
  • Soporte de ejecución multiple basada en una pila de objetos.
  • Ligero.
  • Cross Browser.

Visitar proyecto

http://fitorec.github.com/clockCountdown.js/