11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour tous le monde, je me heurte un à probleme que je n'arrive pas à resoudre d'où mon poste ici. J'ai fais quelques recherches sur Google et sur le forum j'avoue que je ne pige pas trop le comment du pourquoi, mon probleme est que je n'arrive pas à faire rafraichir une partie de ma page.
Je m'explique :
Ma page est constituée de plusieurs blocs, dont un que j'aimerais qu'il soit rafraichi toutes les 30 secondes ( c'est le bloc d'un tchat).
J'ai eu beau retourné le probleme dans tous les sens, je n'ai pas reussi.
Si qqn pourrait me fournir quelques pistes...
Salut,
ah ça, c'est relativement normal, une page se rafraîchit entièrement ou pas du tout Smiley smile mais, do si la sol fa mi ré do, heureusement il y a ajax Smiley smile et avec un periodical updater tu peux cibler un div avec une requête Ajax qui en recharge le contenu à intervalles réguliers, voilou, voilou.

Alors maintenant, tu as le choix, ou tu te lances dans l'écriture du truc, un peu de taf en perspective, ou tu te penches sur les librairies qui vont bien (mootools, Jquery, prototype, etc, euuuh, perso, je n'ai pas mis mootools au début tout à fait par hasard Smiley smile ), ça ne t'empêchera pas d'avoir quelques lignes de code à écrire mais nettement moins et plutôt que de réinventer la roue à chaque fois...

Juste pour infos, "autrefois" (ça sent son papy du web ça Smiley smile ) les tchats qui fonctionnaient sans rafraichissement de la page tournait sur fond d'applet java puis on en a vu doucement arriver sans java qui faisaient la même, javascript ! -> Ajax Smiley smile

have swing
Waou, je suis aller faire un tour sur mootools, c'est beaucoup mieux qu'avant c'est super fluide... Et pour 20 petit kilos on fait pas mal de truc...
Salut matmat,
et oui, mootools est devenue une pétard de librairie (la version 1.0 n'était déjà pas mal mais, depuis la récente sortie de la version 1.1 ça devient carrément grand Smiley smile ) et son mode de téléchargement modulaire est vraiment top quand on a besoin de juste deux trois trucs.

En plus, je dois dire que j'apprécie hautement (et je pense qu'ici, ça devrait être la même Smiley smile ) leur façon d'envisager js, le plus non obstrusif possible. Le forum où je traine pas mal Smiley smile regorge de inline js is bad for health, evil, etc, "autrefois", on aurait pu répondre à ça, "c'est bien joli mais..." alors que là, la librairie met tout ce qu'il faut à dispo pour écrire de la façon la plus propre qui soit, un vrai plaisir de scripter avec ça.

have swing
Si c'est vraiment bien le mode de télechargement, c'est vraiment un travail incroyable.

Par contre, je pense que c'est une erreur de croire qu'une librairie js peut se manier sans connaissance de js. Et c'est pour ça que selon les cas il vaut mieux commencer par coder sois-même les fonctions pour comprendre le fonctionnement.

Si on compare avec le php, perso j'ai mal appris le php parceque je passais toujours par des frameworks ou des cms, et plus tard je me suis rendu compte que ce que je croyais faire plus simplement grace à l'API était en fait tout simple, voir plus simple à faire sans...

Connaitre bien les bases ça te permet de faire le choix entre la librairie ou non ou quelle librairie selon tes besoins.

Par exemple dans le cas du chat Ajax, j'ai essayé d'en faire un Smart-chat je crois qu'en tout ya pas plus de 6k de js et non compressé... Ceci il est encore un peu buggé.

L'autre fois avec l'aide de Koala64 ici on a fait un petit lecteur de flux : lecteur de flux, il y en a pour 3k.

Une requéte Ajax c'est pas forcement trés compliqué et dans le cas du chat c'est juste aller questionner la base réguliérement avec la même requéte.

