[AJAX] Lancer un script PHP au passage de la souris !

Version imprimable

27/08/2006, 01h26
DiabolO

[AJAX] Lancer un script PHP au passage de la souris !

Bonjour,

Voila tout est dit dans l'intitulé du topic, je voudrais savoir s'il était possible de lancer un script php au passage de la souris ?

Merci d'avance !
27/08/2006, 01h31
titoumimi

tu n'es pas dans la bonne section, ça va se passer en javascript, et vraissemblablement ajax même ;)

En effet le passage de souris est un évènement sur le poste client, qui n'a donc à ce moment à pus aucune interraction avec le PHP. Il faudra sans doute déclencher ton évènement sur le onmouseover, je te laisse regarder la suite :)
27/08/2006, 09h28
javatwister

salut

peux-tu dire en 2 mots l'effet recherché?

sur quoi passe la souris?
quel est l'objectif du script php?
27/08/2006, 15h03
DiabolO

Bonjour,

En fait, si je voulais que ce soit un script PHP qui se lance au passage de la souris c'est parce que celui-ci va chercher des informations dans une base de donnée MySQL ! Ce script doit interagir avec MySQL c'est pour cette raison que je voulais qu'il soit codé en PHP!

En fait pour que ça puisse marcher il faudrait que le passage de la souris sur une zone se comporte comme-ci on avait cliqué sur cette zone car un script PHP s'execute du coté serveur ! Le souci c'est que la page sera autmatiquement rechargé et l'effet voulu perdu... Je viens de me rendre compte que ce n'est pas possible du fait que php s'execute du coté serveur !!!

Je compredns maintenant pk mon topic a été déplacé dans le forum JAVASCRIPT :mrgreen: :mrgreen:

Merci bpc !!
27/08/2006, 15h12
Nasky

Tu peux ouvrir une nouvelle fenêtre en JavaScript lors du passage et exécuter le code PHP sur celle-ci.

Nas'
27/08/2006, 15h34
javatwister

si tu détailles un peu encore, je t'assure que tu pourras exécuter ton traitement sans rechargement ;)
27/08/2006, 16h52
DiabolO

Ah vous m'intriguez là !!!

En fait je souhaite developper une application permettant de reserver des courts de tennis en ligne !

L'utilisateur choisit une tranche horaire sur le planning (En l'occurence, un tableau !!) à l'aide de 2 curseurs. Lorsqu'il positionne sa souris sur la zone entre les 2 curseurs, je voudrais qu'un script se declenche et calcul si cette reservation est optimale (c'est à dire que le temps de jeu dans la journée pour ce terrain reste maximum.)
Une fois ce script executé, la zone entre les 2 curseurs apparait en vert et informe que cette tranche horaire peut être reservée. Dans le cas contraire cette zone apparaît en rouge et informe que cette reservation n'est pas possible et qu'il serait préférable de decalé la réservation de 30min).

Biensûr j'aurais pu faire en sorte que les reservations se fassent seulement aux heures pleines pour éviter de telles complications !

j'espère que j'ai été clair et merci pour vos réponses si rapide !!
27/08/2006, 18h12
javatwister

d'accord pour le principe;

attention, il ne faut pas que la fonction javascript soit trop "réactive" histoire de ne pas gêner l'affichage ou le déplacement des curseurs; en fait, un clic dans la zone serait plus adapté;

à part ça, tu déplaces comment tes curseurs? tu peux donner le code html / js (en gros)?

et tu envoies en paramètre vers MySQL les 2 valeurs correspondant à heure de début de plage / heure de fin de plage?
et comment détermines-tu si le créneau est assez long? ça ne se voit pas directement sur le tableau?

excuse-moi pour toutes ces questions indiscrètes :lol:
27/08/2006, 20h29
DiabolO

Je suis d'accord pour le clic dans la zone ! Et puis ça evitera aussi des interactions non souhaitées avec la base de donnée ce qui peut devenir couteux !

Bon sinon je n'ai pas encore rien codé du tout car il y a des trucs que je ne sais pas encore faire et puis pour l'instant je mets toutes les conditions sur papier pour y voir plus clair !

