(function() {
var onDOMContentLoaded = function() {
var displayProperties = function(node, tableid, caption) {
var html = '<caption>' + caption + '</caption>';
html += '<thead>';
html += '<tr>';
html += '<th scope="col">Property</th>';
html += '<th scope="col">Value</th>';
html += '<th scope="col">hasOwnProperty</th>';
html += '</tr>';
html += '</thead>';
html += '<tbody>';
if (node instanceof ArrayBuffer) {
var key = 'byteLength';
html += '<tr>';
html += '<td>' + key + '</td>';
html += '<td>' + node[key] + '</td>';
html += '<td>' + node.hasOwnProperty(key) + '</td>';
html += '</tr>';
} else {
for (var key in node) {
html += '<tr>';
html += '<td>' + key + '</td>';
html += '<td>' + node[key] + '</td>';
html += '<td>' + node.hasOwnProperty(key) + '</td>';
html += '</tr>';
}
}
html += '</tbody>';
document.getElementById(tableid).innerHTML = html;
document.getElementById(tableid).parentNode.previousElementSibling.style.display = 'block';
};
/*
* File Uploader
*/
document.querySelector('[type="file"]').addEventListener('change', function(event) {
var uploader = this;
// Get the instance of File (extends Blob)
var file = event.target.files[0];
if (!(file instanceof File)) {
window.alert('Please upload file.');
} else if (file.type.indexOf('audio') === -1) {
window.alert('Please upload audio file.');
} else {
// Create the instance of FileReader
var reader = new FileReader();
reader.onprogress = function(event) {
if (event.lengthComputable && (event.total > 0)) {
var rate = Math.floor((event.loaded / event.total) * 100);
document.getElementById('progress-file-upload-audio').textContent = rate + ' %';
}
};
reader.onerror = function() {
window.alert('FileReader Error : Error code is ' + reader.error.code);
uploader.value = '';
};
// Success read
reader.onload = function() {
var arrayBuffer = reader.result; // Get ArrayBuffer
displayProperties(file, 'file-properties', 'File (extends Blob)');
displayProperties(arrayBuffer, 'arraybuffer-properties', 'ArrayBuffer');
document.getElementById('progress-file-upload-audio').textContent = file.name;
uploader.value = '';
};
// Read the instance of File
reader.readAsArrayBuffer(file);
}
}, false);
/*
* Drag & Drop
*/
document.getElementById('drop-area').addEventListener('dragenter', function(event) {
event.preventDefault();
document.getElementById('drop-area').classList.add('dragover');
}, false);
document.getElementById('drop-area').addEventListener('dragover', function(event) {
event.preventDefault();
}, false);
document.getElementById('drop-area').addEventListener('dragleave', function(event) {
event.preventDefault();
document.getElementById('drop-area').classList.remove('dragover');
}, false);
document.getElementById('drop-area').addEventListener('drop', function(event) {
event.preventDefault();
document.getElementById('drop-area').classList.remove('dragover');
// Get the instance of File (extends Blob)
var file = /*('items' in event.dataTransfer) ? event.dataTransfer.items[0].getAsFile() : */event.dataTransfer.files[0];
if (!(file instanceof Blob)) {
window.alert('Please upload file.');
} else if (file.type.indexOf('audio') === -1) {
window.alert('Please upload audio file.');
} else {
// Create the instance of FileReader
var reader = new FileReader();
reader.onprogress = function(event) {
if (event.lengthComputable && (event.total > 0)) {
var rate = Math.floor((event.loaded / event.total) * 100);
document.getElementById('progress-drop').textContent = rate + ' %';
}
};
reader.onerror = function() {
window.alert('FileReader Error : Error code is ' + reader.error.code);
};
// Success read
reader.onload = function() {
var arrayBuffer = reader.result; // Get ArrayBuffer
displayProperties(file, 'file-properties', 'File (extends Blob)');
displayProperties(arrayBuffer, 'arraybuffer-properties', 'ArrayBuffer');
document.getElementById('progress-drop').textContent = file.name;
};
// Read the instance of File
reader.readAsArrayBuffer(file);
}
}, false);
/*
* Ajax
*/
var isLoading = false;
document.querySelector('button').addEventListener(EventWrapper.CLICK, function() {
if (isLoading) {
window.alert('Now Loading.');
return;
}
var xhr = new XMLHttpRequest();
var url = '../../../mobile/audio/curtaincall_mix.wav';
// Timeout (1 minutes)
xhr.timeout = 60000;
xhr.ontimeout = function() {
window.alert('Timeout.');
isLoading = false;
};
xhr.onprogress = function(event) {
if (event.lengthComputable && (event.total > 0)) {
var rate = Math.floor((event.loaded / event.total) * 100);
document.getElementById('progress-ajax').textContent = rate + ' %';
}
};
xhr.onerror = function() {
window.alert('Ajax Error.');
isLoading = false;
};
xhr.onload = function() {
document.getElementById('progress-ajax').textContent = '';
if (xhr.status === 200) {
var arrayBuffer = xhr.response; // Get ArrayBuffer
if (arrayBuffer instanceof ArrayBuffer) {
document.getElementById('progress-ajax').textContent = 'Complete !!';
document.getElementById('file-properties').parentNode.previousElementSibling.style.display = 'none';
displayProperties(arrayBuffer, 'arraybuffer-properties', 'ArrayBuffer');
}
isLoading = false;
}
};
xhr.open('GET', url, true);
xhr.responseType = 'arraybuffer'; // XMLHttpRequest Level 2
xhr.send(null);
isLoading = true;
}, false);
};
if ((document.readyState === 'interactive') || (document.readyState === 'complete')) {
onDOMContentLoaded();
} else {
document.addEventListener('DOMContentLoaded', onDOMContentLoaded, true);
}
})();
function EventWrapper(){
}
(function(){
var click = '';
var start = '';
var move = '';
var end = '';
// Touch Panel ?
if (/iPhone|iPad|iPod|Android/.test(navigator.userAgent)) {
click = 'click';
start = 'touchstart';
move = 'touchmove';
end = 'touchend';
} else {
click = 'click';
start = 'mousedown';
move = 'mousemove';
end = 'mouseup';
}
EventWrapper.CLICK = click;
EventWrapper.START = start;
EventWrapper.MOVE = move;
EventWrapper.END = end;
})();