1
00:00:01,066 --> 00:00:04,598
Protože už jsme se naučili používat text,
pojďme si s ním trochu pohrát.

2
00:00:04,598 --> 00:00:08,206
Nejprve použijeme „string"
neboli česky "řetězec“.

3
00:00:08,206 --> 00:00:11,205
Možná si pomyslíte:
"A co je to ten řetězec?".

4
00:00:11,205 --> 00:00:14,560
Je to název
pro text v kódu.

5
00:00:14,560 --> 00:00:16,996
Je to vlastně řetězec znaků.

6
00:00:16,996 --> 00:00:19,403
Vaše jméno je řetězec,
název vaší školy je taky řetězec.

7
00:00:19,403 --> 00:00:22,448
Každá textová zpráva,
kterou jste kdy poslali, je také řetězec.

8
00:00:22,448 --> 00:00:25,498
Jednoduše řečeno
řetězec se rovná text.

9
00:00:25,978 --> 00:00:28,425
Řetězce jsme již dříve
používali k malování.

10
00:00:28,425 --> 00:00:30,266
Ale mohli bychom použít proměnné
s řetězci?

11
00:00:30,266 --> 00:00:30,987
Samozřejmě!

12
00:00:30,987 --> 00:00:33,615
Stejně jako byste 
vložili číslo do proměnné,

13
00:00:33,615 --> 00:00:35,453
můžete do proměnné
dát i řetězec.

14
00:00:35,453 --> 00:00:39,781
Napíšeme tedy:
var myName rovná se a vaše jméno.

15
00:00:39,781 --> 00:00:40,965
Já napíšu "Sophia".

16
00:00:40,965 --> 00:00:42,599
a nezapomeneme na uvozovky.

17
00:00:42,599 --> 00:00:48,536
A teď do funkce místo „Sophia“ 
napíšeme myName.

18
00:00:48,536 --> 00:00:50,528
Přestože to
vypadá stejně,

19
00:00:50,528 --> 00:00:55,333
můžeme to nyní
napsat třeba několikrát.

20
00:00:55,333 --> 00:00:57,316
A můžeme být i víc kreativní.

21
00:00:57,316 --> 00:00:59,872
Stačí pouze
změnit tuto proměnnou.

22
00:00:59,872 --> 00:01:02,658
Můžu tam napsat třeba "Your name",
tedy anglicky "Vaše jméno".

23
00:01:02,658 --> 00:01:04,135
Nyní to tu máme
dokonce třikrát.

24
00:01:04,135 --> 00:01:06,513
Teď si to zase vratím zpátky,

25
00:01:06,513 --> 00:01:08,127
a co když si s tím zkusíme
ještě pohrát?

26
00:01:08,127 --> 00:01:10,081
Můžeme třeba
řetězce spojovat?

27
00:01:10,081 --> 00:01:13,009
Vzpomínáte, jak jsme 
dříve spojovali proměnné?

28
00:01:13,009 --> 00:01:14,581
To samé můžeme udělat i teď.

29
00:01:14,581 --> 00:01:17,063
Počítač prostě spojí
oba řetězce dohromady.

30
00:01:17,063 --> 00:01:19,547
Tyhle řádky si už smažu.

31
00:01:19,547 --> 00:01:23,268
Nechám tu jméno jen jednou a
vytvořím proměnnou nazvanou message.

32
00:01:23,268 --> 00:01:27,900
Ta bude obsahovat proměnnou myName
plus třeba několik vykřičníků.

33
00:01:27,900 --> 00:01:31,095
Pokud teď message vložíme do funkce text,
tak proměnnou nakreslí.

34
00:01:31,095 --> 00:01:33,830
Místo jména
vidíme jméno s vykřičníky.

35
00:01:33,830 --> 00:01:37,458
Příkaz přidal k našemu
jménu vykřičníky.

36
00:01:38,062 --> 00:01:40,402
Můžeme to dokonce udělat
ještě zajímavější.

37
00:01:40,402 --> 00:01:43,410
Třeba tuto proměnnou
necháme vypsat dvakrát.

38
00:01:43,410 --> 00:01:45,528
To vlastně dává celkem smysl.

39
00:01:45,528 --> 00:01:49,264
Sečtení řetězců znamená nalepit druhý
řetězec k zadní části prvního řetězce.

