I've managed to get it working with Youtube and Vimeo video's, and it's awesome. However, I also try to upload mp3's and play them using the HTML5 Media player. The files can be played correctly using the player, but not in the Colorbox.

This is the HTML generated:

<div id="cboxLoadedContent" style="width: 400px; overflow: hidden; height: 300px; "><div id="file-138" class="file file-audio file-audio-mpeg contextual-links-region">
  <div class="content">
    <div id="player--0" class="media-player" style="width:400px; height:300px;">
  <div class="media-player-error"></div>
  <div class="media-player-controls">
    <div class="media-player-controls-left">
      <a class="media-player-play" title="Play"></a>
      <a class="media-player-pause" title="Pause"></a>
    </div>
    <div class="media-player-controls-right">
      <div class="media-player-timer">00:00</div>
      <div class="media-player-fullscreen">
        <div class="media-player-fullscreen-inner"></div>
      </div>
      <div class="media-player-volume">
        <div class="media-player-volume-slider"></div>
        <a class="media-player-volume-button" title="Mute/Unmute"></a>
      </div>
    </div>
    <div class="media-player-controls-mid">
      <div class="media-player-seek">
        <div class="media-player-progress"></div>
      </div>
    </div>
  </div>
  <div class="media-player-play-loader">
    <div class="media-player-big-play"><span></span></div>
    <div class="media-player-loader">&nbsp;</div>
    <div class="media-player-preview"></div>
  </div>
  <div class="media-player-display">
    <audio preload="" id="player--0-player" width="100%" height="100%"><source src="http://dev.clientname.com/files/10_coldplay_-_princess_of_china-320k.mp3">
</audio>
  </div>
</div>  </div>
</div>
</div>

So there is actually an audio element with a valid source. However, the needed JS from the html5_media module is missing. Any thoughts?

Comments

kmadel’s picture

kmadel commented

I actually got it working with the Mediaelement module and would recommend that module for using Media Colorbox with audio. I am working on an updated version fo the module that will handle the file display on the node better for audio and video files, and will allow you to create audio playlists with Media Colorbox for multiple HTML5 based audio playback and Colorbox galleries of audio files.

kmadel’s picture

kmadel commented
Version: 7.x-1.x-dev » 7.x-1.0-rc2
Status: Active » Closed (works as designed)

7.x-1.0-rc2 has much better support for displaying audio and video. You can now display any number of custom fields as part of the link used to open the Colorbox.