1 Тема від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Тема: Випадкове програвання аудіо

Усім доброго вечора!))
Будь ласка, підкажить, яким чином зробити так, щоб щоразу при натисканні на кнопку випадково послідовно програвалися лише три аудіо.
Дякую!

<!DOCTYPE html>
<html> 
<head>
<script type="text/javascript">
function playRandomSound(){ 
    var sounds = [
       ".../sounds/01.mp3",
       ".../sounds/02.mp3",
       ".../sounds/03.mp3",
       ".../sounds/04.mp3",
       ".../sounds/05.mp3"
      ];
    
 
}
</script>
</head>
<body>
<button onclick="playAudio()">Play Audio</button>
</body>
</html>

2 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

Re: Випадкове програвання аудіо

Якось так.

function playRandomSound() { 
    const sounds = [
       ".../sounds/01.mp3",
       ".../sounds/02.mp3",
       ".../sounds/03.mp3",
       ".../sounds/04.mp3",
       ".../sounds/05.mp3"
      ];

    let i = 3;

    while(i) {
        const randomSound = sounds[Math.floor(Math.random() * sounds.length)];
        const audio = new Audio(randomSound);
        audio.play();
        i--;
    }
}
Подякували: Eme1

bebyk вебсайт

3 Відповідь від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Re: Випадкове програвання аудіо

bebyk написав:

Якось так.

Дякую, друже!)))
Але чомусь вони усі звучать разом...

4 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

Re: Випадкове програвання аудіо

Eme написав:

Але чомусь вони усі звучать разом...

Виходить, ще треба побавитися з опрацьовувачем onended.

Остаточний потестований варіант у мене вийшов такий.

index.html

<!DOCTYPE html>
<html>
<body>
<button onclick="playRandomSounds(3)">Play Audio</button>
</body>

<script src="index.js"></script>
</html>

index.js

'use strict';

const SOUNDS = [
    "./sounds/01.mp3",
    "./sounds/02.mp3",
    "./sounds/03.mp3",
    "./sounds/04.mp3",
    "./sounds/05.mp3"
   ];

function playRandomSounds(count) { 

    let index = count;
    const audio = new Audio(getRandomSound());
    audio.play();

    audio.onended = () => {
        if (index > 0) {
            audio.src = getRandomSound();
            audio.play();
            index--;
        }
    };
}

function getRandomSound() {
    return SOUNDS[Math.floor(Math.random() * SOUNDS.length)]
}
Подякували: P.Y., Eme, Tarpan873

bebyk вебсайт

5 Відповідь від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Re: Випадкове програвання аудіо

bebyk написав:

Остаточний потестований варіант у мене вийшов такий.

Просто чудово вийшов!))
Щиро вдячний Вам, добра Людина!)))
P.S. А в якому напрямку подивитися, щоб аудіо в одній серії не повторювалося?

6 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

Re: Випадкове програвання аудіо

Eme написав:

А в якому напрямку подивитися, щоб аудіо в одній серії не повторювалося?

Я розвʼязав би за допомогою проміжкового циклу, з якого видаляти той елемент, що програється.

Подякували: Eme1

bebyk вебсайт

7 Відповідь від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Re: Випадкове програвання аудіо

bebyk написав:

Я розвʼязав би за допомогою проміжкового циклу, з якого видаляти той елемент, що програється.

