apostrophe-soundcloud
It's soundcloud for apostrophe.
Last updated 5 years ago by colpanik .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install apostrophe-soundcloud 
SYNC missed versions from official npm registry.

apostrophe-soundcloud

A simple, style-able soundcloud widget for Apostrophe.

You must have a SoundCloud client id in order to use this module. To obtain a client id, log in to SoundCloud and register an "application" on this page. It doesn't take long.

usage

Enable the module and configure your client id in app.js

modules: {
  apostrophe-soundcloud: {
    clientId: 'xxxxxxxxxxxxxxx'
  }
  // ...other modules
}

Now in a template, you can simply call the widget as an aposSingleton

{{ aposSingleton(page, 'sound', 'soundcloud', {}) }}

You can also add it to the controls aray of an aposArea to make it available in the "Add Content" menu

{{ aposArea(page, 'mixed', {
  controls: ['style', 'bold', 'italic', 'slideshow', 'soundcloud']
}) }}

configuration

You can set a multiPlay option that allows multiple soundcloud widgets to play on the page at once. This defaults to false, making sure that when a user clicks "play" on a soundcloud widget, the soundcloud manager will stop the playback of any other soundcloud widgets on the page.

You can also pass a displayOptions object to customize the display of your waveforms

  • sampleSize the resolution of the waveform. The higher the number, the chunkier it gets.
  • innerColor the fill color of the waveform before it has been interacted with.
  • loadedColor the fill color of the part of waveform that has been loaded after play
  • playedColor the fill color for the part of the waveform that has already been played
  • scrubberColor the color of the bar that appears when your cursor hovers over a sound that is playing
modules: {
  apostrophe-soundcloud: {
    clientId: 'xxxxxxxxxxxxxxxxxxx',
    multiPlay: false,
    displayOptions: {
      sampleSize: 1,
      innerColor: 'rgba(255, 255, 255)',
      loadedColor: 'rgb(240, 240, 240)',
      playedColor: 'rgb(160, 160, 160)',
      scrubberColor: '#00ff00'
    }
  }
}

Instead of specifying site-wide displayOptions, you can pass them directly into your widget. If you have configured displayOptions in your app.js, setting them in your singleton's options will extend what you have already set in app.js

{{ aposSingleton(page, 'sound', 'soundcloud', {
  displayOptions: {
    // override the loadedColor set in app.js but leave the other colors as-is
    loadedColor: 'rgb(0, 0, 255)'
  }
}) }}

Current Tags

  • 0.5.0                                ...           latest (5 years ago)

30 Versions

  • 0.5.0                                ...           5 years ago
  • 0.0.48                                ...           5 years ago
  • 0.0.47                                ...           5 years ago
  • 0.0.46                                ...           5 years ago
  • 0.0.45                                ...           5 years ago
  • 0.0.44                                ...           6 years ago
  • 0.0.43                                ...           6 years ago
  • 0.0.42                                ...           6 years ago
  • 0.0.41                                ...           6 years ago
  • 0.0.40                                ...           6 years ago
  • 0.0.39                                ...           6 years ago
  • 0.0.38                                ...           6 years ago
  • 0.0.37                                ...           6 years ago
  • 0.0.36                                ...           6 years ago
  • 0.0.35                                ...           6 years ago
  • 0.0.32                                ...           6 years ago
  • 0.0.3                                ...           6 years ago
  • 0.0.21                                ...           6 years ago
  • 0.0.2                                ...           6 years ago
  • 0.0.34                                ...           6 years ago
  • 0.0.33                                ...           6 years ago
  • 0.0.31                                ...           6 years ago
  • 0.0.29                                ...           6 years ago
  • 0.0.27                                ...           6 years ago
  • 0.0.26                                ...           6 years ago
  • 0.0.25                                ...           6 years ago
  • 0.0.24                                ...           6 years ago
  • 0.0.23                                ...           6 years ago
  • 0.0.22                                ...           6 years ago
  • 0.0.1                                ...           6 years ago
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 1
Dependencies (1)
Dev Dependencies (0)
None
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |