Как добавить внешние ссылки как звук с помощью p5.js и библиотеки звука p5? - PullRequest
Новая
       19

Как добавить внешние ссылки как звук с помощью p5.js и библиотеки звука p5?

0 голосов
/ 13 марта 2019

Я возился с p5 и его звуковой библиотекой, и я создал небольшой веб-сайт, который генерирует кучу кругов, и я смог заставить круги пульсировать с помощью предварительно загруженной песни, но я хотел сыгратьс добавлением внешних песен с использованием ссылок YouTube, но я не могу заставить его работать. 

var x, y, dx, dy, rad;
        var sound, amplitude;

        var soundAdd;
        let input, button;

        var circ = [];

        var col1, col2, col3; 

        var maxcircles = 25;

        var clicked = 0;

        var trail = 1;

        var follM = 0;

        var clean = 0;

        function addSound() {
            sound = new p5.SoundFile(input.value());
            console.log("Sound Added: " + input.value);
        }

        function setup() {
            createCanvas(window.innerWidth, window.innerHeight);
            background(51);

            amplitude = new p5.Amplitude();

            col1 = round(random(0, 256));
            col2 = round(random(0, 256));
            col3 = round(random(0, 256));

            rad = 20;

            for(var i = 0; i < maxcircles; i++) {
                circ.push(new Circle(x, y, rad, dx, dy, col1, col2, col3));
                dx = random(-10, 10);
                dy = random(-10, 10);

                x = random(0 + rad, width - rad);
        y = random(0 + rad, height - rad);
            }

            input = createInput();

            button = createButton("Submit");
            button.mousePressed(addSound);

            noStroke();
        }

Этот код определяет переменные и функцию для добавления звука, и этот код заставляет его воспроизводить музыку, когда вынажмите 'm' 

if(keyCode === 77) {
                if(sound.isPlaying()) {
                    sound.stop();
                } else {
                    sound.play();
                }
            }

(Amplitude сейчас ничего не делает. Я взял его для отладки)

P5 Сайт: https://p5js.org/

HTML для добавленияp5: 

        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.dom.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.sound.js"></script>

В поле ввода я хотел бы иметь возможность размещать ссылки на видео на YouTube и воспроизводить звук с него.

...