Nutella Peanut-Butter Marshmallow

    soundplayer-widget

    0.4.2 • Public • Published

     Embeddable SoundCloud Players

    npm version Dependency Status Download Count

    The proof of concept in building of component-based, high-quality embeddable widgets. Under the hood Soundplayer Widget consists of deku.js for components and soundcloud-audio.js for HTML5 Audio API.

    Demo

    Manual Setup

    I. Register for an app and get SoundCloud API clientId at https://developers.soundcloud.com.

    II. Include the script into your html page:

    <script>
    /* * * CONFIGURATION VARIABLES * * */
    var sb_soundplayer_client_id = 'YOUR_CLIENT_ID';
     
    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function(d, s, id) {
        if (d.getElementById(id)) return;
        var fjs = d.getElementsByTagName(s)[0],
            js = fjs.parentNode.insertBefore(d.createElement(s), fjs);
        js.id = id;
        js.src = '//cdnjs.cloudflare.com/ajax/libs/soundplayer-widget/0.3.6/soundplayer-widget.min.js';
    })(document, 'script', 'sb-soundplayer-widget-sdk');
    </script> 

    III. Insert widget into the place where you want it to be shown on the page with necessary SoundCloud track or playlist link in data-url:

    <div data-url="https://soundcloud.com/shura/shura-indecision-12-edit-1" class="sb-soundplayer-widget"></div>

    IV. Enjoy! 😎 🎆 💃

    Soundplayer Widget is also available on npm:
    npm install soundplayer-widget --save

    Why Deku and not React?!

    Article on this topic (and about the whole process of development) is coming soon..

    Browser support

    Dependency on Deku which (due to its' tiny size) doesn't support legacy browsers. It means that SoundPlayer has the same range of supported browsers.

    Chrome Firefox IE Safari
    39+ ✔ 34+ ✔ 10+ ✔ 7+ ✔

    To Do

    • playlists support
    • support for multiple different style layouts
    • global SDK object (for purposes like subscribe to audio events etc.)

    Have a suggestion?


    MIT Licensed

    Install

    npm i soundplayer-widget

    DownloadsWeekly Downloads

    40

    Version

    0.4.2

    License

    MIT

    Last publish

    Collaborators

    • dmitri