diff options
Diffstat (limited to 'chromium/third_party/trace-viewer/src/tracing/draw_helpers.js')
-rw-r--r-- | chromium/third_party/trace-viewer/src/tracing/draw_helpers.js | 283 |
1 files changed, 0 insertions, 283 deletions
diff --git a/chromium/third_party/trace-viewer/src/tracing/draw_helpers.js b/chromium/third_party/trace-viewer/src/tracing/draw_helpers.js deleted file mode 100644 index 771e4def00a..00000000000 --- a/chromium/third_party/trace-viewer/src/tracing/draw_helpers.js +++ /dev/null @@ -1,283 +0,0 @@ -// Copyright (c) 2013 The Chromium Authors. All rights reserved. -// Use of this source code is governed by a BSD-style license that can be -// found in the LICENSE file. - -'use strict'; - -base.require('base.sorted_array_utils'); -base.require('tracing.color_scheme'); -base.require('tracing.elided_cache'); - -/** - * @fileoverview Provides various helper methods for drawing to a provided - * canvas. - */ -base.exportTo('tracing', function() { - var elidedTitleCache = new tracing.ElidedTitleCache(); - var palette = tracing.getColorPalette(); - var EventPresenter = tracing.EventPresenter; - - /** - * Should we elide text on trace labels? - * Without eliding, text that is too wide isn't drawn at all. - * Disable if you feel this causes a performance problem. - * This is a default value that can be overridden in tracks for testing. - * @const - */ - var SHOULD_ELIDE_TEXT = true; - - /** - * Draw the define line into |ctx|. - * - * @param {Context} ctx The context to draw into. - * @param {float} x1 The start x position of the line. - * @param {float} y1 The start y position of the line. - * @param {float} x2 The end x position of the line. - * @param {float} y2 The end y position of the line. - */ - function drawLine(ctx, x1, y1, x2, y2) { - ctx.moveTo(x1, y1); - ctx.lineTo(x2, y2); - } - - /** - * Draw the defined triangle into |ctx|. - * - * @param {Context} ctx The context to draw into. - * @param {float} x1 The first corner x. - * @param {float} y1 The first corner y. - * @param {float} x2 The second corner x. - * @param {float} y2 The second corner y. - * @param {float} x3 The third corner x. - * @param {float} y3 The third corner y. - */ - function drawTriangle(ctx, x1, y1, x2, y2, x3, y3) { - ctx.beginPath(); - ctx.moveTo(x1, y1); - ctx.lineTo(x2, y2); - ctx.lineTo(x3, y3); - ctx.closePath(); - } - - /** - * Draw an arrow into |ctx|. - * - * @param {Context} ctx The context to draw into. - * @param {float} x1 The shaft x. - * @param {float} y1 The shaft y. - * @param {float} x2 The head x. - * @param {float} y2 The head y. - * @param {float} arrowLength The length of the head. - * @param {float} arrowWidth The width of the head. - */ - function drawArrow(ctx, x1, y1, x2, y2, arrowLength, arrowWidth) { - var dx = x2 - x1; - var dy = y2 - y1; - var len = Math.sqrt(dx * dx + dy * dy); - var perc = (len - arrowLength) / len; - var bx = x1 + perc * dx; - var by = y1 + perc * dy; - var ux = dx / len; - var uy = dy / len; - var ax = uy * arrowWidth; - var ay = -ux * arrowWidth; - - ctx.beginPath(); - drawLine(ctx, x1, y1, x2, y2); - ctx.stroke(); - - drawTriangle(ctx, - bx + ax, by + ay, - x2, y2, - bx - ax, by - ay); - ctx.fill(); - } - - /** - * Draw the provided slices to the screen. - * - * Each of the elements in |slices| must provide the follow methods: - * * start - * * duration - * * colorId - * * selected - * - * @param {Context} ctx The canvas context. - * @param {TimelineDrawTransform} dt The draw transform. - * @param {float} viewLWorld The left most point of the world viewport. - * @param {float} viewLWorld The right most point of the world viewport. - * @param {float} viewHeight The height of the viewport. - * @param {Array} slices The slices to draw. - * @param {bool} async Whether the slices are drawn with async style. - */ - function drawSlices(ctx, dt, viewLWorld, viewRWorld, viewHeight, slices, - async) { - var pixelRatio = window.devicePixelRatio || 1; - var pixWidth = dt.xViewVectorToWorld(1); - var height = viewHeight * pixelRatio; - - // Begin rendering in world space. - ctx.save(); - dt.applyTransformToCanvas(ctx); - - var tr = new tracing.FastRectRenderer( - ctx, 2 * pixWidth, 2 * pixWidth, palette); - tr.setYandH(0, height); - - var lowSlice = base.findLowIndexInSortedArray( - slices, - function(slice) { return slice.start + slice.duration; }, - viewLWorld); - - for (var i = lowSlice; i < slices.length; ++i) { - var slice = slices[i]; - var x = slice.start; - if (x > viewRWorld) - break; - - var w = pixWidth; - if (slice.duration > 0) { - w = Math.max(slice.duration, 0.001); - if (w < pixWidth) - w = pixWidth; - } - - var colorId = EventPresenter.getSliceColorId(slice); - var alpha = EventPresenter.getSliceAlpha(slice, async); - tr.fillRect(x, w, colorId, alpha); - } - tr.flush(); - ctx.restore(); - } - - /** - * Draw the provided instant slices as lines to the screen. - * - * Each of the elements in |slices| must provide the follow methods: - * * start - * * duration with value of 0. - * * colorId - * * selected - * - * @param {Context} ctx The canvas context. - * @param {TimelineDrawTransform} dt The draw transform. - * @param {float} viewLWorld The left most point of the world viewport. - * @param {float} viewLWorld The right most point of the world viewport. - * @param {float} viewHeight The height of the viewport. - * @param {Array} slices The slices to draw. - * @param {Numer} lineWidthInPixels The width of the lines. - */ - function drawInstantSlicesAsLines( - ctx, dt, viewLWorld, viewRWorld, viewHeight, slices, lineWidthInPixels) { - var pixelRatio = window.devicePixelRatio || 1; - var height = viewHeight * pixelRatio; - - var pixWidth = dt.xViewVectorToWorld(1); - - // Begin rendering in world space. - ctx.save(); - ctx.lineWidth = pixWidth * lineWidthInPixels; - dt.applyTransformToCanvas(ctx); - ctx.beginPath(); - - var lowSlice = base.findLowIndexInSortedArray( - slices, - function(slice) { return slice.start; }, - viewLWorld); - - for (var i = lowSlice; i < slices.length; ++i) { - var slice = slices[i]; - var x = slice.start; - if (x > viewRWorld) - break; - - ctx.strokeStyle = EventPresenter.getInstantSliceColor(slice); - - ctx.moveTo(x, 0); - ctx.lineTo(x, height); - } - ctx.stroke(); - ctx.restore(); - } - - /** - * Draws the labels for the given slices. - * - * The |slices| array must contain objects with the following API: - * * start - * * duration - * * title - * * didNotFinish (optional) - * - * @param {Context} ctx The graphics context. - * @param {TimelineDrawTransform} dt The draw transform. - * @param {float} viewLWorld The left most point of the world viewport. - * @param {float} viewLWorld The right most point of the world viewport. - * @param {Array} slices The slices to label. - * @param {bool} async Whether the slice labels are drawn with async style. - */ - function drawLabels(ctx, dt, viewLWorld, viewRWorld, slices, async) { - var pixelRatio = window.devicePixelRatio || 1; - var pixWidth = dt.xViewVectorToWorld(1); - - ctx.save(); - - ctx.textAlign = 'center'; - ctx.textBaseline = 'top'; - ctx.font = (10 * pixelRatio) + 'px sans-serif'; - - if (async) - ctx.font = 'italic ' + ctx.font; - - var lowSlice = base.findLowIndexInSortedArray( - slices, - function(slice) { return slice.start + slice.duration; }, - viewLWorld); - - // Don't render text until until it is 20px wide - var quickDiscardThresshold = pixWidth * 20; - for (var i = lowSlice; i < slices.length; ++i) { - var slice = slices[i]; - if (slice.start > viewRWorld) - break; - - if (slice.duration <= quickDiscardThresshold) - continue; - - var title = slice.title + - (slice.didNotFinish ? ' (Did Not Finish)' : ''); - - var drawnTitle = title; - var drawnWidth = elidedTitleCache.labelWidth(ctx, drawnTitle); - var fullLabelWidth = elidedTitleCache.labelWidthWorld( - ctx, drawnTitle, pixWidth); - if (SHOULD_ELIDE_TEXT && fullLabelWidth > slice.duration) { - var elidedValues = elidedTitleCache.get( - ctx, pixWidth, - drawnTitle, drawnWidth, - slice.duration); - drawnTitle = elidedValues.string; - drawnWidth = elidedValues.width; - } - - if (drawnWidth * pixWidth < slice.duration) { - ctx.fillStyle = EventPresenter.getTextColor(slice); - var cX = dt.xWorldToView(slice.start + 0.5 * slice.duration); - ctx.fillText(drawnTitle, cX, 2.5 * pixelRatio, drawnWidth); - } - } - ctx.restore(); - } - - return { - drawSlices: drawSlices, - drawInstantSlicesAsLines: drawInstantSlicesAsLines, - drawLabels: drawLabels, - - drawLine: drawLine, - drawTriangle: drawTriangle, - drawArrow: drawArrow, - - elidedTitleCache_: elidedTitleCache - }; -}); |