r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

add support for audio files

Browse source
This commit is contained in:
catarak 2016-07-21 14:18:38 -04:00
parent 9201cb247c
commit 979fcf2152
4 changed files with 32 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
client/modules/IDE/actions/files.js
View file

@ -1,6 +1,8 @@
import * as ActionTypes from '../../../constants';
import axios from 'axios';
import blobUtil from 'blob-util';
import xhr from 'xhr';
import fileType from 'file-type';
const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
@ -33,15 +35,33 @@ export function updateFileContent(name, content) {
export function getBlobUrl(file) {
return (dispatch) => {
blobUtil.imgSrcToBlob(file.url, undefined, { crossOrigin: 'Anonymous' })
.then(blobUtil.createObjectURL)
.then(objectURL => {
dispatch({
type: ActionTypes.SET_BLOB_URL,
name: file.name,
blobURL: objectURL
xhr({
uri: file.url,
responseType: 'arraybuffer',
useXDR: true
}, (err, body, res) => {
if (err) throw err;
const typeOfFile = fileType(new Uint8Array(res));
blobUtil.arrayBufferToBlob(res, typeOfFile.mime)
.then(blobUtil.createObjectURL)
.then(objectURL => {
dispatch({
type: ActionTypes.SET_BLOB_URL,
name: file.name,
blobURL: objectURL
});
});
});
// blobUtil.imgSrcToBlob(file.url, undefined, { crossOrigin: 'Anonymous' })
// .then(blobUtil.createObjectURL)
// .then(objectURL => {
// dispatch({
// type: ActionTypes.SET_BLOB_URL,
// name: file.name,
// blobURL: objectURL
// });
// });
};
}

2
client/modules/IDE/components/FileUploader.js
View file

@ -23,7 +23,7 @@ class FileUploader extends React.Component {
maxThumbnailFilesize: 8, // 3MB
thumbnailWidth: 200,
thumbnailHeight: 200,
acceptedMimeTypes: 'image/bmp,image/gif,image/jpg,image/jpeg,image/png',
acceptedFiles: 'image/bmp,image/gif,image/jpg,image/jpeg,image/png,audio/*',
dictDefaultMessage: 'Drop files here to upload or click to use the file browser',
accept: this.props.dropzoneAcceptCallback,
sending: this.props.dropzoneSendingCallback,

2
client/modules/IDE/components/PreviewFrame.js
View file

@ -97,7 +97,7 @@ class PreviewFrame extends React.Component {
let jsFileStrings = newJSFile.content.match(/(['"])((\\\1|.)*?)\1/gm);
jsFileStrings = jsFileStrings || [];
jsFileStrings.forEach(jsFileString => {
if (jsFileString.match(/^('|")(?!(http:\/\/|https:\/\/)).*\.(png|jpg|jpeg|gif|bmp)('|")$/)) {
if (jsFileString.match(/^('|")(?!(http:\/\/|https:\/\/)).*\.(png|jpg|jpeg|gif|bmp|mp3|wav|aiff|ogg)('|")$/)) {
const filePath = jsFileString.substr(1, jsFileString.length - 2);
let fileName = filePath;
if (fileName.match(/^\.\//)) {

4
package.json
View file

@ -75,6 +75,7 @@
"express": "^4.13.4",
"express-session": "^1.13.0",
"file-saver": "^1.3.2",
"file-type": "^3.8.0",
"htmlhint": "^0.9.13",
"jshint": "^2.9.2",
"jszip": "^3.0.0",
@ -96,6 +97,7 @@
"s3-policy": "^0.2.0",
"shortid": "^2.2.6",
"srcdoc-polyfill": "^0.2.0",
"throttle-debounce": "^1.0.1"
"throttle-debounce": "^1.0.1",
"xhr": "^2.2.1"
}
}