var mysite = {
    'url': "http://www.ajaxweb20.net",
    'author': "Giuseppe Raso",
    'xhtmlValid': true,
    'cssValid': true
}
Home > Blog

Archive for Gennaio, 2008

Tool per monitorare i memory leaks in Internet Explorer

Domenica, Gennaio 27th, 2008

Oggi vi presento un ottimo tool che permette di analizzare uno script eseguito in Internet Explorer 6 o 7 per scoprire se questo èm affetto da memory leaks. Senza scendere troppo nei particolari, questo tool crea un’oggetto che riflette le modifiche fatte a un nodo prima che queste vengano effettivamente fatte. In questo modo il programma ha un controllo pressocchè assoluto sull’esecuzione dello script.

Mi scuso con tutti voi per la grafica indecente, questioni di pochi giorni e cambierò dominio…

Posted in Ajax Web 2.0 | 1 Comment »

Utilizzare gli smiles in qualsiasi piattaforma di blogging, blogger compreso.

Venerdì, Gennaio 25th, 2008

Vi segnalo questo script di Andrea Giammarchi per utilizzare gli smiles in qualsiasi pagina web:

  1. // (C) Andrea Giammarchi - Mit Style Licence - V0.2 - 0.000755
  2. function JSmile(firstChild){
  3.     var parentNode = {"CODE":true, "NOSCRIPT":true, "PRE":true, "SCRIPT":true, "STYLE":true},
  4.         childNodes = (firstChild || document.firstChild).childNodes,
  5.         length = (childNodes || []).length;
  6.     while(length–){
  7.         switch((firstChild=childNodes[length]).nodeType){
  8.             case    1:
  9.                 JSmile(firstChild);
  10.                 break;
  11.             case    3:
  12.                 if(!parentNode[firstChild.parentNode.nodeName])
  13.                     JSmile.nodeType(firstChild);
  14.                 break;
  15.         }
  16.     }
  17. };
  18. JSmile.nodeName = function(join){
  19.     var split = join.split(""),
  20.         length = split.length;
  21.     while(length–)
  22.         split[length] = split[length].charCodeAt(0);
  23.     return  split.join(".");
  24. };
  25. JSmile.nodeType = function(firstChild){
  26.     var parentNode = firstChild.parentNode,
  27.         nodeValue = firstChild.nodeValue,
  28.         nodeName = 0,
  29.         length = 0,
  30.         insertBefore;
  31.     nodeValue.replace(
  32.         /8-\)|:evil:|:geek:|:idea:|:lol:|:mrgreen:|:o|:oops:|:roll:|:shock:|:twisted:|:ugeek:|:x|:\||:!:|:\(|:\)|:\?|:\?:|:D|:P|:arrow:|:cry:|;\)/g,
  33.         function(createTextNode, nodeType){
  34.             if(++length < 21){
  35.                 insertBefore = new Image();
  36.                 insertBefore.className = "jsmile";
  37.                 insertBefore.src = "http://packed.it/JSmile/smiles/phpbb/" + JSmile.nodeName(insertBefore.alt = insertBefore.title = createTextNode);
  38.                 parentNode.insertBefore(document.createTextNode(nodeValue.substring(nodeName, nodeType)), firstChild);
  39.                 parentNode.insertBefore(insertBefore, firstChild);
  40.                 nodeName = nodeType + createTextNode.length;
  41.             }
  42.         }
  43.     );
  44.     if(nodeName){
  45.         parentNode.insertBefore(document.createTextNode(nodeValue.substring(nodeName)), firstChild);
  46.         parentNode.removeChild(firstChild);
  47.     }
  48. };

Dopo averlo scaricato potete includerlo in head attraverso un tag script.
Ogni volta che volete utilizzare lo script basta richiamare la funzione Jsmile:

  1. window.onload = function() { 
  2.     JSmile(document.body);
  3. }

Infine è necessario precisare che nonostante le immagini siano prese direttamente dal server di packed.it, sarebbe buona norma modificare l’uri “http://packed.it/JSmile/smiles/phpbb/” con un uri che punta al proprio server.

Posted in Ajax Web 2.0 | 1 Comment »

Utilizzare json con una sintassi simile alle query SQL

Mercoledì, Gennaio 16th, 2008

Oggi ad attirare la mi attenzione è stato questo post di ajaxian in cui viene presentata una nuova libreria dal fantasioso nome di jsonSQL. Questa, come avrete inutito dal titolo del post, permette di prendere dei dati in un oggetto json tramite una query in stile sql.
Vediamo qualche esempio:

  1. jsonsql.query("select * from json.channel.items order by title desc", json);
  2. jsonsql.query("select title,url from json.channel.items where (category==’javascript’ || category==’vista’) order by title,category asc limit 3", json);

Come vedete l’unico costrutto supportato è select ( e ci credo :D ), ciononostante si possono inserire varie opzioni tipiche di sql come order by o asc.
Io onestamente non credo che sia molto utile il poter utilizzare una sintassi del genere, anche per via delle profonde differenze tra un oggetto json e una tabella mysql.
D’altra parte ad alcuni sviluppatori ajax potrebbe interessare, in questo caso la libreria è liberamente scaricabile da qui.

Posted in Ajax Web 2.0 | No Comments »

Mi sposto o non mi sposto?

Mercoledì, Gennaio 16th, 2008

Splinder mi ha un pò scocciato. Non fraintendetemi, tra le piattaforme di blogging che ho provato è tra le migliori.
Inizialmente avevo scelto blogger per questo blog, ma essendo tale piattaforma ancora in beta avevo puntato su splinder.
Peccato visto che ora ho deciso di spostarmi su wordpress… Perchè peccato? Beh, splinder non permette in nessun modo di esportare i post!
Dovrò quindi utilizzare un plugin, ma ovviamente vi avvertirò con qualche giorno di avviso prima di spostarmi definitivamente.

Posted in Ajax Web 2.0 | 3 Comments »

Tre bug di IE nella gestione del DOM veramente spassosi ( a patto di non imbattersene : )

Domenica, Gennaio 6th, 2008

I bug di IE paiono non avere fine, in questi giorni ne ho scoperti addirittura 3 riguardanti solamente il document object model. Dovrei aprire un blog al riguardo :D
Vediamoli uno ad uno e come possono essere risolti.

Bug 1: document.getElementById non fa distinzioni tra gli attributi name e id.
Il document.getElementById di Internet Explorer ( Opera idem ) è soggetto a un grave errore, ovvero quello di prendere l’elemento anche dall’attributo name. Ciò può essere motivo di confusione: se ad esempio abbiamo un elemento div con id="description", il getElementById potrebbe prendere invece il tag meta con name="description".
Workaround
Creiamoci una funzione che controlli se l’elemento preso ha veramente un id uguale alla stringa passata:

  1. document.$getElementById =(function() {
  2.   if(document.all)
  3.      return function(id) {
  4.        var el = document.getElementById(id);
  5.        if(el.id == id)
  6.          return el;
  7.        for(var i = 0, l = document.all.length; i!=l; i++) {
  8.          if(document.all[i].id == id) return document.all[i]; 
  9.        }
  10.      }
  11.   else return function(id) {
  12.     return document.getElementById(id)
  13.   }
  14. })();


Bug 2 ( risolto in IE7 ): i nodi commento hanno una proprietà tagName.
Questo è veramente divertente. Secondo IE6 e IE5 i nodi commento sono degli elementi html! Essi hanno persino una proprietà tagName uguale a "!", il chè nessuno ha mai capito cosa significhi. Fatto stà che passando il selettore universale "*" al metodo document.getElementsByTagName i nodi commento verranno inclusi nella NodeList restituita.
Workaround
Bisogna verificare che la proprietà nodeType sia uguale a 1. In alternativa è anche possibile controllare che la proprietà tagName sia diversa da "!".

  1. document.$getElementsByTagName =(function() {
  2.   if(navigator.appName == "Microsoft Internet Explorer" && !XMLHttpRequest)
  3.      return function(tag) {
  4.        var elems = document.getElementsByTagName(tag);
  5.        if(tag != "*") return elems;
  6.        for(var i = 0, l = elems.length, res = []; i!=l; i++) {
  7.          if(elems[i].nodeType == 1) res.push(elems[i]);
  8.        }
  9.        return res;
  10.      }
  11.   else return function(tag) {
  12.     return document.getElementsByTagName(tag)
  13.   }
  14. })();


Bug 3: non è possibile utilizzare l’operatore delete su elementi html.
L’operatore delete è l’unico modo per cancellare una proprietà di un oggetto definitivamente ( settarla a null o ad undefined non lo fa ). Potrebbe essere molto utile con gli elementi html per settare dei flag temporanei ed eliminarli una volta terminato il ciclo. Purtroppo delete funziona solo su discendenti della classe nativa Object, e guarda caso gli elementi html in IE non soddisfano questo requisito.
Workaround
La soluzione esiste anche in questo caso ma è alquanto sporca. L’unico modo per un elemento html di avere una proprietà cancellabile definitivamente è quello di usare gli attributi. Il mio consiglio è, se proprio volete usare questa soluzione, cercate di inventarvi nomi complicati pieni di trattini che nessuno possa sovrascrivere per sbaglio.

  1. //Non funziona con IE
  2. var el = document.getElementById("el");
  3. el.prop = "value";
  4. try {
  5.   delete(el.prop);
  6. } catch(err) {
  7.   alert("Stai di certo usando IE");
  8. }
  9.  
  10. //Metodo alternativo e funzionante con IE
  11. var el = document.getElementById("el");
  12. el.setAttribute("prop", "value");
  13. el.removeAttribute("prop");
  14. alert("prop" in el.attributes); //E’ false anche in IE

La lista è ancora lunga. E ciò a dire il vero mi fa un pò paura.

Posted in Ajax Web 2.0 | No Comments »