TourDeJeu, le réseau des jeux en ligne alternatifs : jeux web multijoueurs, jeux par forum. En savoir +

Flux RSS des discussions du forum : pour les joueurs, et pour les créateurs et MJ
  Reply to this topicStart new topicStart Poll

> Comment Rafraichir Une Partie De Page Seulement ?, (ex : Eclaircir Ma Connaissance Php)
chacal3
  Ecrit le : Mardi 22 Mars 2005 à 03h29
Quote Post


Ouf
*

Groupe : Membre
Messages : 296


Il y a une chose (notamment tongue.gif ) que je ne connais pas très bien en Php, c'est le "refresh" d'une partie seulement d'une page...

Jusqu'à maintenant, dans mes sites Php, je relance la page entièrement à chaque clic, hors j'ai déjà vu des sites qui ne rafraichissait qu'une partie de la page comme une fenètre seulement...(et c'est pas des frames, c'est sur)

Je trouve cette technique fabuleuse mais j'arrive pas à trouver quel est le code à utiliser ??? huh.gif

Vous pouvez m'indiquer la direction ? (si c'est bien du php car apparement, ça l'est)


--------------------
Vous pouvez m'appeler MAAAÎTRE, je ne me vexerai pas... :)
PMEmail Poster
Top
naholyr
Ecrit le : Mardi 22 Mars 2005 à 09h28
Quote Post


Ouf
*

Groupe : Membre
Messages : 423


Il n'y a rien de magique, il n'y a que 3 solutions pour obtenir cet effet:

- une iframe.

- des "pseudo-frames" (on utilise toujours le même modèle, et on a simplement un <?=$contenu?> dans la zone principale), cela revient à recharger toute la page à chaque fois, mais si la page est légère et que le navigateur gère bien son cache (je pense que ça a du t'arriver avec FireFox smile.gif ), ça donne un affichage très rapide qui donne l'impression de n'avoir rechargé que la partie principale.

- du flash, un activex, un applet, etc... mais là je pense que tu t'en serais rendu compte.
PMEmail PosterUsers WebsiteICQYahoo
Top
gorgu
Ecrit le : Mardi 22 Mars 2005 à 10h29
Quote Post


Ouf
*

Groupe : Membre
Messages : 417


détail de l'iframe.

en fait tu crée une toute petit page en php qui rentrera dans un cadre (iframe)
tu nommera ton iframe par un nom style name=boudecran

ensuite tu place sur ta grande page
des liens href=tonpetitscript.php?jenesaiskoi target=boudecran

ou des formulaires avec pour action=tonpetitscript.php et pour target=boudecran


--------------------
enfin je crois ...
Adept JDR
PMEmail PosterUsers Website
Top
pascaltje
Ecrit le : Mardi 22 Mars 2005 à 11h26
Quote Post


Ouf
*

Groupe : Membre
Messages : 242


regarde du coté de XmlHttpRequest sur toutjavascript.com, tu vas trouver ton bonheur smile.gif

La technique est plus "propre" qu'une frame, mais il faut tater du javascript sad.gif

Coté compatibilité, IE, mozilla, firefox et quelques autres sont OK.

Coté code, c'est du javascript qui envoie une requete http et recupere le resultat ( pour l'afficher par exemple dans un div ) . ça donne des résultats du style "application en local" ( = pas de refresh qui déteriore l'affichage lors de l'appel de page) sur des données web ( serveur central ).
Le résultat est sympa, mais coté code il faut être rigoureux et savoir récupérer les valeur d'éléments de formulaires via javascript.

A+

Pascal



--------------------
PMEmail PosterUsers Website
Top
Oelita
Ecrit le : Mardi 22 Mars 2005 à 11h28
Quote Post


Alien
*

Groupe : Admin
Messages : 1589


C'est un sujet très intéressant, qui mériterait un sujet de topic plus explicite wink.gif


--------------------
Oëlita la Gentille Hérétique
Admin TourDeJeu
user posted image

Le moyen le plus efficace pour me contacter ? @Oelita sur Twitter
PMEmail PosterUsers Website
Top
naholyr
Ecrit le : Mardi 22 Mars 2005 à 12h01
Quote Post


Ouf
*

Groupe : Membre
Messages : 423


