>> SAM ZELENÁ: Ahoj, všichni.
Vítejte na našem semináři.
Jmenuji se Sam.
Hugh Zabriskie: Jsem Hugh.
SAM ZELENÁ: A budeme dnes mluvit o JavaScript a Web Audio API.
Stačí vyrazit, to je nástin našeho pořadu jednání semináře.
Chystáme se začít tím, že mluví o proč byste měli mít zájem na webu
Audio API, proč je to JavaScript jazyk, co potřebujete pro to,
a pak mluvit o JavaScriptu essentials-- tak podobně,
vás provede některé základy jazyka,
a pak mluvit o audio API na vysoké úrovni.
Poté, Hugh bude hovořit o některých z fází výrobě zvuku
a pak demo tuto strašlivou třídič Projekt postavil a ukázat vám kód.
A pak, budeme mít čas na dotazy na konci pro lidi
kteří zde žijí.
>> Hugh Zabriskie: cool.
>> SAM ZELENÁ: cool.
>> Hugh Zabriskie: cool.
Budu zálohovat.
>> SAM ZELENÁ: Takže popořadě.
Takže jeden z velkých věcí, o webové Audio API
je to, že tam je vyžadován žádný set up.
Je dodáván vestavěný do Většina moderních prohlížečů,
včetně Chrome, EDGE, celek banda others-- všech těch,
že velké části lidé používají dnes.
Takže není nastaven, Kromě jen dostat
webový server v chodu, pro vás, abyste mohli začít pracovat
na vašem projektu, což je skvělé.
>> Doporučujeme pěkný silně, že se domníváte,
Chrome pro použití Vývoj JavaScript web,
jen proto, že jeho vývojáře Nástroje jsou opravdu silné.
Jako příklad jen to, co máme na mysli tím, že říká otevřít svůj JavaScript
console-- pokud jdete do Chromu a se podíváte na jakékoli webové stránky,
a vy klikněte levým tlačítkem Zkontrolujte prvek, a poté
jdete na této malé rozevíracího tady a kliknete na konzole,
uvidíte, co otevírá vypadá hodně jako příkazového řádku, který vám
mohli vidět na vašem počítači Mac, nebo na ID.
A stejně jako to, že můžeme Typ příkazy zde, stejně jako Clear,
a další příkazy podobně.
Můžeme vytvořit proměnné, as uvidíme později v JavaScriptu.
A tak něco, co můžeme dělat v JavaScript, můžeme dělat s konzolou,
a to je super šikovný způsob, jak začít hrát si s API
a se pohodlně JavaScript hned bat.
Nevyžaduje set up, což je opravdu pěkné.
Bezva.
Skvělý.
>> Takže jen jedna věc přidat.
Máte-li některý questions-- existují mnozí z vás, kteří nejsou tady žít,
neváhejte a napište us-- tyto jsou naše e-mailové adresy.
Máte-li dotazy Nechcete se nás zeptat,
jako, oh jsem chybu v mém kódu, nebo něco
to je trochu konkrétnější, Možná, že jako první na Googlu ji.
Existuje spousta skvělých zdrojů o webové audio API venku.
Je to opravdu dobře dokumentovány a je to být
používán tunu lidí v průmysl, a lidé, kteří jsou právě
stavební zábavné věci pro sebe.
Takže tam by měla být hodně zdrojů tam venku.
Skvělý.
>> Cool, tak proč Web Audio API?
Toto schéma je trochu z vývoje na cestě
zvuk na webu vzrostla v průběhu času.
Bgsound byl jako původní HTML tagu že Internet Explorer použita na podporu.
Je povoleno pouze pro docela základní zvuky, funkčnost nebyl velmi robustní,
a vy jste nemohli dělat komplikovaný sekvenování,
nebo určit, kdy zvuk začal a zastavil velmi robustně.
Takže to nebyl nijak zvlášť dobře vyvinuté.
Pak po tom, Flash přišel along--, které,
Jsem si jistý, že vy jste všichni obeznámeni s Flash-- možná ne, jak to funguje,
ale vy jste určitě viděli.
Musíš aktualizovat svůj Flash Plug-in, všechny takové věci,
a to jistě rozšířila funkčnosti, která byla k dispozici.
Ale aby uživatel nainstalovat plug-in je určitě
Nevýhodou, včetně Flash v aplikaci, je to tak?
Vzhledem k tomu, pak jste závislí na Uživatel jít a najít tento plug-in,
a pravděpodobně se otočil off tímto krokem navíc
mají brát použít vaši aplikaci.
A pak tam mohl být aktualizace že zlomí celou vaši žádost,
a nakonec je to noční můra pro vývojáře, taky.
Takže to byla barikáda.
>> A pak po které přišel, audio tag HTML, který
je funkce, která modernějším HTML-- jistě počítal s mnohem více věcí,
ale i věci, které byste mohli udělat tam byla trochu omezena jen
v důsledku věcí že HTML byl schopen.
Takže když JavaScript API, Web Audio API,
stal standardem praxe v různých prohlížečích,
že skutečně rozšířila sadu příležitostí pro vývojáře
opravdu dostat do budovy cool věci pro web.
Po dlouhou dobu se měl bylo opravdu robustní nástroje
pro rodilé audio aplikace, jako-- každý ví GarageBand,
a pak samozřejmě existuje více profesionální audio míchání aplikací,
a takové věci.
Ale tam nebyl opravdu dobré Cloud-- ne
Cloud, jo, myslím, že Cloud-- internetová platforma
který by umožnil vývojářům vytvářet aplikace pro lidi
dělat audio míchání.
A když vám ukáže, později, Web Audio API
umožňuje opravdu silný věci se stane opravdu jednoduše,
což je docela v pohodě.
Tak to je pokyn, proč jste by měl sledovat zbytek semináře,
v podstatě.
>> A teď, budu mluvit o Některé JavaScript-- jen základní prvky
jazyka, takže můžeme být na stejné stránce
když hovoříme o API o něco později.
Bezva.
>> Takže, to je shrnutí.
Zapomněl jsem, že to tu.
To jo.
>> Hugh Zabriskie: Je tu dvě skluzavky zde.
>> SAM ZELENÁ: Jedná se o souhrn některých omezení
z dalších závazných, staré metody.
A pak nyní, máme tyto věci.
Bezva.
Skvělý.
>> Takže, náležitosti JavaScript.
První věcí, první, je tu docela významný rozdíl
v JavaScript proti v jazyk C, ve způsobu, jakým
že proměnné jsou vytvořeny.
Tak v C, jsme zvyklí mít zadejte své proměnné, že jo?
A nemám na mysli typ, jako je zadejte je, mám na mysli typ
jako přiřadit jim význam type-- jako, int, float, char.
V jazyce C, jsme byli opravdu použity k nutnosti vytvořit proměnnou
a pak držet se, že typu pro Celý čas, který budeme používat této proměnné.
A to nemusí být nutně horší, ale je to asi těžší k použití.
Jedním ze skvělých vlastností of JavaScript je
že proměnné jsou, co se nazývá "dynamicky napsaný," který
Znamená to, že můžu vytvořit proměnná s touto syntaxí,
varX se rovná 5, např.
To původně vytváří celé číslo proměnná--
přímo pod kapuce somewhere-- ale já
může změnit, že proměnné odkazovat na řetězec
aniž by dělali něco jako vytvoření nové proměnné.
Nepotřebuji se obávat o typu střídání.
JavaScript ví, že typ je změnily, a to stane dynamicky.
>> Takže, existují výhody a nevýhody, které,
jako každý, kdo pracoval v JavaScript na chvíli mohli znát.
Jsou chvíle, kdy byste mohli omylem
změnit typ proměnné a nezpracovává tento typ výměnu,
a pak se vaše JavaScript může crash-- nebo výjimku
být hozen, protože budete mít špatný typ, pokud očekáváte, jeden druh.
Bezva.
>> Takže, scoping-- který je jako, kdybychom pamatovat prvních týdnech v kurzu,
odkazuje se na jak viditelné proměnné je av jakém části kódu.
To vše vypadá velmi podobně se, jak to vypadá v C.
Takže proměnné jsou obecně scoped uvnitř složených závorek uvnitř funkce,
a pak tam jsou také globálně rozsahem proměnných, které
are-- pokud napíšete proměnnou mimo funkci,
to bude viditelné v celém textu.
>> Jeden rozdíl mezi JavaScript, a C a zejména
je, že pokud jste deklarovat globální proměnná kdekoli v textovém souboru
je to vidět v jakékoliv funkce v tomto textovém souboru.
To je správné, že jo?
>> Hugh Zabriskie: Jo.
>> SAM ZELENÁ: Takže je to také trochu bit funky ve srovnání s C,
kde jsme vždy měli mít náš Variabilní definice nad místech
oni byli používáni.
To není pravidlem, že je vynuceno už, tak trochu jiná.
A opět jen proto, aby je třeba zdůraznit, Globální vs. místní variables--
velmi podobný C. Ty by mohly mít dvě proměnné se stejným názvem,
a mají jednu z jejich jména tmavší místní proměnné, jestliže jeden z nich
byl globální.
Tak, podobný druh Problémy, které někteří z vás
mohou narazit na některá Vašeho problému nastaví tak daleko.
Cool, tak to je proměnné.
>> Flow Control, což znamená, stejně jako, pokud-else-- logické stuff-- a smyčky.
Takže začít s, to je to, co if-else Prohlášení vypadat v JavaScriptu.
Umístění různých věcí, na tratích není důležité.
To je jen jeden z úmluv za to, jak jsme se struktury kódu.
Stejně jako v C, máme "pokud" prohlášení závorka.
To není to, co bych chtěl dělat.
Udělal jsem to znova.
>> Hugh Zabriskie: Snažím se ukončit?
SAM ZELENÁ: Ne, já jsem Jen se snažím přiblížit.
Nezáleží na tom.
>> Takže, máme "kdyby" a prohlášení máme podmínku uvnitř je
že se vyhodnotí jako true nebo false, a to určuje, zda
jsme se vstoupit, že blok kódu.
A podobně, máme-li jinak-a else, stejně jako jsme zvyklí v C.
>> Také byste měli být velmi pohodlná hned bat se smyčkami,
protože se také podívat hodně jako C vypadá.
Ale všimněte si, že jsme znovu mají místo int initializations,
máme var inicializace.
A myslím, že máš dávat pozor, aby se
jisti, že nechcete změnit hodnotu I z int na řetězec,
například proto, že to bude způsobit podivné chování, které možná ne
očekávat.
Ale to by mělo vypadat docela známé, stejně.
>> Takže tohle je místo, kde se věci začnou z toho trochu blázen v JavaScriptu
pro někoho, kdo se chystá od A Dosavadní stav C. U některých funkcí
v JavaScriptu, a tam je jeden způsob, deklarovat funkci, která vypadá
druh podobná C, a pak je tu ještě jeden, který
vypadá trochu jinak.
>> První verze, které můžeme vidět tady,
je druh C-like, kde říkáme, je to funkce,
dát mu jméno, dej počet argumentů,
A pak se obsah funkce dovnitř těchto složených závorek.
Uvidíme příklad argumenty jen sekundu.
>> Vzhledem k tomu, na dalším řádku, vidíme, oh, tady je proměnná s názvem "myFunction,"
a my to rovna této obecný thing-- function-- že
Nezdá se, že mít něco děje.
Důvod, proč to je něco jiného než C je, že JavaScript
je to, co se nazývá funkční jazyk, nebo má funkční prvky, což znamená, že
že funkce jsou ve skutečnosti hodnoty.
A to znamená, že můžeme nastavit proměnná, aby se rovnala funkce
a přesuňte tuto funkci kolem, předat jako argument,
dělat všechny druhy věcí takhle s funkcemi.
>> Ještě jedna věc k note-- funkce jsou zapsány
s určitým počtem argumentů.
Uvidíme příklad funkce s argumentem na další snímek.
Ale JavaScript nebude křičet na vás, pokud se pokusíte
použít funkci s nesprávný počet argumentů.
Bude to jen co je v jejích silách, aby se ano, což znamená, že pokud jste projít,
volání funkce, která očekává Argument s žádný argument, že všechny
se stane, je, že to co nejlépe aby se pokusila spustit tento kód,
a je-li to nakonec vede do výjimky nebo chyby,
to bude hodit tuto výjimku a jen držet going-- což je jen jedním ze způsobů,
že JavaScript funguje.
To jo.
>> Diváků: Co se stane v případě, je tu příliš mnoho argumentů?
SAM ZELENÁ: Takže Otázkou bylo, co se stane,
pokud existuje příliš mnoho argumentů?
A odpověď je, že JavaScript bude jen
ignorovat ty, které jsou po ty to očekává.
Bude pokusu o spuštění funkce říkají, jako kdyby to byl jen první dva.
Právo?
>> Hugh Zabriskie: To je pravda, jo.
Podobně, v případě, že jsou příliš málo argumentů,
to prostě druh dává null všem Argumenty, že nemá žádné hodnoty
pro.
>> SAM ZELENÁ: který může ve skutečnosti být užitečné, pokud jste
Chcete napsat funkci, která trvá proměnný počet argumentů.
Můžete nastavit výchozí hodnoty definice funkce,
a to může ignorovat skutečnost že vstupní tam není.
Tak jsem chtěl mluvit trochu Více informací o této poslední kulkou
bod, což je funkce jsou hodnoty.
Toto je příklad, který je trochu ohromující
pokud jste četli, a nemyslím, že o tom, co se děje na vteřinu.
Takže, pojďme se podívat právě v první řádek sem.
Máme této proměnné, f1, že říkáme je funkce, která dělá tuto věc.
A obsah funkce jsou console.log ("ahoj").
Můžete si myslet console.log jako při JavaScript ekvivalent printf.
Takže to, co se stane, je, pokud budeme Tento kód spustit v naší prohlížeči,
to bude vytisknout řetězec.
Mohu prokázat, že.
Publikum: Do protokolu, i když, to dělá znamenat, že to nahrává někam?
SAM ZELENÁ: Jo.
Takže já ti ukážu, co se bude dít.
Takže otázka byla, co log znamená?
>> Hugh Zabriskie: Takže console.log je jako printf pro C.
SAM ZELENÁ: Takže console.log je jako printf,
takže když mám tuto console.log ("ahoj"), a já říkám, že řetězec "ahoj"
se vytiskne se do konzoly.
To je konzole.
Je to stejné jako printf, kde vytiskne na standardní výstup.
A uvidíme za minutu, ale toto je ve skutečnosti
s odkazem na objekt konzoly, a volání metody na tento objekt.
To bude větší smysl za minutu, kdy jsme
dostat se mluví o objekty v JavaScriptu,
ale myslel jsem, že bych jen zmínit, že.
Hugh Zabriskie: Jsme používá v C, right--
obvykle napsat velký program, v hlavní nic dělat.
Ale to, co je v pohodě v JavaScriptu je budete tento druh tlumočníka, který
probíhá v reálném čase, takže je trvá jen řádek po řádku,
to může jen interpretovat, že na místě.
A to udržuje věci, které proběhne před,
takže je to docela užitečný nástroj pro použijte console.log, nebo konzoly,
Obecně platí, že jen za hraní kolem JavaScript.
>> SAM ZELENÁ: Takže návrat k tomu example-- druhý řádek kódu
Zde je docela šokující v mé hlavě.
Když jsem poprvé četl to, Bylo to jako, co se děje?
Takže to, co se děje, je to deklarace funkce říká,
Mám funkce nazvaná f2 že je čeká jeden argument, f,
a pak to volá, že funkce, f, který
byl předán k němu jako argument bez argumentů sám.
Tak, to by mohlo být matoucí.
Pokud chápeme to jako f2 bere f1 jako argumentu, a potom uvnitř f2,
f dostane called--, což znamená, že tento řádek kódu,
po těchto dvou řádků kód, výsledky v "ahoj"
tištěn na konzoli.
>> Skutečnost, že jsme se projít Funkce kolem jako hodnoty
nakonec je jedním z nejvíce výkonné funkce v JavaScriptu
jako programovací jazyk.
Mimo všechny úžasné věci, to může udělat,
stejně jako funkce z jazyk z hlediska způsobu, jakým
že dělá věci snadné programovat a umožňuje
pro věci, které nejsou zvlášť hodí na web,
funkcionální programování a funkční programování aspekty JavaScriptu
je jedním z nejvíce silné pojmy, které
existuje v JavaScript-- pokud se mě ptáte.
Bezva.
>> Takže, další věc.
Kromě toho, že je funkční, tam jsou také prvky JavaScriptu
které jsou objektově orientovaný, což je jedním z velmi
populární slůvky v informatice.
Objektově-orientovaného programování je velmi populární věc.
JavaScript má verzi, která, kde věřím, že každá hodnota je také
objekt, což znamená, že každý objekt zábaly dohromady určitý počet hodnot.
Takže pro hodnoty, které jsou jednoduché, jako je celé číslo, jako je varX se rovná 5,
že objekt ještě zabalí tuto jednu hodnotu.
>> Ale můžeme si také představit situaci, where-- můžeme myslet situace v C
kde jsme chtěli dělat něco s structs,
například, že zábaly několik Hodnoty dohromady a značky
je to opravdu snadné projít věci kolem.
To je, když je objekt v JavaScriptu.
>> Je důležité si uvědomit, když řeknu, že předměty zabalené
některé počet hodnot společně, že funkce jsou také
hodnoty, což znamená, že funkce je být také uvnitř objektu JavaScriptu.
A důvod, proč to je důležité, je to, že, vzhledem k tomu, často
myslet na volání metody na objektu, který je
populární termínu od ostatní populární objektově orientované jazyky,
jeden z rozdílů je to, že všechno, že metoda je v JavaScriptu
je-li hodnota uložena uvnitř objektu že provádí některé action-- možná
pomocí další hodnoty, které jsou uvnitř z tohoto objektu, ale ne nezbytně.
Takže si dovedete představit situaci, já Asi v trochu bláznivé cesty,
kde jste volali metodu jednoho objekt na jiný objekt, například.
Takže, je to trochu funky tímto způsobem.
>> A můžete také změnit metody které jsou spojeny s objektem
přiřazením této metody A nová funkce, která je rovněž
docela odlišný od jiných objektově orientované jazyky, kde
jakmile budeme deklarovat objekt a instanci ji,
nemůžeme změnit metody, které jsou spojené s tímto objektem ještě.
Tak to je docela jiná.
Bezva.
>> Takže tady je příklad, jako první, objektu v akci.
To je to, co se nazývá obecný objekt, který
znamená, že nemá žádné zejména název, nemá třídu,
je to jen nějaký obal hodnot.
A jak to vypadá, je, my máme tato vnější dvojice složených závorek zde
které ukazují na JavaScriptu a říkají, to je objekt.
Hodnoty uvnitř něj jsou každý hodnoty uvnitř
objektu, který by měl být zabaleny dohromady.
A vnitřní části tohoto objektu, Pak jsme se dvojice klíčů hodnota,
kde klíč odkazuje na název hodnoty uvnitř objektu,
a druhý side-- naproti tlustého střeva here--
je skutečná hodnota že by měly být skladovány.
>> Takže vidíte, že tady máme klíč s názvem fn s hodnotou sam,
následované čárkou, říká na další položku.
Pak se klíč nazvaný ln, s hodnotou zelené,
následované čárkou, následoval "tisku,"
která bude mít funkční hodnotu která se bude dělat tento řádek kódu.
Pojďme se o krok zpět a rozbalit, co se tady děje.
Tak to je trochu složitější, a vidíme něco nového,
poprvé.
"This" klíčové slovo je nová věc vidíme tady, a co to dělá
je, se odkazuje na proud objekt v rozsahu, že jo?
Takže když říkáme, to upozorňuje na celou cestu zpět
do celého tohoto object-- když budeme dělat this.fn,
budeme jít celou cestu zpět K tomuto objektu, jděte na hodnotu fn
a dostat se sam, vytáhněte ji celou cestu zpět, držet to tady, a pak jít dál.
>> Diváků: Tak s vyhledáváním, je že učiněno, protože parametru
definice?
SAM ZELENÁ: Otázkou tedy bylo, je vyhledávání provedeno kvůli parametru
definice?
Jo, určitě.
Co se bude dít tady je, Tento bod říká JavaScriptu,
OK, já jsem stále nějakou hodnotu z tohoto objektu od sebe.
A pak se to bude vypadat na záznamu volal fn, a pokud se najde,
to vrátím, že value-- tak, že je to sam.
Ale já jsem mohl také zadali něco, co se tu není definován,
a pak by to prostě vrátit undefined-- který
je věc, která může JavaScript dělat, což může mít výhody,
ale je to also-- pokud uděláte překlep, to může mít za následek chyby podivné.
Takže to bude jen snažit najít co řeknete, že najít
a to nebude stěžovat, pokud nenajde ji.
Bude to jen říct, že jsem neudělal najít, a pak jít dál.
Tak to by bylo nedefinované, a prázdné, a příjmení.
To jo.
A pak můžeme vidět, že pokud budeme by pak mohla jít dolů a access--
a říkáme tf.print () s závorkách.
Bude to volat, že tisk funkce bez argumentů, že jo?
Ale pokud budeme právě řekl tf.print () středník, bez závorek,
vše, co by měl udělat, je vytáhnout out funkce od hodnoty,
ale ne ve skutečnosti to nazval.
Bezva.
Hugh Zabriskie: Měl uděláme objekt?
SAM ZELENÁ: Jasně, pojďme to udělat.
Tak jsem to může pohnout Příklad do konzoly.
Můžeme si představit, že mám objekt.
Takže tohle je jednoduchý objekt.
Jedná se o objekt, který obsahuje dvě Hodnoty se dvěma tlačítky, dvěma klíčovým hodnota
páry.
Tak jsem se pak může přistupovat hodnoty uložené uvnitř tohoto objektu tím, že dělá x.x1,
Například, a já si 1 Zpět.
Stejně tak, x.x2, dostat tuto hodnotu zpět.
>> A teď opravdu cool věc je, můžu ve skutečnosti přidat něco k tomuto objektu
poté, co jsem ji vytvořili.
Takže si dovedete představit, pojďme že mám funkci.
>> Hugh Zabriskie: Vy musíte udělat, Shift-Enter.
>> SAM ZELENÁ: Oh, to je nepříjemné.
Co se to nelíbí?
Ó.
Tady jsme.
Bezva.
>> Tak jsem právě vytvořili tato funkce, f, že
se chystá jít do proudu objekt a tisk this.x1.
Takže když jsem se zavolat f o sama o sobě, nic se děje
se stane, doprava, protože tam není žádný x1 pole v objektu je to s odkazem na.
Ale, když řeknu, x.f = f a pak jsem volejte x.f (), budu se dostat zpět 1.
Tato funkce f je nyní spojené s objektu x,
který má klíč nazvaný x1 spojené s hodnotou 1,
Takže když říkáme this.x1, to je bude najít to, co je to hledá
a musí být schopen vytisknout hodnotu ven.
Tak to je jen jeden příklad z druhu šílené věci
můžete dělat s objekty v JavaScriptu.
>> Takže tato verze byla generické verze, význam
že jsme vytvořili objekt pomocí tohoto závorky notation-- ortéza notaci,
rather-- a to je my jen chceme vhod, pokud
jeden výskyt určitého objektu, ale co když chceme mít více než jeden
stejného druhu?
A odpověď na to Otázkou je, tam jsou věci,
volal třídy v JavaScriptu stejně.
Můžeme vytvořit funkci, která dělá nějaký inicializace
na cizí těleso, a my bychom říci, stejně jako,
mé class-- tak názvu opětovně použitelné object--
rovná se funkce, která jej nastaví.
Takže to, co by to bylo ekvivalentní aby je vytvoření objektu, který
bude stejně jako, složená závorka, str, tlustého střeva,
to je řetězec, středník, složená závorka.
To by byl obecný Objekt jsme inicializovat,
s tím rozdílem, na Následující řádky jsme se vytvořit prototyp, který
znamená, že je výchozí klíč, který přidáme do našeho objektu, který
má hodnotu jsou zde uvedeny.
To znamená, že, když jsem vytvořit novou instance tohoto MyClass objektu,
to bude mít pre-postavený uvnitř to je hodnota, s názvem str a jiné hodnoty
s názvem myPrint, což je Bude to fungovat.
Skvělý.
>> Skvělý.
Takže poslední věc, říkají o JavaScriptu
je to, že je to opravdu užitečné, za co se nazývají asynchronní operace.
Asynchronní znamená, že my můžete čekat na nějakou operaci
dokončit dříve než přejdeme , ale dál, když budeme čekat
a pak se něco stalo později.
A co tím myslím, že je, vy Lze si představit situaci, kdy
odeslat požadavek na některé web server někde,
a to bude poslat tě zpátky nějaký velký kus dat, že jo?
A váš uživatel může čekat v mezitím aby se tak stalo,
a nic nemůže být děje v té době.
Ale to není skvělý design, je to tak?
Nechcete, aby webová stránka zmrazit.
Co se v případě, že chce uživatel klikněte na drop-down menu?
Není to skvělý design vzor.
Místo toho, v podstatě to, co JavaScript dělá se říká,
OK, tuto operaci asynchronně.
Tak jako, čekají v pozadí, a pak, když je operace provedena,
zavolat zpětné volání function-- zavolat nějakou funkci,
Do některých action-- signalizuje, že Provoz jsme čekali až do konce
je konec.
A důvod, proč to je super výkonná je, můžeme něco udělat, předat argument,
něco udělat, a pak čekat až se něco stane.
Poté, když byla tato něco dokončí, můžeme zavolat zpětné volání.
To je opravdu užitečné, protože to umožňuje nás dělat věci s Web Audio API,
Například, jako je načtení zvukový soubor ze vzdáleného serveru
aniž by museli čekat na celý zvukový soubor má být naloženo,
což by bylo opravdu špatné pro uživatelské zkušenosti.
Bezva.
>> Posledních pár bere na vědomí, o ladění, protože tato
je věc, kterou budete muset udělat, jako součást svého projektu, se zárukou.
Zmínil jsem konzoli JavaScriptu.
Je to super užitečná funkce všech moderních prohlížečů,
A my opravdu povzbudit, abyste si pohodlně používat konzolu,
pokud chcete získat dobrý v JavaScriptu.
Je to super užitečné pro ladění, ale je to také
opravdu užitečné pro zjišťuje to, jak používat API.
Umožňuje opravdu snadné experimentování
aniž byste museli psát nějaký kódu, a potom kompilovat.
Nemusíte dělat všechny tyto kroky.
Stačí si jen napsat nějaký kód do řady,
a pak získat okamžitou zpětnou vazbu na zda je tento řádek kódu, nebo ne
worked-- velmi šikovný.
>> A také, jen jedna technická note-- konzola JavaScript je příkladem
o REPL-- takže to je R-E-P-L, REPL, což je zkratka pro čtení, hodnotit,
print smyčky.
Budeš psát nějaké věci in, tak to si přečíst, co jste zadali v,
to bude hodnotit, a to bude vytisknout výstup, a pak to bude začít znovu.
To vám umožní rychle jít kruhy iterací, který je opravdu cool.
>> Myslím, že skutečný Last note-- to je skutečná poslední poznámka, ano.
Jak můžeme vlastně používat JavaScript?
Takže nejprve, můžeme dovážet jej pomocí tagu script
v horní nebo dolní části HTML file-- kdekoliv uvnitř souboru HTML,
opravdu.
A v rámci tagu script, existují dvě dílčí způsoby importu JavaScript.
Prvním z nich je tím, že má samostatný soubor JavaScript
že import v plném rozsahu, nebo tím, že oblast kódu, jako je skript
spustit, a poté zpětné lomítko skript ukončit.
A pak jsme prostě napsat JavaScript uvnitř souboru HTML.
To jsou dva způsoby.
Můžete ho mít uvnitř HTML.
Diváků: Je jedním lepší než ostatní?
SAM ZELENÁ: Otázkou bylo, je lepší než ostatní.
Takže, ano, jako kódování styl praxi, a také je to jako projekční praxi.
Existují dva důvody, proč by to mohlo být lepší.
První je, že to je váš kód mnohem lépe čitelné všechny vaše HTML
je na jednom místě, všechny vaše CSS je v jiné místo, všechny vaše JavaScriptu
je na třetím místě.
Právo?
Myslím si, že jsme měli již hovořili o tom v sections--, jako to, co CSS--
že je-- a to jde často v jiném souboru.
Tak, podobný druh pojetí sem.
Můžete si také představit, že JavaScript by být znovu použity na více než jednom
HTML stránka, nebo možná Velmi mnoho HTML stránky,
a mít takový JavaScript refactored do jednoho
soubor, který můžete importovat do více než jednoho místa
umožňuje kód bude mnohem více udržitelný.
Můžete si představit, takže jeden změnit JavaScriptu
a museli jej změnit ve 100 různých souborů.
A místo toho můžeme jen to změnit v jednom, což je způsob, jak silnější.
Už jsem odpověď na vaši otázku?
Bezva.
>> Můžeme také zadat do konzole, jak jsme se již zmínil dříve.
A opět, poslední note-- Web Audio je postaven v,
nemusíte nahrát nic.
Bezva.
Jsou nějaké dotazy, máte jakékoliv další otázky týkající se JavaScript,
než jsme dál?
>> Diváků: [Neslyšitelné]
SAM ZELENÁ: Dobře, v pohodě.
Tak teď to bude mluvit o API.
>> Hugh Zabriskie: cool.
Díky, Sam.
>> SAM ZELENÁ: Jistě.
Hugh Zabriskie: Super, takže budeme dál od JavaScriptu.
Takže jsme mluvili o některých náležitosti JavaScript,
a ty, které jsou proměnné, funkce, objektů, funguje jako proměnných,
asynchronní zatížení.
To vše jsou věci, které budete vidět, jak budete používat na webu Audio.
Takže jsme jen mluvit o to nejprve na vysoké úrovni.
>> Je to API, takže je to něco, , který je postaven, jak řekl Sam,
přímo do JavaScriptu které používáte v konzole.
A je to vlastně jen jako C ++ kódu To je opravdu postaven do prohlížeče Chrome
a Firefox, a všechny z těchto prohlížečů.
Takže hlavní myšlenka s webu Audio je, že máte
tento druh potrubí audio, že jo?
Takže vaše audio data přichází v v nějaké formě.
>> Existují tři hlavní druhy forms-- máte oscilátor, který
vytváří sinusoida, cosine vlna, budeme vidět, jak to funguje.
Dalším velmi častým jednoho, Samozřejmě, je MP3.
Takže možná začnete s píseň, a pak
chcete udělat nějaké filtrování k tomu a výstup
that--, že by mohl být možným zdrojem.
A pak se opravdu cool jeden je mikrofon.
Takže můžete použít některé velmi Základní volání v JavaScriptu
získat přístup k mikrofon, takže pokud jste
chtěl, aby aplikaci jako detektor stoupání,
například, že se v váš hlas a zjistí
pitch-- velmi snadný způsob, jak na to.
Stačí si jen trochu číst in, zjistit frekvenci,
a pak výstup číslo.
Tak uvidíme, jak to funguje, stejně.
>> Cíl je v podstatě kde je audio data je na výstupu.
Takže obecně, to je jako váš laptop reproduktory.
Další možnosti jsou jako ScriptProcessorNode--
se dostaneme uzly v second-- ale v podstatě,
Buď jste uvedení zvuk ven prostřednictvím vašeho počítače přes reproduktory,
nebo jste druh záznamu, tak jste ukládání jako audio data.
Takže možná pokud někdo vytvoří hudba v vaší aplikaci a poté
Chcete-li nahrávat, že a možná jako exportovat do SoundCloud, pro example--
že by byl jeden způsob, jak to udělat.
Všechny zábavné věci, které budeme mluvit o,
se stane, mezi těmito dvěma body, kde jsme nahrát v hudbě
a pak se na výstupu.
>> Takže budu mluvit o pět etapy zvukovou produkci v druhém.
Máme tuto věc zvanou AudioContext, který
je tento malý wrapper zde vidíme.
V podstatě to, co AudioContext je-- kdybychom přejít na JavaScript konzole právě teď,
můžeme vytvořit právě teď.
Jen příklad REPL, že jo?
Jsme čtení, vyhodnocování, a vytiskne.
>> AudioContext je globální stát.
Je to struct, je to objekt tady, a udržuje informace
o věcech, které se na Na obrazovce se zvukem.
Jedním z příkladů je aktuální čas.
To vám řekne číslo sekund, velmi přesně,
protože webové stránky vložen.
Tak tohle je opravdu užitečná malý majetek, který můžete použít.
Je to četl only-- Myslím si, že ve skutečnosti můžete zkusit nastavit to hodnotu.
To vám řeknu vám to nastavit, a pak, pokud ji vytisknout
again-- to dělalo ne vlastně docela práci.
Takže tam jsou jen pro čtení vlastnosti v JavaScriptu.
To je opravdu užitečné, pokud jste trochu synchronizaci
hodně jiný informace, když jste
druh hrát různé zvuky.
>> Dalším opravdu užitečné jedním je kontext cíl.
Určitě, pokud máte zájem, bude se snaží to na vlastní konzole vpravo
teď.
Tak tohle je AudioDestinationNode.
V podstatě, co to říká, je, pokud se výkon jde?
Takže existují dvě reálné možnosti zde.
Obvykle výchozí je jen reproduktory,
tak AudioDestinationNode v podstatě jen říká,
tam jsou nulové výstupů do zvuku přichází, poslán do reproduktoru.
Takže obecně, vy ne muset hrát s tím.
Máte-li zájem o vlastně používat ScriptProcessorNode pro záznam,
Rozhodně mě zastřelit e-mail později, protože to je
o něco složitější.
Ale obecně, jsi jen trochu pro výstup zvuku v určité formě.
Tak v pohodě, budeme skákat sem.
Diváků: Je mi to líto.
Hugh Zabriskie: Jo.
Diváků: Vím, že jste řekl, mluvit se později o nahrávání.
Můžete rozhraní, které s Pro Tools?
>> Hugh Zabriskie: S Pro Tools?
Uvidíme.
To si nemyslím.
Tak se mezi klientem, což je JavaScript
konzole, a vaše skutečné počítač, je obecně
něco, co je druh off limitů, pokud jste
bude, něco z povahy the-- je to trochu designu věci,
ale budete snažit, aby prohlížeč oddělené z aktuálního počítače uživatele.
Obecně platí, že jediná věc, kterou jste schopni Přístup je mikrofon nebo kamera.
Nejste schopni, I si nemyslím, použijte Pro Tools.
Nicméně, pokud jste vytvořili stopa v Pro Tools,
vyváženy, že byste mohli nahrát, že sem, filtrovat, například,
Proces, který, a zaznamenat, že do Audio Destination-- nebo no-- koule
Uzel procesoru.
A pak odtud, mohl byste exportovat, že pro SoundCloud, vás
mohl odeslat e-mailem, nebo co se vám líbí odtamtud.
>> Ale je tu trochu mírné bariéry mezi dělat hudbu na počítači
a dělat hudbu on-line.
>> SAM ZELENÁ: A to je nejsou jedinečné tohoto API.
Je to bezpečnostní funkce Chrome, a Myslím si, že všechny ostatní moderní prohlížeč.
Prohlížeč je soběstačný.
Tak například, webová stránka nemůže používají JavaScript otočit zvuk
Na na reproduktorech, například.
Nebo to nemůže vypnete počítač.
A není tam žádný vnitřní bod Mezi těmito dvěma věcmi, vpravo,
takže buď máte kompletní abstrakce,
nebo si otevřít bezpečnostní chybu nechat
programátor se špatnými úmysly dělat co chtějí se svým notebookem.
A to je důvod, proč Chrome je soběstačný.
>> Hugh Zabriskie: Jo.
Dává to smysl?
Cool, cool.
Byl jsem prostě jít ukazují příklad jednoho.
To je do značné míry jako pokud se dostanete, pokud jde
přístupu k počítači uživatele.
Máte-li klávesnice USB zapojen, můžete použít něco, co nazývá Web
MIDI API, které nebudeme opravdu mluvit o tady,
ale to je další API, které je vestavěný do alespoň Chrome-- znovu
To je důvod, proč milujeme Chrome-- Myslím si, že Firefox nebo Safari,
to je jednoduchá věc google-- různé prohlížeče mají
odlišný podpora pro něž API, které provedly.
Ale pokud byste chtěli připojit klávesnici a pracovat s těmito informacemi,
druh poslat klávesnice Informace se k počítači
a pak použít že on-line, toto rozhraní API je místo, kde byste pracovat, že.
>> Bezva.
DOBŘE.
Takže, rychle se pohybující se tady na.
Jak jsme na tom s časem?
>> Reproduktor 1: O 15.
>> Hugh Zabriskie: 15 minut odešel?
OK v pohodě.
Takže budeme závodit kupředu tady.
>> Takže v podstatě, hlavním bodem myslet na to jako potrubí
je to, že každý krok v potrubí je série audio uzlů.
Náš zdroj, řekněme, je oscilátor.
Musíme vytvořit uzel oscilátor.
A to je jen tak malého function--
a oni jsou založeny out audio kontextu zde.
>> Diváků: Když to řekl, oscilátor, znamená to, že
je to vlastně doslova jít od dva různé póly tam a zpět?
>> Hugh Zabriskie: Ne, je to jako digitální reprezentace.
Je to vlastně implementována v C ++.
Já vlastně nevím specifikace o tom, jak je to vlastně provedena,
ale to vše se pracuje jako binární data.
Vlastně ano.
To by bylo říkat, jsem mohl ve skutečnosti, pokud máte zájem,
Mohl bych vám poslat trochu více Informace o tom, jak průběhů
jsou udržovány s digitálním formátu.
OK v pohodě.
>> Takže jsme generování tónu jako sine mávat, nebo něco takového, možná
440 Hertz.
Tvoříme oscilátor.
Chceme-li nastavit hlasitost, my připojit něco k GainNode,
které jsme mohli udělat s .creategain.
To nastavuje hlasitost.
Můžete si projít, že na jakýkoli druhého options-- dobře,
tak zvukový zdroj vyrovnávací uzel je místo, kde byste mohli
uložení MP3, které jste založeného v.
>> SFB filtr je pro filtraci, pokud Chcete-li mít všechny základny ven
písně, nebo něco takového.
Nedej bože, chcete, aby se základna z písně.
A AudioDestination uzel je, opět, jako kde je naše dokončení je.
Pokud jste někdy zájem vidět všechny různé možné varianty,
stačí jít na kartu a nechat auto-kompletní přijít.
A pokud nechcete vytvářet, uvidíte všechny různých věcí, které můžete vytvořit.
Můžete vytvářet dynamické skript procesory,
Já ani nevím, co to je, pro míchání fúze kanálů
a kanál štípačky a to všechno.
Bezva.
>> Takže je to jen Příklad potrubí.
Takže máme tři zdroje přicházet.
Možná, že to jsou průběhy, Možná, že se jedná o MP3.
Jedna se děje prostřednictvím filtr, další je
dostat zkreslený další něčí rýžování vlevo a vpravo.
Můžete dělat všechny druhy věcí a Všichni zaplést kolem dohromady,
a potom ven vychází zvuk na konci, jako cíl.
Toto je příklad toho, co více komplikovaná Web Audio kód vypadá.
Budete vytvářet všechny tyto různé objekty vpravo here--
Nejsem si jistý, o tom.
Ne, to není přiblížit.
DOBŘE.
>> SAM ZELENÁ: Děláte Control, procházení nahoru.
Hugh Zabriskie: Control Scroll--
SAM ZELENÁ: Ne, ne.
Řízení--
>> Hugh Zabriskie: Oh, Control, Posunout?
Oh, gotcha.
To jo.
Wow, Ne, kdepak.
DOBŘE.
Nebudu to dělat.
>> Tak jo, v této první Sekce tady, vidíte
vytváříme všechny tyto různé uzly z kontextu.
Právě jsme jim vysprávka společně v druhé části
V této funkci s názvem Connect.
To je opravdu klíčový Funkce ve Web Audio.
To jen znamená, že poté, co jste udělal něco se zvukem v jednom uzlu,
přenést je na další uzel.
Takže máme zdroj, jej se připojí k analyzátoru,
analyzátor dělá něco s ním, to jde ke zkreslení, a tak dále,
a na místo určení vpravo dole zde.
Bezva.
OK, takže budeme držet dál.
>> Opět se pipeline--, tito jsou nejčastější potrubí,
proto hovoříme o všech těchto věcech, jako je zkreslení, rýžování, tohle všechno.
Pokud máte opravdu zájem při použití věci Pro Tools,
ty, které pravděpodobně zajímat.
Pokud ne, možná jste právě chcete přehrát zvuk,
nebo možná jen chcete nastavit hlasitost zvuku.
To jsou dva nejčastější druh z potrubí ve výrobě zvuku.
>> Opět platí, že způsoby, jak můžete vzít V jako oscillator-- tak, pojďme
udělat demo toho tady.
Takže jdeme na vytvoření jednoduchý audio kontext tady,
a od toho jdeme vytvořit naši oscilátor.
Takže to je, opět, jsme jen zavolá vytvořit oscilátor.
Budeme nastavit frekvenci na že 440 Hertz, každého z nás oblíbený.
Pak jsme připojit, že na místo určení point-- což je reproduktor, takže
kontext cíl.
Nakonec jsme jen říct, start nula sekund od teď, a my jsme zvuk?
>> [ZVONENI]
>> Hugh Zabriskie: Jdeme na to.
Je to jen sinusoida.
OK v pohodě.
A pak budeme nech toho.
>> Publikum: Kde se že zpětná vazba pochází?
>> Hugh Zabriskie: Zpětná vazba?
Oh, pravděpodobně naše mikrofony.
Tak jo, to je to, jak to udělat.
A vlastně, kdybych měl stále je spuštěna,
může mít frekvenci hodnota, jak je to běh,
tak to je zábavná věc pohrát.
Bezva.
To je vždycky krásný člověk představit.
>> SAM ZELENÁ: My jsme ne přemýšlet o tom, jsme?
Hugh Zabriskie: Jo, to je ošklivý člověk.
Takže, vyrovnávací loading-- budu ukázat Příkladem, že na samém konci.
To je načtení MP3.
A mikrofon, můžete použít jen funkci nazvaný Navigator.getUserMedia ()
požádat o přístup k uživatele mikrofon pro tuto informaci.
>> Zde je filtrování, budu Jen dál z tohoto.
To je docela vysoké úrovni, ale filtry jen vám umožní
>> [Pípání]
Filtrování také umožňuje vytvořit věci jako růžová
hluk, hnědý šum, bílý šum.
Chcete-li vytvořit čistý hluk, který Někteří lidé milují, aby nepořádek kolem,
můžete použít aplikaci Web Audio filtrování to udělat.
>> Audio Panning-- tak si představte pokud píšete hru
a chcete, aby se zvuk do znít jako to přichází, stejně jako,
střílí po celé obrazovce, můžete použít posouvání ze zvuku
vytvořit tento druh kužele, který jako-- je to docela Mathy,
ale ve skutečnosti je to opravdu pohodě, pokud si to práce,
a tam je nějaký dobrý návody na to, že vám mohu poslat.
V podstatě, můžete si laskavý o vytvořit zvuk
něco děje kolem v 3D způsobem.
A pokud máte zájem DJ, můžete spusťte míchání a cross blednutí písně.
>> To je jen nějaký velmi jednoduchý kód, v podstatě to, co jsem dělal předtím.
Toto nastavení objemu oscilátor, takže jsme vytvořit naši oscilátor
což vytváří tvar vlny.
Vytváříme naši GainNode, set naši frekvenci,
a pak připojte oscilátor k GainNode, který pak v podstatě změny
kolik signálu je povoleno projít.
Ale opravdu, je to digitální věc, tak je to víc jen-- jo.
To není to, co se skutečně děje, ale to je to, co se děje v reálném životě
se ziskem.
>> Publikum: --quantization parametru objemu?
Hugh Zabriskie: Sorry?
Diváků: je to kvantovaný objem parametr?
Hugh Zabriskie: Jo.
A to je jedna věc, že ​​jsem opravdu deficitem v mém znalostech,
Jak zisk pracuje na digitální úrovni.
Vím, že se skutečné signály, je to v podstatě
kontrolu, kolik jste zesílení signálu.
Tak jo.
Pošlu vám více informací o to, protože bych byl opravdu zvědavý
vědět více o tom.
Ale v podstatě parametry jsou, z nich je fold--
hlasitější signal-- a nula není signál, nebo nebudete slyšet žádný zvuk.
Budeme přeskočit demo čas na to, protože je to v podstatě to, co jsem dělal předtím.
A opět se Context.Destination je audio cílovým uzlem.
Super, OK.
>> Takže budu dělat rychlé dvě dema.
Jak jsme na tom s časem?
>> Reproduktor 1: Asi 10 minut.
>> Hugh Zabriskie: 10 minut?
Skvělý!
Skvělý.
>> Takže první, budu to, je to jen moje oblíbená píseň.
Tak to je jen malý HTML JavaScript.
Budeme mít dvě tlačítka Na stránce přehrát svůj oblíbený song
a zastavit mou oblíbenou píseň.
Budu změnit.
>> Diváků: Zakryjte mikrofonu.
>> Hugh Zabriskie: Jo.
A já jsem v tu naloženo skript, který basically--
a to je velmi užitečné pro načtení MP3,
tak to prostě dělá načítání souborů MP3 cestu rychleji.
Je to v podstatě jen o obal.
To prostě dělá proces načítání MP3 mnohem rychleji,
jinak jste pomocí HTTP požadavku, něco jako to, co jsme dělali
na aktuálním dílný s Server.
Je to opravdu ošklivý, vy nechci to dělat.
>> Takže ten chlap, Boris MSP, napsal opravdu užitečný malý nástroj nazvaný BufferLoader.
Vše, co udělat, je jednoduše předat jej na kontext, vy to list-- projít
nebo, jo, je to seznam v JavaScriptu?
SAM ZELENÁ: Pole.
Hugh Zabriskie: Oh, to je pole, to je pravda.
Je to řada cest na různých souborů.
A pak se to funkci projít.
To je zpětné volání, že mluvíme o s asynchronním zatížení.
Ten se bude jmenovat Jakmile jsou soubory načteny.
A to funkce, která je volána při Soubor je načten bere jako obvod
Pole zatížených nárazníky.
Tak, že dojde k sem.
V podstatě, je BufferList bude jedním value--
nebo to bude řada Délka člověk, který má v ní v indexu
nulu celý načtený soubor MP3.
Takže to, co mám dělat, když jsem dokončit zatížení je, já prostě
vytvoření zdroje vyrovnávací paměti, který je zdroj zvuku vyrovnávací paměti uzel.
Dalším krokem je, že zatížení ve source.buffer jako plná načteného vyrovnávací paměti
z BufferList-- je to hodně buffers--
a pak se připojit, že zvuk vyrovnávací paměti na místo určení.
Tak co to bude dělat je prostě dát MP3
rovně na výstup, a okamžitě se spustí jej
po získání této hovor.
>> Cool, takže uvidíme, se to stalo v akci.
My [neslyšitelný] tady, pojďme se podívat.
Takže jsem prostě jít spuštění základní server.
To je něco, co co musíte udělat, pokud jste
takže požadavky na načítání souborů.
Chystám se začít základní server.
To je v podstatě vaše celá Pset právě teď v jedné linii,
ale je to právě začíná server na portu 80/80.
Tak jsme se jít sem, my chystá nahrát 80/80,
budeme jít na svou oblíbenou píseň.
Takže když jsem hit "hrát svou oblíbená píseň "právě teď,
to bude načíst můj oblíbená píseň a hrát to--
[MUSIC - orli, "Život v FAST PRUH"]
--which se stane být "Život v rychlém pruhu "od The Eagles.
Teď bych mohl zasáhnout "Stop my oblíbená píseň "a přehrát ji.
>> [MUSIC - orli, "Život v FAST PRUH"]
>> A když jsem se přejít na utěšit, protože Použil jsem globální proměnné sem
sledovat této hodnoty, je ve skutečnosti Nyní bude uznána v konzole.
Takže to auto-vytváří pro mě.
Tak to je to, co se hraje právě teď, a já si prostě zavolat source.stop ()
na to.
No, víte co?
Jen tak vy jste slyšeli song-- můžete poznat tuto píseň.
>> [MUSIC - Rick Astley, "nikdy dát YOU UP "]
[MUSIC - orli, "Život v FAST PRUH"]
Nyní jsme všichni Rickrolled.
OK, skvěle, pohybující se na.
Bezva.
Takže to je v podstatě příklad jak byste mohli nahrát MP3 file--
[MUSIC - orli, "Život v FAST PRUH"]
--and hrát, a zastavit a spustit jej.
Jsem mohl udělat mnohem více [neslyšitelných]
>> Poslední z nich budu dělat, je, Já vám ukážu, a [neslyšitelných].
>> [Přehrávání hudby]
>> Je to jako, ogg.wave.mp3.
Myslím, že, pokud si dobře pamatuji, Já jsem narazit na některé problémy s .m4a,
ale nejsem si jistý, o tom.
Myslím si, že mp3.wave--
>> [MUSIC - Rick Astley, "nikdy dát YOU UP "]
>> OK skvěle.
Neměl jsem řekl, že.
Mimochodem, ahoj.
Takže máme tento otevřený.
Takže teď vše, co udělat, je, že jsem v podstatě vytvořil základní syntaxe pro vytváření hudby.
Takže když to udělám něco jako, přidejte G4 1. 2., co to znamená, že,
přidejte klavír poznámku, G4, která je čtvrtou G
up na klavír ode dna.
Takže to je tak trochu MIDI mluvit, Takže pro ty, kteří jsou na základě hudby,
je to jen MIDI poznámky.
>> Diváků: To je G ze Středního C, ne?
>> Hugh Zabriskie: Toto je G nad středem C, to je pravda.
>> Diváků: nad středem C.
>> Hugh Zabriskie: Jo.
Vlastně ano.
Myslím, že jsem vlastně udělal to jeden [neslyšitelné],
tak by to mohlo být oktáva nad to.
Takže pojďme se podívat.
Pokud jsem narazila Play--
[Opakující se PIANO Poznámka]
--we're bude slyšet.
Myšlenka je, že to funguje stejně jako příkazového řádku by,
takže když jsem jít nahoru a dolů na mé klávesnici, vy
může jít zpět na předchozí příkazy, což je docela užitečné.
A dole je můj seznam skladeb, které jsou všechny běží na smyčce.
>> Diváků: jste za předpokladu, že 88-kláves na tom, že jo?
>> Hugh Zabriskie: Otázkou bylo, mám za předpokladu, že o 88-klíč klávesnice,
a ano, jsem.
To, co jsem udělal je, že jsem v podstatě se 88 vzorky
klavíru, jeden pro každou poznámku.
A tak pokaždé, když vám vyslechnout poznámku od nynějška,
že je ve skutečnosti smyčka, která vypadá jako-- je to stále hraje na smyčce,
takže pro každou poznámku, je to běží.
Co se stane, je, myslím, vytvoření vyrovnávací paměti opět,
I vytvořit uzel zisku pro nastavení hlasitosti.
To jen opravdu komplikovaný způsob, jak říct, že jsem
uložit vyrovnávací paměť v source.buffer.
Dávám mu zisk, já připojte jej k zisku,
zisk je připojena k výstup, a pak jsem hrát.
Takže to je druh procesu of přičemž ve zdroji pufru.
>> Diváků: můžete skutečně vzít suchý zvuk a dělat to mokrý [neslyšitelných]?
>> Hugh Zabriskie: Můžete, jo.
Tam je re-sloveso, je tu zpoždění, zkreslení.
Můžete v podstatě dát cokoliv mezi v tomto sendviči of-- dobře,
Potrubí je lepší metafora, ale můžete přidat něco v tom.
Bezva.
>> Takže budu dokončit demo zde, aby vám pocit
toho jen pouhé kolikrát jste lze spustit tuto funkci najednou.
Takže budu odstranit toto.
Chystám se vytvořit generátor that-- podstatě to, co je to opravdu does--
trochu komplikované, ale je to syntax-- bude vytvářet poznámky na běhu,
a prostě začít hrát je jak vyhodnocuje je.
[Vložením PIANO]
>> Takže můžeme jen aby se trochu hudby zde.
[Vložením PIANO]
>> Takže to, co tento příkaz dělá, například, je
to trvá ty tři poznámky k klavír a pak staví je na B3.
Tato syntaxe by mohl dělat trochu větší smysl
pro ty, kteří mají hudba na pozadí zde.
>> Mohu přidat buben.
Můžu--
>> [Vložením NÁSTROJE]
>> --just hrát si s tím.
>> Takže můžete make--
[Vložením NÁSTROJE]
To je trochu víc nepříjemné.
[Vložením NÁSTROJE]
>> Tak, že náhodně přidá suchý činel na každém 16. notu, s 16%
[NESLYŠITELNÝ].
>> [Vložením NÁSTROJE]
>> Jo, takže jak to works-- je to vždy ve formátu 4: 4.
[Vložením NÁSTROJE]
>> Jo, tak za čtyři čtvrtletí, a 16/8.
[Vložením NÁSTROJE]
>> Takže v průměru dostanete 60% zobrazení 16. poznámky.
>> Tak jako tak, je to jen druh na odiv
některé z věcí, které by mohly stavět s Web Audio API.
Je to opravdu silný, je to opravdu rychle, a můžete udělat spoustu skvělých věcí
s tím.
Takže znovu, všechny otázky, které jste, email myself-- Hugh-- nebo Sam,
a upřímně, Google má tuny dobrých zdrojů.
Nějaká poslední otázky?
To jo.
>> Diváků: Takže můžete přistupovat vestavěný mikrofon.
Co kdyby jste chtěli použít lepší mikrofon?
Hugh Zabriskie: Pokud byste chtěli používat lepší mikrofon?
Takže znovu, toto je součástí abstrakce mezi Chrome
a zbytek vašeho počítače.
Pokud to není k dispozici prostřednictvím API, stejně jako Web MIDI rozhraní API,
by pravděpodobně mohlo najít nějaké hacky, ale obecně ne jako proveditelné.
>> SAM ZELENÁ: Můžete also-- všechny Chrome ví
je to, co vaše výchozí mikrofon je, a to, že přistupuje.
Takže pokud jste měli mikrofon byste mohli nastavit jako výchozí mikrofon počítače,
jste mohli přistupovat tímto způsobem a bylo by to pravděpodobně fungovat.
Hugh Zabriskie: To je dobrý postřeh.
Nikdy jsem se snažil, ale byste měli být schopni druhu
of-- pokud přesměrovat vstupní reproduktor, byste měli být schopni to udělat, jo.
>> Nějaká poslední otázky?
Bezva.
No děkuji kluci tolik za sledování.
Jsem Hugh.
SAM ZELENÁ: Já jsem Sam.
Hugh Zabriskie: A tohle je CS50.