Permalink
Fetching contributors…
Cannot retrieve contributors at this time
120 lines (94 sloc) 3.6 KB
import SoundAsset from "../../data/SoundAsset";
const data: {
projectClient: SupClient.ProjectClient;
asset: SoundAsset;
} = {} as any;
const ui: { streamingSelect?: HTMLSelectElement; audioElt?: HTMLAudioElement; } = {};
let socket: SocketIOClient.Socket = null;
function start() {
socket = SupClient.connect(SupClient.query.project);
socket.on("connect", onConnected);
socket.on("disconnect", SupClient.onDisconnected);
// Main
ui.audioElt = <HTMLAudioElement>document.querySelector("audio");
// Upload
const fileSelect = <HTMLInputElement>document.querySelector("input.file-select");
fileSelect.addEventListener("change", onFileSelectChange);
document.querySelector("button.upload").addEventListener("click", () => { fileSelect.click(); } );
document.querySelector("button.download").addEventListener("click", onDownloadSound);
// Sidebar
ui.streamingSelect = <HTMLSelectElement>document.querySelector(".property-streaming");
ui.streamingSelect.addEventListener("change", (event) => {
data.projectClient.editAsset(SupClient.query.asset, "setProperty", "streaming", ui.streamingSelect.value === "true");
});
}
// Network callbacks
const onAssetCommands: any = {};
function onConnected() {
data.projectClient = new SupClient.ProjectClient(socket);
const soundSubscriber = {
onAssetReceived,
onAssetEdited,
onAssetTrashed: SupClient.onAssetTrashed
};
data.projectClient.subAsset(SupClient.query.asset, "sound", soundSubscriber);
}
function onAssetReceived(err: string, asset: SoundAsset) {
data.asset = asset;
setupSound();
setupProperty("streaming", data.asset.pub.streaming);
}
function onAssetEdited(id: string, command: string, ...args: any[]) {
if (onAssetCommands[command] != null) onAssetCommands[command].apply(data.asset, args);
}
// User interface
let objectURL: string;
function onFileSelectChange(event: any) {
if (event.target.files.length === 0) return;
const reader = new FileReader();
reader.onload = (event) => {
data.projectClient.editAsset(SupClient.query.asset, "upload", reader.result);
};
reader.readAsArrayBuffer(event.target.files[0]);
event.target.parentElement.reset();
}
function onDownloadSound() {
function triggerDownload(name: string) {
const anchor = document.createElement("a");
document.body.appendChild(anchor);
anchor.style.display = "none";
anchor.href = objectURL;
// Not yet supported in IE and Safari (http://caniuse.com/#feat=download)
(anchor as any).download = name;
anchor.click();
document.body.removeChild(anchor);
}
const options = {
initialValue: SupClient.i18n.t("soundEditor:sidebar.settings.sound.file.download.defaultName"),
validationLabel: SupClient.i18n.t("common:actions.download")
};
if (SupApp != null) {
triggerDownload(options.initialValue);
} else {
new SupClient.Dialogs.PromptDialog(SupClient.i18n.t("soundEditor:sidebar.settings.sound.file.download.prompt"), options, (name) => {
if (name == null) return;
triggerDownload(name);
});
}
}
function setupSound() {
if (objectURL != null) URL.revokeObjectURL(objectURL);
const typedArray = new Uint8Array(data.asset.pub.sound);
const blob = new Blob([ typedArray ], {type: "audio"});
objectURL = URL.createObjectURL(blob);
ui.audioElt.src = objectURL;
}
function setupProperty(path: string, value: any) {
switch(path) {
case "streaming": ui.streamingSelect.value = value; break;
}
}
onAssetCommands.upload = setupSound;
onAssetCommands.setProperty = setupProperty;
// Start
SupClient.i18n.load([{ root: `${window.location.pathname}/../..`, name: "soundEditor" }], start);