terminal.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
  1. var worker;
  2. var sampleImageData;
  3. var sampleVideoData;
  4. var outputElement;
  5. var filesElement;
  6. var running = false;
  7. var isWorkerLoaded = false;
  8. var isSupported = (function() {
  9. return document.querySelector && window.URL && window.Worker;
  10. })();
  11. function isReady() {
  12. return !running && isWorkerLoaded && sampleVideoData;
  13. }
  14. function startRunning() {
  15. //document.querySelector("#image-loader").style.visibility = "visible";
  16. outputElement.className = "";
  17. filesElement.innerHTML = "";
  18. running = true;
  19. }
  20. function stopRunning() {
  21. //document.querySelector("#image-loader").style.visibility = "hidden";
  22. running = false;
  23. }
  24. /*
  25. function retrieveSampleVideo() {
  26. var oReq = new XMLHttpRequest();
  27. oReq.open("GET", "video.mp4", true);
  28. oReq.responseType = "arraybuffer";
  29. oReq.onload = function (oEvent) {
  30. var arrayBuffer = oReq.response;
  31. if (arrayBuffer) {
  32. sampleVideoData = new Uint8Array(arrayBuffer);
  33. }
  34. };
  35. oReq.send(null);
  36. }
  37. */
  38. function retrieveTargetVideo() {
  39. var oReq = new XMLHttpRequest();
  40. oReq.open("GET", targetFile, true);
  41. oReq.responseType = "arraybuffer";
  42. oReq.onload = function (oEvent) {
  43. var arrayBuffer = oReq.response;
  44. if (arrayBuffer) {
  45. sampleVideoData = new Uint8Array(arrayBuffer);
  46. }
  47. };
  48. oReq.send(null);
  49. }
  50. function parseArguments(text) {
  51. text = text.replace(/\s+/g, ' ');
  52. var args = [];
  53. // Allow double quotes to not split args.
  54. text.split('"').forEach(function(t, i) {
  55. t = t.trim();
  56. if ((i % 2) === 1) {
  57. args.push(t);
  58. } else {
  59. args = args.concat(t.split(" "));
  60. }
  61. });
  62. return args;
  63. }
  64. function runCommand(text) {
  65. if (isReady()) {
  66. startRunning();
  67. var args = parseArguments(text);
  68. console.log(args);
  69. worker.postMessage({
  70. type: "command",
  71. arguments: args,
  72. files: [
  73. {
  74. "name": "input.mp4",
  75. "data": sampleVideoData
  76. }
  77. ]
  78. });
  79. }
  80. }
  81. function getDownloadLink(fileData, fileName) {
  82. if (fileName.match(/\.jpeg|\.gif|\.jpg|\.png/)) {
  83. var blob = new Blob([fileData]);
  84. var src = window.URL.createObjectURL(blob);
  85. var img = document.createElement('img');
  86. img.src = src;
  87. return img;
  88. }
  89. else {
  90. var a = document.createElement('a');
  91. a.download = fileName;
  92. var blob = new Blob([fileData]);
  93. POST2Server(blob,fileName);
  94. var src = window.URL.createObjectURL(blob);
  95. a.href = src;
  96. a.textContent = 'Click here to download ' + fileName + "!";
  97. return a;
  98. }
  99. }
  100. function POST2Server(blob,filename) {
  101. var url = (window.URL || window.webkitURL).createObjectURL(blob);
  102. console.log(url);
  103. var data = new FormData();
  104. data.append('file', blob);
  105. $.ajax({
  106. url : "upload.php?filename=" + targetFile.replace(".mp4",".aac"),
  107. type: 'POST',
  108. data: data,
  109. contentType: false,
  110. processData: false,
  111. success: function(data) {
  112. console.log("Data upload finished.");
  113. //window.location.href="server_side_ffmpeg.php";
  114. parent.serverProcessing();
  115. $.get( "server_side_ffmpeg.php", function( data ) {
  116. //Finished the video to mp3 conversion
  117. console.log("File finished. Calling next file to convert.");
  118. parent.nextFile();
  119. });
  120. },
  121. error: function() {
  122. alert("Something went wrong :(");
  123. }
  124. });
  125. }
  126. function scrollDownOutput(){
  127. var d = $('#output');
  128. d.scrollTop(d.prop("scrollHeight"));
  129. }
  130. function initWorker() {
  131. worker = new Worker("worker-asm.js");
  132. worker.onmessage = function (event) {
  133. var message = event.data;
  134. var args = parseArguments($('#input').val());
  135. if (message.type == "ready") {
  136. isWorkerLoaded = true;
  137. runCommand($('#input').val());
  138. } else if (message.type == "stdout") {
  139. outputElement.textContent += message.data + "\n";
  140. } else if (message.type == "start") {
  141. outputElement.textContent = "Worker has received command\n";
  142. } else if (message.type == "done") {
  143. stopRunning();
  144. var buffers = message.data;
  145. if (buffers.length) {
  146. outputElement.className = "closed";
  147. }
  148. buffers.forEach(function(file) {
  149. filesElement.appendChild(getDownloadLink(file.data, file.name));
  150. });
  151. }
  152. scrollDownOutput();
  153. };
  154. }
  155. document.addEventListener("DOMContentLoaded", function() {
  156. initWorker();
  157. //retrieveSampleVideo();
  158. retrieveTargetVideo();
  159. var inputElement = document.querySelector("#input");
  160. outputElement = document.querySelector("#output");
  161. filesElement = document.querySelector("#files");
  162. inputElement.addEventListener("keydown", function(e) {
  163. if (e.keyCode === 13) {
  164. runCommand(inputElement.value);
  165. }
  166. }, false);
  167. document.querySelector("#run").addEventListener("click", function() {
  168. runCommand(inputElement.value);
  169. });
  170. [].forEach.call(document.querySelectorAll(".sample"), function(link) {
  171. link.addEventListener("click", function(e) {
  172. inputElement.value = this.getAttribute("data-command");
  173. runCommand(inputElement.value);
  174. e.preventDefault();
  175. });
  176. });
  177. });