| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <!-- | 2 <!-- |
| 3 | 3 |
| 4 // Copyright 2011 Google Inc. | 4 // Copyright 2011 Google Inc. |
| 5 // | 5 // |
| 6 // Licensed under the Apache License, Version 2.0 (the "License"); | 6 // Licensed under the Apache License, Version 2.0 (the "License"); |
| 7 // you may not use this file except in compliance with the License. | 7 // you may not use this file except in compliance with the License. |
| 8 // You may obtain a copy of the License at | 8 // You may obtain a copy of the License at |
| 9 // | 9 // |
| 10 // http://www.apache.org/licenses/LICENSE-2.0 | 10 // http://www.apache.org/licenses/LICENSE-2.0 |
| (...skipping 161 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 172 document.documentElement.classList[ | 172 document.documentElement.classList[ |
| 173 outputCheckbox.checked ? 'remove' : 'add']('hide-output'); | 173 outputCheckbox.checked ? 'remove' : 'add']('hide-output'); |
| 174 }, false); | 174 }, false); |
| 175 | 175 |
| 176 /** | 176 /** |
| 177 * debounce time = min(tmin + [func's execution time], tmax). | 177 * debounce time = min(tmin + [func's execution time], tmax). |
| 178 * | 178 * |
| 179 * @param {Function} func | 179 * @param {Function} func |
| 180 * @param {number} tmin Minimum debounce time | 180 * @param {number} tmin Minimum debounce time |
| 181 * @param {number} tmax Maximum debounce time | 181 * @param {number} tmax Maximum debounce time |
| 182 * @return {Function} A debounced version of func with an attached "delay" | 182 * @return {Function} A debounced version of func with two attached methods: |
| 183 * function. "delay" will delay any pending debounced function by the | 183 * - "delay" will delay any pending debounced function by the current |
| 184 * current debounce time. If there are none pending, it is a no-op. | 184 * debounce time. If there are none pending, it is a no-op. |
| 185 * - "cancel" cancels any pending debounced function. If there are none |
| 186 * pending, it is a no-op. |
| 185 */ | 187 */ |
| 186 function debounced(func, tmin, tmax) { | 188 function debounced(func, tmin, tmax) { |
| 187 var id = 0; | 189 var id = 0; |
| 188 var t = tmin; | 190 var t = tmin; |
| 189 function wrappedFunc() { | 191 function wrappedFunc() { |
| 190 var start = Date.now(); | 192 var start = Date.now(); |
| 191 id = 0; | 193 id = 0; |
| 192 func(); | 194 func(); |
| 193 t = tmin + Date.now() - start; // tmin + [func's execution time] | 195 t = tmin + Date.now() - start; // tmin + [func's execution time] |
| 194 t = t < tmax ? t : tmax; | 196 t = t < tmax ? t : tmax; |
| 195 } | 197 } |
| 196 function debouncedFunc() { | 198 function debouncedFunc() { |
| 197 clearTimeout(id); | 199 clearTimeout(id); |
| 198 id = setTimeout(wrappedFunc, t); | 200 id = setTimeout(wrappedFunc, t); |
| 199 } | 201 } |
| 200 // id is nonzero only when a debounced function is pending. | 202 // id is nonzero only when a debounced function is pending. |
| 201 debouncedFunc.delay = function() { id && debouncedFunc(); } | 203 debouncedFunc.delay = function() { id && debouncedFunc(); } |
| 204 debouncedFunc.cancel = function() { clearTimeout(id); id = 0; } |
| 202 return debouncedFunc; | 205 return debouncedFunc; |
| 203 } | 206 } |
| 204 | 207 |
| 205 function setOptionsFromSource(source) { | 208 function setOptionsFromSource(source) { |
| 206 var re = /^\/\/ Options:\s*(.+)$/mg; | 209 var re = /^\/\/ Options:\s*(.+)$/mg; |
| 207 var optionLines = source.match(re); | 210 var optionLines = source.match(re); |
| 208 if (optionLines) { | 211 if (optionLines) { |
| 209 optionLines.forEach(function(line) { | 212 optionLines.forEach(function(line) { |
| 210 re.lastIndex = 0; | 213 re.lastIndex = 0; |
| 211 var m = re.exec(line); | 214 var m = re.exec(line); |
| (...skipping 106 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 318 traceur.options.reset(); | 321 traceur.options.reset(); |
| 319 rebuildOptions(); | 322 rebuildOptions(); |
| 320 }); | 323 }); |
| 321 | 324 |
| 322 document.querySelector('.all-off').addEventListener('click', | 325 document.querySelector('.all-off').addEventListener('click', |
| 323 function() { | 326 function() { |
| 324 traceur.options.reset(true); | 327 traceur.options.reset(true); |
| 325 rebuildOptions(); | 328 rebuildOptions(); |
| 326 }); | 329 }); |
| 327 | 330 |
| 331 var menuDiv = document.querySelector('.options'); |
| 332 |
| 333 // Hide menu when the mouse leaves optionsDiv. Most of this code is to |
| 334 // work around the lack of a cross-browser 'mouseleave' event. |
| 335 function menuInitEvents(e) { |
| 336 var optionButton = document.querySelector('.option-button'); |
| 337 var menuHide = debounced(function() { |
| 338 menuDiv.removeEventListener('mouseover', menuHide.cancel); |
| 339 menuDiv.removeEventListener('mouseout', menuHide); |
| 340 optionButton.removeEventListener('mouseover', menuHide.cancel); |
| 341 optionButton.removeEventListener('mouseout', menuHide); |
| 342 menuDiv.hidden = true; |
| 343 }, 100, 400); |
| 344 |
| 345 menuDiv.removeEventListener('mouseover', menuInitEvents); |
| 346 |
| 347 menuDiv.addEventListener('mouseover', menuHide.cancel); |
| 348 menuDiv.addEventListener('mouseout', menuHide); |
| 349 optionButton.addEventListener('mouseover', menuHide.cancel); |
| 350 optionButton.addEventListener('mouseout', menuHide); |
| 351 } |
| 352 |
| 353 document.querySelector('.option-button').addEventListener('mouseover', |
| 354 function() { |
| 355 menuDiv.hidden = false; |
| 356 menuDiv.addEventListener('mouseover', menuInitEvents); |
| 357 }); |
| 358 |
| 328 document.querySelector('.option-button').addEventListener('click', | 359 document.querySelector('.option-button').addEventListener('click', |
| 329 function() { | 360 function() { |
| 330 var optionsDiv = document.querySelector('.options'); | 361 menuDiv.hidden = !menuDiv.hidden; |
| 331 optionsDiv.hidden = !optionsDiv.hidden; | 362 |
| 363 if (!menuDiv.hidden) |
| 364 menuDiv.addEventListener('mouseover', menuInitEvents); |
| 332 }); | 365 }); |
| 333 | 366 |
| 334 function renderSourceMap(source, sourceMap) { | 367 function renderSourceMap(source, sourceMap) { |
| 335 var consumer = new SourceMapConsumer(sourceMap); | 368 var consumer = new SourceMapConsumer(sourceMap); |
| 336 var lines = source.split('\n'); | 369 var lines = source.split('\n'); |
| 337 var lineNumberTable = lines.map(function(line, lineNo) { | 370 var lineNumberTable = lines.map(function(line, lineNo) { |
| 338 var generatedPosition = { | 371 var generatedPosition = { |
| 339 line: lineNo + 1, | 372 line: lineNo + 1, |
| 340 column: 0 | 373 column: 0 |
| 341 }; | 374 }; |
| 342 var position = consumer.originalPositionFor(generatedPosition); | 375 var position = consumer.originalPositionFor(generatedPosition); |
| 343 var lineDotColumn = position.line + '.' + position.column; | 376 var lineDotColumn = position.line + '.' + position.column; |
| 344 return (lineNo + 1) + ': ' + line + ' -> ' + lineDotColumn; | 377 return (lineNo + 1) + ': ' + line + ' -> ' + lineDotColumn; |
| 345 }); | 378 }); |
| 346 return 'SourceMap:\n' + lineNumberTable.join('\n'); | 379 return 'SourceMap:\n' + lineNumberTable.join('\n'); |
| 347 } | 380 } |
| 348 | 381 |
| 349 })(); | 382 })(); |
| 350 | 383 |
| 351 </script> | 384 </script> |
| 352 </body> | 385 </body> |
| 353 </html> | 386 </html> |
| OLD | NEW |
|---|
