{"id":127,"date":"2026-08-27T09:28:48","date_gmt":"2026-08-27T06:28:48","guid":{"rendered":"https:\/\/mzxbox.ru\/?page_id=127"},"modified":"2026-08-27T13:38:33","modified_gmt":"2026-08-27T10:38:33","slug":"127-2","status":"publish","type":"page","link":"https:\/\/mzxbox.ru\/?page_id=127","title":{"rendered":"Simple sampler"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">catalogTestSampler.json<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#FFFFFF\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#000000;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>{\n\t\"label\": \"Test Sampler Plugin\",\n\t\"purpose\": \"Sampler\",\n\t\"kind\": \"tesSamplerPluginV1_0\",\n\t\"ui\": \"http:\/\/127.0.0.1:8080\/sampler\/ui2.html\",\n\t\"evaluate\": \"createNewTestSamplerPlugin\",\n\t\"script\": \"http:\/\/127.0.0.1:8080\/sampler\/plugin2.js\"\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki light-plus\" style=\"background-color: #FFFFFF\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #000000\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #A31515\">&quot;label&quot;<\/span><span style=\"color: #000000\">: <\/span><span style=\"color: #A31515\">&quot;Test Sampler Plugin&quot;<\/span><span style=\"color: #000000\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #A31515\">&quot;purpose&quot;<\/span><span style=\"color: #000000\">: <\/span><span style=\"color: #A31515\">&quot;Sampler&quot;<\/span><span style=\"color: #000000\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #A31515\">&quot;kind&quot;<\/span><span style=\"color: #000000\">: <\/span><span style=\"color: #A31515\">&quot;tesSamplerPluginV1_0&quot;<\/span><span style=\"color: #000000\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #A31515\">&quot;ui&quot;<\/span><span style=\"color: #000000\">: <\/span><span style=\"color: #A31515\">&quot;http:\/\/127.0.0.1:8080\/sampler\/ui2.html&quot;<\/span><span style=\"color: #000000\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #A31515\">&quot;evaluate&quot;<\/span><span style=\"color: #000000\">: <\/span><span style=\"color: #A31515\">&quot;createNewTestSamplerPlugin&quot;<\/span><span style=\"color: #000000\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #A31515\">&quot;script&quot;<\/span><span style=\"color: #000000\">: <\/span><span style=\"color: #A31515\">&quot;http:\/\/127.0.0.1:8080\/sampler\/plugin2.js&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">plugin2.js<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#FFFFFF\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#000000;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>function createNewTestSamplerPlugin() {\n\tlet audioContext = null;\n\tlet outputVolume = null;\n\tlet properties = {\n\t\tvolume: 0.7,\n\t\tratio: 1\n\t};\n\tlet noiseBuffer;\n\tlet nodes = [];\n\treturn {\n\t\tlaunch: (context, parameters) => {\n\t\t\tif (!(outputVolume)) {\n\t\t\t\taudioContext = context;\n\t\t\t\toutputVolume = audioContext.createGain();\n\n\t\t\t\tnoiseBuffer = audioContext.createBuffer(1, 12345, audioContext.sampleRate);\n\t\t\t\tfor (let ii = 0; ii &lt; noiseBuffer.getChannelData(0).length; ii++) {\n\t\t\t\t\tnoiseBuffer.getChannelData(0)&#91;ii&#93; = Math.random() * 2 - 1;\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (parameters) {\n\t\t\t\tproperties = parameters;\n\t\t\t}\n\t\t\toutputVolume.gain.value = properties.volume;\n\t\t},\n\t\tbusy: () => {\n\t\t\treturn false;\n\t\t},\n\t\tduration: () => {\n\t\t\treturn 0.25;\n\t\t},\n\t\tstart: (when, tempo) => {\n\t\t\tconst boom = audioContext.createBufferSource();\n\t\t\tboom.buffer = noiseBuffer;\n\t\t\tboom.playbackRate.value = properties.ratio;\n\t\t\tboom.loop = true;\n\t\t\tboom.loopStart = Math.random() * 1.0;\n\t\t\tboom.connect(outputVolume);\n\t\t\tboom.start(when);\n\t\t\tboom.stop(when + 0.25);\n\t\t\tnodes.push(boom);\n\t\t},\n\t\tcancel: () => {\n\t\t\tnodes.forEach((node) => {\n\t\t\t\tnode.disconnect();\n\t\t\t});\n\t\t\tnodes = [];\n\t\t},\n\t\toutput: () => {\n\t\t\treturn outputVolume;\n\t\t}\n\t};\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki light-plus\" style=\"background-color: #FFFFFF\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #0000FF\">function<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #795E26\">createNewTestSamplerPlugin<\/span><span style=\"color: #000000\">() {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #0000FF\">let<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">audioContext<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #0000FF\">null<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #0000FF\">let<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">outputVolume<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #0000FF\">null<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #0000FF\">let<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000\"> = {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #001080\">volume:<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #098658\">0.7<\/span><span style=\"color: #000000\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #001080\">ratio:<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #098658\">1<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t};<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #0000FF\">let<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">noiseBuffer<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #0000FF\">let<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">nodes<\/span><span style=\"color: #000000\"> = [];<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #AF00DB\">return<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #795E26\">launch<\/span><span style=\"color: #001080\">:<\/span><span style=\"color: #000000\"> (<\/span><span style=\"color: #001080\">context<\/span><span style=\"color: #000000\">, <\/span><span style=\"color: #001080\">parameters<\/span><span style=\"color: #000000\">) <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #AF00DB\">if<\/span><span style=\"color: #000000\"> (!(<\/span><span style=\"color: #001080\">outputVolume<\/span><span style=\"color: #000000\">)) {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t<\/span><span style=\"color: #001080\">audioContext<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">context<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t<\/span><span style=\"color: #001080\">outputVolume<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">audioContext<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">createGain<\/span><span style=\"color: #000000\">();<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t<\/span><span style=\"color: #001080\">noiseBuffer<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">audioContext<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">createBuffer<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #098658\">1<\/span><span style=\"color: #000000\">, <\/span><span style=\"color: #098658\">12345<\/span><span style=\"color: #000000\">, <\/span><span style=\"color: #001080\">audioContext<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">sampleRate<\/span><span style=\"color: #000000\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t<\/span><span style=\"color: #AF00DB\">for<\/span><span style=\"color: #000000\"> (<\/span><span style=\"color: #0000FF\">let<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">ii<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #098658\">0<\/span><span style=\"color: #000000\">; <\/span><span style=\"color: #001080\">ii<\/span><span style=\"color: #000000\"> &lt; <\/span><span style=\"color: #001080\">noiseBuffer<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">getChannelData<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #098658\">0<\/span><span style=\"color: #000000\">).<\/span><span style=\"color: #001080\">length<\/span><span style=\"color: #000000\">; <\/span><span style=\"color: #001080\">ii<\/span><span style=\"color: #000000\">++) {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t\t<\/span><span style=\"color: #001080\">noiseBuffer<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">getChannelData<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #098658\">0<\/span><span style=\"color: #000000\">)&#91;<\/span><span style=\"color: #001080\">ii<\/span><span style=\"color: #000000\">&#93; = <\/span><span style=\"color: #001080\">Math<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">random<\/span><span style=\"color: #000000\">() * <\/span><span style=\"color: #098658\">2<\/span><span style=\"color: #000000\"> - <\/span><span style=\"color: #098658\">1<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #AF00DB\">if<\/span><span style=\"color: #000000\"> (<\/span><span style=\"color: #001080\">parameters<\/span><span style=\"color: #000000\">) {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t<\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">parameters<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">outputVolume<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">gain<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">value<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">volume<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #795E26\">busy<\/span><span style=\"color: #001080\">:<\/span><span style=\"color: #000000\"> () <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #AF00DB\">return<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #0000FF\">false<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #795E26\">duration<\/span><span style=\"color: #001080\">:<\/span><span style=\"color: #000000\"> () <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #AF00DB\">return<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #098658\">0.25<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #795E26\">start<\/span><span style=\"color: #001080\">:<\/span><span style=\"color: #000000\"> (<\/span><span style=\"color: #001080\">when<\/span><span style=\"color: #000000\">, <\/span><span style=\"color: #001080\">tempo<\/span><span style=\"color: #000000\">) <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #0000FF\">const<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #0070C1\">boom<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">audioContext<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">createBufferSource<\/span><span style=\"color: #000000\">();<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">buffer<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">noiseBuffer<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">playbackRate<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">value<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">ratio<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">loop<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #0000FF\">true<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #001080\">loopStart<\/span><span style=\"color: #000000\"> = <\/span><span style=\"color: #001080\">Math<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">random<\/span><span style=\"color: #000000\">() * <\/span><span style=\"color: #098658\">1.0<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">connect<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #001080\">outputVolume<\/span><span style=\"color: #000000\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">start<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #001080\">when<\/span><span style=\"color: #000000\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">stop<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #001080\">when<\/span><span style=\"color: #000000\"> + <\/span><span style=\"color: #098658\">0.25<\/span><span style=\"color: #000000\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">nodes<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">push<\/span><span style=\"color: #000000\">(<\/span><span style=\"color: #001080\">boom<\/span><span style=\"color: #000000\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #795E26\">cancel<\/span><span style=\"color: #001080\">:<\/span><span style=\"color: #000000\"> () <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">nodes<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">forEach<\/span><span style=\"color: #000000\">((<\/span><span style=\"color: #001080\">node<\/span><span style=\"color: #000000\">) <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t\t<\/span><span style=\"color: #001080\">node<\/span><span style=\"color: #000000\">.<\/span><span style=\"color: #795E26\">disconnect<\/span><span style=\"color: #000000\">();<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t});<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #001080\">nodes<\/span><span style=\"color: #000000\"> = [];<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t<\/span><span style=\"color: #795E26\">output<\/span><span style=\"color: #001080\">:<\/span><span style=\"color: #000000\"> () <\/span><span style=\"color: #0000FF\">=&gt;<\/span><span style=\"color: #000000\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t\t<\/span><span style=\"color: #AF00DB\">return<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #001080\">outputVolume<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\t}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t};<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">ui2.html<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#FFFFFF\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#000000;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>&lt;html>\n\n&lt;head>\n\t&lt;style>\n\t\tbody {\n\t\t\tbackground: silver;\n\t\t}\n\t&lt;\/style>\n&lt;\/head>\n\n&lt;body>\n\t&lt;h1>Test Sampler Plugin&lt;\/h1>\n\t&lt;p>Volume&lt;\/p>\n\t&lt;p>&lt;input type=\"range\" id=\"volumeslider\" min=\"0\" max=\"1\" step=\"0.1\" onchange=\"setVolume(this.value);\" \/>&lt;\/p>\n\t&lt;p>Pitch ratio&lt;\/p>\n\t&lt;p>&lt;input type=\"range\" id=\"pitchslider\" min=\"0.25\" max=\"3\" step=\"0.1\" onchange=\"setRatio(this.value);\" \/>&lt;\/p>\n&lt;\/body>\n&lt;script>\n\tlet dialigId = '';\n\tlet properties = {\n\t\tvolume: 0.7,\n\t\tratio: 1\n\t};\n\n\tfunction setRatio(rr) {\n\t\tproperties.ratio = rr;\n\t\tpostMessageToHost();\n\t}\n\n\tfunction setVolume(nn) {\n\t\tproperties.volume = nn;\n\t\tpostMessageToHost();\n\t}\n\n\tfunction onHostMessage(messageEvent) {\n\t\tif (dialigId) {\n\t\t\tif (messageEvent.data.hostData) {\n\t\t\t\tproperties = messageEvent.data.hostData;\n\t\t\t}\n\t\t\tdocument.getElementById('volumeslider').value = properties.volume;\n\t\t\tdocument.getElementById('pitchslider').value = properties.ratio;\n\t\t} else {\n\t\t\tdialigId = messageEvent.data.hostData;\n\t\t}\n\t}\n\n\tfunction postMessageToHost() {\n\t\twindow.parent.postMessage({\n\t\t\tdialogID: dialigId,\n\t\t\tpluginData: properties,\n\t\t\tdone: false,\n\t\t\tscreenWait: false\n\t\t}, '*');\n\t}\n\twindow.addEventListener('message', onHostMessage, false);\n\tpostMessageToHost();\n&lt;\/script>\n\n&lt;\/html><\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki light-plus\" style=\"background-color: #FFFFFF\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #800000\">&lt;html&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;head&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;style&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t\tbody <\/span><span style=\"color: #0000FF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t<\/span><span style=\"color: #001080\">background<\/span><span style=\"color: #000000FF\">: <\/span><span style=\"color: #001080\">silver<\/span><span style=\"color: #000000FF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #0000FF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;\/style&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;\/head&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;body&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;h1&gt;<\/span><span style=\"color: #000000\">Test Sampler Plugin<\/span><span style=\"color: #800000\">&lt;\/h1&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;p&gt;<\/span><span style=\"color: #000000\">Volume<\/span><span style=\"color: #800000\">&lt;\/p&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;p&gt;&lt;input<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">type<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;range&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">id<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;volumeslider&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">min<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;0&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">max<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;1&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">step<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;0.1&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">onchange<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;setVolume(this.value);&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #800000\">\/&gt;&lt;\/p&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;p&gt;<\/span><span style=\"color: #000000\">Pitch ratio<\/span><span style=\"color: #800000\">&lt;\/p&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\t<\/span><span style=\"color: #800000\">&lt;p&gt;&lt;input<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">type<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;range&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">id<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;pitchslider&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">min<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;0.25&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">max<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;3&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">step<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;0.1&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #E50000\">onchange<\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #A31515\">&quot;setRatio(this.value);&quot;<\/span><span style=\"color: #000000\"> <\/span><span style=\"color: #800000\">\/&gt;&lt;\/p&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;\/body&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;script&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\tlet dialigId = &#39;&#39;;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\tlet properties = <\/span><span style=\"color: #0000FF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #001080\">volume<\/span><span style=\"color: #000000FF\">: <\/span><span style=\"color: #098658\">0.7<\/span><span style=\"color: #000000FF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #001080\">ratio<\/span><span style=\"color: #000000FF\">: <\/span><span style=\"color: #098658\">1<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t<\/span><span style=\"color: #0000FF\">}<\/span><span style=\"color: #000000\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\tfunction setRatio(rr) <\/span><span style=\"color: #0000FF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000FF\">.<\/span><span style=\"color: #001080\">ratio<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #001080\">rr<\/span><span style=\"color: #000000FF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #795E26\">postMessageToHost<\/span><span style=\"color: #000000FF\">();<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t<\/span><span style=\"color: #0000FF\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\tfunction setVolume(nn) <\/span><span style=\"color: #0000FF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000FF\">.<\/span><span style=\"color: #001080\">volume<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #001080\">nn<\/span><span style=\"color: #000000FF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #795E26\">postMessageToHost<\/span><span style=\"color: #000000FF\">();<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t<\/span><span style=\"color: #0000FF\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\tfunction onHostMessage(messageEvent) <\/span><span style=\"color: #0000FF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t<\/span><span style=\"color: #795E26\">if<\/span><span style=\"color: #000000FF\"> (<\/span><span style=\"color: #001080\">dialigId<\/span><span style=\"color: #000000FF\">) {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t<\/span><span style=\"color: #795E26\">if<\/span><span style=\"color: #000000FF\"> (messageEvent.data.hostData) {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t\t<\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #000000\">=<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #001080\">messageEvent<\/span><span style=\"color: #000000FF\">.<\/span><span style=\"color: #001080\">data<\/span><span style=\"color: #000000FF\">.<\/span><span style=\"color: #001080\">hostData<\/span><span style=\"color: #000000FF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\tdocument.getElementById(<\/span><span style=\"color: #A31515\">&#39;volumeslider&#39;<\/span><span style=\"color: #001080\">).value = properties.volume;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t\t\tdocument.getElementById(<\/span><span style=\"color: #A31515\">&#39;pitchslider&#39;<\/span><span style=\"color: #001080\">).value = properties.ratio;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t\t} else {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t\t\tdialigId = messageEvent.data.hostData;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t\t}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\tfunction postMessageToHost() {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t\twindow.parent.postMessage({<\/span><\/span>\n<span class=\"line\"><span style=\"color: #001080\">\t\t\tdialogID:<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #001080\">dialigId<\/span><span style=\"color: #000000FF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t<\/span><span style=\"color: #001080\">pluginData:<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #001080\">properties<\/span><span style=\"color: #000000FF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t<\/span><span style=\"color: #001080\">done:<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #0000FF\">false<\/span><span style=\"color: #000000FF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t\t<\/span><span style=\"color: #001080\">screenWait:<\/span><span style=\"color: #000000FF\"> <\/span><span style=\"color: #0000FF\">false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t\t}, <\/span><span style=\"color: #A31515\">&#39;*&#39;<\/span><span style=\"color: #000000FF\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000FF\">\t<\/span><span style=\"color: #0000FF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\twindow.addEventListener(&#39;message&#39;, onHostMessage, false);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #000000\">\tpostMessageToHost();<\/span><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;\/script&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #800000\">&lt;\/html&gt;<\/span><\/span><\/code><\/pre><\/div>\n","protected":false},"excerpt":{"rendered":"<p>catalogTestSampler.json plugin2.js ui2.html<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":112,"menu_order":2,"comment_status":"closed","ping_status":"closed","template":"mzxbox-template-front","meta":{"footnotes":""},"class_list":["post-127","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/pages\/127","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mzxbox.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=127"}],"version-history":[{"count":4,"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/pages\/127\/revisions"}],"predecessor-version":[{"id":152,"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/pages\/127\/revisions\/152"}],"up":[{"embeddable":true,"href":"https:\/\/mzxbox.ru\/index.php?rest_route=\/wp\/v2\/pages\/112"}],"wp:attachment":[{"href":"https:\/\/mzxbox.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=127"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}