Discussion :

[saluts92]

Bonjour,

Ma question est simple, je recherche une liste exhaustive (tutorial) des événements (et syntaxe : méthodes, ...) que l'on peut trouver sur un smartphone.

par exemple : Touchmove, touchstart, ....

Je ne trouve pas grand chose sur le net

Merci

[Kaamo]

Réflexes à avoir : Spécifications sur http://www.w3.org/, références sur https://developer.mozilla.org/

Touch Events version 1 [W3C]
Touch events [MDN]
Liste des types Touch event

[saluts92]

Merci

Par contre cela ne m'a pas aidé à trouver une solution pour mon besoin

je souhaite savoir si l'utilisateur d'un smartphone fait un "TouchMove" vers la droite ou vers la gauche

Mais peut etre devrais je ouvrir un autre post ?

[Kaamo]

Les liens et en particulier le dernier listent tous les types d'événements "Touch".
En gros :
touchstart quand le doigt est posé
touchend quand le doigt est retiré
touchmove quand le doigt bouge

Pourquoi ne pas enregistrer les positions (x et y) de départ / de fin afin de déterminer dans quelle direction a été fait le "glissement".

[saluts92]

c'est ce que j'ai essayé de faire avec touchstart et touchend mais j'ai un problème pour passer la valeur de départ (fonction touchstart) à la fonction touchend
etant donné qu'il n'y a pas de variable global en javascript

[Kaamo]

etant donné qu'il n'y a pas de variable global en javascript

Donne voir un exemple

[saluts92]

pour avoir les coordonnées du départ il faut que j'utilise touchstart, je fais donc la fonction suivante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 $('#test22').on('touchstart', function(event) {
       var e = event.originalEvent;
      e.preventDefault();
      var pos1=e.targetTouches[0].pageX;
});

où pos1 recoit la valeur de la coordonnée X quand le doigt touche l'écran
puis je fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
 $('#test22').on('touchend', function(event) {
       var e = event.originalEvent;
      e.preventDefault();
      var pos2=e.targetTouches[0].pageX;
});

où pos2 recoit la valeur de la coordonnée X quand le doigt quitte l'écran

mais dans la fonction "touchend" pos1 n'est pas reconnu, donc je ne peux pas faire de calcul pour savoir si le doigt a été vers la gauche ou vers la droite

[Kaamo]

C'est normal pos1 n'est visible que dans la fonction. Il faut que tu la rendes accessible à un niveau plus global

[saluts92]

c'est bien ce que je disais

javascript ne permet pas de rendre global une variable

[Invité]

javascript ne permet pas de rendre global une variable

FAUX. => voir ici.

N.B. Une simple recherche t'aurait permis de trouver seul.

[Kaamo]

Oula en effet j'aurai dû être plus précis. Une lecture des bases de Javascript sont à prévoir

[Invité]

@Kamoo

"Les Inconnus" : https://www.youtube.com/watch?v=HgKXN_Uw2ME

"Ils ne faut pas prendre les gens pour des cons, mais il ne faut pas oublier qu'ils le sont"

@saluts92
Rien de perso (évidemment !) : juste pour le fun !

Ca biche ?

[saluts92]

en effet je reconnais avoir mal compris cette regle

mais vos 2 derniers POST son inutiles et ne font pas avancer le schimblick mis à part peut etre ... votre EGO surdimensionné

[vermine]

Bonjour,

Il n'y pas de problème d'égo ni autre.
L'humour est souvent présent sur nos forums. Il ne faut pas mal le prendre.

Les membres ne connaissent pas dès le départ le niveau des personnes et parlent parfois de choses qui leur semble tout à fait logique mais qui ne l'est pas pour la personne qui pose la question. Le conseil de revoir les bases du JavaScript est toujours judicieux et permet aux différents intervenants de parler "le même langage" (de se faire comprendre).

[Invité]

Bonjour saluts92,
sur DVP, nous sommes quelques uns à nous croiser régulièrement.

