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

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/ui_lazy/FlameChart.js

Issue 1995123002: Revert of DevTools: Add inertia to flamechart dragging. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 7 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 | « third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 /** 1 /**
2 * Copyright (C) 2013 Google Inc. All rights reserved. 2 * Copyright (C) 2013 Google Inc. All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * * Redistributions of source code must retain the above copyright 8 * * Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * * Redistributions in binary form must reproduce the above 10 * * Redistributions in binary form must reproduce the above
(...skipping 56 matching lines...) Expand 10 before | Expand all | Expand 10 after
67 this._calculator = new WebInspector.FlameChart.Calculator(dataProvider); 67 this._calculator = new WebInspector.FlameChart.Calculator(dataProvider);
68 68
69 this._canvas = this.contentElement.createChild("canvas"); 69 this._canvas = this.contentElement.createChild("canvas");
70 this._canvas.tabIndex = 1; 70 this._canvas.tabIndex = 1;
71 this.setDefaultFocusedElement(this._canvas); 71 this.setDefaultFocusedElement(this._canvas);
72 this._canvas.addEventListener("mousemove", this._onMouseMove.bind(this), fal se); 72 this._canvas.addEventListener("mousemove", this._onMouseMove.bind(this), fal se);
73 this._canvas.addEventListener("mouseout", this._onMouseOut.bind(this), false ); 73 this._canvas.addEventListener("mouseout", this._onMouseOut.bind(this), false );
74 this._canvas.addEventListener("mousewheel", this._onMouseWheel.bind(this), f alse); 74 this._canvas.addEventListener("mousewheel", this._onMouseWheel.bind(this), f alse);
75 this._canvas.addEventListener("click", this._onClick.bind(this), false); 75 this._canvas.addEventListener("click", this._onClick.bind(this), false);
76 this._canvas.addEventListener("keydown", this._onKeyDown.bind(this), false); 76 this._canvas.addEventListener("keydown", this._onKeyDown.bind(this), false);
77 WebInspector.installInertialDragHandle(this._canvas, this._startCanvasDraggi ng.bind(this), this._canvasDragging.bind(this), this._endCanvasDragging.bind(thi s), "-webkit-grabbing", null); 77 WebInspector.installDragHandle(this._canvas, this._startCanvasDragging.bind( this), this._canvasDragging.bind(this), this._endCanvasDragging.bind(this), "-we bkit-grabbing", null);
78 WebInspector.installDragHandle(this._canvas, this._startRangeSelection.bind( this), this._rangeSelectionDragging.bind(this), this._endRangeSelection.bind(thi s), "text", null); 78 WebInspector.installDragHandle(this._canvas, this._startRangeSelection.bind( this), this._rangeSelectionDragging.bind(this), this._endRangeSelection.bind(thi s), "text", null);
79 79
80 this._vScrollElement = this.contentElement.createChild("div", "flame-chart-v -scroll"); 80 this._vScrollElement = this.contentElement.createChild("div", "flame-chart-v -scroll");
81 this._vScrollContent = this._vScrollElement.createChild("div"); 81 this._vScrollContent = this._vScrollElement.createChild("div");
82 this._vScrollElement.addEventListener("scroll", this._onScroll.bind(this), f alse); 82 this._vScrollElement.addEventListener("scroll", this._onScroll.bind(this), f alse);
83 this._scrollTop = 0; 83 this._scrollTop = 0;
84 84
85 this._entryInfo = this.contentElement.createChild("div", "flame-chart-entry- info"); 85 this._entryInfo = this.contentElement.createChild("div", "flame-chart-entry- info");
86 this._markerHighlighElement = this.contentElement.createChild("div", "flame- chart-marker-highlight-element"); 86 this._markerHighlighElement = this.contentElement.createChild("div", "flame- chart-marker-highlight-element");
87 this._highlightElement = this.contentElement.createChild("div", "flame-chart -highlight-element"); 87 this._highlightElement = this.contentElement.createChild("div", "flame-chart -highlight-element");
(...skipping 537 matching lines...) Expand 10 before | Expand all | Expand 10 after
625 * @param {!MouseEvent} event 625 * @param {!MouseEvent} event
626 */ 626 */
627 _initMaxDragOffset: function(event) 627 _initMaxDragOffset: function(event)
628 { 628 {
629 this._maxDragOffsetSquared = 0; 629 this._maxDragOffsetSquared = 0;
630 this._dragStartX = event.pageX; 630 this._dragStartX = event.pageX;
631 this._dragStartY = event.pageY; 631 this._dragStartY = event.pageY;
632 }, 632 },
633 633
634 /** 634 /**
635 * @param {number} x 635 * @param {!MouseEvent} event
636 * @param {number} y
637 */ 636 */
638 _updateMaxDragOffset: function(x, y) 637 _updateMaxDragOffset: function(event)
639 { 638 {
640 var dx = x - this._dragStartX; 639 var dx = event.pageX - this._dragStartX;
641 var dy = y - this._dragStartY; 640 var dy = event.pageY - this._dragStartY;
642 var dragOffsetSquared = dx * dx + dy * dy; 641 var dragOffsetSquared = dx * dx + dy * dy;
643 this._maxDragOffsetSquared = Math.max(this._maxDragOffsetSquared, dragOf fsetSquared); 642 this._maxDragOffsetSquared = Math.max(this._maxDragOffsetSquared, dragOf fsetSquared);
644 }, 643 },
645 644
646 /** 645 /**
647 * @return {number} 646 * @return {number}
648 */ 647 */
649 _maxDragOffset: function() 648 _maxDragOffset: function()
650 { 649 {
651 return Math.sqrt(this._maxDragOffsetSquared); 650 return Math.sqrt(this._maxDragOffsetSquared);
652 }, 651 },
653 652
654 /** 653 /**
655 * @param {number} x
656 * @param {number} y
657 * @param {!MouseEvent} event 654 * @param {!MouseEvent} event
658 * @return {boolean} 655 * @return {boolean}
659 */ 656 */
660 _startCanvasDragging: function(x, y, event) 657 _startCanvasDragging: function(event)
661 { 658 {
662 if (event.shiftKey) 659 if (event.shiftKey)
663 return false; 660 return false;
664 if (!this._timelineData() || this._timeWindowRight === Infinity) 661 if (!this._timelineData() || this._timeWindowRight === Infinity)
665 return false; 662 return false;
666 this._isDragging = true; 663 this._isDragging = true;
667 this._initMaxDragOffset(event); 664 this._initMaxDragOffset(event);
668 this._dragStartPointX = x; 665 this._dragStartPointX = event.pageX;
669 this._dragStartPointY = y; 666 this._dragStartPointY = event.pageY;
670 this._dragStartScrollTop = this._vScrollElement.scrollTop; 667 this._dragStartScrollTop = this._vScrollElement.scrollTop;
668 this._dragStartWindowLeft = this._timeWindowLeft;
669 this._dragStartWindowRight = this._timeWindowRight;
671 this._canvas.style.cursor = ""; 670 this._canvas.style.cursor = "";
672 this.hideHighlight(); 671 this.hideHighlight();
673 return true; 672 return true;
674 }, 673 },
675 674
676 /** 675 /**
677 * @param {number} x 676 * @param {!MouseEvent} event
678 * @param {number} y
679 */ 677 */
680 _canvasDragging: function(x, y) 678 _canvasDragging: function(event)
681 { 679 {
682 var pixelShift = this._dragStartPointX - x; 680 var pixelShift = this._dragStartPointX - event.pageX;
683 this._dragStartPointX = x; 681 this._dragStartPointX = event.pageX;
684 this._muteAnimation = true; 682 this._muteAnimation = true;
685 this._handlePanGesture(pixelShift * this._pixelToTime); 683 this._handlePanGesture(pixelShift * this._pixelToTime);
686 this._muteAnimation = false; 684 this._muteAnimation = false;
687 685
688 var pixelScroll = this._dragStartPointY - y; 686 var pixelScroll = this._dragStartPointY - event.pageY;
689 this._vScrollElement.scrollTop = this._dragStartScrollTop + pixelScroll; 687 this._vScrollElement.scrollTop = this._dragStartScrollTop + pixelScroll;
690 this._updateMaxDragOffset(x, y); 688 this._updateMaxDragOffset(event);
691 }, 689 },
692 690
693 _endCanvasDragging: function() 691 _endCanvasDragging: function()
694 { 692 {
695 this._isDragging = false; 693 this._isDragging = false;
696 this._updateHighlight(); 694 this._updateHighlight();
697 }, 695 },
698 696
699 /** 697 /**
700 * @param {!MouseEvent} event 698 * @param {!MouseEvent} event
(...skipping 26 matching lines...) Expand all
727 _hideRangeSelection: function() 725 _hideRangeSelection: function()
728 { 726 {
729 this._selectionOverlay.classList.add("hidden"); 727 this._selectionOverlay.classList.add("hidden");
730 }, 728 },
731 729
732 /** 730 /**
733 * @param {!MouseEvent} event 731 * @param {!MouseEvent} event
734 */ 732 */
735 _rangeSelectionDragging: function(event) 733 _rangeSelectionDragging: function(event)
736 { 734 {
737 this._updateMaxDragOffset(event.pageX, event.pageY); 735 this._updateMaxDragOffset(event);
738 var x = Number.constrain(event.pageX + this._selectionOffsetShiftX, 0, t his._offsetWidth); 736 var x = Number.constrain(event.pageX + this._selectionOffsetShiftX, 0, t his._offsetWidth);
739 var start = this._cursorTime(this._selectionStartX); 737 var start = this._cursorTime(this._selectionStartX);
740 var end = this._cursorTime(x); 738 var end = this._cursorTime(x);
741 this._rangeSelectionStart = Math.min(start, end); 739 this._rangeSelectionStart = Math.min(start, end);
742 this._rangeSelectionEnd = Math.max(start, end); 740 this._rangeSelectionEnd = Math.max(start, end);
743 this._updateRangeSelectionOverlay(); 741 this._updateRangeSelectionOverlay();
744 this._flameChartDelegate.updateRangeSelection(this._rangeSelectionStart, this._rangeSelectionEnd); 742 this._flameChartDelegate.updateRangeSelection(this._rangeSelectionStart, this._rangeSelectionEnd);
745 }, 743 },
746 744
747 _updateRangeSelectionOverlay: function() 745 _updateRangeSelectionOverlay: function()
(...skipping 1257 matching lines...) Expand 10 before | Expand all | Expand 10 after
2005 this.update(); 2003 this.update();
2006 }, 2004 },
2007 2005
2008 _enabled: function() 2006 _enabled: function()
2009 { 2007 {
2010 return this._rawTimelineDataLength !== 0; 2008 return this._rawTimelineDataLength !== 0;
2011 }, 2009 },
2012 2010
2013 __proto__: WebInspector.HBox.prototype 2011 __proto__: WebInspector.HBox.prototype
2014 } 2012 }
OLDNEW
« no previous file with comments | « third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698