-
Notifications
You must be signed in to change notification settings - Fork 31
Interaction: alert, prompt, confirm #170
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.
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
Closed
Closed
Changes from all commits
Commits
Show all changes
5 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -1,8 +1,8 @@ | ||||||
| JavaScript-code: | ||||||
|
|
||||||
| ```js demo run | ||||||
| let name = prompt("What is your name?", ""); | ||||||
| alert(name); | ||||||
| ```js | ||||||
| let nume = prompt("Cum te numești?", ""); | ||||||
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
numele variabilelor nu se traduc. |
||||||
| alert(nume); | ||||||
| ``` | ||||||
|
|
||||||
| The full page: | ||||||
|
|
@@ -15,8 +15,8 @@ The full page: | |||||
| <script> | ||||||
| 'use strict'; | ||||||
|
|
||||||
| let name = prompt("What is your name?", ""); | ||||||
| alert(name); | ||||||
| let nume = prompt("Cum te numești?", ""); | ||||||
| alert(nume); | ||||||
| </script> | ||||||
|
|
||||||
| </body> | ||||||
|
|
||||||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,105 +1,109 @@ | ||
| # Interaction: alert, prompt, confirm | ||
| # Interacțiuni: alert, prompt, confirm | ||
|
|
||
| As we'll be using the browser as our demo environment, let's see a couple of functions to interact with the user: `alert`, `prompt` and `confirm`. | ||
| Deoarece vom folosi browserul ca mediu de demonstrație, hai să vedem câteva funcții cu care putem interacționa cu utilizatorul: `alert`, `prompt` și `confirm` | ||
|
|
||
| ## alert | ||
|
|
||
| This one we've seen already. It shows a message and waits for the user to press "OK". | ||
| Pe aceasta am văzut-o deja. Ea afișează un mesaj și așteaptă ca utilizatorul să apese "OK". | ||
|
|
||
| For example: | ||
| De exemplu: | ||
|
|
||
| ```js run | ||
| alert("Hello"); | ||
| ```js | ||
| alert("Salut"); | ||
| ``` | ||
|
|
||
| The mini-window with the message is called a *modal window*. The word "modal" means that the visitor can't interact with the rest of the page, press other buttons, etc, until they have dealt with the window. In this case -- until they press "OK". | ||
| Mini fereastra cu mesajul se numește *modal*. Cuvântul "modal" înseamnă că vizitatorul nu poate interacționa cu restul paginii, apăsa alte butoane, etc, până nu se ocupă de fereastră. În cazul de față - până nu apasă "OK". | ||
|
|
||
| ## prompt | ||
|
|
||
| The function `prompt` accepts two arguments: | ||
| Funcția `prompt` acceptă două argumente: | ||
|
|
||
| ```js no-beautify | ||
| result = prompt(title, [default]); | ||
| ```js | ||
| rezultat = prompt(titlu, [default]); | ||
| ``` | ||
|
|
||
| It shows a modal window with a text message, an input field for the visitor, and the buttons OK/Cancel. | ||
| Aceasta afișează un modal cu un mesaj text, un câmp de introducere text pentru utilizator și butoanele OK/Anulează. | ||
|
|
||
| `title` | ||
| : The text to show the visitor. | ||
| `titlu` | ||
| : Textul afișat utilizatorului. | ||
|
|
||
| `default` | ||
| : An optional second parameter, the initial value for the input field. | ||
| : Un al doilea parametru, opțional, reprezintă valoarea inițială pentru câmpul de introducere text. | ||
|
|
||
| ```smart header="Parantezele drepte din sintaxa `[...]`" | ||
| Parantezele drepte din jurul cuvântului `default` în sintaxa de mai sus denotă faptul că parametrul este opțional, nu obligatoriu. | ||
|
|
||
| ```smart header="The square brackets in syntax `[...]`" | ||
| The square brackets around `default` in the syntax above denote that the parameter is optional, not required. | ||
| ``` | ||
|
|
||
| The visitor can type something in the prompt input field and press OK. Then we get that text in the `result`. Or they can cancel the input by pressing Cancel or hitting the `key:Esc` key, then we get `null` as the `result`. | ||
| Utilizatorul poate scrie ceva în prompt și poate apăsa OK. Apoi noi primim acel text în `rezultat`. Sau poate anula introducerea de text prin apăsarea butonului Anulează sau apăsarea tastei `key:Esc`, apoi noi primim `null` ca `rezultat` | ||
|
|
||
| The call to `prompt` returns the text from the input field or `null` if the input was canceled. | ||
| Apelarea funcției `prompt` returnează textul din câmpul de introducere text sau `null` dacă introducerea de text a fost anulată. | ||
|
|
||
| For instance: | ||
| De exemplu: | ||
|
|
||
| ```js run | ||
| let age = prompt('How old are you?', 100); | ||
| let vârstă = prompt('Câți ani ai?', 100); | ||
|
|
||
| alert(`You are ${age} years old!`); // You are 100 years old! | ||
| alert(`Ai ${vârstă} de ani!`); // Ai 100 de ani! | ||
| ``` | ||
|
|
||
| ````warn header="In IE: always supply a `default`" | ||
| The second parameter is optional, but if we don't supply it, Internet Explorer will insert the text `"undefined"` into the prompt. | ||
| ````warn header="Pentru Internet Explorer: mereu dă o valoare parametrului `default`" | ||
| Al doilea parametru e opțional, dar dacă nu-i dăm nici-o valoare, Internet Explorer va insera textul `"undefined"` în prompt. | ||
|
|
||
| Run this code in Internet Explorer to see: | ||
| Rulează acest cod în Internet Explorer ca să vezi: | ||
|
|
||
| ```js run | ||
| ```js | ||
| let test = prompt("Test"); | ||
| ``` | ||
|
|
||
| So, for prompts to look good in IE, we recommend always providing the second argument: | ||
| Așadar, pentru ca prompt-ul să funcționeze corect și în Internet Explorer, recomandăm ca mereu să folosești și al doilea argument: | ||
|
|
||
| ```js run | ||
| let test = prompt("Test", ''); // <-- for IE | ||
| ```js | ||
| let test = prompt("Test", ""); // <-- pentru Internet Explorer | ||
| ``` | ||
|
|
||
| ```` | ||
|
|
||
| ## confirm | ||
|
|
||
| The syntax: | ||
| Sintaxa: | ||
|
|
||
| ```js | ||
| result = confirm(question); | ||
| rezultat = confirm(întrebare); | ||
| ``` | ||
|
|
||
| The function `confirm` shows a modal window with a `question` and two buttons: OK and Cancel. | ||
| Funcția `confirm` afișează un modal cu o `întrebare` și două butoane: OK și Anulează. | ||
|
|
||
| The result is `true` if OK is pressed and `false` otherwise. | ||
| Rezultatul este `true` dacă utilizatorul apasă OK și `false` în caz contrar. | ||
|
|
||
| For example: | ||
| De exemplu: | ||
|
|
||
| ```js run | ||
| let isBoss = confirm("Are you the boss?"); | ||
| let estePatron = confirm("Ești patronul?"); | ||
|
|
||
| alert( isBoss ); // true if OK is pressed | ||
| alert(estePatron); // true dacă se apasă pe OK | ||
| ``` | ||
|
|
||
| ## Summary | ||
| ## Rezumat | ||
|
|
||
| We covered 3 browser-specific functions to interact with visitors: | ||
| Am vorbit despre 3 funcții specifice browserului pentru a interacționa cu utilizatorii: | ||
|
|
||
| `alert` | ||
| : shows a message. | ||
| : afișează un mesaj. | ||
|
|
||
| `prompt` | ||
| : shows a message asking the user to input text. It returns the text or, if Cancel button or `key:Esc` is clicked, `null`. | ||
| : afișează un mesaj cerându-i utilizatorului să introducă text. Returnează textul sau, dacă este apăsat butonul Anulează sau tasta `key:Esc`, `null`. | ||
|
|
||
| `confirm` | ||
| : shows a message and waits for the user to press "OK" or "Cancel". It returns `true` for OK and `false` for Cancel/`key:Esc`. | ||
| : afișează un mesaj și așteaptă ca utilizatorul să apese "OK" sau "Anulează". Returnează `true` dacă este apăsat OK și `false` dacă este apăsat Anulează/`key:Esc`. | ||
|
|
||
| All these methods are modal: they pause script execution and don't allow the visitor to interact with the rest of the page until the window has been dismissed. | ||
| Toate aceste metode sunt modale: ele opresc execuția codului și nu permit utilizatorului să interacționeze cu restul paginii până când fereastra a fost închisă. | ||
|
|
||
| There are two limitations shared by all the methods above: | ||
| Există două limitări comune între toate metodele de mai sus: | ||
|
|
||
| 1. The exact location of the modal window is determined by the browser. Usually, it's in the center. | ||
| 2. The exact look of the window also depends on the browser. We can't modify it. | ||
| 1. Locația exactă a modalului este determinată de browser. De obicei, e în centrul ferestrei. | ||
| 2. Aspectul exact al modalului depinde tot de browser. Nu îl putem schimba. | ||
|
|
||
| That is the price for simplicity. There are other ways to show nicer windows and richer interaction with the visitor, but if "bells and whistles" do not matter much, these methods work just fine. | ||
| Acesta este prețul plătit pentru simplitate. Sunt și alte moduri de a afișa ferestre mai frumoase și interacțiuni mai complexe cu utilizatorul, dar dacă "brizbrizurile" nu contează atât de mult pentru tine, aceste metode merg de minune. | ||
| ``` | ||
| ```` |
16 changes: 8 additions & 8 deletions
16
1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,25 +1,25 @@ | ||
| The answer: `1`. | ||
| Răspunsul: `1`. | ||
|
|
||
| ```js run | ||
| ```js | ||
| let i = 3; | ||
|
|
||
| while (i) { | ||
| alert( i-- ); | ||
| } | ||
| ``` | ||
|
|
||
| Every loop iteration decreases `i` by `1`. The check `while(i)` stops the loop when `i = 0`. | ||
| Fiecare iterație descrește valoarea lui `i` cu `1`. Verificarea `while(i)` oprește iterația atunci când `i = 0`. | ||
|
|
||
| Hence, the steps of the loop form the following sequence ("loop unrolled"): | ||
| Așadar, pașii buclei formează următoarea secvență ("buclă desfășurată"): | ||
|
|
||
| ```js | ||
| let i = 3; | ||
|
|
||
| alert(i--); // shows 3, decreases i to 2 | ||
| alert(i--); // afișează 3, descrește valoarea lui i la 2 | ||
|
|
||
| alert(i--) // shows 2, decreases i to 1 | ||
| alert(i--) // afișează 2, descrește valoarea lui i la 1 | ||
|
|
||
| alert(i--) // shows 1, decreases i to 0 | ||
| alert(i--) // afișează 1, descrește valoarea lui i la 0 | ||
|
|
||
| // done, while(i) check stops the loop | ||
| // gata, verificarea while(i) oprește bucla | ||
| ``` |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
40 changes: 17 additions & 23 deletions
40
1-js/02-first-steps/13-while-for/2-which-value-while/solution.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,30 +1,24 @@ | ||
| The task demonstrates how postfix/prefix forms can lead to different results when used in comparisons. | ||
| Acest exercițiu demonstrează cum prefixele/sufixele pot duce la rezultate diferite când sunt comparate. | ||
|
|
||
| 1. **From 1 to 4** | ||
| 1. **De la 1 la 4** | ||
|
|
||
| ```js run | ||
| let i = 0; | ||
| while (++i < 5) alert( i ); | ||
| ``` | ||
| ```js | ||
| let i = 0; | ||
| while (++i < 5) alert( i ); | ||
| ``` | ||
| Prima valoare este `i = 1` pentru că `++i` incrementează prima dată `i` și apoi returnează noua valoare. Așadar prima comparație este `1 < 5` și funcția `alert` afișează `1`. | ||
| 2. **De la 1 la 5** | ||
|
|
||
| The first value is `i = 1`, because `++i` first increments `i` and then returns the new value. So the first comparison is `1 < 5` and the `alert` shows `1`. | ||
| ```js | ||
| let i = 0; | ||
| while (i++ < 5) alert( i ); | ||
| ``` | ||
| Prima valoare este din nou `i = 1`. Forma cu sufix `i++` incrementează `i` și după returnează vechea valoare, deci comparația `i++ < 5` va folosi `i = 0` (față de `++i < 5`). | ||
|
|
||
| Then follow `2, 3, 4…` -- the values show up one after another. The comparison always uses the incremented value, because `++` is before the variable. | ||
| Dar funcția `alert` se apelează separat. Este altă linie de cod care se execută după incrementare și după comparație. Așadar primește `i = 0`. | ||
|
|
||
| Finally, `i = 4` is incremented to `5`, the comparison `while(5 < 5)` fails, and the loop stops. So `5` is not shown. | ||
| 2. **From 1 to 5** | ||
| Apoi urmând `2, 3, 4...` | ||
|
|
||
| ```js run | ||
| let i = 0; | ||
| while (i++ < 5) alert( i ); | ||
| ``` | ||
| Hai să ne oprim la `i = 4`. Forma cu prefix `++i` l-ar incrementa și am folosi `5` pentru comparație. Dar aici avem forma cu sufix `i++`. Astfel îl incrementează pe `i` la `5`, dar returnează vechea valoare. Datorită faptului că comparația e de fapt `while(4 < 5)` - adevărat și execuția codului continuă cu funcția `alert`. | ||
|
|
||
| The first value is again `i = 1`. The postfix form of `i++` increments `i` and then returns the *old* value, so the comparison `i++ < 5` will use `i = 0` (contrary to `++i < 5`). | ||
|
|
||
| But the `alert` call is separate. It's another statement which executes after the increment and the comparison. So it gets the current `i = 1`. | ||
|
|
||
| Then follow `2, 3, 4…` | ||
|
|
||
| Let's stop on `i = 4`. The prefix form `++i` would increment it and use `5` in the comparison. But here we have the postfix form `i++`. So it increments `i` to `5`, but returns the old value. Hence the comparison is actually `while(4 < 5)` -- true, and the control goes on to `alert`. | ||
|
|
||
| The value `i = 5` is the last one, because on the next step `while(5 < 5)` is false. | ||
| Valoarea `i = 5` esre ultima, deoarece următorul pas `while(5 < 5)` este fals. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
16 changes: 8 additions & 8 deletions
16
1-js/02-first-steps/13-while-for/3-which-value-for/solution.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,17 +1,17 @@ | ||
| **The answer: from `0` to `4` in both cases.** | ||
| **Răspunsul: de la 0 la 4 în ambele cazuri.** | ||
|
|
||
| ```js run | ||
| ```js | ||
| for (let i = 0; i < 5; ++i) alert( i ); | ||
|
|
||
| for (let i = 0; i < 5; i++) alert( i ); | ||
| ``` | ||
|
|
||
| That can be easily deducted from the algorithm of `for`: | ||
| Asta se poate deduce ușor din algoritmul lui `for`: | ||
|
|
||
| 1. Execute once `i = 0` before everything (begin). | ||
| 2. Check the condition `i < 5` | ||
| 3. If `true` -- execute the loop body `alert(i)`, and then `i++` | ||
| 1. Execută o dată `i = 0` înainte a orice altceva (inițializator). | ||
| 2. Verifică condiția `i < 5` | ||
| 3. Dacă e `true` -- rulează corpul buclei `alert(i)`, și apoi `i++` | ||
|
|
||
| The increment `i++` is separated from the condition check (2). That's just another statement. | ||
| Incrementarea `i++` e separată de verificarea condiției (2). Aceea e pur și simplu altă bucată de cod. | ||
|
|
||
| The value returned by the increment is not used here, so there's no difference between `i++` and `++i`. | ||
| Valoarea returnată după incrementare nu e folosită aici, așadar nu este nici-o diferență între `i++` și `++i`. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,11 +1,9 @@ | ||
|
|
||
|
|
||
| ```js run demo | ||
| ```js | ||
| for (let i = 2; i <= 10; i++) { | ||
| if (i % 2 == 0) { | ||
| alert( i ); | ||
| } | ||
| } | ||
| ``` | ||
|
|
||
| We use the "modulo" operator `%` to get the remainder and check for the evenness here. | ||
| Folosim operatorul "modulo" `%` pentru a afla restul împărțirii și astfel a verifica paritatea. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.