QUOTE (pascaltje @ 22 Mar 2005, 11:26 )
regarde du coté de XmlHttpRequest sur toutjavascript.com, tu vas trouver ton bonheur smile.gif

La technique est plus "propre" qu'une frame, mais il faut tater du javascript sad.gif

Coté compatibilité, IE, mozilla, firefox et quelques autres sont OK.

Coté code, c'est du javascript qui envoie une requete http et recupere le resultat ( pour l'afficher par exemple dans un div ) . ça donne des résultats du style "application en local" ( = pas de refresh qui déteriore l'affichage lors de l'appel de page) sur des données web ( serveur central ).
Le résultat est sympa, mais coté code il faut être rigoureux et savoir récupérer les valeur d'éléments de formulaires via javascript.

A+

Pascal

Toi, il va falloir que tu nous expliques tout ça en détails wink.gif
PMEmail PosterUsers WebsiteICQYahoo
Top
pascaltje
Ecrit le : Mardi 22 Mars 2005 à 12h41
Quote Post


Ouf
*

Groupe : Membre
Messages : 242


bon alors on en parle ici entre développeurs PHP:
http://www.phpfrance.com/forums/voir_sujet-511.php

et pour un tutorial orienté jeux, on va attendre la fin de mon déménagement wink.gif

ce qui est sympa et non négligeable avec cette technique c'est:
- chercher l'info uniquement (et pas les menus autour) = gain en bande passante
- l'effet "application sans refresh pas beau"
- la possibilité de lancer une tâche d'arrière plan (ex: toutes les minutes vérifier si les contacts du joueur sont connectés, et si oui l'indiquer et permettre une discussion)

A+

Pascal


--------------------
PMEmail PosterUsers Website
Top
naholyr
Ecrit le : Mardi 22 Mars 2005 à 13h34
Quote Post


Ouf
*

Groupe : Membre
Messages : 423


Je vois immédiatement un nombre incroyable d'applications smile.gif
Je n'aurais jamais pensé JS capable de ça, et pourtant ça m'a souvent manqué...

On peut maintenant faire un jeu quasiment entièrement en JS, les éléments côté serveur se limitant vraiment uniquement au calcul, même les "pseudo-frames" peuvent être gérées par Javascript smile.gif

Je commence dès aujourd'hui la réécriture de mon jeu avec cette techno (j'en profite qu'il n'est pas très avancé biggrin.gif), je ne perds aucun navigateur, puisque j'utilisais déjà beaucoup de JS.

Edit: http://xulfr.org/wiki/ApplisWeb/Request
PMEmail PosterUsers WebsiteICQYahoo
Top
Haiken
Ecrit le : Mardi 22 Mars 2005 à 14h04
Quote Post


Ouf
*

Groupe : Membre
Messages : 360


