blob: a0fd79af567b7807d7d4b1d1b575e8fcc84acaaf [file] [log] [blame]
<!DOCTYPE html>
<!--
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.
-->
<link rel="import" href="/tracing/model/event_set.html">
<link rel="import" href="/tracing/ui/base/ui.html">
<link rel="import" href="/tracing/ui/brushing_state_controller.html">
<dom-module id='tr-ui-a-analysis-link'>
<template>
<style>
:host {
display: inline;
cursor: pointer;
cursor: pointer;
white-space: nowrap;
}
a {
text-decoration: underline;
}
</style>
<a href="{{href}}" on-click="onClicked_" on-mouseenter="onMouseEnter_" on-mouseleave="onMouseLeave_"><content></content></a>
</template>
</dom-module>
<script>
'use strict';
Polymer({
is: 'tr-ui-a-analysis-link',
properties: {
href: {
type: String
}
},
listeners: {
'click': 'onClicked_',
'mouseenter': 'onMouseEnter_',
'mouseleave': 'onMouseLeave_'
},
ready: function() {
this.selection_ = undefined;
},
attached: function() {
// Save an instance of the controller since it's going to be used in
// detached() where it can no longer be obtained.
this.controller_ =
tr.c.BrushingStateController.getControllerForElement(this);
},
detached: function() {
// Reset highlights.
this.clearHighlight_();
this.controller_ = undefined;
},
set color(c) {
this.style.color = c;
},
/**
* @return {*|function():*}
*/
get selection() {
return this.selection_;
},
/**
* |selection| can be anything except a function, or else a function that
* can return anything.
*
* In the context of trace_viewer, |selection| is typically an EventSet,
* whose events will be highlighted by trace_viewer when this link is
* clicked or mouse-entered.
*
* If |selection| is not a function, then it will be dispatched to this
* link's embedder via a RequestSelectionChangeEvent when this link is
* clicked or mouse-entered.
*
* If |selection| is a function, then it will be called when this link is
* clicked or mouse-entered, and its result will be dispatched to this
* link's embedder via a RequestSelectionChangeEvent.
*
* @param {*|function():*} selection
*/
set selection(selection) {
this.selection_ = selection;
Polymer.dom(this).textContent = selection.userFriendlyName;
},
setSelectionAndContent: function(selection, opt_textContent) {
this.selection_ = selection;
if (opt_textContent)
Polymer.dom(this).textContent = opt_textContent;
},
/**
* If |selection| is a function, call it and return the result.
* Otherwise return |selection| directly.
*
* @return {*}
*/
getCurrentSelection_: function() {
// Gets the current selection, invoking the selection function if needed.
if (typeof this.selection_ === 'function')
return this.selection_();
return this.selection_;
},
setHighlight_: function(opt_eventSet) {
if (this.controller_)
this.controller_.changeAnalysisLinkHoveredEvents(opt_eventSet);
},
clearHighlight_: function(opt_eventSet) {
this.setHighlight_();
},
onClicked_: function(clickEvent) {
if (!this.selection_)
return;
clickEvent.stopPropagation();
var event = new tr.model.RequestSelectionChangeEvent();
event.selection = this.getCurrentSelection_();
this.dispatchEvent(event);
},
onMouseEnter_: function() {
this.setHighlight_(this.getCurrentSelection_());
},
onMouseLeave_: function() {
this.clearHighlight_();
}
});
</script>