javascript

sleep/wait/pause javascript

Vendredi 26 janvier 2007

Alors ça c’est le gros problème en se moment : faire une pause en javascript.

Attention je parle de pause ‘in-line’ et pas de lancement de fonction avec settimeout :

function sleep(time, func) {
settimeout(func,time);
}

ceci n’est pas du script inline et il est impossible de l’utiliser en gardant toujours le meme corp de function.

Certain s’embarque dans des boucles qui font forcer votre processeur comme jamais :

function sleep(time){
var start = date.getTime();
while(start+time > date.getTime()) true;
return;
}

autant dire que ça fait déchets…

la seule solution possible actuellement semble etre de passer par le narrative javascript compiler qui lui va se débrouiller pour nous compiler un code qui va nous permettre de faire des pauses dedans.

function sleep(millis) {
var notifier = new EventNotifier();
setTimeout(notifier, millis);
notifier.wait->();
}

je trouve tout de meme abérant que cela ne soit pas inclus au javascript standard… ça limite fortement les possibilités de créer un code simple et facile à utiliser.

Mise à jour 24 juillet 2007 : Ajaxian a trouvé une implémentation du narrative javascript permettant de ne pas changer la syntaxe originale de javascript dans vos codes : javascript Strands

Classé dans :javascript, programmation | Commentaires (7)

narrative javascript

narrative javascript est un framework qui se déférencie des autres.
Il inclue un compilateur en javascript qui parse votre code avant de le retourner compilé à sa sauce.

Ce compilateur est principalement destiné a créer des codes sans asynchronisation, permettant ainsi de créer votre code ‘full inline’.

Il est basé sur un algorythme java traduit pour l’occasion en javascript.

site officiel

Classé dans :javascript, programmation | Commentaire (1)

cibler le document d’une iframe en javascript

Mercredi 24 janvier 2007

Vous pourrez avoir besoin comme moi de cibler le contenu ainsi que les fonction inclus dans une iframe, comme par exemple pour créer un script avec des upload de fichiers.

Le ciblage de l’élément iframe se fait comme les autres avec l’id ou avec l’attribut name seulement le contenu du document de l’iframe est un peu plus problèmatique.

par exemple pour cibler la partie window.document de la page de l’iframe :

vous devrez faire :

var myf = document.getElementById("myiframe");
myf = myf.contentWindow.document || myf.contentDocument;

maintenant votre variable myf cible sur le window.document de l’iframe.

un petit rapel : pour cibler la page à partir de l’iframe, simple :

window.parent.document

Ces exemples marchent pour firefox, opera, IE >= 5.5.

Classé dans :javascript, programmation | Commentaires (12)

fonction prototype 1.5 $$

Vendredi 29 décembre 2006

si vous voulez selectionnez un élément de votre page html en évitant les id et encore plus de parcourir toute l’arborescence et l’orgi qui en résulte, il y a plusieur script pour vous :

on connaissait déjà behaviour : pratique, simple mais un peu limité (par exemple réassigner seulement un groupe d’élément et non toute la page)

et c’est alors que prototype sort ça fonction: $$ : on peut voir l’annoncement sur ajaxian

en gros la fonction est simple $$(’p.maclass’) renvoie un array d’élément html, et c’est tout! easy-write comme dirait certains !!!

alors là je dis chapeau… seulement apparement il y a encore des soucis de perfomances alors un bloggeur (et probablement plus) a sorti un add-on a prototype 1.5 qui n’est pas encore sortie en version stable.

speeding-up-prototypes-selector

et vous pouvez voir sur la page de test que c’est largement plus optimisé.

vivement la version stable.
je devrais peut-être leur dire pour leur eval pas global

Classé dans :javascript, programmation | Commentaire (1)

railto framework ajax

Mardi 5 décembre 2006

je viens de découvrir Railto, un framework ajax qui permet de faire de très jolies choses (allez voir la section demo).