40
00:01:49,264 --> 00:01:51,797
Možná přemýšlíte, co jiného
můžeme s řetězci provádět.

41
00:01:51,797 --> 00:01:55,015
Můžeme je násobit nebo dělit
nebo odečítat?

42
00:01:55,811 --> 00:01:57,348
Ne, to nejde.

43
00:01:57,348 --> 00:01:59,326
Řetězce můžeme pouze spojovat.

44
00:01:59,326 --> 00:02:01,754
Mohli jsme dělit
a odečítat číselné proměnné.

45
00:02:01,754 --> 00:02:04,662
Řetězcové proměnné nám 
umožňují jenom spojování.

46
00:02:04,662 --> 00:02:07,324
To jsem ale zvědavá, co?

47
00:02:07,324 --> 00:02:09,526
Ale jenom zvědavostí se člověk 
dozvídá víc.

48
00:02:11,344 --> 00:02:16,930
Zkusme si teď ukázat animaci, a to
interakci myši s textovými řetězci.

49
00:02:17,500 --> 00:02:20,551
Vytvoříme si řetězec,
který sleduje kurzor myši,

50
00:02:20,551 --> 00:02:23,636
a to pouhým přilepením do cyklu.

51
00:02:23,636 --> 00:02:27,285
Jak bychom to udělali...
Vytvoříme funkci var draw,

52
00:02:27,285 --> 00:02:29,664
a poté vše dáme přímo do ní.

53
00:02:29,664 --> 00:02:32,905
Vypadá to povědomě,
to už jsme používali, když jsme se učili animovat.

54
00:02:32,905 --> 00:02:39,459
Pokud má řetězec sledovat kurzor myši, tak
určitě potřebujeme použít mouseX a mouseY.

55
00:02:39,459 --> 00:02:40,487
A máme hotovo.

56
00:02:40,487 --> 00:02:43,188
Je to vlastně takové malování
naším jménem.

57
00:02:43,188 --> 00:02:46,823
A samozřejmě, pokud bychom chtěli,
mohli bychom snadno nastavit pozadí.

58
00:02:46,823 --> 00:02:50,828
Například nastavit
nějakou pěknou světle modrou.

59
00:02:50,828 --> 00:02:55,082
A teď vidíme text,
který sleduje kurzor myši.

60
00:02:55,082 --> 00:02:57,186
Úplně stejně jako jsme to
dřív dělali s objekty.

61
00:02:57,186 --> 00:03:00,133
A na závěr si pojďme
vyzkoušet použití animace.

62
00:03:00,133 --> 00:03:02,640
Chceme, aby velikost textu
rostla.

63
00:03:02,640 --> 00:03:04,844
Tady nastavujeme
výchozí velikost textu na 30.

64
00:03:04,844 --> 00:03:06,619
Ale protože už známe proměnné,

65
00:03:06,619 --> 00:03:10,794
tak místo 30 bychom mohli říci:
var howBig se rovná 30.

66
00:03:10,794 --> 00:03:14,199
A teď tuto proměnnou použijeme
místo toho, abychom psali přímo 30.

67
00:03:14,649 --> 00:03:16,417
To je úplně to samé.

68
00:03:16,417 --> 00:03:19,986
Musíme ale něco měnit,
aby se jednalo o animaci.

69
00:03:20,485 --> 00:03:25,424
Můžeme to udělat třeba tak, že řekneme:
howBig se rovná howBig plus jedna.

70
00:03:25,424 --> 00:03:28,344
To bude určovat, 
jak se proměnná howBig mění.

71
00:03:28,344 --> 00:03:32,214
Vezmeme původní hodnotu howBig a
přičteme jedna, aby to bylo o trochu větší.

72
00:03:32,214 --> 00:03:34,754
A nyní stačí restartovat program.

73
00:03:34,754 --> 00:03:39,856
Když pohybujeme myší,
velikost textu roste.

74
00:03:39,856 --> 00:03:43,262
To vše díky tomuto řádku kódu.

75
00:03:43,262 --> 00:03:44,716
No a dál je to jen na vás.

76
00:03:44,716 --> 00:03:47,590
Můžete si zkusit animaci
třeba zrychlit.

77
00:03:48,086 --> 00:03:51,653
Tak a tím jsme se naučili, nejen jak
manipulovat s tvary pomocí kódu,

78
00:03:51,653 --> 00:03:57,000
ale i jak používat s kódem text.