Implemented support for audio playback with 'canPlayType' webAPI feature

src/config.json

@@ -1,12 +1,7 @@
 {
-	"swiper" : {
-		"speed" : 300,
-		"effect" : "slide"
+	"swiper": {
+		"speed": 300,
+		"effect": "slide"
 	},
-	"mimetypes": [
-		"video/mp4",
-		"video/ogg",
-		"video/webm",
-		"video/quicktime"
-	]
+	"mimetypes": ["video/mp4", "video/ogg", "video/webm", "video/quicktime", "audio/mpeg", "audio/wav"]
 }

src/scripts/init.js

@@ -2,58 +2,58 @@ if (!OCA.Mediaviewer) {
 	/**
 	 * @namespace
 	 */
-	OCA.Mediaviewer = {};
+	OCA.Mediaviewer = {}
 }
 
-OCA.Mediaviewer.app = require('./setup.js').default;
+OCA.Mediaviewer.app = require("./setup.js").default
 
 $(document).ready(function () {
-	const app = OCA.Mediaviewer.app;
-	const mountPoint = $('<div>', {
+	const app = OCA.Mediaviewer.app
+	const mountPoint = $("<div>", {
 		id: app.name,
-		html: '<div>'
-	});
+		html: "<div>",
+	})
 
 	if (!OCA.Files) {
-		return;
+		return
 	}
-	
+
 	// ---- Register fileactions -------
 
 	let actionHandler = (fileName, context) => {
-		$('body').append(mountPoint);
+		$("body").append(mountPoint)
 
-		OCA.Mediaviewer.files = context.fileList.files;
+		OCA.Mediaviewer.files = context.fileList.files
 
 		OC.addScript(app.name, app.name).then(() => {
-			OC.redirect(OC.joinPaths('#', app.name, fileName));
-		});
-	};
-
-	app.config.mimetypes.forEach( (mimetype) => {
+			OC.redirect(OC.joinPaths("#", app.name, fileName))
+		})
+	}
 
+	app.config.mimetypes.forEach((mimetype) => {
 		// register only browser playable videotypes
-		let n = mimetype.search("video");
+		let n = mimetype.search(/^(audio|video)/)
 		if (n === 0) {
-			let hasVideo = document.createElement('video').canPlayType &&
-				document.createElement('video').canPlayType(mimetype);
-			if (!hasVideo) {
-				return;
+			let hasMedia =
+				(document.createElement("video").canPlayType && document.createElement("video").canPlayType(mimetype)) ||
+				(document.createElement("audio").canPlayType && document.createElement("audio").canPlayType(mimetype))
+			if (!hasMedia) {
+				return
 			}
 		}
 
 		let ViewMedia = {
 			mime: mimetype,
 			name: app.name,
 			permissions: OC.PERMISSION_READ,
-			displayName: t('files_mediaviewer', 'Open in Media Viewer'),
-			iconClass: 'icon-toggle',
-			actionHandler
-		};
+			displayName: t("files_mediaviewer", "Open in Media Viewer"),
+			iconClass: "icon-toggle",
+			actionHandler,
+		}
 
 		if (OCA.Files.fileActions) {
-			OCA.Files.fileActions.registerAction(ViewMedia);
-			OCA.Files.fileActions.setDefault(mimetype, app.name);
+			OCA.Files.fileActions.registerAction(ViewMedia)
+			OCA.Files.fileActions.setDefault(mimetype, app.name)
 		}
-	});
-});
+	})
+})