Contenido

Detectar en navegador en XSL

27 ene

+ 0

Hoy por casualidad he caido en un artículo de Manfred Staudinger, escrito en Abril del 2008,  que nos muestra como detectar el navegador de usuario desde un fichero XSL.

Recordemos que XSLT es una técnica que nos permite transformar la salida de un XML mediante el uso de un fichero XSL que actua como plantilla superpuesta., al igual que los fichero CSS modifican el aspecto del HTML.

xsl_browser

Usando la propiedad system-property() obtenemos el motor que el navegador usa para transformar los XML con las XSL y dependiendo del nombre que este tenga podemos obtener algunos datos interesantes para condicionar nuestros scripts.

<xsl:variable name="vendor" select="system-property('xsl:vendor')"/>;

Ver código completo.

iMeneame.net ahora más móvil que nunca

12 ene

+ 2

Ayer le dediqué unas horas a depurar el código de iMeneame.net para que se adaptar más a los dispositivos móviles. Ya que gracias a Lucas tenemos tenemos un aspecto mejorado y especificado para el iPhone, creía necesario efectuar un cambio para otros dispositivos con pantallas más pequeñas.

iMeneame.net se lava la cara

26 oct

+ 17

Hace más de un año que iMeneame vió la luz, la versión para el iPhone de Meneame.net (versión no oficial) ha tenido que aguantar con un diseño realmente horrible (evidentemente mio) hasta que me he topado con Lucas Savelli de WydStudio.

new_imeneamenew_meneame_single

Gracias a Lucas, iMeneame ha adquirido un aspecto más moderno y más eficiente para el dispositivo que fue creado. Debido a que el contenido lo saco del RSS de Meneame me veo condicionado a lo que este formato nos devuelve, las limitaciones del XSL tampoco han ayudado mucho, pero creo que el resultado es más que satisfactorio apesar de las salvedades encontradas.

Espero que os guste, y me comuniqueis todos los fallos e impresiones.

iMeneame, la versión de Meneame para el iPhone/iTouch

15 oct

+ 17

Hace un tiempo vimos como se veía Digg desde el iPhone, una versión lite de Digg adaptada para dedazos. Pues ahora le toca a Meneame.

Este fin de semana he estado trasteando un poco, leyendo la documentación de Apple para optimar el contenido y los sitios web para el iPhone/iTouch y he pensado, “¿que mejor que Meneame para probar esto?”. Y me puse manos a la obra.

imeneame.JPGinoticia.JPG

Desarrollo

Está desarrollado en PHP y se basa sobre el Feed de Meneame.net, usando transformaciones XSLT para convertilo en HTML, he desarrollado una mini caché de 60 segundos de los ficheros HTML, que aliviará la transformación y lectura del feed.

Resultado 

El resultado es una versión, ligera y optimizada que los usuarios de iPhone/iTouch podrán utilizar perfectamente. Aún se haya en estado Beta, pero es bastante estable y desde el iTouch se ve perfectamente.

[Descargar][Demo][iTouch Appz]

Actualización
Se han añadido los comentarios de cada entrada, mediante la lectura del RSS correspondiente y cacheandolo transformado con el resto de la noticia.

Firefox 3.0 integrará EXSLT

6 jun

+ 3

Esta tarde Enzo me preguntaba si sabía algo acerca de la implantación de XSLT 2 en el nuevo Firefox 3.0 y la verdad es que me ha hecho mucha curiosidad el tema y he estado indagando un poco sobre el tema.

Al parecer Firefox 3.0 no integrará, o no hay planes al respecto,  XSLT 2 aunque tampoco se limitará a mantener la versión actual (XSLT 1.0)  y añadirá EXSLT, una iniciativa de la cominidad para proveer de extensiones al XSLT, entre ellas podemos ver mejoras:

Hasta el momento estos son los datos que he encontrado, quizas decidan cambiar los planes e implementar el estandar en el último momento, pero hasta entonces, solo podemos esperar.

Freja, aplica XSL a tus XML mediante Javascript

4 may

+ 1

Ayer Ajaxian, me alegraba con un nuevo framework para aplicar templates al javascript. En este caso se trata de un framework capaz de aplicar fichero XSL a nuestros XML’s, Freja es el nombre de este framework.

¿Que es Freja?

Freja es un framework especializado para la creación te templates para aplicaciones web visuales, para que nos entendamos, nos permite transforma nuestras códigos XML, en algo legible por el usuario de forma realmente simple.

Únicamente necesitas conocer el lenguaje XSL para poder distrutar de esta librería.

Ejemplo de uso

//XML
<?xml version="1.0" encoding="utf-8"?>
<items>
	<item id="item1">
		<name>Black Bean and Smoked Tomato</name>
		<description>with Goat Cheese, a touch of Cumin and Cayenne</description>		
		<price>$3.80</price>	
	</item>
	<item id="item2">
		<name>Baked Brie Wheel</name>
		<description>Oven baked and served with condiments and crackers</description>		
		<price>$8.85</price>	
	</item>	
	<item id="item3">
		<name>Pork Green Chili and Chips</name>
		<description>Homemade pork green chili served with a basket of white corn tortilla chips</description>		
		<price>$7.95</price>	
	</item>	
