Okazari / Rythm.js

A javascript library that makes your page dance.
https://okazari.github.io/Rythm.js/
GNU General Public License v3.0
3.93k stars 252 forks source link

Does not work in iOS Safari #98

Open mgreci opened 5 years ago

mgreci commented 5 years ago

I’m not sure if you have considered mobile or even Safari but starting the demo initially rotates the Github and Release Notes buttons but no music plays nor does everything dance like it does on a desktop (Chrome).

Okazari commented 5 years ago

Safari is a known bug for me, but i have nothing to debug this out :/ Any help to find the issue would be appreciated.

brianyuen commented 4 years ago

Would love to see this working on mobile with mic support.

Okazari commented 4 years ago

I still need help on this as i don't have neither a mac or an iphone.

mgreci commented 4 years ago

The demo plays fine on desktop Safari. Except for a console log Promise rejection error of navigator.getUserMedia upon click on 'Use Microphone'. I'll investigate, possibly send PR.

I can try to debug iOS Safari next.

oleegarch commented 1 year ago

Using combination of Howler and Rythm.js resolve this problem.

Example:

import Rythm from 'rythm.js'
import { Howl } from 'howler'
import kineticMusicMP3 from '@/assets/musics/kinetic.mp3'

const howlKinetic = new Howl({ src: kineticMusicMP3, html5: true, preload: false })

const rythm = new Rythm()
rythm.addRythm('rythm-pulse', 'pulse', 0, 10)
rythm.addRythm('rythm-shake', 'shake', 0, 10)
rythm.addRythm('rythm-twist', 'twist', 0, 10)

// when need to load music and start dance page
howlKinetic.load();
howlKinetic.play();
rythm.connectExternalAudioElement(howlKinetic._sounds[0]._node);
rythm.setGain(0.1);
rythm.player.currentInputType = rythm.player.inputTypeList['TRACK'];
rythm.start();

// when need to stop dancing
howlKinetic.stop();
rythm.stop();