Ce framework est compatible uniquement IE 6.x/7.x et FF 1.x, comptez pas y allez avec opera…
Il fournie un code JS ainsi qu’un code serveur en PHP JSP Python .Net … bref beaucoup d’implémentations serveur.
Tout ça à l’air super! on dirait que c’est entièrement géré par coordonnée à l’écran, vous placez vos fenètre vos composant etc comme vous voulez!
Assez de widgets son implémentés pour en faire presque ce que vous voulez, et vous pouvez toujours changer les skins par défaut si vous les trouvés laid.

Seulement… allez pas piochez dans le code… illisible. c’est bourré de tab qui sont pas au bonne endroit, des fonctions à X paramètres inconnus, c’est lourd c’est gros.
D’ailleurs rien que le core javascript fait 500 Ko… 1/2 Mo à charger par vos visiteurs avant de voir apparaitre quoi que se soit… sans compter se que vous avez ajouté… si encore il y avait une bonne doc mais euh… où elle est ?? 500 Ko de code et 5 tuto tous aussi sombre que mon troue de balle!

Allez hop, à la corbeille, j’irai le rechercher quand tout ça aura évolué en doc et diminué en taille, autrement dire, j’ai peur que je puisse y recycler direct.

–EDIT–
allez je rectifie, en fait il le disent eux même que c’est trop lourd pour être exploité dans un site web entier :
FAQ Rialto

Classé dans :javascript, php, programmation | Commentaire (0)

javascript code parser/beautifiers/formater

Mardi 14 novembre 2006

marre des scripts écrit sur une ligne et illisibles ?

un petit programme simple, rapide, gratuit : Javascript Code Improver

rien de tel pour fouiller adsense :p

Classé dans :javascript, programmation | Commentaire (0)

Eclipse et PHP

Mardi 10 octobre 2006

Depuis que le projet Eclipse a démarré, il a fait du chemin.
A la base devellopper pour créer des applications java, sa protabilité fut tel qu’une multitude de plug-ins se sont créer permettant de develloper sous divers languages avec des assistants utilisateurs qui vont parfois bien au-dela de certain éditeurs payant.

Et parmis ses plug-ins on retrouve bien entendu PHPEclipse, permettant l’intégration du PHP. Celui-ci inclus:
- la coloration du code (paramètrable)
- la gestion des class, des variables, en tenant compte des fichiers inclut (via include ou require par exemple)
- un débugger syntaxique avancé (avec reconnaissance des variables)
- l’implémentaion des définitions/commentaires de type PEAR
- la reconnaissance du système de template smarty
- les bulles d’aides des fonctions natives php ET de vos fonctions avec votre définition si il y a.
- l’implémentaion d’un navigateur DANS l’envirronnement Eclipse afin de générer les page via votre serveur (local ou internet)

La synchronisation CVS est inclu dans Eclipse. Seul point noir en cour de develloppement, la synchronisation FTP se fait à l’aide d’un autre plug-in (FTP & WebDAV) mais j’ai des erreurs de connection 4 fois sur 5 sur la plupart des serveurs.. J’attend avec impatience la mise à jour.

En complément de ceci, et comme si ça ne suffisait pas, IBM a soumis un plug-in permettant l’implémentaion total d’AJAX basé sur des framework existants (Dojo, Open Rico) et implémentant des adaptations pour les environnements J2EE/JSP et Apache/PHP: L’ATF (AJAX Toolkit Framework) est encore en cour develloppement mais vous pouvez déjà vous procurer les versions beta. Imaginer le bonheur de pouvoir débugger ses codes javascript correctement, regardez les vidéos pour baver un peu.

Eclipse est donc très prometteur et deviendra surement l’éditeur favoris de nombreux develloppeur dans un avenir proche.
Ai-je besion de vous rapeler sa gratuité ?
Dreamweaver n’a qu’a bien se tenir.

– EDIT –
Finalement la synchronisation FTP marche très bien! Je suppose que l’erreur était du à la récente installation du plug-in… cela dit ne compter pas vous connecter sur les serveur FTP de free vu leur timeout exessivement bas
Pour effectuer une synchronisation affichez la vue “synchronisation de l’équipe”, ça vous paraitra plus clair
Allez quelques fonctionnalités de plus pour vous faire baver :
- visualisation des fichiers modifiés seulement (sur ftp ou sur local)
- comparaison diff avec éditeur intégré (vous savez, celui que dreamweaver n’intègre pas)
- intégration d’un mode de conflit si une nouvel version du fichier à été up sur le serveur pendant que vous travailler sur l’ancienne
Bon ben voila les autre éditeur peuvent tous allez se cacher, s’enterrer même.
Eclipse c’est de la balle

