Apprise: Una buena alternativa a los alert() de javascript

Diseño web

Son cada vez más los que piensan que no debemos utilizar el alert de javascript de cara al usuario final, pero los programadores estamos demasiado acostumbrados a utilizarlos y son nuestros compañeros de depuración en casos en los que no podemos gastar a ‘San Firebug’ ni similares.

Pues bien. Apprise es una alternativa muy ligera y elegante para sustituir a nuestros viejos alerts.

Además permite personalizar los textos y amplía alguna funcionalidad como podemos ver:

Alternativa al alert de javascript

Además, podemos fácilmente sobrecargar la función alert() para que al implementar ‘apprise’ no tengamos que ir cambiando los viejos alerts uno a uno, e incluso los podamos seguir usando.

if(document.getElementById) {
    window.alert = function(txt) {
        apprise(txt);
    }
}

Pues nada.

Esperamos que os guste y que os sirva.

Happy codding….

Problema con el cambio de idioma en los menus con Joomfish y la cache de Joomla activada

Joomla

Recientemente nos hemos encontrado con el problema de que los items de menú no se traducían al cambiar de idioma, hasta que no volvíamos a refrescar la página.

Al parecer cuando se cambia de idioma, el componente de ‘mainmenu‘ carga el resultado de la cache, y después lo escribe, de forma que es la segunda vez que cargamos la página cuando recoge de cache el resultado correcto.

En principio, esto se debería solucionar facilmente, deshabilitando la cache para los módulos ‘mainmenu‘ que tengamos, pero no es así. Sigue sin funcionar.

La solución drástica, es deshabilitar toda la cache de Joomla desde la configuración general, pero de esa manera perdemos demasiado rendimiento. No es una buena solución.

La mejor solución, sería tener un archivo de cache diferente para cada idioma, pero no es una solución sencilla, y lo que hemos encontrado, solo es válido si tenemos el archivo ‘/include/cache/lite.php‘ (al parecer de la versión 1.0 de Joomla). Ver el hilo del foro sobre esto.

Para los que no tenemos ese archivo, y a falta de una solución mejor (si la tienes, puedes compartirla en un comentario), podemos desactivar la cache de los módulos ‘mainmenu’ modificando el archivo ‘\modules\mod_mainmenu\helper.php‘.

Lo único que tenemos que hacer es no utilizar el sistema de cache para llamar al método ‘buildXML’ en las líneas 77 y 78, y llamarlo de forma normal.

Quedaría algo como:

//$cache =& JFactory::getCache('mod_mainmenu');
//$string = $cache->call(array('modMainMenuHelper', 'buildXML'), $params);
$string = modMainMenuHelper::buildXML($params);

Pues nada. Eso es todo.

Esperamos que os sea de ayuda.

Colorear código fuente publicado en html en tu web (syntax highlight)

Diseño web

Siempre es de agradecer que el código fuente que se muestre en una página este coloreado según la sintaxis del lenguaje del código.

Para implementar esto en este mismo blog, estubimos barajando principalmente dos opciones: «Highlight.js» y «Code prettifier» de google; ya que ambos detectan el lenguaje de forma automática.

El primero, trabaja directamente sobre cualquier <pre><code> sin necesidad de añadir ninguna class a la etiqueta, en cambio, el de google requería añadir la class «prettyprint», así que empezamos por probar el primero.

Para incluirlo, no hizo falta ni descargarlo. Solo tubimos que añadir en el head lo siguiente:

<script src="https://yandex.st/highlightjs/5.16/highlight.min.js"></script>
<link rel="stylesheet" href="http://yandex.st/highlightjs/5.16/styles/default.min.css">
<script>
hljs.tabReplace = '    ';
hljs.initHighlightingOnLoad();
</script>

El resultado NO fué satisfactorio. Colorear, coloreaba; pero juntaba todo el código en una misma línea.

Le tocaba el turno al script de google.

Este si que hubo que descargarlo (almenos no encontré la opción para utilizar los servidores de google), y para añadirlo sin tener que reemplazar en base de datos todos los <code> por <code class=»prettyprint»>, lo hicimos de la siguiente forma:

<script src="/wp-content/prettify/prettify.js"></script>
<link rel="stylesheet" href="/wp-content/prettify/prettify.css">
<script>
jQuery(document).ready(function() {
  jQuery('code').addClass("prettyprint");
  prettyPrint();
});
</script>

Con esto como podéis ver el resultado SI és el que esperábamos.