Merge branch 'master' of git://gitorious.org/owncloud/owncloud
Robin Appelman
commit
49c2efee27
@ -0,0 +1,9 @@
|
||||
This plugin implements a very basic HTML5 audio preview for ownCloud.
|
||||
|
||||
Only formats supported by the browser can be played.
|
||||
Sadly, those are very limited and not coherent among browsers, see http://html5doctor.com/native-audio-in-the-browser/ for more info.
|
||||
|
||||
Ideas to change that (TODO):
|
||||
- Flashplayer fallback
|
||||
and/or
|
||||
- on-the-fly transcoding
|
||||
@ -0,0 +1,66 @@
|
||||
OC_AudioPlayer = new Object();
|
||||
|
||||
OC_AudioPlayer.playAudio = function(dir, file, type) {
|
||||
var path = WEBROOT + '/files/api?action=get&dir='+encodeURIComponent(dir)+'&file='+encodeURIComponent(file);
|
||||
|
||||
OC_AudioPlayer.audioFrame = document.createElement('div');
|
||||
OC_AudioPlayer.audioFrame.setAttribute('id', 'audioframe');
|
||||
OC_AudioPlayer.audioFrame.setAttribute('class', 'center');
|
||||
var div = document.createElement('div');
|
||||
var inner = document.createElement('div');
|
||||
var audio = document.createElement('audio');
|
||||
var source = document.createElement('source');
|
||||
|
||||
// if (!(!!(audio.canPlayType) && (audio.canPlayType(type) != "no") && (audio.canPlayType(type) != ""))) {
|
||||
// // use a flash player fallback
|
||||
// // or implement some nice on-the-fly recoding here
|
||||
// alert("Native playing of '"+type+"' format is not supported by your browser.");
|
||||
// return;
|
||||
// }
|
||||
audio.setAttribute('controls', 'controls');
|
||||
audio.setAttribute('preload', 'auto');
|
||||
audio.setAttribute('autoplay', 'autoplay');
|
||||
audio.setAttribute('autobuffer', 'autobuffer');
|
||||
source.setAttribute('src', path);
|
||||
source.setAttribute('type', type);
|
||||
|
||||
audio.appendChild(source);
|
||||
inner.appendChild(audio);
|
||||
div.appendChild(inner);
|
||||
OC_AudioPlayer.audioFrame.appendChild(div);
|
||||
|
||||
OC_AudioPlayer.audioFrame.addEvent('onclick', OC_AudioPlayer.hidePlayer);
|
||||
inner.addEvent('onclick', function(e){e.stopPropagation();}); // don't close if clicked on player
|
||||
|
||||
body = document.getElementsByTagName('body').item(0);
|
||||
body.appendChild(OC_AudioPlayer.audioFrame);
|
||||
}
|
||||
|
||||
OC_AudioPlayer.hidePlayer = function(){
|
||||
var div = document.getElementById('audioframe');
|
||||
div.parentNode.removeChild(div);
|
||||
}
|
||||
|
||||
// only register "play" option for file formats the browser claims to support
|
||||
OC_AudioPlayer.formats = {
|
||||
'audio/mpeg':"mp3",
|
||||
'audio/ogg':"ogg",
|
||||
'application/ogg':"ogg",
|
||||
'audio/wav':"wav",
|
||||
'audio/wave':"wav",
|
||||
'audio/x-wav':"wav",
|
||||
'audio/basic':"au",
|
||||
'audio/x-aiff':"aif"
|
||||
};
|
||||
var audio = document.createElement('audio');
|
||||
for(format in OC_AudioPlayer.formats) {
|
||||
if (!!(audio.canPlayType) && (audio.canPlayType(format) != "no") && (audio.canPlayType(format) != "")) {
|
||||
if(!OC_FILES.fileActions[format]) {
|
||||
OC_FILES.fileActions[format] = new Object();
|
||||
}
|
||||
OC_FILES.fileActions[format].play = function() {
|
||||
OC_AudioPlayer.playAudio(this.dir, this.file, this.mime);
|
||||
}
|
||||
OC_FILES.fileActions[format]['default'] = OC_FILES.fileActions[format].play;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
<?php
|
||||
//load the required js and css files
|
||||
OC_UTIL::addScript('plugins/audioplayer/audioplayer.js');
|
||||
OC_UTIL::addStyle('plugins/audioplayer/style.css');
|
||||
?>
|
||||
@ -0,0 +1,15 @@
|
||||
<?xml version="1.0"?>
|
||||
<plugin version='1.0'>
|
||||
<info>
|
||||
<id>audioplayer</id>
|
||||
<name>A simple HTML5 based audio player for ownCloud</name>
|
||||
<version>0.1</version>
|
||||
<licence>AGPL</licence>
|
||||
<author>ente</author>
|
||||
<require>1.1</require>
|
||||
</info>
|
||||
<runtime>
|
||||
<include>lib_audioplayer.php</include>
|
||||
</runtime>
|
||||
</plugin>
|
||||
|
||||
@ -0,0 +1,21 @@
|
||||
#audioframe{
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:0px;
|
||||
height:100%;
|
||||
width:100%;
|
||||
background:rgb(20,20,20);
|
||||
background:rgba(20,20,20,0.9);
|
||||
text-align:center;
|
||||
display:table;
|
||||
}
|
||||
|
||||
#audioframe>div{
|
||||
display:table-cell;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
#audioframe>div>div{
|
||||
display:inline-block;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue