Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(157)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: tracing/tracing/ui/base/quad_stack_view.html

Issue 2771723003: [tracing] Move math utilities from base into their own subdirectory (attempt 2) (Closed)
Patch Set: rebase Created 3 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « tracing/tracing/ui/base/name_line_chart_test.html ('k') | tracing/tracing/ui/base/scatter_chart.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <!-- 2 <!--
3 Copyright (c) 2013 The Chromium Authors. All rights reserved. 3 Copyright (c) 2013 The Chromium Authors. All rights reserved.
4 Use of this source code is governed by a BSD-style license that can be 4 Use of this source code is governed by a BSD-style license that can be
5 found in the LICENSE file. 5 found in the LICENSE file.
6 --> 6 -->
7 <link rel="import" href="/tracing/base/bbox2.html"> 7 <link rel="import" href="/tracing/base/math/bbox2.html">
8 <link rel="import" href="/tracing/base/math.html"> 8 <link rel="import" href="/tracing/base/math/math.html">
9 <link rel="import" href="/tracing/base/quad.html"> 9 <link rel="import" href="/tracing/base/math/quad.html">
10 <link rel="import" href="/tracing/base/math/rect.html">
10 <link rel="import" href="/tracing/base/raf.html"> 11 <link rel="import" href="/tracing/base/raf.html">
11 <link rel="import" href="/tracing/base/rect.html">
12 <link rel="import" href="/tracing/base/settings.html"> 12 <link rel="import" href="/tracing/base/settings.html">
13 <link rel="import" href="/tracing/ui/base/camera.html"> 13 <link rel="import" href="/tracing/ui/base/camera.html">
14 <link rel="import" href="/tracing/ui/base/mouse_mode_selector.html"> 14 <link rel="import" href="/tracing/ui/base/mouse_mode_selector.html">
15 <link rel="import" href="/tracing/ui/base/mouse_tracker.html"> 15 <link rel="import" href="/tracing/ui/base/mouse_tracker.html">
16 <link rel="import" href="/tracing/ui/base/utils.html"> 16 <link rel="import" href="/tracing/ui/base/utils.html">
17 17
18 <style> 18 <style>
19 * /deep/ quad-stack-view { 19 * /deep/ quad-stack-view {
20 display: block; 20 display: block;
21 float: left; 21 float: left;
(...skipping 222 matching lines...) Expand 10 before | Expand all | Expand 10 after
244 transformed[1] = ((tmpVec4[1] / w) + 1) * viewport.height / 2; 244 transformed[1] = ((tmpVec4[1] / w) + 1) * viewport.height / 2;
245 transformed[2] = w; 245 transformed[2] = w;
246 } 246 }
247 247
248 function drawProjectedQuadBackgroundToContext( 248 function drawProjectedQuadBackgroundToContext(
249 quad, p1, p2, p3, p4, ctx, quadCanvas) { 249 quad, p1, p2, p3, p4, ctx, quadCanvas) {
250 if (quad.imageData) { 250 if (quad.imageData) {
251 quadCanvas.width = quad.imageData.width; 251 quadCanvas.width = quad.imageData.width;
252 quadCanvas.height = quad.imageData.height; 252 quadCanvas.height = quad.imageData.height;
253 quadCanvas.getContext('2d').putImageData(quad.imageData, 0, 0); 253 quadCanvas.getContext('2d').putImageData(quad.imageData, 0, 0);
254 var quadBBox = new tr.b.BBox2(); 254 var quadBBox = new tr.b.math.BBox2();
255 quadBBox.addQuad(quad); 255 quadBBox.addQuad(quad);
256 var iw = quadCanvas.width; 256 var iw = quadCanvas.width;
257 var ih = quadCanvas.height; 257 var ih = quadCanvas.height;
258 drawTriangleSub( 258 drawTriangleSub(
259 ctx, quadCanvas, 259 ctx, quadCanvas,
260 p1, p2, p4, 260 p1, p2, p4,
261 [0, 0], [iw, 0], [0, ih]); 261 [0, 0], [iw, 0], [0, ih]);
262 drawTriangleSub( 262 drawTriangleSub(
263 ctx, quadCanvas, 263 ctx, quadCanvas,
264 p2, p3, p4, 264 p2, p3, p4,
(...skipping 128 matching lines...) Expand 10 before | Expand all | Expand 10 after
393 'input', this.onStackingDistanceChange_.bind(this)); 393 'input', this.onStackingDistanceChange_.bind(this));
394 394
395 this.trackMouse_(); 395 this.trackMouse_();
396 396
397 this.camera_ = new tr.ui.b.Camera(this.mouseModeSelector_); 397 this.camera_ = new tr.ui.b.Camera(this.mouseModeSelector_);
398 this.camera_.addEventListener('renderrequired', 398 this.camera_.addEventListener('renderrequired',
399 this.onRenderRequired_.bind(this)); 399 this.onRenderRequired_.bind(this));
400 this.cameraWasReset_ = false; 400 this.cameraWasReset_ = false;
401 this.camera_.canvas = this.canvas_; 401 this.camera_.canvas = this.canvas_;
402 402
403 this.viewportRect_ = tr.b.Rect.fromXYWH(0, 0, 0, 0); 403 this.viewportRect_ = tr.b.math.Rect.fromXYWH(0, 0, 0, 0);
404 404
405 this.pixelRatio_ = window.devicePixelRatio || 1; 405 this.pixelRatio_ = window.devicePixelRatio || 1;
406 }, 406 },
407 407
408 updateHeaderVisibility_: function() { 408 updateHeaderVisibility_: function() {
409 if (this.headerText) 409 if (this.headerText)
410 Polymer.dom(this).querySelector('#header').style.display = ''; 410 Polymer.dom(this).querySelector('#header').style.display = '';
411 else 411 else
412 Polymer.dom(this).querySelector('#header').style.display = 'none'; 412 Polymer.dom(this).querySelector('#header').style.display = 'none';
413 }, 413 },
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after
453 this.camera_.deviceRect = rect; 453 this.camera_.deviceRect = rect;
454 this.chromeQuad_ = undefined; 454 this.chromeQuad_ = undefined;
455 }, 455 },
456 456
457 resize: function() { 457 resize: function() {
458 if (!this.offsetParent) 458 if (!this.offsetParent)
459 return true; 459 return true;
460 460
461 var width = parseInt(window.getComputedStyle(this.offsetParent).width); 461 var width = parseInt(window.getComputedStyle(this.offsetParent).width);
462 var height = parseInt(window.getComputedStyle(this.offsetParent).height); 462 var height = parseInt(window.getComputedStyle(this.offsetParent).height);
463 var rect = tr.b.Rect.fromXYWH(0, 0, width, height); 463 var rect = tr.b.math.Rect.fromXYWH(0, 0, width, height);
464 464
465 if (rect.equalTo(this.viewportRect_)) 465 if (rect.equalTo(this.viewportRect_))
466 return false; 466 return false;
467 467
468 this.viewportRect_ = rect; 468 this.viewportRect_ = rect;
469 this.style.width = width + 'px'; 469 this.style.width = width + 'px';
470 this.style.height = height + 'px'; 470 this.style.height = height + 'px';
471 this.canvas_.style.width = width + 'px'; 471 this.canvas_.style.width = width + 'px';
472 this.canvas_.style.height = height + 'px'; 472 this.canvas_.style.height = height + 'px';
473 this.canvas_.width = this.pixelRatio_ * width; 473 this.canvas_.width = this.pixelRatio_ * width;
(...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after
532 var s = (this.deviceRect_.width - leftWidth - rightWidth) / midWidth; 532 var s = (this.deviceRect_.width - leftWidth - rightWidth) / midWidth;
533 chromeCtx.scale(s, 1); 533 chromeCtx.scale(s, 1);
534 534
535 chromeCtx.drawImage(this.chromeImages_.mid, 0, 0); 535 chromeCtx.drawImage(this.chromeImages_.mid, 0, 0);
536 chromeCtx.restore(); 536 chromeCtx.restore();
537 537
538 chromeCtx.drawImage( 538 chromeCtx.drawImage(
539 this.chromeImages_.right, leftWidth + s * midWidth, 0); 539 this.chromeImages_.right, leftWidth + s * midWidth, 0);
540 540
541 // Construct the quad. 541 // Construct the quad.
542 var chromeRect = tr.b.Rect.fromXYWH( 542 var chromeRect = tr.b.math.Rect.fromXYWH(
543 this.deviceRect_.x, 543 this.deviceRect_.x,
544 this.deviceRect_.y - offsetY, 544 this.deviceRect_.y - offsetY,
545 this.deviceRect_.width, 545 this.deviceRect_.width,
546 this.deviceRect_.height + offsetY); 546 this.deviceRect_.height + offsetY);
547 var chromeQuad = tr.b.Quad.fromRect(chromeRect); 547 var chromeQuad = tr.b.math.Quad.fromRect(chromeRect);
548 chromeQuad.stackingGroupId = this.maxStackingGroupId_ + 1; 548 chromeQuad.stackingGroupId = this.maxStackingGroupId_ + 1;
549 chromeQuad.imageData = chromeCtx.getImageData( 549 chromeQuad.imageData = chromeCtx.getImageData(
550 0, 0, chromeCanvas.width, chromeCanvas.height); 550 0, 0, chromeCanvas.width, chromeCanvas.height);
551 chromeQuad.shadowOffset = [0, 0]; 551 chromeQuad.shadowOffset = [0, 0];
552 chromeQuad.shadowBlur = 5; 552 chromeQuad.shadowBlur = 5;
553 chromeQuad.borderWidth = 3; 553 chromeQuad.borderWidth = 3;
554 this.chromeQuad_ = chromeQuad; 554 this.chromeQuad_ = chromeQuad;
555 return this.chromeQuad_; 555 return this.chromeQuad_;
556 }, 556 },
557 557
558 scheduleRender: function() { 558 scheduleRender: function() {
559 if (this.redrawScheduled_) 559 if (this.redrawScheduled_)
560 return false; 560 return false;
561 this.redrawScheduled_ = true; 561 this.redrawScheduled_ = true;
562 tr.b.requestAnimationFrame(this.render, this); 562 tr.b.requestAnimationFrame(this.render, this);
563 }, 563 },
564 564
565 onRenderRequired_: function(e) { 565 onRenderRequired_: function(e) {
566 this.scheduleRender(); 566 this.scheduleRender();
567 }, 567 },
568 568
569 stackTransformAndProcessQuads_: function( 569 stackTransformAndProcessQuads_: function(
570 numPasses, handleQuadFunc, includeChromeQuad, opt_arg1, opt_arg2) { 570 numPasses, handleQuadFunc, includeChromeQuad, opt_arg1, opt_arg2) {
571 var mv = this.camera_.modelViewMatrix; 571 var mv = this.camera_.modelViewMatrix;
572 var p = this.camera_.projectionMatrix; 572 var p = this.camera_.projectionMatrix;
573 573
574 var viewport = tr.b.Rect.fromXYWH( 574 var viewport = tr.b.math.Rect.fromXYWH(
575 0, 0, this.canvas_.width, this.canvas_.height); 575 0, 0, this.canvas_.width, this.canvas_.height);
576 576
577 // Calculate the quad stacks. 577 // Calculate the quad stacks.
578 var quadStacks = []; 578 var quadStacks = [];
579 for (var i = 0; i < this.quads_.length; ++i) { 579 for (var i = 0; i < this.quads_.length; ++i) {
580 var quad = this.quads_[i]; 580 var quad = this.quads_[i];
581 var stackingId = quad.stackingGroupId || 0; 581 var stackingId = quad.stackingGroupId || 0;
582 while (stackingId >= quadStacks.length) 582 while (stackingId >= quadStacks.length)
583 quadStacks.push([]); 583 quadStacks.push([]);
584 584
(...skipping 79 matching lines...) Expand 10 before | Expand all | Expand 10 after
664 return [ 664 return [
665 this.pixelRatio_ * (e.clientX - this.canvas_.offsetLeft - br.left), 665 this.pixelRatio_ * (e.clientX - this.canvas_.offsetLeft - br.left),
666 this.pixelRatio_ * (e.clientY - this.canvas_.offsetTop - br.top) 666 this.pixelRatio_ * (e.clientY - this.canvas_.offsetTop - br.top)
667 ]; 667 ];
668 }, 668 },
669 669
670 onSelectionUpdate_: function(e) { 670 onSelectionUpdate_: function(e) {
671 var mousePos = this.extractRelativeMousePosition_(e); 671 var mousePos = this.extractRelativeMousePosition_(e);
672 var res = []; 672 var res = [];
673 function handleQuad(passNumber, quad, p1, p2, p3, p4) { 673 function handleQuad(passNumber, quad, p1, p2, p3, p4) {
674 if (tr.b.pointInImplicitQuad(mousePos, p1, p2, p3, p4)) 674 if (tr.b.math.pointInImplicitQuad(mousePos, p1, p2, p3, p4))
675 res.push(quad); 675 res.push(quad);
676 } 676 }
677 this.stackTransformAndProcessQuads_(1, handleQuad, false); 677 this.stackTransformAndProcessQuads_(1, handleQuad, false);
678 var e = new tr.b.Event('selectionchange'); 678 var e = new tr.b.Event('selectionchange');
679 e.quads = res; 679 e.quads = res;
680 this.dispatchEvent(e); 680 this.dispatchEvent(e);
681 } 681 }
682 }; 682 };
683 683
684 return { 684 return {
685 QuadStackView, 685 QuadStackView,
686 }; 686 };
687 }); 687 });
688 </script> 688 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/ui/base/name_line_chart_test.html ('k') | tracing/tracing/ui/base/scatter_chart.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698