Classé dans :javascript, php, programmation | Commentaire (1)

javascript eval global

Dimanche 1 octobre 2006

ça fait un peu près 1 mois que je cherche à exécuter mon code javascript contenu dans mes données chargées via AJAX. Tout le monde me dira qu’il existe eval, seulement voila, ceci ne marche uniquement pour le code éxécuté en live et non pour les déclaration de fonction.

En effet, même dans le framework du style prototype, eval() est déclaré dans le contexte de l’objet AJAX, autrement dit dans la fonction AJAX. Ainsi toute les fonctions déclarées dans eval ne sont disponibles que dans la fonction où l’on fait le eval().

un petit exemple pour m’expliquer :

function myeval(){
eval(‘function test(){alert(’test ok‘);}’);
alert(typeof(test)); //affiche function
test(); // affiche ‘test ok’
}
myeval();
alert(typeof(test)); //affiche undefined
test(); // erreur : fonction test inconnu

ceci peut poser de gros problèmes pour déclarer des objects via AJAX :

//x est votre object XMLHttpRequest
x.onreadystatechange = function (){
if (this.readyState == 4 && this.status == 200){
var c = document.getElementById(‘monconteneur’);
c.innerHTML = x.responseText;
//maintenant que les données reçu on été placé dans la page,
//il faut exécuter toutes les balise script :
var allscript = c.getElementsByTagName(’script’);
for(var i=0;i< allscript.length;i++){
eval(allscript[i].text);
}
alert(typeof(une_function_dans_mes_balise_script));//return function
}
}

seulement voilà : si maintenant vous avez un bouton avec dans l’action onClick une fonction qui est déclaré dans la page chargé, celle ci ne s’éxécutera pas car elle n’est pas déclaré dans un contexte global mais seulement dans la fonction onreadystatechange.

Mais, pour toi public, j’ai la solution. vous pouvez utiliser :

window.eval();
//ou encore :
var global = this; //dans un contexte global
//puis
global.eval();

vos function seront alors déclarée dans un contexte global.
var global = this; est utilisé pour forcé la compatibilité.

A noté que les différents framework tel que prototype n’exécute pas vos script via eval dans un contexte global (voir la function evalScripts pour prototype).

Je ne vous cache pas que j’ai galéré pour un truc tout con cependant astucieux

Classé dans :javascript, programmation | Commentaires (35)

réduire la taille d’un code javascript

Lundi 14 août 2006

Si vous voulez (appeler ça comme vous voudrez) réduire la taille, enlever les espaces blancs, comprésser, minimiser un code javascript afin que les données transmises soient moindre tout en n’affectant pas les performances, je vous propose un petit utilitaire écrit en une dixaine de language : jsmin

Classé dans :javascript, programmation | Commentaire (0)

javascript function serialize compatible PHP

Samedi 5 août 2006

Un jour comme hier j’en ai eu marre de pas pouvoir passer mes variables PHP à javascript correctement. Et je me suis di “mais il y a la fonction serialize en PHP” alors j’ai rouillé sur le net une petite heure pour éssayer de trouver un script qui permette de déserializer (unserialise) en javascript…

Je me suis rendu conte qu’il avait tous besoin d’une class en javascript… Alors moi et mon égo surdimensionné nous déplaçâmes tout ces scripts mal itérés dans la corbeille et ouvrîmes une page blanche, décidé à écrire une fonction et non une classe.

voila le résultat Demo serialize javascript

Dernière version : xorax-serialize-1.2
mise à jour du support pour la deserialization des objets php

historique :
xorax-serialize-1.1 correction de bug mineur sur les boolean.
xorax-serialize

Classé dans :javascript, programmation | Commentaires (15)