Ce que je ne sais pas faire par exemple ce sont les curseurs mais je peux te dire ce que j'entends par curseurs ! En fait c'est exactement le même curseur que celui qui permet d'agrandir ou de diminuer l'echelle dans google earth voir ici
Une fois que le premier curseur est positionné le deuxième ne pourra se déplacer qu'avec un pas correspondant à 1h de jeu! Où même, il pourra se déplacer par pas de 30min, car au clique sur cette zone, le script lui interdira de reserver sur cette tranche car la tranche horaire ne sera pas comprise entre 1h et 2h par exemple !

Pour le script php:

1- Le script php prends en paramètre l'heure de début et l'heure de fin
3-Si pas compris entre 1h et 2h alors on retourne false
4-Si ok, Il calcule sans compter cette reservation le temps de jeu maximum pour ce terrain et sur la journée entière
5-Ensuite il fait le même calcul mais cette fois ci en prenant en compte la reservation en paramètre
6-On compare les 2 chiffres !

Pour calculer le temps de jeu max dans une journée il va falloir récupérer dans la base de donnée les reservations (heure de début et heure de fin de chaque reservation pour le terrain et la journée)

Je sais pas si j'ai été clair mais bon... :roll:

Merci encore et n'hésite pas à me poser des questions même indiscretes :D
27/08/2006, 20h35
javatwister

hum...

je ne vois pas bien le rapport avec le curseur de googleEarth 8O

et sinon, l'interface sur laquelle le client choisit, c'est un tableau html, non?
27/08/2006, 20h57
DiabolO

Oui c'est bien un tableau HTML !!

Au dessus du tableau il y aura 2 curseurs au niveau des horaires que tu pourras déplacer horizontalement ! Tu ne vois tjrs pas de quoi je veux parler?
27/08/2006, 22h17
Sergejack

