From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- .../client/performance/modules/waterfall-ticks.js | 98 ++++++++++++++++++++++ 1 file changed, 98 insertions(+) create mode 100644 devtools/client/performance/modules/waterfall-ticks.js (limited to 'devtools/client/performance/modules/waterfall-ticks.js') diff --git a/devtools/client/performance/modules/waterfall-ticks.js b/devtools/client/performance/modules/waterfall-ticks.js new file mode 100644 index 000000000..76eb8a6c9 --- /dev/null +++ b/devtools/client/performance/modules/waterfall-ticks.js @@ -0,0 +1,98 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ +"use strict"; + +const HTML_NS = "http://www.w3.org/1999/xhtml"; + +// ms +const WATERFALL_BACKGROUND_TICKS_MULTIPLE = 5; +const WATERFALL_BACKGROUND_TICKS_SCALES = 3; +// px +const WATERFALL_BACKGROUND_TICKS_SPACING_MIN = 10; +const WATERFALL_BACKGROUND_TICKS_COLOR_RGB = [128, 136, 144]; +// byte +const WATERFALL_BACKGROUND_TICKS_OPACITY_MIN = 32; +// byte +const WATERFALL_BACKGROUND_TICKS_OPACITY_ADD = 32; + +const FIND_OPTIMAL_TICK_INTERVAL_MAX_ITERS = 100; + +/** + * Creates the background displayed on the marker's waterfall. + */ +function drawWaterfallBackground(doc, dataScale, waterfallWidth) { + let canvas = doc.createElementNS(HTML_NS, "canvas"); + let ctx = canvas.getContext("2d"); + + // Nuke the context. + let canvasWidth = canvas.width = waterfallWidth; + // Awww yeah, 1px, repeats on Y axis. + let canvasHeight = canvas.height = 1; + + // Start over. + let imageData = ctx.createImageData(canvasWidth, canvasHeight); + let pixelArray = imageData.data; + + let buf = new ArrayBuffer(pixelArray.length); + let view8bit = new Uint8ClampedArray(buf); + let view32bit = new Uint32Array(buf); + + // Build new millisecond tick lines... + let [r, g, b] = WATERFALL_BACKGROUND_TICKS_COLOR_RGB; + let alphaComponent = WATERFALL_BACKGROUND_TICKS_OPACITY_MIN; + let tickInterval = findOptimalTickInterval({ + ticksMultiple: WATERFALL_BACKGROUND_TICKS_MULTIPLE, + ticksSpacingMin: WATERFALL_BACKGROUND_TICKS_SPACING_MIN, + dataScale: dataScale + }); + + // Insert one pixel for each division on each scale. + for (let i = 1; i <= WATERFALL_BACKGROUND_TICKS_SCALES; i++) { + let increment = tickInterval * Math.pow(2, i); + for (let x = 0; x < canvasWidth; x += increment) { + let position = x | 0; + view32bit[position] = (alphaComponent << 24) | (b << 16) | (g << 8) | r; + } + alphaComponent += WATERFALL_BACKGROUND_TICKS_OPACITY_ADD; + } + + // Flush the image data and cache the waterfall background. + pixelArray.set(view8bit); + ctx.putImageData(imageData, 0, 0); + doc.mozSetImageElement("waterfall-background", canvas); + + return canvas; +} + +/** + * Finds the optimal tick interval between time markers in this timeline. + * + * @param number ticksMultiple + * @param number ticksSpacingMin + * @param number dataScale + * @return number + */ +function findOptimalTickInterval({ ticksMultiple, ticksSpacingMin, dataScale }) { + let timingStep = ticksMultiple; + let maxIters = FIND_OPTIMAL_TICK_INTERVAL_MAX_ITERS; + let numIters = 0; + + if (dataScale > ticksSpacingMin) { + return dataScale; + } + + while (true) { + let scaledStep = dataScale * timingStep; + if (++numIters > maxIters) { + return scaledStep; + } + if (scaledStep < ticksSpacingMin) { + timingStep <<= 1; + continue; + } + return scaledStep; + } +} + +exports.TickUtils = { findOptimalTickInterval, drawWaterfallBackground }; -- cgit v1.2.3