>> SAM ЗЕЛЕНИЙ: Привіт, всім.
Ласкаво просимо на наш семінар.
Мене звуть Сем.
Х'ю Забриски: Я Х'ю.
SAM ЗЕЛЕНИЙ І ми збираємося говорити сьогодні про JavaScript і API веб-аудіо.
Просто, щоб почати, це начерк нашого порядку денного семінару.
Ми збираємося почати з розмови про чому ви повинні бути зацікавлені в Мережі
Аудіо API, чому JavaScript мову потрібно для нього,
а потім говорити про JavaScript essentials-- так як,
ходити вас через деякі Основи мови,
а потім говорити про аудіо API на високому рівні.
Потім, Х'ю буду говорити про деякі з етапів виробництва аудіо
а потім демо цей дивовижний секвенсор Проект він побудував і показати вам код.
А потім, у нас буде час для питання в кінці для людей
хто тут живе.
>> Х'ю Забриски: Прохолодний.
>> SAM ЗЕЛЕНИЙ: Прохолодний.
>> Х'ю Забриски: Прохолодний.
Я резервного копіювання.
>> SAM ЗЕЛЕНИЙ: Отже, перше, що в першу чергу.
Так один з великих речей про Web Audio API
є те, що немає ніякого набору до необхідності.
Він поставляється вбудована в більшість сучасних браузерів,
у тому числі Chrome, EDGE, в цілому купа others-- всіх тих
що великі ділянки люди використовують сьогодні.
Так що там немає установки, осторонь від просто отримувати
веб-сервер відбувається, для Ви для початку роботи
на вашому проекті, який є великим.
>> Ми рекомендуємо досить сильно, що ви вважаєте
за допомогою Chrome для Веб-розробки JavaScript,
тільки тому, що його розробника інструменти дійсно сильні.
Як приклад тільки те, що ми маємо на увазі кажучи відкрити свій JavaScript
console-- якщо ви йдете в Chrome і ви подивіться на будь-який веб-сторінці,
і ви клацніть лівою кнопкою миші Огляньте елемент, а потім
Ви йдете в цій маленькій списку прямо тут і натисканні на консолі,
ви побачите, що відкриває виглядає багато, як в командному рядку, що вам
могли б бачити на вашому Mac, або на ID.
І просто так, ми можемо тип команди тут, як Clear,
і інші команди, як, що.
Ми можемо створювати змінні, а ми побачимо пізніше в JavaScript.
І тому все, що ми можемо зробити в JavaScript, ми можемо зробити з консолі,
і це супер зручний спосіб почати грати з API,
і освоїтися з JavaScript з місця в кар'єр.
Немає необхідності набір вгору, яка насправді приємно.
Прохолодний.
Високий.
>> Так що просто ще одна річ, щоб додати.
Якщо у вас є questions-- є багато з вас, хто не тут жити,
не соромтеся, пишіть us-- ці наші адреси електронної пошти.
Якщо у вас є питання Ви не хочете, щоб запитати нас,
як, о, я є помилка в моєму коді, або щось
це трохи більш конкретним, може бути, Google в першу чергу.
Є багато великих ресурсів про Web Audio API там.
Це дійсно добре документально, і це є
використовується тонна людей в промисловість, і люди, які просто
будівництво прикольних речей для себе.
Так не повинно бути багато ресурсів там.
Високий.
>> Круто, так чому веб-Аудіо API?
Ця схема трохи з еволюції шляху
звук в Інтернеті виріс протягом довгого часу.
BGSOUND був, як в оригінальній HTML тега що Internet Explorer використовується для підтримки.
Це дозволено тільки для досить простих звуків, функціональність не надто надійні,
і ви не могли б зробити складніше послідовності,
або контролювати, коли звук почав і зупинився дуже рішуче.
Таким чином, це не було особливо добре розвинена.
Потім, після того, флеш- прийшов along--, які
Я впевнений, що ви, хлопці, всі знайомі з Flash-- може бути, не як вона працює,
але ви, звичайно бачив.
Ви повинні оновити свій флеш- Plug-в, всі такого роду речі,
і що, безумовно, розширив спектр функціональності, який був доступний.
Але зробити користувачеві встановити плагін, безумовно,
Недолік у тому числі Flash, у вашому додатку, чи не так?
Бо тоді ви на утриманні Користувач відбувається і знайти цей плагін,
і, ймовірно, перетворюється від цього додатковий крок
вони повинні зробити, щоб використовувати ваш додаток.
А потім може бути оновлення що зламаю всю вашу заявку,
і закінчує тим, що кошмар для розробника, теж.
Так що було барикада.
>> А потім після цього прийшли разом, HTML-тег аудіо, який
є особливістю більш сучасною HTML-- які звичайно, дозволило набагато більше речей,
але навіть те, що ви могли б зробити були трохи обмежені тільки
в результаті речей що HTML-здатний.
Тому, коли JavaScript API, веб-аудіо API,
став стандартом практикувати у всіх браузерах,
що насправді розширили набір можливостей для розробників
щоб дійсно отримати в будівлі цікавий матеріал для Інтернету.
Довгий час був були дійсно надійні інструменти
для рідних аудіо-додатків, like-- кожен знає, GarageBand,
і то, очевидно, є більш професійні аудіо змішування додатки,
і що таке.
Але не було ні дійсно хороший Cloud-- НЕ
Облік, так, я думаю, Cloud-- веб-платформа
що дозволить розробникам створювати додатки для людей
зробити мікшування аудіо.
І, як він покаже вам Через Web Audio API
дозволяє дуже потужний речі, щоб статися насправді просто,
який є досить прохолодно.
Так от інструкція, чому ви повинні додивитися семінару,
в основному.
>> А тепер, я збираюся говорити про деякі JavaScript-- тільки основні елементи
мови, так що ми можемо бути на тій же сторінці
коли ми говоримо про API трохи пізніше.
Прохолодний.
>> Так, це короткий виклад.
Я забув це було тут.
Так.
>> Х'ю Забриски: Там це дві гірки тут.
>> SAM ЗЕЛЕНИЙ: Це короткий деякі з обмежень
з інших обов'язкових, старими методами.
І то тепер, у нас є ці речі.
Прохолодний.
Високий.
>> Так, основи JavaScript.
Насамперед, є досить значна різниця
У JavaScript в порівнянні з мова, як C, в дорозі
що змінні створюються.
Таким чином, в C, ми звикли до того, ввести наші змінні, вірно?
І я не маю на увазі тип як введіть їх, я маю на увазі тип
як привласнити їм значення type-- т.п., INT, поплавок, напівкоксу.
У C, ми дійсно використовується для того, щоб створити змінну
а потім дотримуватися цього типу для Весь час, що ми використовуємо цю змінну.
І це не обов'язково гірше, але це, ймовірно, складніше у використанні.
Один з цікавих функцій з JavaScript є
що змінні, що називається "динамічно типізованих", який
означає, що я можу створити Мінлива з цим синтаксисом,
varX дорівнює 5, наприклад.
Це спочатку створює ціле переменная--
прямо під капот somewhere-- але я
може змінити цю змінну для позначення рядка
нічого не роблячи, як створення нової змінної.
Я не потрібно турбуватися про зміну типу.
JavaScript знає, що тип-х змінилося, і що відбувається динамічно.
>> Так, є переваги і недоліки, що,
а хто-небудь, хто працював у JavaScript на деякий час, можливо, знаєте.
Є часи, коли Ви могли б випадково
змінити тип змінної і не впоратися, що зміна типу,
і тоді ваш JavaScript може crash-- або виключення
бути кинуті, тому що ви будете мати неправильний тип, коли ви очікуєте один тип.
Прохолодний.
>> Так, scoping-- який, як, якщо ми пам'ятаю ранні тижні в курсі,
ставиться до того, як видимого змінної є і в якій області коду.
Все, що виглядає дуже схоже щоб, як вона виглядає в С.
Так змінні області видимості, як правило у фігурні дужки всередині функції,
а потім Є також глобально контекстні змінні, які
are-- якщо ви пишете змінну поза функцією,
він буде видно в усьому тексті.
>> Одне з відмінностей між JavaScript і C зокрема,
є те, що, якщо ви оголосите глобальної Мінлива де-небудь в текстовому файлі
це видно в будь-якої функції в цьому текстовому файлі.
Це правильно, вірно?
>> Х'ю Забриски: Так.
>> SAM ЗЕЛЕНИЙ: Так це теж трохи трохи наляканий, в порівнянні з C,
де ми завжди були, щоб наші визначення змінних вище місцях
вони були використані.
Це не правило, що це виконання більше, так що, трохи відрізняється.
І знову тільки, щоб ще раз підкреслити, Глобальний проти місцевого variables--
дуже схожий на C. Ви могли б дві змінні з тим же ім'ям,
і є один з їхніх назв затінювати по локальної змінної, якщо один з них
був глобальним.
Так що, схоже вид проблеми, які деякі з вас
можливо, зіткнулися з в деяких вашої проблеми встановлює досі.
Круто, так що змінні.
>> Управління потоком, тобто, як, якщо-else-- логічно stuff-- і петлі.
Таким чином, щоб почати с, це те, що, якщо-інакше заяви виглядають як в JavaScript.
Розміщення різних речей на лініях, не важливо.
Це лише один з конвенцій за те, як ми структурі коду.
Так само, як в C, у нас є "якщо", дужка заяві.
Це не те, що я мав на увазі, щоб зробити.
Я зробив це знову.
>> Х'ю Забриски: Спроба вийти?
SAM ЗЕЛЕНИЙ: Ні, я просто намагається збільшити.
Це не має значення.
>> Так, у нас є ", якщо" заяву і ми маємо умову всередині нього
, Яке обчислюється в істинне або помилкове, і що визначає, чи є
ми входимо в цей блок коду.
І також, ми маємо ще-якщо і ще, як ми звикли в С.
>> Ви також повинні бути дуже комфортно з місця в кар'єр з петель,
бо вони також виглядають багато, як C виглядає.
Але ви помітите, що ми знову Тобто, замість того, INT ініціалізації,
у нас є VAR ініціалізації.
І я думаю, ви повинні бути обережним, щоб зробити
що ви не зміните значення з I від Int в рядок,
наприклад, тому що це буде викликати дивну поведінку ви не можете
очікувати.
Але це має виглядати дуже знайомо, як добре.
>> Так що це, де речі починають отримати трохи розуму в JavaScript
для когось, хто збирається від А фон С. Є функції
в JavaScript, і є один із способів оголосити функцію, яка виглядає
роду аналогічні C, і то є ще один, який
виглядає трохи відрізняється.
>> Перша версія, які ми можемо бачити тут,
це свого роду C-як, де ми говоримо, це функція,
дати йому ім'я, дайте кількість аргументів,
і потім вміст функції перейти всередині цих фігурних дужках.
Ми бачимо приклад Аргументи За секунду.
>> У той час як на наступному рядку, ми бачимо, ах, ось змінна називається "туРіпсИоп,"
і ми рівнятися його на це загальний thing-- function--, що
здається, не мають нічого відбувається.
Причина того, що відрізняється ніж С, що JavaScript
це те, що називається функціональний мова, або має функціональні елементи, а це означає,
що функції фактично є значення.
А це означає, що ми можемо встановити змінна рівним функцію
а потім перейти цю функцію навколо, передати його в якості аргументу,
зробити всі види речей так з функціями.
>> Ще одна річ, щоб note-- функції написані
з певною кількістю аргументів.
Ми бачимо приклад функції з аргументом на наступному слайді.
Але в JavaScript НЕ БУДЕ кричати на вас, якщо ви спробуєте
використовувати функцію з неправильна кількість аргументів.
Це буде просто зробити все можливе, щоб зробити, це означає, що, якщо ви проходите,
Ви викликаєте функцію, що очікує Аргумент без аргументу, все, що
відбудеться це будете робити все можливе, щоб спробувати виконати цей код,
і якщо він в кінцевому підсумку працює в виключення або помилку,
це кину це виняток і просто тримати going-- який є лише одним із способів
що JavaScript працює.
Так.
>> АУДИТОРІЯ: Що станеться, якщо є занадто багато аргументів?
SAM ЗЕЛЕНИЙ: Так Питання було, що відбувається
якщо є занадто багато аргументів?
І відповідь, що JavaScript буде просто
ігнорувати ті, які після тих, які передбачається.
Це постараюся виконати функцію подзвонити, як ніби це було тільки перші два.
Вірно?
>> Х'ю Забриски: Це вірно, так.
Аналогічним чином, якщо занадто мало аргументів,
це тільки частково дає нуль, щоб всі Аргументи це не має значення
для.
>> SAM ЗЕЛЕНИЙ: Який може насправді бути зручно, якщо ви
хочу написати функцію, яка приймає змінне число аргументів.
Ви можете встановити значення за замовчуванням в визначення функції,
і він може ігнорувати той факт, що вхідний не існує.
Тому я хочу, щоб трохи поговорити більше про це останнього патрона
точка, яка функції значення.
Це приклад, який трохи запаморочливих
якщо ви тільки що прочитали це, і не думаю, що про те, що відбувається протягом секунди.
Отже, давайте подивимося якраз в перша лінія тут.
У нас є змінна, f1, що ми говоримо, це функція, яка робить цю річ.
І зміст функції які console.log ("привіт").
Ви можете думати про console.log, що і JavaScript еквівалент Printf.
Так, що буде їсти, якщо ми запустити цей код в нашому браузері,
це буде роздрукувати рядок.
Я можу довести, що.
АУДИТОРІЯ: За журналі, хоча, робить, що означає, що це записується де-небудь?
SAM ЗЕЛЕНИЙ: Так.
Так що я покажу вам, що станеться.
Таким чином, питання було, чи що лог на увазі?
>> Х'ю Забриски: Так console.log це як Printf для C.
SAM ЗЕЛЕНИЙ: Так console.log це як Printf,
так що якщо у мене є ця console.log ("привіт"), і я закликаю, що рядок "привіт"
друкується на консоль.
Це консоль.
Це просто, як Printf, де він друкує на стандартний висновок.
І ми побачимо в хвилину, але це насправді
з посиланням на об'єкт консолі, і виклик методу цього об'єкта.
Це матиме більше сенсу в хвилину, коли ми
дістатися до говоримо про об'єкти в JavaScript,
але я думав, я б просто зазначити, що.
Х'ю Забриски: Ми використовувати в C, right--
ми зазвичай пишемо велику програму У головному робити.
Але те, що це круто в JavaScript це ви є такий, що перекладача
працює в режимі реального часу, так це займає всього порядково,
він може просто інтерпретувати, що на місці.
І він відслідковує речі, які працюють, перш ніж,
так що це досить корисний інструмент для використовувати console.log або консоль,
Як правило, для просто грати навколо з JavaScript.
>> SAM ЗЕЛЕНИЙ: Так повертаючись до цього example-- другий рядок коду
тут досить приголомшуючим в моїй голові.
У перший раз я прочитав це, Це було схоже, що відбувається?
Так, що відбувається це, це Функція декларації говориться,
У мене є функція називається f2 що чекає один аргумент, F,
і потім викликає, що Функція, F, які
був прийнятий до нього в якості аргументу без аргументів сам.
Так, що, можливо, було заплутаним.
Якщо ми розуміємо це, як f2 f1 займає в якості аргументу, а потім всередині f2,
е отримує called-- що означає що це рядки коду,
Після цих двох ліній Код, призводить "привіт"
друкується на консоль.
>> Той факт, що ми можемо пройти Опції як значення близько
закінчується будучи одним з найбільш потужні можливості JavaScript
в якості мови програмування.
Поза всі з дивовижні речі можна зробити,
як особливість Мова по шляху
що він робить речі легко програмувати і дозволяє
за те, що не особливо добре підходить для мережі,
функціональне програмування і функціональне програмування JavaScript аспекти
це одна з найбільш потужні поняття,
існує в JavaScript--, якщо ви запитаєте мене.
Прохолодний.
>> Так, наступна річ.
На додаток до функціональних, Є також елементи JavaScript
які об'єктно-орієнтованим, який є одним з найбільш
популярні розумні слова в інформатиці.
Об'єктно-орієнтоване програмування це дійсно популярна річ.
JavaScript має версію, що де я вважаю, що кожен значення також
об'єкт, що означає, що кожен об'єкт обгортання разом деяка кількість значень.
Таким чином, для значень, які є простими, як ціле число, як varX дорівнює 5,
що об'єкт просто обгортання що одне значення.
>> Але ми також можемо уявити собі ситуацію, where-- ми можемо думати про ситуацію в C
де ми хотіли зробити щось з структур,
наприклад, що обгортання кілька значення разом і робить
це дійсно легко передати речі навколо.
Ось коли об'єкт знаходиться в JavaScript.
>> Важливо пам'ятати, коли я кажу, що об'єкти, загорнуті
деяка кількість значень разом, який функціонує також
значення, що означає, що функції можуть також всередині об'єкта JavaScript.
І причина того, що важливо є те, що, в той час як ми часто
думати про виклик методу на об'єкт, який
популярного термін від одного популярні об'єктно-орієнтовані мови,
одна з відмінностей в тому, що Все, що метод в JavaScript
є значення, яке зберігається всередині об'єкта що виконує деякі action-- можливо
використовуючи інші значення, які знаходяться всередині цього об'єкта, але не обов'язково.
Таким чином, ви можете собі уявити ситуацію, я думаю, в трохи божевільною чином,
де ви назвати метод одного об'єкт на інший об'єкт, наприклад.
Таким чином, це трохи наляканий таким чином.
>> І ви можете також змінити методи які пов'язані з об'єктом
шляхом привласнення, що метод А Нова функція, яка також
досить відрізняється від інших об'єктно-орієнтовані мови, де
коли ми оголошуємо об'єкт і його екземпляр,
ми не можемо змінити методи, які пов'язані з цим об'єктом більше.
Так що це досить різні.
Прохолодний.
>> Так ось приклад, по-перше, об'єкта в дію.
Це те, що називається загальний об'єкт, який
означає, що він не має жодних конкретне ім'я, не є клас,
це лише деякі обгортання значень.
І те, як це виглядає, ми повинні це зовнішня пара фігурних дужок тут
що вказати JavaScript і говорити, що це є об'єктом.
Значення всередині нього є кожен значення всередині
об'єкта, який повинен бути обгорнуті разом.
А всередині цього об'єкта, ми тоді повинні пари ключ-значення,
де ключ відноситься до імені від вартості всередині об'єкта,
а інший side-- навпроти товстої кишки here--
фактичне значення які повинні бути збережені.
>> Отже, ви бачите тут, що у нас є Ключ називається Fn зі значенням Сем,
слід кома, кажучи наступного запису.
Потім ключ називається Л.М., зі значенням зелений,
слід кома, з подальшим "друк",
який матиме значення функції що буде робити цю рядок коду.
Давайте зробимо крок назад і розпакувати, що відбувається тут.
Так що це трохи складніше, і ми бачимо щось нове
вперше.
"Це" ключове слово нова річ ми бачимо тут, і що це робить
це відноситься до струму об'єкт в області, вірно?
Тому, коли ми говоримо, це вказує весь шлях назад
щоб всього цього object-- коли ми робимо this.fn,
ми збираємося пройти весь шлях назад до цього об'єкта, перейдіть до значення FN
і отримати Сем, тягнути все це шлях назад, дотримуватися його тут, а потім рухатися далі.
>> АУДИТОРІЯ: Так що з пошуку, є що зроблено через параметра
визначення?
SAM ЗЕЛЕНИЙ: Таким чином, питання був, є пошук робиться через параметр
визначення?
Так, абсолютно.
Що станеться ось, це точка говорить на JavaScript,
ОК, я отримую деяке значення з цього об'єкта з себе.
І тоді це буде виглядати для входу називається Fn, і якщо він знаходить його,
вона поверне що value-- так, це Сем.
Але я міг би також набрали те, що не було визначено тут,
і тоді було б просто повернутися undefined-- які
це річ, яка може JavaScript робити, що може мати переваги,
але це also-- якщо ви зробите помилку, це може призвести до дивних помилок.
Так що просто намагаються знайти все, що ви скажіть йому знайти
і це не буде скаржитися, якщо не знаходить його.
Це просто скажу, я не знайти його, а потім рухатися далі.
Так це буде визначено, плюс пробіл, плюс прізвище.
Так.
І тоді ми бачимо, що, якщо ми то може піти вниз і access--
і ми називаємо tf.print () з дужками.
Це буде назвати це друк Функція без аргументів, вірно?
Але якщо ми тільки що сказали, tf.print () крапка з комою, без дужок,
все, що зробив би це витягнути з функції від значення,
але насправді не назвав його.
Прохолодний.
Х'ю Забриски: Повинен ми робимо об'єкт?
SAM ЗЕЛЕНИЙ: Звичайно, давайте зробимо це.
Так що я можу рухатися це прикладом для консолі.
Ми можемо уявити собі, що в мене є об'єкт.
Так що це простий об'єкт.
Це об'єкт, який містить два значення з двома ключами, два ключових значення
пар.
Так що я можу отримати доступ значення, що зберігається всередині цього об'єкта, роблячи x.x1,
наприклад, і я отримую 1 спину.
Точно так само, x.x2, отримати, що значення назад.
>> А тепер дійсно класна річ, я можу насправді щось додати до цього об'єкта
після того як я його створив.
Таким чином, ви можете собі уявити, давайте у мене є функції.
>> Х'ю Забриски: Ви потрібно зробити Shift-Enter.
>> SAM ЗЕЛЕНИЙ: О, це дратує.
Що це не подобається?
Ох.
Ось і ми.
Прохолодний.
>> Так що я тільки що створили ця функція, F, що
йтиме протягом об'єкт і роздрукувати this.x1.
Так що, якщо я просто зателефонувати за п Сам нічого не відбувається
щоб це відбулося, правильно, тому що немає x1 поле в об'єкті це на увазі.
Але, якщо я скажу x.f = F, а потім я зателефонувати x.f (), я збираюся повернутися 1.
Ця функція F тепер пов'язано з об'єкта х,
який грає ключову називається x1 пов'язані зі значенням 1,
тому, коли ми називаємо this.x1, це збирається знайти те, що він шукає
і бути в змозі надрукувати значення з.
Так от тільки один приклад з роду божевільних речей
Ви можете зробити з об'єктами в JavaScript.
>> Так що версія була загальна версія, сенс
що ми створили об'єкт, використовуючи цей дужки notation-- позначення дужки,
rather-- і це зручно, якщо ми просто хочемо
один примірник конкретного об'єкта, але що, якщо ми хочемо мати більше, ніж один
такого ж роду?
І відповідь на це питання Питання в тому, є речі,
називаються класами в JavaScript, а також.
Ми можемо створити функцію, яка робить якийсь ініціалізації
для іноземного об'єкта, і ми б сказали, як,
мій class-- так ім'я багаторазової object--
дорівнює функцію, яка встановлює його.
Так що це було б еквівалентно щоб створює об'єкт, який
було б просто хотів, фігурна дужка, вул, товстої кишки,
це рядок, крапка з комою, фігурна дужка.
Це було б загальне об'єкт, який ми ініціалізації,
з однією різницею, на Наступні рядки ми створюємо прототип, який
означає, що це ключовий замовчуванням, що додати до нашого об'єкту, що
має значення, перераховані тут.
Це означає, що, коли я створюю новий Примірник цього об'єкта MyClass,
це буде вже вбудованих всередині це значення називається вул й інше значення
називається myPrint, що буде функція.
Високий.
>> Відмінно.
Таким чином, останнє, що говорять про JavaScript
є те, що дійсно корисно для чого називаються асинхронні операції.
Асинхронний означає, що ми може чекати якоїсь операції
для завершення, перш ніж перейти , Але рухатися далі, поки ми чекаємо
а потім щось трапиться пізніше.
І те, що я маю на увазі, що є, ви Можна уявити собі ситуацію, в якій
Ви надсилаєте запит на деякі веб-сервер десь,
і він збирається відправити тебе назад деякі великий шматок даних, вірно?
І ваш користувач міг чекати в Тим часом, щоб це відбулося,
і ніщо не могло бути відбувається в той час.
Але це не велика конструкція, вірно?
Ви не хочете, щоб веб-сторінки, щоб заморозити.
Що робити, якщо користувач хоче, щоб натисніть на випадаючому меню?
Це не великий шаблон.
Замість цього, в основному, що JavaScript робить, каже,
ОК, зробити цю операцію асинхронно.
Так як, чекати у фоновому режимі, а потім, коли операція виконується,
викликати зворотний виклик function-- викликати деякі функції,
у деяких action--, щоб сигналізувати, що робота нас чекає до кінця
завершено.
І причина того, що це супер потужний є, ми можемо зробити щось, передати аргумент,
зробити щось, а потім чекати, на щось трапиться.
Потім, коли той щось завершує, ми можемо назвати зворотного виклику.
Це дійсно зручно, тому що це дозволяє нам зробити речі з веб-Audio API,
наприклад, як завантажити аудіо файлів з віддаленого сервера
без чекати Весь звуковий файл буде завантажений,
що було б насправді погано для користувацького досвіду.
Прохолодний.
>> Остання пара зазначає про налагодження, так як це
це річ, яку ви будете мати, щоб зробити як частина вашого проекту, гарантовано.
Я згадав консоль JavaScript.
Це супер корисна функція всіх сучасних браузерах,
І ми дійсно рекомендуємо вам отримати зручно використовувати консоль,
якщо ви хочете отримати хороше в JavaScript.
Це супер зручно для налагодження, але це також
дуже корисно для з'ясування , Як використовувати API.
Це дозволяє реально просто експеримент
без необхідності вводити деякі Код, а потім компілювати його.
Ви не повинні робити всі ті кроки.
Ви можете просто написати деякий код в лінію,
а потім отримати негайну зворотний зв'язок на або не те, що рядок коду
worked-- дуже зручно.
>> А також, тільки один технічний note-- консоль JavaScript є прикладом
з REPL-- так що це Р-Е-Р-Л, REPL, який стоїть для читання, оцінити,
друк цикл.
Ви збираєтеся ввести деякі речі в, це буде читати те, що ви набрали в,
це буде оцінити його, і він буде друкувати вихід, а потім знову почну.
Це дозволяє швидко перейти в кола ітерації, що це дійсно круто.
>> Я думаю, реальний Ост note-- це є фактичним останнє зауваження, так.
Як ми насправді використовувати JavaScript?
Отже, спочатку ми можемо імпортувати його, використовуючи тег сценарію
у верхній або нижній частині в HTML file-- в будь-якому місці всередині з HTML файлу,
насправді.
І в тег сценарію, є дві суб-шляху імпорту JavaScript.
По-перше, шляхом мати окремий файл JavaScript
що ми імпортуємо в повному обсязі, або при наявності площа коду, як сценарій
для початку, а потім Обернена коса риска сценарій до кінця.
А потім ми просто написати JavaScript всередині HTML-файлу.
Такі два шляхи.
Ви не можете мати його всередині HTML.
АУДИТОРІЯ: Є одним краще, ніж інші?
SAM ЗЕЛЕНИЙ: Питання було, один кращий, ніж інші.
Так що, так, як практика стилю кодування, а також це як проектній практиці.
Є дві причини, чому це може бути краще.
Перший, це робить ваш код A багато більш читабельним, якщо всі ваші HTML
в одному місці, всі ваші CSS в інше місце, всі ваші JavaScript
знаходиться в третьому місці.
Вірно?
Я думаю, що ми повинні вже говорили Про це в sections-- як CSS--, що
що is-- і він йде Часто в іншому файлі.
Так, подібного роду поняття тут.
Ви також можете собі уявити, що JavaScript буде використано на більш ніж один
HTML-сторінка, або, можливо, Дуже багато HTML-сторінок,
і має, що JavaScript реструктурувати в один
файл, який можна імпортувати в більш ніж в одному місці
дозволяє код, який буде набагато більше, у супроводі.
Ви можете собі уявити, що робить один змінити на JavaScript
і того, щоб змінити його в 100 різних файлів.
І замість того, що ми можемо просто змінити його в одному, що шлях більш потужним.
Я відповів на ваше запитання?
Прохолодний.
>> Ми також можемо ввести в консолі, як ми вже згадували раніше.
І знову, в останній note-- Web Audio вбудована,
Вам не потрібно, щоб завантажити що-небудь.
Прохолодний.
Є які-небудь питання, у вас є більше питань про JavaScript,
перш ніж ми перейдемо?
>> АУДИТОРІЯ: [нерозбірливо]
SAM ЗЕЛЕНИЙ: Гаразд, круто.
Так що тепер він збирається говорити про API.
>> Х'ю Забриски: Прохолодний.
Спасибі, Сем.
>> SAM ЗЕЛЕНИЙ: Звичайно.
Х'ю Забриски: Високий, так ми перейдемо від JavaScript.
Таким чином, ми вже говорили про деякі з Основи JavaScript,
і ті змінні, функції, об'єкти, функції, як змінних,
асинхронна завантаження.
Це все, що ви будете бачите, як ви використовувати Web Audio.
Таким чином, ми просто поговоримо про це спочатку на високому рівні.
>> Це API, так це те, що побудований, як сказав Сем,
прямо в JavaScript використовувати в консолі.
І це насправді так само, як C ++ код що насправді побудований в Chrome
і Firefox, і всі ці браузери.
Таким чином, головна ідея з Web Аудіо, що ви повинні
цей вид трубопроводу аудіо, вірно?
Таким чином, ваш аудіодані приходить в тій чи іншій формі.
>> Погляд з трьох основних forms-- у вас є генератор, який
створює синусоїда, косинус хвиля, ми збираємося, щоб побачити, як це працює.
Ще один дуже поширений, звичайно, MP3.
Так, може бути, ви починаєте з пісня, а потім ви
хочу зробити деяку фільтрацію до того, що і вихід
that--, що може бути можливим джерелом.
І тоді дійсно здорово один мікрофон.
Таким чином, ви можете використовувати деякі дуже Основні виклики в JavaScript
щоб отримати доступ до мікрофон, і тому, якщо ви
хотів зробити додаток як детектор тони,
наприклад, що бере в Ваш голос та цифри з
pitch-- дуже простий спосіб, що.
Ви можете тільки вид читати в, з'ясувати частоту,
а потім вихід число.
Таким чином, ми будемо бачити, як це працює, як добре.
>> Пункт призначення в основному коли аудіо дані виводяться.
Так зазвичай, це як Ваші ноутбук динаміків.
Інші варіанти, як ScriptProcessorNode--
ми повернемося до вузлів в second-- але в основному,
або ви ставите звук з за допомогою комп'ютера через динаміки,
або ви вид запису, тому ви зберігаєте його як аудіо-даних.
Так може бути, якщо хтось створює музика у вашому додатку, а потім
Ви хочете, щоб записати, що, може бути, як і експортувати його в SoundCloud, для example--
що б бути одним із способів, щоб зробити це.
Всі забавні речі, які ми будемо говорити про,
відбувається між цими двома точками, де ми завантажуємо в музиці
а потім виводити його.
>> Так що я збираюся говорити про п'ять етапи виробництва аудіо в секунду.
У нас є те, що називається AudioContext, що
це трохи оболонкою ми бачимо тут.
В основному те, що AudioContext is-- якщо ми перейти до JavaScript консолі прямо зараз,
ми можемо створити його прямо зараз.
Просто приклад REPL, вірно?
Ми читання, оцінки, і це виводить.
>> AudioContext це глобальна держава.
Це структура, це об'єкт тут, і він зберігає інформацію
про речі, які йдуть на На екрані, що відносяться до аудіо.
Одним із прикладів є поточний час.
Це говорить вам номер секунд, дуже точно,
з веб-сторінки завантажуються.
Так що це дійсно корисно трохи властивостей, які можна використовувати.
Це читав only-- Я думаю, насправді Ви можете спробувати встановити його значення.
Це вам скажу встановити його, а потім, якщо ви роздрукувати його
again-- це насправді не зовсім робота.
Так що тільки для читання нерухомість в JavaScript.
Це дійсно корисно, якщо Ви начебто синхронізації
багато різних Інформація, коли ви
вигляд відіграє різні звуки.
>> Ще один дуже корисний контекст призначення.
Безумовно, якщо ви зацікавлені, то спробувати це на свій страх і консолі праворуч
Тепер.
Так що це AudioDestinationNode.
В основному те, що це говорить те, де вихід відбувається?
Таким чином, є два реальних варіантів тут.
Зазвичай за замовчуванням це тільки ваші колонки,
так AudioDestinationNode в основному тільки говорить
є нульові виходи до звуку в найближчі направив спікеру.
Так зазвичай, ви не повинні грати з цим.
Якщо ви зацікавлені в насправді за допомогою ScriptProcessorNode для запису,
безумовно знімати мене в електронній пошті пізніше, тому що це
трохи складніше.
Але в цілому, ви просто вид виводити звук в тій чи іншій формі.
Так здорово, ми повернутися назад тут.
АУДИТОРІЯ: Я перепрошую.
Х'ю Забриски: Так.
АУДИТОРІЯ: Я знаю, ви сказали, щоб поговорити Вам пізніше про запис.
Чи можете ви, що інтерфейс з Pro Tools?
>> Х'ю Забриски: З Pro Tools?
Давайте подивимося.
Я не думаю, що так.
Так відбувається між клієнтом, який є JavaScript
Консоль, і ваш фактичний комп'ютер, як правило,
те, що це свого роду з закриті, якщо ви
буде, свого роду за характером the-- це свого роду дизайн речі,
але ви намагайтеся тримати окремий браузер від фактичного комп'ютері користувача.
Взагалі, єдине, що ви в змозі доступ мікрофон або камера.
Ви не в змозі, я не думаю, що використовувати Pro Tools.
Тим не менше, якщо ви створили трек в Pro Tools,
експортується, що ви могли б завантажити його тут, фільтрувати, наприклад,
процес, який і записувати, що в Аудіо Destination-- або no-- Сферу
Процесор Вузол.
А потім звідти, ви могли б експортувати, що SoundCloud, ви
може відправити його по електронній пошті, або що вам подобається звідти.
>> Але це свого роду невеликий бар'єр між створенням музики на комп'ютері
і робить музику онлайн.
>> SAM ЗЕЛЕНИЙ: І це не тільки в цьому API.
Це функція безпеки Chrome, і Я думаю, що будь-який інший сучасний браузер.
Браузер є самодостатнім.
Так, наприклад, веб-сторінка не може використовувати JavaScript, щоб увімкнути звук
на ваші колонки, наприклад.
Або він не може вимкнути комп'ютер.
І немає проміжна точка між цими двома речами, право,
так що або у вас є повна абстракція,
або ви відкриваєте Безпека недолік дозволяючи
програміст з поганими намірами зробити що вони хочуть з вашого ноутбука.
І ось чому Хром є самодостатнім.
>> Х'ю Забриски: Так.
Чи має це сенс?
Круто, круто.
Я просто хочу, щоб показати приклад одного.
Це досить багато, як далеко, як ви отримаєте в плані
доступу комп'ютер користувача.
Якщо у вас є клавіатура USB підключений, Ви можете використовувати те, що називається веб-
MIDI-API, який ми не будемо дійсно говорити про тут,
але це вже інша API, що це вбудований в, щонайменше Chrome-- раз,
це чому ми любимо Chrome-- Я думаю, що Firefox або Safari,
це просто річ, щоб google-- різні браузери мають
відрізняється підтримка якого API-інтерфейси вони реалізовані.
Але якщо ви хочете, щоб підключити клавіатуру і працювати з цією інформацією,
вид відправки клавіатури Інформація до комп'ютера
а потім використовувати цей онлайн, це API де ви працювати, що.
>> Прохолодний.
ДОБРЕ.
Так, швидко рухається тут.
Як ми робимо на час?
>> СПІКЕР 1: Про 15.
>> Х'ю Забриски: 15 хвилин залишилося?
ОК здорово.
Таким чином, ми йти попереду тут.
>> Так в основному, головним пунктом думати про це як про трубопровід
є те, що кожен крок у трубопроводі серія аудіо вузлів.
Наше джерело, скажімо, є генератор.
Нам потрібно створити вузол генератора.
І це тільки частково маленького function--
і всі вони засновані з звукового контексті тут.
>> АУДИТОРІЯ: Коли сказав він генератор, означає, що
це насправді буквально переході від два різні полюси і назад?
>> Х'ю Забриски: Ні, це як цифрове представлення.
Це насправді реалізовані в C ++.
Я насправді не знаю, специфікації про те, як він насправді реалізовані,
але все це працює як двійкові дані.
Насправді, так.
Це було б говорити, я міг насправді, якщо ви зацікавлені,
Я міг би послати вам трохи більше Інформація про те, як сигналів
зберігаються мають цифровий формат.
ОК здорово.
>> Таким чином, ми генерації тони, як синус хвилі або щось подібне, може бути,
440 Герц.
Ми створюємо генератор.
Якщо ми хочемо, щоб встановити гучність, ми нічого підключитися до GainNode,
які ми могли б зробити з .creategain.
Це встановлює гучність.
Ви можете передати, що на будь іншого options-- добре,
так що джерело звуку буфер вузол, де ви могли б
зберігати MP3, що ви завантажили в.
>> Biquad фільтр для фільтрації, якщо Ви хочете, щоб прийняти всі підставу з
пісні, або щось подібне.
Не дай Бог ви хочете взяти база з пісні.
І AudioDestination вузол, знову ж таки, як, де наш фіналізації.
Якщо ви коли-небудь зацікавлені в тому, всі різні можливі варіанти,
просто перейдіть на вкладку, і нехай автоматичне заповнення придумати.
І якщо ви створити, ви побачите всі різні речі, які ви можете створити.
Ви можете створювати динамічні Сценарій процесори,
Я навіть не знаю, що Тобто, для змішування каналів злиття
і канал розгалужувачі і все таке.
Прохолодний.
>> Так що це просто Приклад трубопроводу.
Отже, ми маємо три джерела в найближчі.
Може бути, це сигнали, може бути, це МР3.
Один походить через фільтр, ще один-х
отримувати спотворюється інший своє панорамування вліво і вправо.
Ви можете зробити всі види речей і всі вони змішуються навколо разом,
і потім прибуває аудіо Зрештою, в якості місця призначення.
Це приклад того, що більш складний веб-код Аудіо виглядає.
Ви створюєте всі ці різні об'єкти прямо here--
Я не впевнений, що це.
Ні, це не збільшити.
ДОБРЕ.
>> SAM ЗЕЛЕНИЙ: Ви робите Control, прокрутки вгору.
Х'ю Забриски: Управління Scroll--
SAM ЗЕЛЕНИЙ: Ні, ні.
Control--
>> Х'ю Забриски: О, управління прокрутите?
О, Гоча.
Так.
Нічого собі, Ні, Ні.
ДОБРЕ.
Я не буду цього робити.
>> Так що, так, в цей перший розділ тут, ви бачите
ми створюємо всі ці різні вузли з контексту.
Ми просто складаючи їх разом у другій частині
за допомогою цієї функції під назвою Connect.
Це дійсно ключ функція в Web Audio.
Це просто означає, як тільки ви зробили то зі звуком в одному вузлі,
передати його на наступний вузол.
Таким чином, ми маємо джерело, його підключається до аналізатора,
аналізатор робить щось з ним, вона йде до спотворення, і так далі,
і до місця призначення внизу прямо тут.
Прохолодний.
ОК, так що ми будемо продовжувати рухатися далі.
>> Pipeline-- знову ж, це є найбільш поширеними трубопроводів,
таким чином, ми говоримо про всі ці речі, як спотворення, панорамування, все це дрібниці.
Якщо ви дійсно зацікавлені за допомогою речі Pro Tools,
ті, ймовірно, зацікавить Вас.
Якщо ні, може бути, ви просто хочу грати звук,
або, може бути, ви просто хочете, щоб встановити гучність на звук.
Ті, є двома найбільш поширений вид трубопроводів в аудіо продукції.
>> Знову ж таки, способів, ви можете взяти його в якості oscillator-- так, давайте
зробити демо-версія, що прямо тут.
Отже, ми збираємося, щоб створити простий аудіо контекст тут,
і від, що ми збираємося щоб створити наш генератор.
Так що, знову ж таки, ми просто буду називати Створити генератор.
Ми збираємося встановити частоту на що 440 Герц, улюбленець.
Потім ми пов'язуємо, що до місця призначення point-- який є спікер, так
контекст призначення.
Нарешті, ми просто говоримо, почати нулю секунд від тепер, і ми вже звучить?
>> [Дзвінок]
>> Х'ю Забриски: Тут ми йдемо.
Це просто синусоїда.
ОК здорово.
І тоді ми будемо зупинити.
>> АУДИТОРІЯ: Звідки що зворотний зв'язок прийшли?
>> Х'ю Забриски: Зворотній зв'язок?
О, напевно, наші мікрофони.
Так що, так, ось як ви це робите.
А насправді, якби я був тримав його працює, ви
може мати частоту значення, він працює,
так що це кумедна річ, щоб грати навколо.
Прохолодний.
Це завжди чудовий один, щоб уявити.
>> SAM ЗЕЛЕНИЙ: Ми не зробили думаю про те, чи зробив?
Х'ю Забриски: Так, що це противний.
Так, буфер loading-- я показати приклад, що в самому кінці.
Ось завантаженні MP3.
І мікрофон, можна використовувати тільки функцію називається Navigator.getUserMedia ()
щоб запросити доступ до користувача мікрофон для цієї інформації.
>> Ось фільтрації, я буду просто рухатися від цього.
Це досить високий рівень, але тільки фільтри дозволяють вам
>> [ЗВУКОВИЙ СИГНАЛ]
Фільтрація також дозволяє створити такі речі, як рожевий
шум, коричневий шум, білий шум.
Якщо ви хочете створити чистий шум, який деякі люди люблять возитися с,
Ви можете використовувати веб-Audio Фільтрація зробити.
>> Аудіо Panning-- так що уявіть, якщо ви пишете гру
і ви хочете, щоб звук на здаватися, що це йде, як,
стрілянина по екрану, ви можна використовувати панорамування звуку
Для створення такого роду конуса, які like-- це досить Mathy,
але це насправді дуже здорово, якщо ви отримаєте його роботи,
і є деякі хороші підручники з нею, я можу надіслати вам.
В принципі, ви можете вид з створення звуку
щось відбувається з в 3D чином.
І якщо у вас є інтерес DJ, ви можете почати змішування і перетнути вицвітання пісні.
>> Це лише деякі дуже прості Код, в основному те, що я робив раніше.
Це встановлює обсяг генератор, таким чином, ми створюємо нашу генератор
який створює форму хвилі.
Ми створюємо нашу GainNode, встановити наш частоту,
а потім підключити генератор до GainNode, які потім в основному зміни
скільки сигнал пропускається.
Але насправді, це цифровий річ, так що це більш просто-- так.
Це не те, що відбувається насправді, але це те, що відбувається в реальному житті
з посиленням.
>> АУДИТОРІЯ: --quantization параметра гучності?
Х'ю Забриски: Вибачте?
АУДИТОРІЯ: Це квантований параметр обсяг?
Х'ю Забриски: Так.
І це єдине, що я дійсно перебуваю дефіцитний в моїй знання,
як посилення роботи на цифровий рівень.
Я знаю, з фактичною Сигнали, це в основному
управління, скільки ви посилення сигналу.
Так що, так.
Я пошлю вам більш детальну інформацію про що, бо я насправді цікаво
щоб дізнатися більше про те, що.
Але в основному параметри є, один є fold--
голосніше signal-- і нуль НЕ сигнал, або ви не будете чути звук.
Ми пропустити демо час, що, оскільки це в основному те, що я робив раніше.
І знову, Context.Destination є однією вузол призначення.
Високий, добре.
>> Так що я збираюся зробити швидкий дві демо.
Як ми робимо на час?
>> СПІКЕР 1: Близько 10 хвилин.
>> Х'ю Забриски: 10 хвилин?
Відмінно!
Високий.
>> Таким чином, перший я збираюся робити, це називається моя улюблена пісня.
Так що це просто трохи HTML JavaScript.
Ми збираємося, щоб мати дві кнопки на сторінці грати мою улюблену пісню
і зупинити мою улюблену пісню.
Я змінити це.
>> АУДИТОРІЯ: Обкладинка мікрофон.
>> Х'ю Забриски: Так.
І я завантажений тут скрипт, який basically--
і це дійсно корисно для завантаження в MP3,
так що це просто робить завантаженням файлів MP3 спосіб швидше.
Це в основному тільки обгортка.
Він просто робить процес навантаження в МР3 набагато швидше,
в іншому випадку ви використовуєте HTTP запит, ніби як те, що ми робили
на поточному частини встановленої з сервером.
Це дійсно потворні, ви не хочу, щоб це зробити.
>> Так цей хлопець, Борис Smus, написав дійсно корисно трохи інструмент, званий BufferLoader.
Все, що вам зробити, це просто передати його на Контекст, ви передаєте йому list--
або, так, це список в JavaScript?
SAM ЗЕЛЕНИЙ: масив.
Х'ю Забриски: О, це масив, що це правильно.
Це масив шляхів в різних файлах.
І тоді ви передати його функції.
Це зворотного виклику ми говорили про з асинхронної завантаження.
Це буде називатися Після того як файли завантажені.
І, що функція, яка викликається, коли файл завантажується приймає як периметра
масив завантажених буферів.
Так що тут відбувається.
В основному, це BufferList буде одним value--
або це буде масив Довжина одного, який має в ньому індексу
нулю всю завантажену файл у форматі MP3.
Так, що я роблю, коли я закінчу завантаження, я просто
створити джерело буфера, який є аудіо джерелом вузол буфера.
Наступним кроком, я завантажити в source.buffer як повний завантаженого буфера
від BufferList-- це багато buffers--
а потім підключити цю аудіо буфер до місця призначення.
Так що це буде робити просто просто поставити MP3
прямо на вихід, і почати його відразу ж
на отримання цього виклику.
>> Круто, так що давайте подивимося це сталося в дії.
Мої [нерозбірливо] тут, давайте подивимося.
Так що я просто хочу, щоб почати основного сервера.
Це те, що Ви повинні зробити, якщо ви
робити запити для завантаження файлів.
Я збираюся почати основного сервера.
Це в основному ваш весь PSET зараз в одному рядку,
але це тільки починає сервер на порту 80/80.
Так ми йдемо сюди, ми збирається завантажити 80/80,
ми збираємося, щоб перейти до Моя улюблена пісня.
Так що, якщо я вдарив "грати Мої улюблена пісня "прямо зараз,
він збирається завантажити мій улюблена пісня і грати it--
[МУЗИКА - орли, "Життя в Фаст LANE "]
--which буває "Життя в Фаст Лейн "на The Eagles.
Тепер, я міг вдарити "зупинити мої улюблена пісня "і переграти його.
>> [МУЗИКА - орли, "Життя в Фаст LANE "]
>> І якщо я йду до консолі, бо Я використовував глобальну змінну тут
стежити цієї величини, його насправді тепер буде визнана в консолі.
Так Він автоматично створює для мене.
Так ось те, що грає зараз, і я можу просто зателефонуйте source.stop ()
на тому.
Ну, ви знаєте, що?
Точно так само ви, хлопці, почувши це song-- Ви могли б визнати цю пісню.
>> [МУЗИКА - Rick Astley, "НІКОЛИ дам Вас "]
[МУЗИКА - орли, "Життя в Фаст LANE "]
Тепер ми всі були Rickrolled.
ОК, здорово, рухатися далі.
Прохолодний.
Таким чином, це в основному приклад просто, як ви могли б завантажити MP3 file--
[МУЗИКА - орли, "Життя в Фаст LANE "]
--І грати, і зупинити і запустити його.
Я міг би зробити ще дуже багато [нерозбірливо]
>> Останнє, що я зроблю це, Я покажу вам [нерозбірливо].
>> [Грає музика]
>> Це як, ogg.wave.mp3.
Я думаю, що, якщо я правильно пам'ятаю, Я зіткнувся з деякими питаннями .m4a,
але я не впевнений в цьому.
Я думаю, що mp3.wave--
>> [МУЗИКА - Rick Astley, "НІКОЛИ дам Вас "]
>> ОК здорово.
Я не сказав, що.
У всякому разі, привіт.
Отже, ми маємо це відкрито.
Так що тепер я все це, я в основному створена основний синтаксис для створення музики.
Так що, якщо я щось подібне, додати g4 1, 2, те, що це означає, що,
додати піаніно до відома, G4, що є четвертим G
на фортепіано знизу.
Так що це свого роду MIDI кажуть, так і для тих, хто музику, засновану,
це просто MIDI ноти.
>> АУДИТОРІЯ: Це G на Близькому C, вірно?
>> Х'ю Забриски: Це G вище середньої С, це вірно.
>> АУДИТОРІЯ: Над Середній С.
>> Х'ю Забриски: Так.
Насправді, так.
Я думаю, що насправді зробив його одним [нерозбірливо],
так що це може бути на октаву вище цього.
Отже, давайте подивимося.
Якщо я вдарив Play--
[Повторювати PIANO ПРИМІТКА]
--we're почуєте, що.
Ідея полягає в тому, що він працює так само, як в командному рядку буде,
так що якщо я йду вгору і вниз на моїй клавіатурі, ви
може повернутися до попередньої команди, який є досить корисним.
І нижче мій список треків, які всі працюючі на петлі.
>> АУДИТОРІЯ: Ви припускаючи, що 88-клавішна клавіатура на це, вірно?
>> Х'ю Забриски: Питання було, я припускаючи 88-клавішною клавіатурою,
і так, я.
Те, що я зробив, я в основному взяв 88 зразків
фортепіано, по одному для кожної ноти.
І так кожен раз, коли ви почути ноту тепер,
що насправді цикл, який виглядає like-- це стає грав на петлі,
тому для кожної ноти, це працює.
Що відбувається, я створити буфер знов,
Створити посилення вузла для настройки гучності.
Це просто дуже складний спосіб сказати, що я
зберігати буфер в source.buffer.
Я даю йому виграш, я підключіть його до прибутку,
посилення з'єднаний з Вихід, а потім я граю.
Так що це свого роду процес приймати в джерелі буфера.
>> АУДИТОРІЯ: Чи можете ви насправді взяти, що сухий звук і зробити його мокрою [нерозбірливо]?
>> Х'ю Забриски: Можна, так.
Там це знову дієслово, є затримка, спотворення.
Ви можете в основному покласти що-небудь в між тим, що бутерброд of-- добре,
трубопровід є кращою метафорою, але ви можете додати що-небудь в цьому.
Прохолодний.
>> Так що я буду закінчити демо тут, щоб дати вам відчуття
просто величезна кількість разів ви може працювати цю функцію зразу.
Так що я збираюся зняти це.
Я збираюся створити генератор that-- в основному те, що does-- це дійсно
вид складної syntax-- але це буде генерувати нотатки на льоту,
і просто почати грати їм, як він оцінює їх.
[Реле PIANO]
>> Таким чином, ми можемо просто зробити трохи музики тут.
[Реле PIANO]
>> Так що ця команда робить, наприклад,
він приймає ці три ноти для фортепіано, а потім поміщає їх на B3.
Цей синтаксис може зробити трохи більше сенсу
для тих, хто є музичний фон тут.
>> Я можу додати бочку.
Я можу--
>> [Реле ІНСТРУМЕНТИ]
>> --just пограти з цим.
>> Таким чином, ви можете make--
[Реле ІНСТРУМЕНТИ]
Той трохи більше дратує.
[Реле ІНСТРУМЕНТИ]
>> Так що випадково додає сухий тарілки на кожному 16-му примітці, з 16%
[Нерозбірливо].
>> [Реле ІНСТРУМЕНТИ]
>> Так, так це те, як works-- це завжди в 4: 4.
[Реле ІНСТРУМЕНТИ]
>> Так, так чотирьох кварталів, і 16/8.
[Реле ІНСТРУМЕНТИ]
>> Так, в середньому, ви отримуєте 60% з-парад на 16 нот.
>> У кожному разі, це було просто вид, щоб показати
деякі з речей, які ви могли б будувати з веб-Audio API.
Це дійсно потужний, це дійсно швидко, і ви можете зробити багато класних речей
з цим.
Отже, ще раз, будь-які питання, у вас, E-mail myself-- Hugh-- або Сем,
і, чесно кажучи, Google має тонна хороших ресурсів.
Будь останні питання?
Так.
>> АУДИТОРІЯ: Таким чином, ви можете отримати доступ до вбудований мікрофон.
Що робити, якщо ви хочете, щоб використовувати кращий мікрофон?
Х'ю Забриски: Якщо ви хочете краще використовувати мікрофон?
Отже, ще раз, це є частиною абстракція між Chrome
і інша частина вашого комп'ютера.
Якщо це не доступно через АНІ, як веб-MIDI API,
Ви, ймовірно, може знайти деякі хакі, але, як правило, не, як це здійсненно.
>> SAM ЗЕЛЕНИЙ: Ви можете also-- всі хром знає
це те, що ваш мікрофон за замовчуванням це, і це доступ, який.
Так що, якщо у вас є мікрофон ви могли встановити як мікрофона за замовчуванням комп'ютера,
Ви могли отримати доступ до його таким чином і це, ймовірно, працювати.
Х'ю Забриски: Це хороший момент.
Я ніколи не намагався, але Ви могли б бути в змозі виду
of-- якщо ви перенаправити введення динамік, Ви могли б бути в змозі зробити це, так.
>> Будь останні питання?
Прохолодний.
Ну ви, хлопці, спасибі так багато для перегляду.
Я Х'ю.
SAM ЗЕЛЕНИЙ: Я Сем.
Х'ю Забриски: І це CS50.