De temps en temps, histoire de détendre l'atmosphère, on plaisante, on envoie des piques, ou des private jokes.

Comme je l'ai précisé, la phrase, sortie d'un sketch des Inconnus, ne t'est absolument pas destinée.

En clair, elle s'adressait surtout à Kamoo :

"Il ne faut pas oublier de fournir suffisamment d'explications pour se faire comprendre"

L'explication de Vermine est tout-à-fait pertinente :

Les membres ne connaissent pas dès le départ le niveau des personnes et parlent parfois de choses qui leur semble tout à fait logique mais qui ne l'est pas pour la personne qui pose la question.

[Kaamo]

En effet, désolé de t'avoir vexé mais ce n'était pas du tout méchant.

Les variables globales sont omniprésentes en Javascript. C'est la, du moins un des, bases du langage. C'est d'autant plus important car elles sont "sensibles", il est donc important de les maîtriser pour éviter les mauvaises surprises.

Comprendre la portée des variables en Javascript (le scope) :
Des exemples basiques pour bien comprendre le "scope". En gros, ce qu'il faut avoir en tête.
- Chaque variable déclarée en dehors d'une fonction est rattachée directement à l'objet global window
- Dans une fonction, si tu ne déclares pas une variable avec le mot clef var, celle-ci sera considéré comme appartenant à l'objet window
- Dans une fonction, si tu déclares les variables avec le mot clef var, celles-ci ne seront accessibles qu'à l'intérieur de la fonction

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script>
// ici on est dans le "scope" global de la page. Chaque variable est attachée à window.
 
var a = 1; // équivaut à window.a = 1, équivaut à window[a] = 1, équivaut à a = 1
console.log(window); // tu verras qu'il y a quelque part notre variable "a"
 
function test() {
  b = 2; // sera contenu dans window à l'exécution de test()
  var c = 3; // ne sera pas contenu dans window à l'exécution de test()
} // cette fonction est attachée à l'objet window
 
test();
console.log(window); // On a pollué window avec nos variables a et b. Notre fonction test(). Mais il n'y a pas c car elle est déclarée dans la fonction test() donc accessible qu'à l'intérieur de celle-ci
</script>

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
var a = 5;
function test() {
  a = 6; // implicitement window.a
}
test(); 
console.log(a); // 6

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
var a = 5;
function test() {
  var a = 6; // n'est pas rattaché à l'objet window global. Cette variable a n'est accessible qu'à l'intérieur de test() et ne modifie par l'environnement global
}
test();
console.log(a); // 5

Pour aller plus loin :
- Pourquoi faut-il toujours déclarer ses variables ?
- Comment créer une variable globale dans une fonction ?
- Si tu es à l'aise avec l'anglais, je te conseille vivement ce petit Quiz. Quand tu auras tout bon, et compris les réponses, tu aras tout pigé sur le scope.

Quelle est la bonne pratique ?
Il faut être conscient que les variables globales, c'est pas bien.Il faut "englober ton code" dans une fonction qui retourne un objet contenant les fonctions/variables qui ont besoin d'être utilisées. On fait appel ici à un modèle de développement à connaitre : le "module pattern". C'est le principe utilisé par les librairies Javascript populaires (jQuery pour ne citer que lui).

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
(function(app){
// ton code ici
var date, nom, prive;
 
// faire des trucs
date = new Date();
nom = 'toto titi';
prive = 'coucou';
 
// attacher à cet objet tout ce qu'on souhaite utiliser ailleurs
app.nom = nom;
app.date = date;
 
})(window.app = window.app || {});
 
console.log(app); // Object {nom: "toto titi", date: Thu Aug 26 2013 10:54:28 GMT+0200 (Paris, Madrid (heure d’été))}

Ici, seules date et nom seront accessibles dans une seule variable globale (window.app) !
Les autres variables "inutiles" (comme prive dans cet exemple) qui servent seulement à l'exécution interne de ton programme ne seront pas visibles dans window, ne polluant pas l'espace.