En même temps, si ce ne sont pas trop d'informations, tu peux mettre à disposition du client (et donc de javascript) toutes les infos nécessaires.
Comme ça au moins tu ne te soucies plus des temps de réactions du client au serveur ainsi éliminés. (donc si il y a 10 cases de réservation, précalculer et précharger ce qu'il faut au chargement de la page).
27/08/2006, 22h41
javatwister

bah, là il me faut vraiment un aperçu parce que je vois pas;
28/08/2006, 01h20
DiabolO

Voici un dessin !
J'espère que ce sera plus clair avec ! ( Pas de commentaire sur le coloriage svp :mouarf: )

Citation:

n même temps, si ce ne sont pas trop d'informations, tu peux mettre à disposition du client (et donc de javascript) toutes les infos nécessaires.
Comme ça au moins tu ne te soucies plus des temps de réactions du client au serveur ainsi éliminés. (donc si il y a 10 cases de réservation, précalculer et précharger ce qu'il faut au chargement de la page).

Et si l'utilisateur a désactivé js sur son navigateur ? Je voudrais que même les utilisateurs ayant désactivés js puissent utiliser l'application.. Il faudrait aussi que celle-ci soit utilisable sous firefox et sous ie !
28/08/2006, 09h44
FremyCompany

Si pas JS, pas d'interactivté... c'est simple comme bonjour...
28/08/2006, 10h36
Sergejack

Personnelement, je me fous pas mal des utilisateurs qui désactivent Javascript, avec la logique "aux plus grandes les possibilités au plus grand le risque" personne n'ouvrirait jamais un excécutable, on retrournerait dans les arbres, et on aurait une peur bleue des silexs.

JavaScript permet de mieux servir les intérêts des internautes, alors qu'ils ne crachent pas desssus sous prétexte que rarement cela pourrait les déservir.

Une solution JS et non JS peuvent-être totallement éloignées, impliquants deux développements distincts XD
28/08/2006, 10h59
SpaceFrog

à part ajax, je ne vois pas comment éviter une usine à gaz qui de toute façon impliquera javascript !

les désactiveurs de javascript sont à ranger au rayon des paranos ... :roll:
28/08/2006, 11h03
FremyCompany

Citation:

Envoyé par SpaceFrog

à part ajax, je ne vois pas comment éviter une usine à gaz qui de toute façon impliquera javascript !

les désactiveurs de javascript sont à ranger au rayon des paranos ... :roll:

Et de toute facon, ils sont très peu nombreux... plus ou moins 1%... (selon les statistique du serveur de mon père...)
28/08/2006, 11h07
SpaceFrog

les stats d'un seul serveurs sont souvent biaisées du fait qu'un seul serveur reçoit en général une seule sorte de clients ...
mais le pourcentage reste faible ...
28/08/2006, 11h47
javatwister

salut

bon, c'est clair que tu n'as pas besoin d'un appel dynamique à la db pour déterminer si un créneau est libre; et pas non plus d'un "curseur!";

ce que je te propose, c'est composer les zones vertes / rouges de ton tableau à partir de MySQL au chargement: le client n'aura qu'à regarder pour voir le planning et s'inscrira forcément dans une plage libre, san avoir à bouger un curseur :lol:
29/08/2006, 00h32
DiabolO

Bonjour à tous !

Citation:

Et si l'utilisateur a désactivé js sur son navigateur ?

Lol apparemment ce n'est pas un truc à dire sur un forum JS :mouarf: :mouarf:

Citation:

bon, c'est clair que tu n'as pas besoin d'un appel dynamique à la db pour déterminer si un créneau est libre;

Je ne souhaite pas déterminer si un créneau est libre mais plutôt savoir si un créneau qui est libre peut-être utilisé ou pas !! (Oui je sais ça paraît un peu débile ce que je viens de dire mais ça ne l'est pas...)

Exemple :

Mon application permet de reserver un court de tennis au début de chaque heure à partir de 8h jusqu'à 22h mais aussi au milieu de chaque heure (On peut très bien reserver un court de 8h à 9h mais aussi de 8h30 à 9h30 par exemple).
Admettons maintenant qu'un joueur reserve un court de 13h30 à 15h30. Un autre pourrait très bien reserver un court de 12h à 13h. Or entre 13h et 13h30 il n'est pas possible de reserver un court. Donc on perd 30 min de jeu dans la journée. Et si tout le monde procède ainsi on peut facilement perdre 3h de jeu dans une journée. Et ça c'est un problème pour moi !
Ce problème n'existerait pas si toutes les reservations se faisaient seulement au début de chaque heure. Mais ce n'est pas le cas ici ..
Donc pour régler ce problème j'ai décidé d'interdire aux utilisateurs de reserver sur un créneau susceptible de laisser des trous dans le planning (En fait ce n'est pas très efficace comme solution si on regarde de près..enfin bref!!)

Il n'est pas possible de determiner à l'avance les zones vertes puisque le planning peut être découpé de plusieurs façon différentes. En effet un joueur peut reserver un court pour 1h 1h30 ou 2h ! c'est pourquoi j'ai eu l'idée des curseurs. En fait n'importe quel moyen de sélection sur le plannning ferait l'affaire !

Bref la meilleure solution pour le moment et selon moi est celle proposée par Nasky au début de ce topic .

QQn a une idée pour faire ce genre de curseur ?

Merci encore bonne soirée
29/08/2006, 08h37
javatwister

ben pourtant, ça me paraît jouable de proposer le tableau des créneaux directement !

mettons un planning vierge:
1) le premier client peut s'inscrire 1h , 1h30 ou 2h;
2) on lui interdit seulement les créneaux qui font perdre 30mn en début ou fin de journée;
3) le second client et tous les autres s'inscrirent également pour 1h , 1h30 ou 2h;
4) On leur interdit les créneaux qui font perdre 30mn en début de journée, fin de journée, et entre chaque réservation;
5) qu'est-ce qui ne va pas dans cette logique?
6) une option possible: au chargement, le tableau présente les créneaux utilisés (rouge); le client sélectionne dans un menu quelconque 1h, 1h30 ou 2h et valide: la page se recharge en lui présentant les seuls créneaux disponibles (autrement dit, il y a plus de zones rouges, voire, que du rouge);
enfin, le client clique zur l'une des zones possibles _ peut-être après avoir changé son voeu initial _ et son inscription est validée.
Pour les 2 échanges client / serveur (vérification des créneaux pour une durée et inscription) tu as le choix entre une soumission de formulaire classique (rechargement de page = communication html/php) et un envoi des données en arrière-plan (pas de rechargement = communication js/php);
29/08/2006, 17h31
javatwister

tiens, tout bien réfléchi, c'est rigolo de goupiller le script en js et de ne servir de MySQL que pour les validations ;)
29/08/2006, 20h49
DiabolO

