[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:00.96,0:00:03.76,Default,,0000,0000,0000,,Inne fajne zastosowanie\NJS na stronach Dialogue: 0,0:00:03.81,0:00:06.78,Default,,0000,0000,0000,,to animacja właściwości w czasie. Dialogue: 0,0:00:06.84,0:00:08.54,Default,,0000,0000,0000,,Zanim się do tego zabierzemy, Dialogue: 0,0:00:08.58,0:00:11.61,Default,,0000,0000,0000,,upewnię się,\Nże znacie inną globalną zmienną Dialogue: 0,0:00:11.70,0:00:16.14,Default,,0000,0000,0000,,dostępną na każdej stronie\Ninternetowej - zmienną "window". Dialogue: 0,0:00:16.87,0:00:21.48,Default,,0000,0000,0000,,Wpiszę "console.log",\Na wy możecie zatrzymać odtwarzanie, Dialogue: 0,0:00:21.58,0:00:25.63,Default,,0000,0000,0000,,otworzyć narzędzia deweloperskie\Ni zobaczyć, co tam jest. Dialogue: 0,0:00:27.04,0:00:32.90,Default,,0000,0000,0000,,Widzieliście? To jest olbrzymie!\NTyle tam kodu, że aż szok! Dialogue: 0,0:00:33.76,0:00:35.48,Default,,0000,0000,0000,,Żebyście się z tym oswoili, Dialogue: 0,0:00:35.58,0:00:40.16,Default,,0000,0000,0000,,powiem o właściwościach i metodach,\Ndo których jest stamtąd dostęp. Dialogue: 0,0:00:40.26,0:00:43.46,Default,,0000,0000,0000,,Jest tu "window.location", Dialogue: 0,0:00:43.56,0:00:46.88,Default,,0000,0000,0000,,zawierające informacje o URL strony. Dialogue: 0,0:00:48.23,0:00:50.54,Default,,0000,0000,0000,,Zresztą napiszę to na stronie, Dialogue: 0,0:00:50.64,0:00:54.35,Default,,0000,0000,0000,,żebyście nie musieli\Nco chwilę zatrzymywać odtwarzania. Dialogue: 0,0:00:54.45,0:00:56.03,Default,,0000,0000,0000,,Zatem: "textContent"... Dialogue: 0,0:00:56.13,0:01:00.00,Default,,0000,0000,0000,,i napiszemy, że URL tej strony Dialogue: 0,0:01:00.06,0:01:04.44,Default,,0000,0000,0000,,to "window.location".\NI że to jest obiekt, Dialogue: 0,0:01:04.58,0:01:08.17,Default,,0000,0000,0000,,więc musimy do niego wejść.\NPiszę: "href". Dialogue: 0,0:01:08.35,0:01:13.33,Default,,0000,0000,0000,,I już: to jest URL zawartej tu\Nstrony internetowej. Dialogue: 0,0:01:14.63,0:01:17.97,Default,,0000,0000,0000,,Inna właściwość to\N"window.navigator.user.agent". Dialogue: 0,0:01:18.02,0:01:23.01,Default,,0000,0000,0000,,Mówi o przeglądarce użytkownika. Dialogue: 0,0:01:23.46,0:01:25.50,Default,,0000,0000,0000,,Wpiszę: "the browser"... Dialogue: 0,0:01:25.60,0:01:31.74,Default,,0000,0000,0000,,nazwiemy ją "the user agent", dalej:\N"is + window.navigator.user agent". Dialogue: 0,0:01:32.93,0:01:38.71,Default,,0000,0000,0000,,No dobrze. Ten ciąg "user agent"\Npewnie wydaje się wam wariacki. Dialogue: 0,0:01:38.82,0:01:41.84,Default,,0000,0000,0000,,Nie został stworzony po to,\Nby czytali go ludzie; Dialogue: 0,0:01:41.96,0:01:46.04,Default,,0000,0000,0000,,nie zawsze ma sens.\NZ przyczyn historycznych. Dialogue: 0,0:01:46.14,0:01:49.16,Default,,0000,0000,0000,,Większość projektantów stron\Nkorzysta z bibliotek, Dialogue: 0,0:01:49.26,0:01:51.94,Default,,0000,0000,0000,,żeby zrozumieć, co oznacza ten ciąg, Dialogue: 0,0:01:52.03,0:01:55.01,Default,,0000,0000,0000,,jaka jest przeglądarka,\Nsystem operacyjny itp. Dialogue: 0,0:01:55.11,0:01:57.10,Default,,0000,0000,0000,,Bo to bardzo dziwne. Dialogue: 0,0:01:59.05,0:02:02.79,Default,,0000,0000,0000,,A to już takie dziwne nie jest:\N"window.outerWidth" Dialogue: 0,0:02:02.89,0:02:05.02,Default,,0000,0000,0000,,i "window.outerHeight". Dialogue: 0,0:02:05.12,0:02:07.33,Default,,0000,0000,0000,,Powiedzmy, Dialogue: 0,0:02:10.03,0:02:13.24,Default,,0000,0000,0000,,że ta strona internetowa ma Dialogue: 0,0:02:13.34,0:02:16.79,Default,,0000,0000,0000,,"window.outerWidth"...\Nzaczniemy od szerokości... Dialogue: 0,0:02:16.85,0:02:20.55,Default,,0000,0000,0000,,...i "window.outerHeight". Dialogue: 0,0:02:21.16,0:02:24.52,Default,,0000,0000,0000,,U mnie to jest 1280 na 715, Dialogue: 0,0:02:24.62,0:02:26.94,Default,,0000,0000,0000,,ale u was może być inaczej. Zależy, Dialogue: 0,0:02:27.04,0:02:31.72,Default,,0000,0000,0000,,jak wygląda wasza strona internetowa,\Ngdy oglądacie ten film. Dialogue: 0,0:02:31.81,0:02:35.36,Default,,0000,0000,0000,,Teraz pokażę wam coś zaskakującego. Dialogue: 0,0:02:35.49,0:02:40.01,Default,,0000,0000,0000,,Skasuję słowo "window"\Nw tej linii kodu. Dialogue: 0,0:02:42.69,0:02:47.38,Default,,0000,0000,0000,,I... nadal działa! Dialogue: 0,0:02:47.87,0:02:52.69,Default,,0000,0000,0000,,Ponieważ "window" to domyślna globalna\Nzmienna na stronach internetowych. Dialogue: 0,0:02:52.79,0:02:56.28,Default,,0000,0000,0000,,Przeglądarka szuka\Nużywanej przez was zmiennej Dialogue: 0,0:02:56.38,0:02:59.84,Default,,0000,0000,0000,,w obiekcie "window", Dialogue: 0,0:02:59.94,0:03:03.18,Default,,0000,0000,0000,,a kiedy stworzycie\Nnową zmienną globalną, Dialogue: 0,0:03:03.28,0:03:07.85,Default,,0000,0000,0000,,obiekt "window"\Nbędzie ją przechowywał jako własność. Dialogue: 0,0:03:07.90,0:03:13.00,Default,,0000,0000,0000,,Nie powinniście deklarować własnych\Nzmiennych "outerWidth" i "outerHeight", Dialogue: 0,0:03:13.10,0:03:17.81,Default,,0000,0000,0000,,bo anulują one "window.outerWidth"\Ni "window.outerHeight". Dialogue: 0,0:03:17.96,0:03:21.64,Default,,0000,0000,0000,,Generalnie, powinniście unikać\Nzmiennych globalnych, Dialogue: 0,0:03:21.69,0:03:24.64,Default,,0000,0000,0000,,bo jest ryzyko,\Nże będą kolidować między sobą Dialogue: 0,0:03:24.69,0:03:27.28,Default,,0000,0000,0000,,albo ze zmiennymi w obiekcie "window". Dialogue: 0,0:03:27.37,0:03:31.52,Default,,0000,0000,0000,,Dla bezpieczeństwa możecie dodawać\Ndo globalnych zmiennych prefiksy. Dialogue: 0,0:03:31.62,0:03:35.51,Default,,0000,0000,0000,,Np. w Khan Academy piszemy "KA_" Dialogue: 0,0:03:35.64,0:03:39.27,Default,,0000,0000,0000,,przed każdą zmienną globalną,\Nktóra jest nam potrzebna. Dialogue: 0,0:03:39.39,0:03:41.98,Default,,0000,0000,0000,,Dobrze.\NTo więc jest obiekt "window". Dialogue: 0,0:03:42.03,0:03:46.93,Default,,0000,0000,0000,,Wkrótce zobaczycie, jak za pomocą\Ndwu funkcji można w nim robić animacje.