Дякую Вам... але я поки що самотужки, мабуть, не справлюсь(((

8 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

Re: Випадкове програвання аудіо

Eme написав:
bebyk написав:

Я розвʼязав би за допомогою проміжкового циклу, з якого видаляти той елемент, що програється.

Дякую Вам... але я поки що самотужки, мабуть, не справлюсь(((

Найпростіше зі splice.

'use strict';

const SOUNDS = [
    "./sounds/01.mp3",
    "./sounds/02.mp3",
    "./sounds/03.mp3",
    "./sounds/04.mp3",
    "./sounds/05.mp3"
   ];

function playRandomSounds(count) { 

    let sounds = SOUNDS;
    let index = count - 1;

    let  randomArrayIndex = getRandomNumber(sounds);
    const audio = new Audio(sounds.splice(randomArrayIndex, 1)[0]);
    audio.play();

    audio.onended = () => {
        if (index > 0) {
            randomArrayIndex = getRandomNumber(sounds);
            audio.src = sounds.splice(randomArrayIndex, 1)[0];
            audio.play();
            index--;
        }
    };
}

function getRandomNumber(maxNumber) {
    return Math.floor(Math.random() * maxNumber);
}
Подякували: Eme1

bebyk вебсайт

9 Відповідь від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Re: Випадкове програвання аудіо

bebyk написав:

Найпростіше зі splice

На жаль, заплуталося.... але я розберуся)

10 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

Re: Випадкове програвання аудіо

Eme написав:
bebyk написав:

Найпростіше зі splice

На жаль, заплуталося.... але я розберуся)

Вважайте на стан sound — splice не тільки повертає обраний елемент, але й змінює масив з треками, вилучаючи той, повернув.

Подякували: Eme1

bebyk вебсайт

11 Відповідь від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Re: Випадкове програвання аудіо

bebyk написав:

Вважайте на стан sound — splice не тільки повертає обраний елемент, але й змінює масив з треками, вилучаючи той, повернув.

Добре... дякую Вам!))

12 Відповідь від Eme

  • Eme
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 14.07.2023
  • Повідомлень: 7
    • Репутація: 0

Re: Випадкове програвання аудіо

bebyk написав:

Найпростіше зі splice.

Доброго дня, друже!))
Чомусь зразу не побачив оновлений Вами код((
Для полегшення сприйняття  вставив аудіо файли, але чомусь вони не відтворюються рандомно. Самостійно не можу розібратися((
У чому може бути проблема?

<!DOCTYPE html>
<html> 
<head>
<script type="text/javascript">
'use strict';

const SOUNDS = [
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0059980.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0094830.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0091290.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0034390.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0033030.mp3"
   ];

function playRandomSounds(count) { 

    let sounds = SOUNDS;
    let index = count - 1;

    let  randomArrayIndex = getRandomNumber(sounds);
    const audio = new Audio(sounds.splice(randomArrayIndex, 1)[0]);
    audio.play();

    audio.onended = () => {
        if (index > 0) {
            randomArrayIndex = getRandomNumber(sounds);
            audio.src = sounds.splice(randomArrayIndex, 1)[0];
            audio.play();
            index--;
        }
    };
}

function getRandomNumber(maxNumber) {
    return Math.floor(Math.random() * maxNumber);
}
</script>
</head>
<body>
<button onclick="playRandomSounds(3)">Play Audio</button>
</body>
</html>

13 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

Re: Випадкове програвання аудіо

Eme написав:
bebyk написав:

Найпростіше зі splice.

Доброго дня, друже!))
Чомусь зразу не побачив оновлений Вами код((
Для полегшення сприйняття  вставив аудіо файли, але чомусь вони не відтворюються рандомно. Самостійно не можу розібратися((
У чому може бути проблема?

<!DOCTYPE html>
<html> 
<head>
<script type="text/javascript">
'use strict';

const SOUNDS = [
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0059980.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0094830.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0091290.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0034390.mp3",
    "https://www.collinsdictionary.com/sounds/hwd_sounds/PL-W0033030.mp3"
   ];

function playRandomSounds(count) { 

    let sounds = SOUNDS;
    let index = count - 1;

    let  randomArrayIndex = getRandomNumber(sounds);
    const audio = new Audio(sounds.splice(randomArrayIndex, 1)[0]);
    audio.play();

    audio.onended = () => {
        if (index > 0) {
            randomArrayIndex = getRandomNumber(sounds);
            audio.src = sounds.splice(randomArrayIndex, 1)[0];
            audio.play();
            index--;
        }
    };
}

function getRandomNumber(maxNumber) {
    return Math.floor(Math.random() * maxNumber);
}
</script>
</head>
<body>
<button onclick="playRandomSounds(3)">Play Audio</button>
</body>
</html>

Попередньо можу сказати, що у функцію getRandomNumber треба передавати максимально допустиме число рандому (maxNumber). У даному випадку довжину масиву: наприклад, getRandomNumber(sounds.length)

bebyk вебсайт