Citation:

mettons un planning vierge:
1) le premier client peut s'inscrire 1h , 1h30 ou 2h;
2) on lui interdit seulement les créneaux qui font perdre 30mn en début ou fin de journée;
3) le second client et tous les autres s'inscrirent également pour 1h , 1h30 ou 2h;
4) On leur interdit les créneaux qui font perdre 30mn en début de journée, fin de journée, et entre chaque réservation;
5) qu'est-ce qui ne va pas dans cette logique?

Jusqu'ici on est d'accord !! :)

Citation:

au chargement, le tableau présente les créneaux utilisés (rouge); le client sélectionne dans un menu quelconque 1h, 1h30 ou 2h et valide: la page se recharge en lui présentant les seuls créneaux disponibles (autrement dit, il y a plus de zones rouges, voire, que du rouge);
enfin, le client clique zur l'une des zones possibles _ peut-être après avoir changé son voeu initial _ et son inscription est validée.

En gros: si le client veut jouer 1h, le tableau affichera tous les créneaux d'1h disponibles. S'il choisit 2h, le tableau affichera tous les créneaux de 2h disponibles ?
30/08/2006, 08h42
javatwister

oui!

par contre, si tu peux reproduire ici la routine qui vérifie les créneaux côté serveur, ça m'intéresse :)

voici un brouillon très réduit (une demi-journée complètement fictive, hors calendrier);

en fait, j'affiche en rouge les créneaux déjà pris et la réponse (oui / non) dépend de la durée choisie;
j'ai remplacé la phase de validation par une simple alerte mais c'est tout comme;

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>...</title>
 
<style type="text/css">
 
#liste {
cursor:pointer;
height:100px;
list-style-type:none;
margin:50px;
padding:0px;
}
 
#liste li {
float:left;
width:50px;
background-color:#ffffff;
border:1px solid #000000;
}
 
#op {
margin-left:50px;
width:320px;
padding-left:20px;
border:2px ridge #ff0000;
}
 
</style>
 
 
</head>
 
<body>
 
 
<ul id="liste">
<li>8h</li>
<li>8h30</li>
<li>9h</li>
<li>9h30</li>
<li>10h</li>
<li>10h30</li>
<li>11h</li>
<li>11h30</li>
<li>12h</li>
<li>12h30</li>
</ul>
 
 
<p id="op">
<strong>Choisissez le temps de réservation souhaitée puis cliquez sur un horaire de début de séance.</strong><br />
<input type="radio" checked="checked" name="r" value="2" />1h<br />
<input type="radio" name="r" value="3" />1h30<br />
<input type="radio" name="r" value="4" />2h
</p>
 
<script type="text/javascript">
 
var ra=document.getElementsByName("r");
var ul=document.getElementById("liste").getElementsByTagName("li");
var n=2;
var t=[];
var q=[-2,-1,ul.length,ul.length+1];
 
for(i=0;i!=ra.length;i++){
	ra[i].onclick=function(){
		n=parseInt(this.value)
	}
}
 
for(i in q){
	t[q[i]]=true
}
 
 
for(i=0;i!=ul.length;i++){
	ul[i].ind=i;
	ul[i].onclick=function(){
		if(t[this.ind-2] && !t[this.ind-1] || !t[this.ind+n] && t[this.ind+n+1]){
			alert("Créneau indisponible.\n\nChoisissez éventuellement une durée de jeu différente.");
			return
		}
 
		for(j=0;j<n;j++){
			if(t[this.ind+j]){
				alert("Créneau indisponible.\n\nChoisissez éventuellement une durée de jeu différente.");
				return
			}
		} 
 
		for(j=0;j<n;j++){
			t[this.ind+j]=true;
			ul[this.ind+j].style.backgroundColor="#00ff00";
		}
		alert("Votre réservation est prise en compte de " + this.firstChild.data + " à " + ul[this.ind+n-1].firstChild.data)
		for(j=0;j<n;j++){
			ul[this.ind+j].style.backgroundColor="#ff0000";
		}
	}
}
 
 
</script>
 
 
 
 
</body>
</html>

31/08/2006, 23h44
DiabolO

Salut merci pour tes reponses, en ce moment j'suis en norvège donc j'verrais ça à mon retour lundi !

à bientôt et merci encore