<x-timeline-view-side-panel-container></x-timeline-view-side-panel-container>
</middle-container>
<x-drag-handle></x-drag-handle>
- <div id="analysis"></div>
+ <tracing-analysis-view id="analysis"></tracing-analysis-view>
</template>
<template id="help-btn-template">
tvcm.ui.decorate(this.dragEl_, tvcm.ui.DragHandle);
this.analysisEl_ = this.querySelector('#analysis');
- tvcm.ui.decorate(this.analysisEl_, tracing.analysis.AnalysisView);
- this.appendChild(this.analysisEl_);
this.addEventListener('requestSelectionChange',
this.onRequestSelectionChange_.bind(this));
document.addEventListener('keypress', this.onKeypress_.bind(this), true);
this.dragEl_.target = this.analysisEl_;
+
+ // State management on selection change.
+ this.selections_ = {};
+ window.addEventListener('popstate', this.onPopState_.bind(this));
},
createHelpButton_: function() {
'selectionChange', this.onSelectionChanged_);
this.trackView_.viewport.addEventListener(
'change', this.onViewportChanged_);
- this.analysisEl_.clearSelectionHistory();
}
// Set the model.
if (modelValid) {
this.trackView_.model = model;
this.timelineViewSidePanelContainer_.model = model;
+ this.clearSelectionHistory_();
}
tvcm.dispatchSimpleEvent(this, 'modelChange');
},
onRequestSelectionChange_: function(e) {
+ // Save the selection so that when back button is pressed,
+ // it could be retrieved.
+ this.selections_[e.selection.guid] = e.selection;
+ var state = {
+ selection_guid: e.selection.guid
+ };
+ window.history.pushState(state);
+
this.trackView_.selection = e.selection;
e.stopPropagation();
},
+ onPopState_: function(e) {
+ if (e.state === null)
+ return;
+
+ var selection = this.selections_[e.state.selection_guid];
+ if (selection)
+ this.trackView_.selection = selection;
+ e.stopPropagation();
+ },
+
+ clearSelectionHistory_: function() {
+ this.selections_ = {};
+ },
+
onViewportChanged_: function(e) {
var spc = this.timelineViewSidePanelContainer_;
if (!this.trackView_) {