</items>
//XSL
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent="yes" encoding="UTF-8"/>
<xsl:template match="/">
	<xsl:apply-templates />
</xsl:template>
<xsl:template match="items">
<div>
	<xsl:apply-templates />
	<p><a href="#" class="addLink">Add a new menu entry</a></p>
</div>
</xsl:template>
<xsl:template match="item">	
<div>
	<h4><xsl:value-of select="name" /> &#xA0; <small><a href='#' id='{@id}' class='editLink'>edit</a></small></h4>
	<p><xsl:value-of select="description" /></p>
	<p><em>Price: <xsl:value-of select="price" /></em></p>
</div>
</xsl:template>
<xsl:template match="text()" />
</xsl:stylesheet>
//Javascript
// Freja Tutorial 3 - http://www.csscripting.com/freja

Freja.AssetManager.HTTP_METHOD_TUNNEL = null;
Freja.AssetManager.XSLT_SERVICE_URL = "srvc-xslt.php";	// For safari only

// Load Model and Views
var menu = getModel('models/data.xml');
var display = getView('views/display.xsl');
var edit = getView('views/edit.xsl');

// Handles 'ok' button in edit view
edit.behaviors["editForm"] = {
	onsubmit : function() {
		menu.updateFrom(edit);
		display.render(menu, "content");
		return false;
	}
};
edit.behaviors["cancelButton"] = {
	onclick : function() {
		display.render(menu, "content");
		return false;
	}
};

// Handles 'edit' link next to each menu item
display.behaviors["editLink"] = {
	onclick : function(n) {		
		edit.render(menu, "content", {itemid:n.id});
		return false;
	}
};

// Handles 'add new menu item' link at the bottom of the list
display.behaviors["addLink"] = {
	onclick : function() {
		var newitem = Freja._aux.loadXML(Freja._aux.xmlize( {name: '', description:'', price: '' },"item"));
		var root = menu.document.documentElement;	
		newitem = root.appendChild(Freja._aux.importNode(menu.document, newitem.documentElement));
		var newid = 'item'+root.childNodes.length;
		newitem.setAttribute('id',newid);
		edit.render(menu, "content", {itemid:newid});
		return false;
	}
};

// Let's go.
window.onload = function() {
	display.render(menu, "content");
}

[ Descargar][Demo][Tutorial]

JSLT, más templates en javascript

11 abr

+ 5

Que javacript es un lenguaje en auge, y que gracias a este auge se está asegurando un futuro hueco en todos los navegadores, no es una novedad. Por ello cada vez más van saliendo aplicaciones, utilidades y mejoras a este lenguaje.

Cade vez más se está apostando por él y hay muchas herramientas que actualmente vulneran la accesibilidad web, pero que a mi parecer en un futuro pueden ser un buen aliado para trabajar con Javascript.

JSLT, es una muestra de ello, una librería javascript que emula el trato de XSLT en a nuestros XML. En la laboriosa y árdua tarea de parsear XML con Javascript generalmente nos encontramos con códigos infumables, por este motivo herramientas que nos facilitan esta tarea me parecen muy interesantes.

XML

<xml>
 <folder name='F1'>
  <file>A</file>
  <file>B</file>
  <file>C</file>
 </folder>
 <folder name='F2'>
  <file>D</file>
 </folder>
 <folder name='F2'>
  <file>E</file>
  <file>F</file>
 </folder>
</xml>

XSLT

<xsl:foreach select="folder">
   <xsl:variable name="c"><xsl:value-of select="count(files)" /></xsl:variable>
   Folder <xsl:value-of select="@name" /> has <xsl:value-of select="$c" /> file\n
   <xsl:foreach select="file" >\s
      File: <xsl:value-of select="text()" />
      <xsl:if test="position() != last()">,</xsl:if>
   </xsl:foreach>\n
</xsl:foreach>

JSLT

[foreach('folder'){]
   Folder {@name} has [%c] file\n
   [foreach('file'){]\s
      File: [%$'text()'.toLowerCase();]
      [if(!last)%',']
   [}]\n
[}]

Tenemos una url en donde probar nuestro JSLT y trastear un poco con él. No soporta funcionalidades como position(), pero la idea es muy buena y atractiva.

Via

Recomendaciones de la W3C para la XSLT 2.0

24 nov

+ 1

Llevo más de 1 año programando con XSLT y desde que lo conozco he estado deseando que aparecieran cosas como estas. La nueva revisión promete y estas recomendaciones de la W3C son la prueba.

Tomando contacto con XSLT(I)

7 ago

+ 11

XSLT o Hojas de estilos aplicadas a XML (eXtensible Stylesheet Language) , son sin duda una herramienta de futuro y importante de conocer aunque sea únicamente la base. He pensado en que podría aprovechar que es principalmente la tecnología que utilizo en el trabajo, y lo llevo bastante por mano, para hacer un pequeño manual en capítulos con lo más importante de este lenguaje.

Continua —>

Release Candidate de XSLT 2.0

14 jun

+ 0

Presentan la Release Candidate del XLT 2.0 Por favor una variable normal!!!