Pour ceux qui cherchent un peu de facilité, il existe déjà des librairies :
JPSPAN qui permet d'appeler des fonctions php à partir du javascript (RPC)
JSOLAIT qui permet de passer des appels XML-RPC en javascript (on peut utiliser les fonctions xml-rpc de php côté serveur, mais il en existe aussi dans d'autres langages comme le java)


--------------------
PMEmail Poster
Top
gorgu
Ecrit le : Mardi 22 Mars 2005 à 14h12
Quote Post


Ouf
*

Groupe : Membre
Messages : 417


ben je vais vous décevoir, j'ai suivi vos liens cliqué sur tous les tests imaginables, firefox n'en reussit pas beaucoup.

Si vous voulez avoir un élément du même style, il existes aussi la toute petite iframe qui va nous renvoyer un javascript d'update d'un div de la page parent et cela fonctionne partout.

pour l'info du début. je n'y ai pas pensé tout à l'heure mais dans smiles war (voir ma signature) tu as la partie jeu qui fonctionne avec iframe.


--------------------
enfin je crois ...
Adept JDR
PMEmail PosterUsers Website
Top
naholyr
Ecrit le : Mardi 22 Mars 2005 à 14h22
Quote Post


Ouf
*

Groupe : Membre
Messages : 423


Je n'ai pas testé, mais en effet je pense que là on sombre dans le syndrome de l'usine à gaz qui veut tout savoir faire, et qui finit par avoir trop de bugs.
Mais tout simplement, pouvoir appeler une page avec du javascript, et pouvoir en récupérer la source, c'est tout de même plus propre, et plus facile à conceptualiser (et donc à débugger) que la petite iframe. Elle rend certes bien des services, mais ça finit par être un peu lourd pour le serveur cette petite chose qui se recharge toutes les X secondes wink.gif

Là javascript va pouvoir récupérer l'entête, ce qui signifie qu'on va pouvoir jouer avec un header('Last-modified') de façon optimale, et que le navigateur gère correctement ou non son cache, on n'en a plus rien à faire: si rien n'est à mettre à jour, on ne va pas plus loin smile.gif

De même on peut récupérer le status de la requête: 200, 404, 301, etc... Cela ouvre quelques possibilités supplémentaires non ?

C'est un exemple qui me vient à l'esprit, mais il doit y avoir plein d'applications auxquelles on ne pense pas immédiatement, et qui sont bien plus propres à mettre en place avec cette méthode qu'avec une page qui se rafraichit constamment (que ce soit la page principale ou une iframe cachée). D'autant plus que j'avais entendu parler il y a un an ou deux d'applications qui permettrait de détecter et empêcher l'affichage des images et/ou frames de 0 pixels. Bon heureusement les parano n'ont pas non plus trop d'influence, mais quite à utiliser du javascript (la petite iframe c'est gentil, mais il faut quand-même du js quelque part), autant le faire avec les fonctions qu'il faut wink.gif

Pour les suspicieux, firefox sécurise la fonction XMLHttpRequest.open() en interdisant son appel si le second paramètre désigne une url extérieure au serveur local (donc si vous voulez faire un xmlhttp.open("GET", "http://www.google.fr") depuis votre site, les FFeux auront une erreur Erreur : uncaught exception: Permission refusée d'appeler la méthode XMLHttpRequest.open alors que les IEeux n'auront pas de problème).

Je n'ai pas trouvé s'il était en projet que cette méthode devienne "officielle" (comme document.write qu'on peut considérer comme faisant partie du JS "standard") ?
PMEmail PosterUsers WebsiteICQYahoo
Top
pascaltje
Ecrit le : Mardi 22 Mars 2005 à 15h00
Quote Post


Ouf
*

Groupe : Membre
Messages : 242


A propos de compatibilité...

je pense qu'il faut faire des choix:
- soit peu ou pas de javascript pour gérer des navigateurs rares ou anciens;
- soit javascript à fond, quitte à mettre quelques navigateurs de coté... et ainsi obliger leur propriétaire à mettre à jour leur navigateur vers des versions récentes.

c'est la logique du jeu video sur PC: il faut la dernière carte graphique + le processeur qui suit, sinon on ne joue pas.

c'est sûr, on laisse des joueurs potentiels de coté, mais au moins on a un jeu plus évolué que la moyenne (tout le monde n'a pas les moyens de faire du flash sad.gif )


--------------------
PMEmail PosterUsers Website
Top
chacal3
Ecrit le : Mardi 22 Mars 2005 à 17h22
Quote Post


Ouf
*

Groupe : Membre
Messages : 296


J'ai bien fait d'avoir lancer le sujet car j'apprend plein de choses ! tongue.gif

En plus, je crois que cela va servir à pas mal d'entre nous ! cool.gif


--------------------
Vous pouvez m'appeler MAAAÎTRE, je ne me vexerai pas... :)
PMEmail Poster
Top
naholyr
Ecrit le : Mardi 22 Mars 2005 à 17h25
Quote Post


Ouf
*

Groupe : Membre
Messages : 423


Okay, alors donc smile.gif

J'ai découvert l'existence de ce truc ce matin, et j'ai appris à faire de l'objet en javascript il y a une heure, donc si j'ai fait d'énormes bourdes, il serait bon que quelqu'un qui s'y connaisse mieux corrige, mais j'ai bon espoir d'avoir produit une bonne base.

L'idée c'est de faire une classe d'abstraction pour XmlHttpRequest, la voici:
QUOTE
class URL


#ctor ( string url [, string method [, array args ] ] )
Constructeur.
url est l'adresse de la page à appeler.
method est la méthode d'appel: "GET" ou "POST".
args est la liste des arguments à passer: un tableau de tableaux [nom,valeur].

string encodedArgs ( )
renvoie la version encodée (arg1=val1&arg2=val2...) des arguments à passer à la page.

setArg ( string name , string value )
Ajoute un argument à passer à la page.
name est le nom de l'argument à ajouter/modifier.
value est sa valeur.

boolean load ( [ boolean background [, function call_after ] ] )
Appelle la page.
background définit si l'on doit appeler la page en arrière-plan, ou attendre qu'elle soit chargée avant de continuer.
call_after est la fonction qui sera appelée une fois la page chargée. Cette fonction prend un seul argument: l'objet qui l'a appelée (de la classe URL).


array args
La liste des couples [nom,valeur] à passer à la page.

source source
Définie uniquement si la page a été chargée avec succès: il s'agit du code source de la page appelée.

boolean loaded
Faux tant que la page n'a pas été chargée avec succès.

string status
Contient le status de la connexion à la page (si tout va bien: "200").

string url
L'adresse de la page chargée.

string method
La méthode d'accès à la page ("GET" ou "POST").

string error
Contient le message d'erreur si jamais load() a renvoyé false.


Le code de cette classe: http://naholyr.free.fr/xmlhttprequest.js

Et enfin une 'tite démo:
http://naholyr.free.fr/xmlhttprequest_true.html (chargement en fond)
http://naholyr.free.fr/xmlhttprequest_false.html (chargements successifs)
Et le source de "xmlhttprequest.php" correspondant:
CODE
<?php
   echo $method=getenv('REQUEST_METHOD');
   print_r(${'_'.$method});
?>


Edit: testé avec IE 6.0 et FF 1.0

Edit(2) pour ceux qui ont la flemme de voir les démos:
CODE
url = new URL("mapage.html");
url.load();
alert(url.source); // affiche la source de "mapage.html"

CODE
url = new URL("monformulaire.php", "POST");
url.setArg("nom", "mon nom");
url.load();
alert(url.source); // affiche la source de "monformulaire.php"
// avec la variable nom = "mon nom" envoyée par POST.
QUOTE
development at acriba dot at wrote:
I just found out, that you can use serverside sessions with XMLHttpRequest. Cookies are set automatically, you don't have to do any extra work. Isn't that wonderful?
Classe smile.gif
PMEmail PosterUsers WebsiteICQYahoo
Top
pascaltje
Ecrit le : Mardi 22 Mars 2005 à 18h51
Quote Post


Ouf
*

Groupe : Membre
Messages : 242


allez hop! les mains dans le cambouis!

pour ma part, j'ai repris la classe de robloche sur toutjavascript.com (classe utilisée pour son morpion)

j'ai ajouté un attribut: divid qui correspond à l'id du div (calque) cible;

La fonction process de base (appelée par check) tape la cible si le résultat est revenu.

ensuite j'ai trouvé un artcile en anglais sur une calculatrice fonctionnant au XHR.

Pour les formulaires, la balise form doit etre:
form onsubmit="return fonction_de_soumission()"

avec fonction_de_soumission la fonction javascript qui appelle la page:
CODE

function fonction_de_soumission() {
// recuperer les variables
// preparation de l'envoi des données
// envoi
// settimeout sur la fonction qui affichera
return false; // pour evityer la soumission
}


voila en gros, exemples plus précis à l'occasion wink.gif



--------------------
PMEmail PosterUsers Website
Top
naholyr
Ecrit le : Mardi 22 Mars 2005 à 21h14
Quote Post


Ouf
*

Groupe : Membre
Messages : 423


Je surenchéris tongue.gif
Déjà, j'ai renommé ma classe HttpRequest.
Avec l'utilisation de la bibliothèque (dont je ne connais pas l'auteur) que je trimballe depuis quelques temps maintenant, j'ajoute une fonction d'affichage dans un layer (il suffit de donner le nom du layer à l'attribut "layer" de l'objet HttpRequest). J'ajoute également une fonction de traitement de formulaire générique.

Les fichiers:
http://naholyr.free.fr/XHR/layerAccess.js
http://naholyr.free.fr/XHR/httpRequest.js
Démo: http://naholyr.free.fr/XHR/index.html

Have fun smile.gif
PMEmail PosterUsers WebsiteICQYahoo
Top
Ludvig
Ecrit le : Lundi 28 Mars 2005 à 20h10
Quote Post


Pro
*

Groupe : Membre
Messages : 109


Hello !

Je ne sais pas si je reponds vraiment a la question initiale, mais
ca m'a l'aire bien compliqué tout ça blink.gif

J'ai une function :

CODE
function refreshFrame($target,$url){
echo"<script language=\"JavaScript\" type=\"text/javascript\">
parent.$target.location.href=\"$url\"
</script>";
}


puis j'ai mon jeu en 'frames' puis je peux donc
envoyer n'importe lequel page php/html dans un
de mes frames avec par exemple :

refreshFrame("mainFrame","vue.php?show=vue");

pour mettre la page vue.php dans la frame centrale.


Bon, pas très compliqué tout ça, mais comme
je trouve ça très pratique... puis ca marche
bien avec Mozilla/FF/IE/...


Edit : C'est en php tout ça...


--------------------
user posted image
PMEmail Poster
Top
pascaltje
Ecrit le : Jeudi 31 Mars 2005 à 16h21
Quote Post


Ouf
*

Groupe : Membre
Messages : 242


L'idée derrière XmlHttpRequest est de rafraichir une partie quelconque de la page, sans forcément passer par des frames.

Et une fois la fonction prise en main, ça va bien à programmer smile.gif


--------------------
PMEmail PosterUsers Website
Top
Ludvig
Ecrit le : Jeudi 31 Mars 2005 à 21h36
Quote Post


Pro
*

Groupe : Membre
Messages : 109


Arf, oui, j'ai même regardé quelques exemples vraiment pas mal !

Perso, je vais rester simple laugh.gif car je maitrise pas tout ça (en plus
j'ai trop peur de plus être compatible).


/Lud

ps. ça va pas être bloqué dans la cache des fois ?


--------------------
user posted image
PMEmail Poster
Top
L_abruti
Ecrit le : Mardi 03 Mai 2005 à 16h11
Quote Post


Kid
*

Groupe : Membre
Messages : 19


Juste un truc, vous pensez bien à laisser les fonctions de base des jeux accessibles même sans js ?
Je veux dire, même dans FF 1+, Opera 7+, Netscape 6+, IE 6+ etc. y a moyen de désactiver le javascript. Et certains joueurs dont je fait partie ont tendance à le faire pour ne plus supporter tous ces "petits gadgets à pub qui te pourrissent la vie".
Bref, c'est toujours sympa quand on tombe sur un site, certes moins beau mais toujours utilisable une fois le js désactivé.
PMEmail Poster
Top
bibi.skuk
Ecrit le : Mercredi 04 Mai 2005 à 19h21
Quote Post


Pro
*

Groupe : Membre
Messages : 64


QUOTE (L_abruti @ 3 May 2005, 15:11 )
Juste un truc, vous pensez bien à laisser les fonctions de base des jeux accessibles même sans js ?
Je veux dire, même dans FF 1+, Opera 7+, Netscape 6+, IE 6+ etc. y a moyen de désactiver le javascript. Et certains joueurs dont je fait partie ont tendance à le faire pour ne plus supporter tous ces "petits gadgets à pub qui te pourrissent la vie".
Bref, c'est toujours sympa quand on tombe sur un site, certes moins beau mais toujours utilisable une fois le js désactivé.

les jeux via browser essayent de plus en plus d'utiliser toutes les technologies disponibles pour pouvoir avoir des jeux jolis/rapides/legers, le JS fait parti de ce type de technologies.

si tu veux jouer, il va devoir malheuresement pour beaucoups de jeux reactiver JS...

[edit] une gestion de map entirement en JS, ca existe...
PM
Top
gorgu
Ecrit le : Mercredi 04 Mai 2005 à 22h58
Quote Post


Ouf
*

Groupe : Membre
Messages : 417


pour ma part j'evite au maximum le javascript... mais la mort de l'iframe dans le xhtml me fait peur wink.gif


--------------------
enfin je crois ...
Adept JDR
PMEmail PosterUsers Website
Top
Anthor
Ecrit le : Lundi 12 Septembre 2005 à 21h15
Quote Post


Kid
*

Groupe : Membre
Messages : 35


Cette technique est pas mal personnellement je m'en sers pour rafraichir mon chat ^^

Mais aussi pour faire evoluer la position des joueurs envirronant... ou alors les HP/MP...

Bref beaucoup d'utilité mais très difficile a aborder la premiere fois.


--------------------
PMEmail Poster
Top
zumba
Ecrit le : Mardi 13 Septembre 2005 à 18h53
Quote Post


Ouf
*

Groupe : Membre
Messages : 496


haha un sujet qui m'intéresse !

personellement j'ai découvert l'injection de contenu cet été et je ne jure plus que par ca, j'ai d'ailleurs refais toute mon interface (qui compportait 9 iframes tout de meme, générant donc 10 connexions simultanées à l'allumage) grâce aux techniques de remote scripting.
Ca consiste a remplacer ses iframes par des divs ou tout ce qui peut contenir un innerHTML affiché, de récuper le code géneré par l'exécution d'une page dans une variable js et de balancer cette variable dans l'objet DOM

J'ai pondu 2 libs JS pour gerer ca intelligement, avec file d'attente, traitement d'erreur, etc... C'est pas encoretout a fait mature, il reste des cas limites mais c'est quand même un énorme progrès.

La première s'appuyait sur un iframe caché et triggeré sur le loadcomplete, et l'autre sur l'objet xmlhttprequest. Les 2 sont très proches mais avec qq différences. Globalement le xmlhttprequest est le mieux
Attention ca n'est pas si simple comme technique, il revoir tous ses liens . Dans certains cas on arrive aux limites des navigateurs (j'ai trouvé le moyen de vautrer a coup sur IE 6 avec, Firefox lui requiert des temporisations car il se plante si ca va "trop vite"... quid de la création des objets DOM à la volée lors de l'injection) Bref que des trucs pas forcément évident qu'on découvre un peu de manière empirique. La question de l'execution du javscript (et de l'attachement de nouveaux objets logiques à la page) géneré par le remote est aussi très épineuse, encore plus dans un iframe parent qui a donc un contexte d'exécution fils par rapport au contexte des affichages. Reste enfin la question de la soumission des forms, des charsets...

Mais en dehors de ca c'est du bonheur complet. Outre la réduction des connexions, des volumes des échanges - on observe un gain réel des perfs. L'ergonomie aussi y gagne, on peut parallèliser des actions, plus besoin d'attendre que A soit validée côté serveur pour lancer B (sauf si B dépend de A bien sûr), on peut contrôler totalement les affichages de ses "morceaux de page", par exemple griser un formulaire en cours de soumission, faire du déboguage "à chaud" du code injecté... raaaaah c'est trop bon.

Je suis intimement persuadé que c'est LA technique pour faire une interface web de JEU (je ne parle pas de flash ou autre plugin). Si un jour j'ai le temps j'écrirai un article là dessus.

et je tiens a confirmer ca :
QUOTE
[edit] une gestion de map entirement en JS, ca existe...

ma carte est entièrement en JS et elle est loin d'être nase. Et là encore du bonus pour le remorte scripting : mon moteur bufferise une zone de 200*200. Avant, quand on sortait de la zone, le script de map se rechargeait entièrement avec la nouvelle zone. Maintenant, je ne vais que chercher le nouveau buffer, soit peut être 10% en ressource (bande passante, mémoire, CPU) de ce que demandait le chargement complet.
Illustration typique du gain de perf lié au remote scripting.




--------------------
Z
PMEmail Poster
Top
Grouik
Ecrit le : Vendredi 16 Septembre 2005 à 00h35
Quote Post


Unregistered






Bref, de l'Asynchronous JavaScript And XML.

On en trouve déjà sur des sites professionnels (je pense à la RATP par exemple) mais par petites touches.

Vu le gros intérêt ergonomique couplé aux problèmes techniques (liés à l'utilisation du JavaScript) ça va devenir de plus en plus répandu, ce qui promet de beaux arrachages de cheveux aux développeurs whistling.gif
Top
« Sujets + anciens | Design et graphismes | Sujets + récents »

Reply to this topicStart new topicStart Poll