Skip to content

Keyboard Events en fr #65

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Aug 21, 2019
Merged

Keyboard Events en fr #65

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
cb113f7
Keyboard Events en fr
abdouse79 Aug 21, 2019
b65861d
Merge branch 'Drag'n'Drop-with-mouse-events' into keyboard-events
abdouse79 Aug 21, 2019
7c1ef86
Merge branch 'master' into keyboard-events
HachemiH Aug 21, 2019
c6f9633
Update index.html
HachemiH Aug 21, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 5 additions & 3 deletions 2-ui/3-event-details/5-keyboard-events/2-check-sync-keydown/solution.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
Nous devons utiliser deux gestionnaires: `document.onkeydown` et `document.onkeyup`.

We should use two handlers: `document.onkeydown` and `document.onkeyup`.
L'ensemble `pressed` doit garder les touches en cours appuyées.

Let's create a set `pressed = new Set()` to keep currently pressed keys.
Créons un set `pressed = new Set()` pour garder les touches actuellement enfoncées.

Le premier gestionnaire en ajoute, tandis que le second en supprime. Chaque fois sur `keydown` nous vérifions si nous avons suffisamment de touches enfoncées et exécutons la fonction si c'est le cas.

The first handler adds to it, while the second one removes from it. Every time on `keydown` we check if we have enough keys pressed, and run the function if it is so.
16 changes: 8 additions & 8 deletions 2-ui/3-event-details/5-keyboard-events/2-check-sync-keydown/solution.view/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html>
<body>

<p>Press "Q" and "W" together (can be in any language).</p>
<p>Appuyez sur "Q" et "W" ensemble (cela peut être dans n'importe quelle langue).</p>

<script>
function runOnKeys(func, ...codes) {
Expand All @@ -11,19 +11,19 @@
document.addEventListener('keydown', function(event) {
pressed.add(event.code);

for (let code of codes) { // are all keys in the set?
for (let code of codes) { // est ce que toutes les touches sont un ensemble ?
if (!pressed.has(code)) {
return;
}
}

// yes, they are
// oui, elles le sont

// during the alert, if the visitor releases the keys,
// JavaScript does not get the "keyup" event
// and pressed set will keep assuming that the key is pressed
// so, to evade "sticky" keys, we reset the status
// if the user wants to run the hotkey again - let them press all keys again
// durant le message d'alerte, si le visiteur relâche les touches,
// JavaScript n'obtient pas l'évènement "keyup"
// et les ensembles appuyées continuent d'assumer que la touche est appuyée
// alors, pour échapper aux touches "sticky" , nous réinitialisons le status
// Si un usager veut exécuter le raccourcis encore - laisser le appuyer toutes les touches encore
pressed.clear();

func();
Expand Down
7 changes: 4 additions & 3 deletions 2-ui/3-event-details/5-keyboard-events/2-check-sync-keydown/task.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ importance: 5

---

# Extended hotkeys
# Raccourcis clavier étendus

Create a function `runOnKeys(func, code1, code2, ... code_n)` that runs `func` on simultaneous pressing of keys with codes `code1`, `code2`, ..., `code_n`.
Créer une fonction `runOnKeys(func, code1, code2, ... code_n)` exécutant la fonction `func` lorsqu’on appuie simultanément sur les touches avec les codes suivant `code1`, `code2`, ..., `code_n`.

For instance, the code below shows `alert` when `"Q"` and `"W"` are pressed together (in any language, with or without CapsLock)
Par exemple, le code en dessous montre `alert` lorsque `"Q"` et `"W"` sont appuyées ensemble (dans n'importe quelle langue, avec ou sans l'activation de La touche Majuscule, CapsLock)

```js no-beautify
runOnKeys(
Expand All @@ -17,3 +17,4 @@ runOnKeys(
```

[demo src="solution"]

Loading