diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
commit | 074785cea106179cb3305637055ab0a009ca74f2 (patch) | |
tree | e6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/ru/tools/web_audio_editor/index.html | |
parent | da78a9e329e272dedb2400b79a3bdeebff387d47 (diff) | |
download | translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2 translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip |
initial commit
Diffstat (limited to 'files/ru/tools/web_audio_editor/index.html')
-rw-r--r-- | files/ru/tools/web_audio_editor/index.html | 69 |
1 files changed, 69 insertions, 0 deletions
diff --git a/files/ru/tools/web_audio_editor/index.html b/files/ru/tools/web_audio_editor/index.html new file mode 100644 index 0000000000..2638a12414 --- /dev/null +++ b/files/ru/tools/web_audio_editor/index.html @@ -0,0 +1,69 @@ +--- +title: Web аудио редактор +slug: Tools/Web_Audio_Editor +tags: + - API веб-аудио + - Firefox + - Mozilla + - Мозилла + - инструменты +translation_of: Tools/Web_Audio_Editor +--- +<div>{{ToolsSidebar}}</div><p>С помощью <a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">Web Audio API</a>, разработчики создают {{domxref("AudioContext", " аудиоконтекст")}}. Затем в<span id="result_box" lang="ru"><span> этом контексте они создают ряд</span></span> {{domxref ("AudioNode", "audio nodes")}}, <span id="result_box" lang="ru"><span>включая:</span></span></p> + +<ul> + <li><span id="result_box" lang="ru"><span>Узлы, предоставляющие <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_sources">источник звука</a></span></span><span id="result_box" lang="ru"><span>, такие как генератор или источник буфера данных</span></span></li> + <li><span id="result_box" lang="ru"><span>Узлы, выполняющие <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_effects_filters">преобразования</a>,</span></span> <span id="result_box" lang="ru"><span>такие как задержка и усиление</span></span></li> + <li><span id="result_box" lang="ru"><span>Узлы, представляющие <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_destinations">назначение аудиопотока</a>,</span></span> <span id="result_box" lang="ru"><span>такие как динамики</span></span></li> +</ul> + +<p><span id="result_box" lang="ru"><span>Каждый узел имеет ноль или более свойств</span></span> {{domxref ("AudioParam")}} <span id="result_box" lang="ru"><span>которые настраивают его работу.</span> <span>Например </span></span>{{domxref ("GainNode")}} <span id="result_box" lang="ru"><span> имеет одно свойство усиления, в то время как</span></span> {{domxref ("OscillatorNode")}} <span id="result_box" lang="ru"><span>имеет частоту и свойства насстройки.</span></span></p> + +<p><span id="result_box" lang="ru"><span>Разработчик соединяет узлы в виде графика, а полный граф определяет поведение аудиопотока.</span></span></p> + +<p><span id="result_box" lang="ru"><span>Web Audio Editor исследует аудиоконтекст, созданный на странице, и обеспечивает визуализацию его графика.</span> <span>Это дает вам представление о его работе на высоком уровне и позволяет вам убедиться, что все узлы подключены так, как вы ожидаете.</span> <span>Затем вы можете изучить и отредактировать свойства AudioParam для каждого узла на графике.</span> <span>Некоторые свойства non-AudioParam, например свойство типа OscillatorNode, отображаются, и вы также можете их редактировать.</span></span></p> + +<p><span id="result_box" lang="ru"><span>Этот инструмент все еще экспериментальный.</span></span> <span id="result_box" lang="ru"><span>Если вы найдете ошибки, мы будем рады,</span></span> <a class="external external-icon" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox&component=Developer%20Tools%3A%20Web%20Audio%20Editor">если вы отправите их в Bugzilla</a>. <span id="result_box" lang="ru"><span>Если у вас есть вопросы или предложения по новым функциям, </span></span> <a href="http://ffdevtools.uservoice.com/forums/246087-firefox-developer-tools-ideas">ffdevtools.uservoice.com</a> или <a href="http://twitter.com/firefoxdevtools">Twitter</a> <span id="result_box" lang="ru"><span>отличные места для их регистрации.</span></span></p> + +<h2 id="Открытие_веб-аудиоредактора"><span class="short_text" id="result_box" lang="ru"><span>Открытие веб-аудиоредактора</span></span></h2> + +<p><span id="result_box" lang="ru"><span>Web Audio Editor по умолчанию</span></span><span lang="ru"><span> не включен в Firefox 32. Чтобы включить его, откройте Настройки инструмента разработчика и отметьте «Web Audio».</span> <span>Теперь на панели инструментов Toolbox должна быть дополнительная вкладка с надписью «Web Audio».</span> <span>Щелкните вкладку и загрузите страницу, которая создает звуковой контекст.</span> <span>Два хороших демки:</span></span></p> + +<ul> + <li><a href="https://github.com/mdn/voice-change-o-matic">Voice-change-O-Matic</a> <span id="result_box" lang="ru"><span> может применять различные эффекты к входу микрофона, а также обеспечивает визуализацию результата</span></span></li> + <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin</a>, <span id="result_box" lang="ru"><span>изменяет высоту и громкость синусоидальной волны при перемещении указателя мыши</span></span></li> +</ul> + +<h2 id="Визуализация_графа">Визуализация графа</h2> + +<p><span id="result_box" lang="ru"><span>Теперь Web Audio Editor отобразит график загруженного аудиоконтекста.</span> <span>Вот график демоверсии The Violent:</span></span></p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/10171/web-audio-editor.png" style="display: block; height: 648px; margin-left: auto; margin-right: auto; width: 868px;"> <span id="result_box" lang="ru"><span>Вы можете видеть, что он использует три узла: {{domxref ("OscillatorNode")}} в качестве источника, {{domxref ("GainNode")}} для управления томом и {{domxref ("GainNode")}} в качестве места назначения.</span></span></p> + +<h3 id="Подключения_к_AudioParams"><span class="short_text" id="result_box" lang="ru"><span>Подключения к AudioParams</span></span></h3> + +<div class="geckoVersionNote"> +<p><span id="result_box" lang="ru"><span>Отображение подключений к AudioParams является новым в Firefox 34.</span></span></p> +</div> + +<p><span id="result_box" lang="ru"><span>Соединения между узлами отображаются сплошными линиями.</span> <span>Если вместо этого вы подключили узел к AudioParam в другом узле, то соединение будет показано пунктирной линией между узлами и будет помечено именем AudioParam:</span></span><img alt="" src="https://mdn.mozillademos.org/files/8819/web%20audio-editor-connect-param.png" style="display: block; margin-left: auto; margin-right: auto;"></p> + +<h2 id="Проверка_и_изменение_AudioNodes"><span class="short_text" id="result_box" lang="ru"><span>Проверка и изменение AudioNodes</span></span></h2> + +<p><span id="result_box" lang="ru"><span>Если вы нажмете на узел, он подсветится, и вы получите инспектор узла справа.</span> <span>В этом списке перечислены значения свойств AudioParam этого узла.</span> <span>Например, вот как выглядит OscillatorNode:</span></span></p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/10173/web-audio-editor-props.png" style="display: block; height: 648px; margin-left: auto; margin-right: auto; width: 868px;"> <span id="result_box" lang="ru"><span>В демоверсии Viplent, параметр частоты изменяется когда пользователь перемещает мышь влево и вправо, и вы можете увидеть это, отраженное в инспекторе узлов.</span> <span>Однако значение не обновляется в реальном времени: вам нужно снова щелкнуть узел, чтобы увидеть обновленное значение.</span></span></p> + +<p><span id="result_box" lang="ru"><span>Если вы щелкнете значение в инспекторе узлов, вы можете изменить его: нажмите</span></span> <kbd>Enter</kbd> или <kbd>Tab</kbd> <span id="result_box" lang="ru"><span>и новое значение вступит в силу немедленно.</span></span></p> + +<h2 id="Обход_узлов"><span class="short_text" id="result_box" lang="ru"><span>Обход узлов</span></span></h2> + +<div class="geckoVersionNote"> +<p><span class="short_text" id="result_box" lang="ru"><span>Новое в Firefox 38.</span></span></p> +</div> + +<p><span id="result_box" lang="ru"><span>В панели, которая показывает детали узла, есть кнопка включения / выключения:</span></span></p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/10183/web-audio-editor-on-off.png" style="display: block; height: 97px; margin-left: auto; margin-right: auto; width: 316px;"> <span id="result_box" lang="ru"><span>Нажмите на него, и график будет изменен для обхода этого узла, поэтому он больше не будет иметь никакого эффекта.</span> <span>Узлы, которые обойдены, показаны заштрихованным фоном:</span></span></p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/10181/web-audio-editor-bypassed.png" style="display: block; height: 74px; margin-left: auto; margin-right: auto; width: 348px;"></p> |