found in the LICENSE file.
-->
-<link rel="stylesheet" href="/tvcm/ui/common.css">
+<link rel="stylesheet" href="/base/ui/common.css">
<link rel="stylesheet" href="/tracing/timeline_track_view.css">
+<link rel="import" href="/base/events.html">
+<link rel="import" href="/base/properties.html">
+<link rel="import" href="/base/settings.html">
+<link rel="import" href="/base/ui.html">
+<link rel="import" href="/base/ui/mouse_mode_selector.html">
<link rel="import" href="/tracing/filter.html">
<link rel="import" href="/tracing/selection.html">
<link rel="import" href="/tracing/timeline_viewport.html">
<link rel="import" href="/tracing/timeline_display_transform_animations.html">
<link rel="import" href="/tracing/timing_tool.html">
-<link rel="import" href="/tvcm/events.html">
-<link rel="import" href="/tvcm/properties.html">
-<link rel="import" href="/tvcm/settings.html">
<link rel="import" href="/tracing/trace_model/event.html">
<link rel="import" href="/tracing/tracks/drawing_container.html">
<link rel="import" href="/tracing/tracks/trace_model_track.html">
<link rel="import" href="/tracing/tracks/ruler_track.html">
-<link rel="import" href="/tvcm/ui.html">
-<link rel="import" href="/tvcm/ui/mouse_mode_selector.html">
<script>
'use strict';
* Thread2: CCCCCC CCCCC
*
*/
-tvcm.exportTo('tracing', function() {
+tv.exportTo('tracing', function() {
var Selection = tracing.Selection;
var SelectionState = tracing.trace_model.SelectionState;
var Viewport = tracing.TimelineViewport;
* @constructor
* @extends {HTMLDivElement}
*/
- var TimelineTrackView = tvcm.ui.define('div');
+ var TimelineTrackView = tv.ui.define('div');
TimelineTrackView.prototype = {
__proto__: HTMLDivElement.prototype,
this.appendChild(this.dragBox_);
this.hideDragBox_();
+ this.initHintText_();
+
this.bindEventListener_(document, 'keypress', this.onKeypress_, this);
this.bindEventListener_(document, 'keydown', this.onKeydown_, this);
this.bindEventListener_(document, 'keyup', this.onKeyup_, this);
},
initMouseModeSelector: function() {
- this.mouseModeSelector_ = new tvcm.ui.MouseModeSelector(this);
+ this.mouseModeSelector_ = new tv.ui.MouseModeSelector(this);
this.appendChild(this.mouseModeSelector_);
this.mouseModeSelector_.addEventListener('beginpan',
this.mouseModeSelector_.addEventListener('exittiming',
this.timingTool_.onExitTiming.bind(this.timingTool_));
- var m = tvcm.ui.MOUSE_SELECTOR_MODE;
+ var m = tv.ui.MOUSE_SELECTOR_MODE;
this.mouseModeSelector_.supportedModeMask =
m.SELECTION | m.PANSCAN | m.ZOOM | m.TIMING;
this.mouseModeSelector_.settingsKey =
this.mouseModeSelector_.setKeyCodeForMode(m.TIMING, '4'.charCodeAt(0));
this.mouseModeSelector_.setModifierForAlternateMode(
- m.SELECTION, tvcm.ui.MODIFIER.SHIFT);
+ m.SELECTION, tv.ui.MODIFIER.SHIFT);
this.mouseModeSelector_.setModifierForAlternateMode(
- m.PANSCAN, tvcm.ui.MODIFIER.SPACE);
+ m.PANSCAN, tv.ui.MODIFIER.SPACE);
this.mouseModeSelector_.setModifierForAlternateMode(
- m.ZOOM, tvcm.ui.MODIFIER.CMD_OR_CTRL);
+ m.ZOOM, tv.ui.MODIFIER.CMD_OR_CTRL);
},
detach: function() {
if (!model)
throw new Error('Model cannot be null');
- var modelInstanceChanged = this.model_ != model;
+ var modelInstanceChanged = this.model_ !== model;
this.model_ = model;
this.modelTrack_.model = model;
if (modelInstanceChanged)
this.viewport_.setWhenPossible(this.setInitialViewport_.bind(this));
- tvcm.setPropertyAndDispatchChange(this, 'model', model);
+ tv.setPropertyAndDispatchChange(this, 'model', model);
},
get hasVisibleContent() {
},
setInitialViewport_: function() {
+ // We need the canvas size to be up-to-date at this point. We maybe in
+ // here before the raf fires, so the size may have not been updated since
+ // the canvas was resized.
+ this.modelTrackContainer_.updateCanvasSizeIfNeeded_();
var w = this.modelTrackContainer_.canvas.width;
var min;
if (this.model_.bounds.isEmpty) {
min = 0;
range = 1000;
- } else if (this.model_.bounds.range == 0) {
+ } else if (this.model_.bounds.range === 0) {
min = this.model_.bounds.min;
range = 1000;
} else {
min = this.model_.bounds.min;
range = this.model_.bounds.range;
}
+
var boost = range * 0.15;
tempDisplayTransform.set(this.viewport_.currentDisplayTransform);
tempDisplayTransform.xSetWorldBounds(min - boost,
if (this.focusElement.tabIndex >= 0) {
if (document.activeElement == this.focusElement)
return true;
- return tvcm.ui.elementIsChildOf(document.activeElement,
+ return tv.ui.elementIsChildOf(document.activeElement,
this.focusElement);
}
return true;
onDblClick_: function(e) {
if (this.mouseModeSelector_.mode !==
- tvcm.ui.MOUSE_SELECTOR_MODE.SELECTION)
+ tv.ui.MOUSE_SELECTOR_MODE.SELECTION)
return;
if (!this.selection.length || !this.selection[0].title)
* @param {boolean} Whether to change the zoom level smoothly.
*/
zoomBy_: function(scale, smooth) {
+ if (scale <= 0) {
+ return;
+ }
+
smooth = !!smooth;
var vp = this.viewport_;
var viewWidth = this.modelTrackContainer_.canvas.clientWidth;
return;
var worldCenter = bounds.center;
+ var viewCenter = this.modelTrackContainer_.canvas.width / 2;
var adjustedWorldRange = bounds.range * 1.25;
var newScale = this.modelTrackContainer_.canvas.width /
adjustedWorldRange;
var zoomInRatio = newScale / this.viewport_.currentDisplayTransform.scaleX;
var animation = new tracing.TimelineDisplayTransformZoomToAnimation(
- worldCenter, 'center',
+ worldCenter, viewCenter,
this.viewport_.currentDisplayTransform.panY,
zoomInRatio);
this.viewport_.queueDisplayTransformAnimation(animation);
} else
this.selection_ = new Selection();
- tvcm.dispatchSimpleEvent(this, 'selectionChange');
+ tv.dispatchSimpleEvent(this, 'selectionChange');
+ this.showHintText_('Press \'m\' to mark current selection');
if (this.selectionOfInterest.length) {
var track = this.viewport_.trackForEvent(this.selectionOfInterest[0]);
var roundedDuration = Math.round((hiWX - loWX) * 100) / 100;
this.dragBox_.textContent = roundedDuration + 'ms';
- var e = new tvcm.Event('selectionChanging');
+ var e = new tv.Event('selectionChanging');
e.loWX = loWX;
e.hiWX = hiWX;
this.dispatchEvent(e);
loVX, hiVX, loY, hiY, selection);
// Activate the new selection.
- this.setSelectionAndClearHighlight(selection);
+ var selection_change_event = new tracing.RequestSelectionChangeEvent();
+ selection_change_event.selection = selection;
+ this.dispatchEvent(selection_change_event);
},
onBeginZoom_: function(e) {
tempDisplayTransform.panY -= yDelta;
vp.setDisplayTransformImmediately(tempDisplayTransform);
this.storeLastTouchPositions_(e);
+ },
+
+ initHintText_: function() {
+ this.hintTextBox_ = this.ownerDocument.createElement('div');
+ this.hintTextBox_.className = 'hint-text';
+ this.hintTextBox_.style.display = 'none';
+ this.appendChild(this.hintTextBox_);
+
+ this.pendingHintTextClearTimeout_ = undefined;
+ },
+
+ showHintText_: function(text) {
+ if (this.pendingHintTextClearTimeout_) {
+ window.clearTimeout(this.pendingHintTextClearTimeout_);
+ this.pendingHintTextClearTimeout_ = undefined;
+ }
+ this.pendingHintTextClearTimeout_ = setTimeout(
+ this.hideHintText_.bind(this), 1000);
+ this.hintTextBox_.textContent = text;
+ this.hintTextBox_.style.display = '';
+ },
+
+ hideHintText_: function() {
+ this.pendingHintTextClearTimeout_ = undefined;
+ this.hintTextBox_.style.display = 'none';
}
};