C'est interressant et formateur de comprendre comment ça marche, et c'est sur que au bout d'un moment ça peut-être plus simple et plus rapide d'utiliser une librairie, au fait tu penses quoi de JQuery?
Modifié par matmat (20 May 2007 - 20:32)
pour les 30secondetu peux utiliser un setInterval
aprés pour le rafraichissement, perso je met ce que je dois raffraichir dans une div ensuite je fait une methode qui supprime cette div et ensuite en recréer une autre et la remplir avec une requete ajax
Salut,
je suis assez d'accord avec toi pour ce qui est de commencer par essayer de comprendre. J'aurais d'ailleurs même tendance à verser parfois dans l'excès inverse puisque je refuse carrément des boulots quand on me demande de les faire sur base de cms ou frameworks en php (l'essentiel de mon taf en fait). Faut dire aussi, je suis un peu snob et quand je regarde le source produit par ces trucs-là, ça me hérisse le poils, et du poil, il y en a sur le bétail Smiley smile

Dans le cas de js, j'avoue que c'est un peu différent, je m'étais penché dessus il y a longtemps et avait fini par ne plus vouloir en entendre parler à cause des galères de l'époque NN4 IE3/4 (ça remonte Smiley smile ).

Quand j'y suis revenu, assez récemment, rebelote, mes petites mains, des tutos et des bouquins... Mais là, j'avoue que mootools (après un détour par prototype/scriptaculous) m'a vraiment convaincu. Faut dire que perso, je reste très prudent sur le sujet, les choses sérieuses (manip de données, formulaires et autres), je les vois toujours côté serveur, js restant pour moi encore comme je le disais dans un post, une surcouche de luxe, plutôt dédiée à l'ergonomie et aux aspect plaisirs du truc mais sur laquelle je ne me repose jamais pour le fonctionnement général d'un site.

Alors c'est vrai que mootools me simplifie la vie en préparant une grande partie du taf mais, ça n'empêche que je pense comme toi, il vaut toujours mieux commencer par comprendre le fonctionnement général du langage, ce qu'il manipule, comment il le fait, etc, etc. Pour preuve, le nombre de gars sur le forum de mootools qui disent "j'ai repris l'exemple des démos tel quel et ça ne marche pas" tout simplement parce qu'ils pensent qu'écrire la fonction déclenche l'effet (sans penser d'ailleurs un instant au souk que ce serait si c'était le cas, le truc qui se déclenche tout seul quand il veut... Smiley smile ).

Dailleurs, je suis en train de méditer un truc mootools pour les débutants qui reprendrait ce genre de notions de base parce que c'est une réalité, beaucoup de gars mettent les doigts dans js pour la première fois à travers une librairie pour l'effet d'accordéon ou autre qu'il ont vu et veulent sur leur site.

Enfin je digresse Smiley smile d'autant que je crois que nous sommes complètement d'accord sur le sujet. Pour ce qui est de Jquery, j'y ai aussi jeté un oeil et j'avoue que plusieurs trucs m'ont bigrement séduit. Déjà rien que le poids !! la simplicité d'utilisation, des tas de plugins utiles et certains plutôt funs, et puis, évidemment, le truc obsessionnel chez moi, accéder aux éléments sans coller du js partout dans la page. Comme pour mootools la librairie a gravement muri et on est loin des requêtes "magiques" des débuts.

Le truc, c'est que comme je te le disais, je suis vraiment très très php et du coup, je freine un peu mes envis de toucher à tout pour une simple question de temps et j'essaye de comprendre à fond une librairie pour devenir vraiment efficace avec, mais je ne dis pas qu'un jour... Smiley smile

Allez, faut que je monte à la capitale, rv client Smiley smile

Have swing
Modérateur
Salut,

Rapidement... avant de proposer une bibliothèque, il pourrait être intéressant de se renseigner sur l'existant, vous ne trouvez pas ? Si la personne qui demande se sert déjà d'une bibliothèque et que vous lui proposez d'ajouter Prototype pour la mise à jour d'un bloc, n'avez-vous pas l'impression qu'il y a comme un truc qui cloche ? Smiley rolleyes ... sans compter qu'effectivement, c'est faisable sans librairie...
Modifié par koala64 (21 May 2007 - 16:14)
Surtout que c'est l'exemple même ou la librairie t'impose un fonctionnement qui ne correspond pas aux besoins, je m'explique:

Pour faire un chat il faut effectivement faire des requetes réguliéres pour voir si il y a des nouveaux messages, mais en cas d'activité il faut espacer ces requetes, de mon expérience avec le chat Ajax, c'est mieux.

Sauf que... Ajax updater de protype double le temps en cas d'inactivitée, ce qui fait que si t'es un peu lent à écrire ton correspondant aurat la reponse avec un délai excessif. Dans le cas du chat, il vaut mieux faire que le délai double seulement au bout d'un certain temps pour garder une fluidité dans la communication.

Je rajouterais également qu'un chat à juste besoin, de faire des requetes Ajax, ce serait donc utliser un dixiéme de la librairie...
Modifié par matmat (21 May 2007 - 16:33)
declink a écrit :
Bonjour tous le monde, je me heurte un à probleme que je n'arrive pas à resoudre d'où mon poste ici. J'ai fais quelques recherches sur Google et sur le forum j'avoue que je ne pige pas trop le comment du pourquoi, mon probleme est que je n'arrive pas à faire rafraichir une partie de ma page.
Je m'explique :
Ma page est constituée de plusieurs blocs, dont un que j'aimerais qu'il soit rafraichi toutes les 30 secondes ( c'est le bloc d'un tchat).
J'ai eu beau retourné le probleme dans tous les sens, je n'ai pas reussi.
Si qqn pourrait me fournir quelques pistes...


Hello,

pour un chat développé il y a un bail j'avais simplement utilisé un iframe que je reloadais toutes les 30 secondes. Pas de JS quoi.

Maintenant c'est vrai qu'avec Ajax... Smiley ravi
virtualgadjo a écrit :
Mais là, j'avoue que mootools (après un détour par prototype/scriptaculous) m'a vraiment convaincu.


Tu préfères Mootools à Prototype ? J'ai découvert le dernier récemment (première biblio ajax que je teste) et j'avoue que j'ai trouvé ça bien foutu. Maintenant je ne connais pas les autres bibliothèques...
Salut,
ben disons que mootools prend en charge effets/Dom/ajax etc là où pour faire la même avec prototype il faut ajouter scriptaculous et le poids commence à grossir un poil. Ceci dit, prototype est évidemment très bien faite (mootools avoue d'ailleurs sa filiation).

Dernier truc, je ne sais pas comment a évolué prototype sur le sujet mais une chose qui m'a franchement séduite avec mootools est l'obsession du js non obstrusif, l'attachement au DRY principle (do not repeat yourself) et l'élégance de la syntaxe. Ajoute à ça une communauté de développeurs et utilisateurs très active (voir le forum)... Mais encore une fois, prototype n'est pas pour rien la plus connue de la bande, elle est redoutable, existe depuis belle lurette et marche très bien.

Have swing