Witamy z powrotem w tej lekcji skupimy się na dodanie w audio, więc dodając próbek muzycznych, które zagramy gdy trafiliśmy każdy klawisz, a także skupić się na nauczaniu każdego klucza swój własny kolor, tak, że nie zawsze te pomarańczowo przechodzący w żółty i zielony, ale wtedy będziemy mieli kilka, które są pewne, że są purpurowe niebieskie jak widać tutaj, wszystkie inne kolory.
Ale to zawsze ten sam kolor dla danego klucza jak H zawsze ta pomarańczowa cue jest zawsze to, że T Y i tak dalej.
OK.
Więc zacząć musimy po prostu dowiedzieć się, w jaki sposób możemy odtworzyć dźwięk w ogóle.
Tak po prostu, jak wywołać dźwięk za pomocą Hallard.
Tak w Hausler jest w zasadzie przeciwieństwem Paperchase miarę swej złożoności jest to naprawdę bardzo proste, co sprawia, że ​​naprawdę miło.
Ponownie można odtwarzać dźwięk bez biblioteki, ale jest to trochę.
To trochę bolesne, gdy chcemy zrobić coś, co chcemy zrobić, gdzie nie jesteśmy tylko odtwarzanie dźwięku jeden raz, ale chcę, aby móc wywołać dźwięk dziesięć razy z rzędu, jak powiedzmy, że to robię bzdura tu chcę być w stanie zrobić coś takiego jest trochę pracy w celu uczynienia tego w rzeczywistości zachowują się tak, że chcemy go.
To naprawdę łatwe odtwarzanie dźwięku jak odtworzyć utwór, który jest naprawdę denerwujące, ale jeśli pójdziesz na witrynie internetowej i tam niektóre znasz jakiegoś dźwięku lub utworu to gra w tle, który jest bardzo proste do zrobienia z godz tim sowy i JavaScript roku ,
Ale żeby zrobić coś takiego, gdzie możemy mieć grono jednoczesnym dźwiękiem dzieje i możemy powtórzyć rzeczy i że byłoby o wiele łatwiejsze w użyciu coś podobnego Hallard J nas.
Więc znowu nie niemożliwe.
Jak wszystko, że biblioteka nie można to zrobić samemu.
Ale nie byłoby tak naprawdę chcą.
Jeśli więc przyjrzeć się, jak to działa w tym wszystkim, że musimy skorzystać z tej odrobiny kodu tutaj, gdzie tworzymy nowy sposób.
Jak więc jest rzeczą, że jesteśmy inicjalizacji i wiedział, jak to zrobić.
Następnie dajemy mu listę kilku adresów URL plików, które chcemy grać.
Więc dlatego, że dajemy mu tablicę z tych różnych jesteś różne pliki, mimo że wyglądają jak są one takie same są po prostu różne typy plików oraz kolejność, aby umieścić je w kolejności, która jest wyjec postara i obciążenie ich.
Więc w zasadzie istnieją pewne typy plików, które będą działać w każdej przeglądarce niektóre z nich, które nie będą działać w każdej przeglądarce.
Tak można określić pewne kopii zapasowych.
Nie zamierzamy tego robić.
Musimy tylko jeden plik.
Ale jeśli chcesz mieć kopie zapasowe w zasadzie tak, że działa w miarę znam przynajmniej można przeczytać o tym tutaj, jestem tego pewien.
Jedziemy cię albo źródłem jesteś jeszcze na torze lub utwory mają być załadowane na dźwięk.
Powinny one być kolejność preferencji.
Howard Jasc automatycznie załaduje pierwszy z nich, który jest zgodny z aktualną przeglądarkę.
Więc pójdziesz.
Moglibyśmy dodać w innych wersjach tego samego utworu.
W naszym przypadku ta sama próbka i wykrzykiwać automatycznie załadować pierwszy taki, który jest kompatybilny.
OK.
Więc kod, który musimy choć jest nowy Howell.
A potem idziesz i to wszystko.
I wtedy, gdy jesteśmy gotowi do gry to po prostu zadzwoń do odtworzenia.
Można zobaczyć tutaj i nie będzie go zatrzymać.
Nie będziemy zatrzymując.
Nie będzie pętli, ponieważ nasze dźwięki są bardzo krótkie.
Więc po prostu chcę, żeby grać i niech zakończy się.
Każdy z nich jest około gdzieś między pół sekundy i drugi.
Więc jeśli nie zostało to zrobione śmiało i pobrać ten plik zip, który ma wszystkie dźwięki i zaciągnął do tego samego katalogu, w którym został pisanie kodu.
Więc zamiast dźwięków mamy wszystkie te pliki.
W porządku.
A następną rzeczą, którą musisz zrobić, to zainstalować HäUSLER Aby go wykorzystać.
Więc można go pobrać.
Ale tylko przez wzgląd odmiany użyję CDN.
Więc po prostu nie szukaj dla howler CDN kopią tego pierwszego.
Jesteś tu wszyscy zawsze można przetestować go zobaczyć, czy jest on ważny.
No to ruszamy.
Oto kod, który jest dla wyjec.
Idealny.
Wróćmy do naszej aplikacji, a następnie będziemy wystarczy dodać w skrypcie.
Więc po papierze można powielać i po prostu zmienić źródło za wyjec wiesz zróbmy pewien, że ładuje OK bez żadnego problemu.
Idealny.
Dalej niech rzeczywiście zrobić nasz pierwszy wycie.
Warto więc skopiować ten kod ponownie od Hower.
Wystarczy wziąć ten pierwszy tu i zróbmy go top zacząć.
Więc po prostu to zrobić tu i powiemy dźwięk var jest równa umiał, a następnie będziemy po prostu umieścić w jednym pliku i zróbmy pierwszy z nich, który widzimy.
Więc Bubbles dostał MP 3, dzięki czemu jest w środku ukośnik katalog dźwięk pęcherzyki stud MP 3.
Więc dźwięk.
Slash bańki.
Już zapomniał użyć pęcherzyków.
Proszę bardzo.
Czy liczbę mnogą.
Tak brzmi jakbyś pęcherzyków.
MP 3 i to wszystko, czego potrzebujemy.
I niech nie odtworzyć go od razu.
Załóżmy, że po prostu stworzyć.
To wszystko, co musimy zrobić.
A potem grać to niech po prostu grać.
Po naciśnięciu klawisza w dół tak, że to dźwięk dot gra bardzo ładne i proste rzućmy okiem go wypróbować.
No to jedziemy.
Więc za każdym naciśnięciu klawisza kilka różnych kluczy teraz powoduje, że OK dźwięku.
Miejmy nadzieję, że nie był zbyt uciążliwe.
Więc następnym się skupmy się na dodanie w innym dźwiękiem.
Więc po prostu zrobić dwie zacząć.
Mamy więc pęcherzyków.
Zróbmy Clay MP3 tak, że mogliśmy zrobić, to po prostu powielić to i zrobić dźwięk dwa równa się nowa Howell i zrobimy dźwięku ukośnik gliny i P3.
I co wtedy zrobimy tutaj jest mieć if.
Więc skupmy się na dwóch kluczy.
Zróbmy ai s.
Więc jeśli Naciśnij a jeśli klucz jest następnie zagramy dźwięk i nazwijmy to brzmi jeden tylko w celu wyjaśnienia, czy klucz jest s umieścić w cudzysłowie to za dobrze.
Potem zagramy dźwięk też.
Tak więc, aby powiedzieć, co klawisz został naciśnięty to naprawdę łatwe Paperchase mamy ten obiekt zdarzenia tu i musimy zrobić, to klucz dot zdarzeń.
Więc po prostu przeczytać instrukcję if, jeśli zdarzenie klucza równa a.
Potem po prostu zrobić sztukę jednego dźwięku.
Więc to jest jedna gra dźwięk, a następnie zrobić to samo.
Jeśli zdarzenie dot kluczowych równych równa X wtedy zrobi odtwarzania dźwięku też.
Więc dźwięk grać tak po prostu.
Tak więc możemy spróbować to.
Więc tylko Klawisze i S powinny wywołać rzeczy.
Więc powiem ci teraz mam uderzenia q wygląda mamy błąd.
Co my dojazd.
Dźwięk nie jest zdefiniowana.
Zignorować te ostrzeżenia tutaj teraz będziemy mocowania tych na samym końcu.
Jest to bardziej złożony problem, ale to faktycznie nie będzie wchodzić w drogę naszego kodeksu pracy, aby rozpocząć.
Ale to będzie tak głupi błąd.
Byłem przedstawieniu dźwięk tutaj.
Nie mamy już zdrowy.
OK.
Więc teraz nic nie powinno grać.
Kiedy uderzył większość klawiszy ale będę hit K inne klucze, a teraz miała s.
Więc mamy n s.
Idealny.
I co możemy zrobić, jak jest teraz przypisać kolor do każdego z nich tak, że mogliśmy zrobić coś takiego.
Przenieśmy to na dole tego samego klucza w dół, ale tuż przed pchania możemy mieć coś takiego, jeśli zdarzenie ma on grać, że dźwięk i możemy ustawić kolor nowego kręgu dot kolor wypełnienia jest równy, a wtedy możemy nadać mu kolor chciałbym zobaczyć 3 5 0, a następnie zrobić to samo.
Jeśli naciśnij s, ale w innym kolorze jak zróbmy 16 A 0 8 5 i wtedy możemy mieć innego i mam nadzieję, że myślisz sobie: To chyba nie jest najlepszym sposobem osiągnięcia tego celu.
To może być OK dla dwóch i nas, ale co 20 30 lub 50 klawiszy.
Używamy całą klawiaturę i wszystkie inne znaki.
To byłoby dużo kodu.
Ale niech mi tylko pokazać ci teraz.
Więc cue większość kolorów lub większość klawiszy nie odtwarza dźwięku.
Dają nam ten sam kolor.
Teraz gdybym miał UPS uderzę dwa klucze daje nam nieco inny kolor, jak daje nam niebieski.
Więc oczywiście kolor, który wybrałem tutaj jest trudne.
Trudno jest zobaczyć, pozwól mi zmienić zmian będzie fioletowy.
A technicznie powinniśmy sprawiają, że jest inaczej.
Jeśli więc będziemy sprawdzić, czy klucz jest LCF i innego jeśli mamy dwa if.
Ten będzie biegać i wtedy mamy innego wtedy, jeśli nie jest to prawdą, to ELSO być prawdą, ale nie będzie uwzględniać ten pojawi.
Więc jeśli chcemy tylko jednego z nich, aby mogło być prawdziwe który chcemy tylko jeden kolor fioletowy niebieski lub pomarańczowy.
Następnie chcemy, by być częścią jednego if, ale to naprawdę nie ma znaczenia, ponieważ mamy zamiar to zmienić w ciągu zaledwie sekundy.
Teraz nasz odświeżania tutaj jest normalne klawisze.
I hit choć mamy fioletowy trafienie, ponieważ mamy niebieskie i dwa różne dźwięki.
OK.
Więc tak jak używamy HäUSLER.
Teraz chcemy to zrobić dla każdego klucza i jest o wiele lepszy sposób niż to, co my tu mamy.
Więc jestem naprawdę dzieje, aby pozbyć się tego wszystkiego, bo mogliśmy.
Jak już wspomniano wcześniej, jeśli posiadają oświadczenie dla każdego pojedynczego klawisza, jeśli klucz jest to zrobić, jeśli klucz jest B i dla każdego pojedynczego klawisza.
Ale to naprawdę nie jest dobrą praktyką.
Więc co zrobimy, a nie jest zdefiniowanie obiektu, a my po prostu nazwać to kluczowe dane i jest to obiekt.
A to, co to będzie wyglądać.
Będziemy więc mieć klucz niczym.
I wtedy, gdy zostanie naciśnięty powiemy, że kolor powinien być fioletowy i że dźwięk powinien być.
I niech po prostu umieścić całą tę rzecz tam.
Więc pójdę nad tym za chwilę.
Ujmę to tutaj, a potem możemy zrobić jeszcze raz dokładnie to samo dla nas.
Więc kiedy jest wciśnięty kolor powinien być zielony i dźwięk powinny być nowe.
Jak będzie.
To samo jesteś albo i zróbmy dźwięk ukośnik Clay myślał MP3 i wtedy moglibyśmy zrobić dla każdego pojedynczego klawisza.
I tak jest dużo składni tutaj, ale zaletą jest to, że mamy jedno miejsce dla wszystkich naszych danych jest zdefiniowany, a potem nie musimy if lub w oddzielnym warunkowe dla każdego pojedynczego klawisza.
Wszystko, co musimy zrobić, to wziąć, gdzie są ci klucz dot zdarzenia, które rzeczywiście pozbył.
Weź to właśnie tutaj.
Zdarzenie klucz, który punkt jest kluczem, który został naciśnięty.
I powiedzmy, że to pismo J.
Jeśli o to chodzi po prostu wziąć go i podłącz go do kluczowych danych i że da nam kolor fioletowy dźwięk.
Czy ten dźwięk.
Więc pokażę ci, co mam na myśli.
Chodźmy z tymi dwoma przykładami i uczynić go bardziej oczywiste, dodajmy w jednym więcej egzemplarzach, co mamy.
Więc mamy n s niech też zrobić D.
I kolor może być to zbyt żółty, a potem dźwięk.
Co jeszcze mamy.
Zróbmy konfetti.
Idealny.
Pozbyć się tego spływu przecinkiem.
Możemy pozbyć się tego teraz i musimy to zmienić wokół trochę i następną rzeczą, która będzie zrobić, to wziąć ten klucz kaczki zdarzeń i podłączyć go do naszych kluczowych danych.
Tak więc możemy zrobić coś takiego.
Klucz Uchwyt Dane Kluczowym wydarzeniem i że dałoby nam na razie, czy ów było wydarzenie daje nam całą tę rzecz tutaj, a następnie możemy zrobić kolor, dzięki czemu możemy nie rozpocznie.
Więc co zrobimy to zanim nowa nowe koło, a my po prostu powiedzieć, kolor wypełnienia nowego okręgu równa klucza kolor Kluczowym wydarzeniem danych.
Więc po prostu powtórzyć ciemności kluczem jest list.
Również w naszym przypadku będziemy się upewnić, że to pismo.
Technicznie może być liczbą lub shiftier zakładka ale to klucz, który został naciśnięty.
Następnie bierzemy to i podłączyć go do kluczowych danych.
Otrzymujemy całą tę rzecz na zewnątrz.
Jeśli eventime Kluczem jest, czy użytkownik nacisnął następnie robimy ciemny kolor, który daje nam fioletowy.
Tak więc mamy do ustawiania nowy krąg, ale kolor wypełnienia się fioletowy.
Jeśli Duck Key wydarzenie jest nie zauważyć, że nie trzeba mieć if to zrobić.
Więc nie mamy do powiedzenia jeśli Turcja ma to zrobić, jeśli przypadku gdy klucz jest poproszony, aby to zrobić.
Jest to ta sama linia nie wiem co.
Ponieważ mamy ten słownik albo to jedno źródło naszych danych zdefiniowany jest problem oczywiście.
To będzie działać tylko na S i D teraz.
Więc pokażę odświeżyć upewnić się, że nie ma żadnych błędów składniowych.
My nie może odczytać koloru lub nie można odczytać prawidłowo kolorowe niezdefiniowane i to nie jest błąd składni.
To błąd, który ja spodziewałem.
Więc to ci pokażę.
Będę naciśnij dobrą Naciśnij a lub s są również dobre i D.
Ale teraz klawisz Q i mamy problem.
A to dlatego, że jest to nieokreślone kluczowe dane Q nie istnieje.
Mamy S i D.
Więc to jest problem.
Sposobem na ustalenie, że jest prosty.
Wszystko zrobimy, to sprawdzić, czy to zrobić tutaj.
Top wewnątrz tego klucza prasy Wystąpienie zdarzenia Wspornik dane klucza Docky.
Więc pamiętaj, jeśli jest to truthy Zasadniczo jeśli istnieje wtedy zrobimy wszystko.
W przeciwnym razie, jeśli nie istnieje, że nie będzie nic, aby zacząć robić.
I rzeczywiście nie będzie w ogóle cokolwiek robić.
Więc teraz nasze firmy Apple działają tylko to zrobi wszystko, czy tylko robić nic po naciśnięciu S i D.
Więc po prostu wrócić zróbmy pewien, że teraz działa.
Q Nic się nie dzieje.
Jestem naciskając kilka klawiszy.
Teraz hit.
I to działa.
Klucz S i D, ale nikt inny nie robi niczego.
Wspaniały.
Więc teraz przejdźmy dźwięk grać.
Więc to też jest ładne i proste.
Musimy tylko dźwięk klawiszy Kluczowym wydarzeniem danych i nie jestem pewien, dlaczego nazwałem te dwa dźwięki, które powinny być dźwięk.
Nie idziemy które odgrywają dźwięk kropka.
Pamiętaj Venki podłączyć do tego savey prasie D.
Otrzymujemy ten obiekt.
Robimy dat dźwięk na nim.
Dostajemy to którą następnie uruchomić grę tak samo jak przedtem.
OK, dajmy mu szansę.
A jako.
A pozostałe klawisze nie robić nic.
Idealny.
Więc wszystko, co pozostało do zrobienia jest naprawdę tylko dodać wszystkie jej innymi klawiszami a to byłoby bardzo bolesne, aby oglądać mnie wpisać od nowa.
Mam, że pre-done Dałem Ci plik w pobrania.
Nazwałem go z dnia na dzień.
Tak.
Więc jeśli otworzymy się, że to jest po prostu gigantyczny obiekt, który ma wszystkie klawisze liter.
Mamy więc Q W E R.
Oni naprawdę nie są w dowolnej kolejności.
No, ale nie są one szczególnie jeśli chodzi o kolejność kolorów i dźwięków.
Właśnie odebrał te losowe i każdy z nich ma kolor.
Jeśli więc skopiuj to i zastąpić to, co my tu mamy mieć pewność, że nazywają to kluczowe dane doskonały.
Mamy teraz warunkiem tego słownika brzmiące kolorach dla każdego kluczowego każdego pojedynczego klawisza alfabetu przynajmniej.
I możemy użyć.
Nie musimy zmienić nasz kod w ogóle.
Więc jest to naprawdę miłe, jeśli chcemy dodać klawiszy numerycznych, gdzie chcemy dodać na karcie i shift i uciec i co tam jeszcze po prostu dodać dodatkowe właściwości tego obiektu.
Warto więc wypróbować odświeżenia go zamknąć.
Idealny.
W porządku.
Więc nie dać się ponieść tutaj.
Dość zabawne chociaż.
OK.
Dobrze, że to wystarczy.
Więc omówiliśmy wiele, ale na koniec dnia wszystko, co rzeczywiście było trochę kodu, który okazało się, aby krąg.
Wzięliśmy jakiś kod, który okazał się animować okrąg, aby zmienić kolor.
Znaleźliśmy trochę kodu do zrobienia wydarzenia.
Kiedy więc po naciśnięciu klawisza.
A potem połączyć to z jakimś innym kodem okazało się grać muzykę.
A kiedy można umieścić go razem można zrobić kilka fajnych rzeczy i jest dużo więcej można zrobić tutaj.
I nie jesteśmy w 100 procentach wykonane.
Skończyliśmy z funkcjonalnością więc nie jesteśmy w żadnym dodawania nowych funkcji i nie będzie wyglądać inaczej.
Ale jeśli nie otworzyć konsolę zobaczysz dostajemy wszystko to nie może załadować pliki SML HTP wniosek krzyż pochodzenie.
Bla bla bla.
omówię, że w następnym filmie.
Dyskusja na temat, dlaczego tak się dzieje, a także w jaki sposób możemy to naprawić.
A potem drugą rzeczą, którą zrobimy jest mówić o małej drodze refactoring to, ponieważ teraz przy każdym naciśnięciu Dodaję nowy krąg do tablicy kręgu i jestem nigdy nie usuwanie ich z tej tablicy.
Więc mogę mieć 10000 tam teraz.
Dobrze, że nie, ale może mieć sto istnieje 200 i jesteśmy zapętlenie nad tym cała rzecz.
Nawet jeśli nie widzimy kręgi, ponieważ są one tak małe.
Więc zrobimy mała zmiana, aby pozbyć się tych, w następnym filmie.
Ale znowu skończymy z funkcjonalnością więc jeśli nie obchodzi, aby zobaczyć, że po prostu lubił czyniąc to i chcesz przejść.
Śmiało i przejść do następnej jednostki.