IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

more work on dash links

Browse Source
This commit is contained in:
Torkel Ödegaard 2015-05-06 10:57:32 +02:00
parent 26c9a19392
commit 1f48c07395
5 changed files with 50 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/app/directives/bodyClass.js
View File

@ -16,7 +16,7 @@ function (angular, _, $) {
// tooltip removal fix
$scope.$on("$routeChangeSuccess", function() {
$("#tooltip").remove();
$("#tooltip, .tooltip").remove();
});
$scope.$watch('submenuEnabled', function() {

19
public/app/features/dashlinks/editor.html
View File

@ -8,27 +8,28 @@
<i class="fa fa-remove pointer" ng-click="deleteLink(link)"></i>
</li>
<li class="tight-form-item" style="width: 80px;">Type</li>
<li class="tight-form-item">Type</li>
<li>
<select class="input-medium tight-form-input" style="width: 101px;" ng-model="link.type" ng-options="f for f in ['dashboard','absolute']"></select>
<select class="input-medium tight-form-input" style="width: 101px;" ng-model="link.type" ng-options="f for f in ['dashboard','absolute']" ng-change="updated()"></select>
</li>
<li class="tight-form-item" ng-show="link.type === 'dashboard'">Dashboard</li>
<li ng-show="link.type === 'dashboard'">
<input type="text"
ng-model="link.dashboard"
bs-typeahead="searchDashboards"
class="input-large tight-form-input">
<input type="text" ng-model="link.dashboard" bs-typeahead="searchDashboards" class="input-xlarge tight-form-input" ng-model-onblur ng-change="updated()">
</li>
<li class="tight-form-item" ng-show="link.type === 'absolute'">Url</li>
<li class="tight-form-item" ng-show="link.type === 'absolute'" style="width: 69px">Url</li>
<li ng-show="link.type === 'absolute'">
<input type="text" ng-model="link.url" class="input-xlarge tight-form-input">
<input type="text" ng-model="link.url" class="input-xlarge tight-form-input" ng-model-onblur ng-change="updated()">
</li>
<li class="tight-form-item">Title</li>
<li>
<input type="text" ng-model="link.title" class="input-medium tight-form-input">
<input type="text" ng-model="link.title" class="input-medium tight-form-input" ng-model-onblur ng-change="updated()">
</li>
<li class="tight-form-item">Tooltip</li>
<li>
<input type="text" ng-model="link.tooltip" class="input-medium tight-form-input" placeholder="Open dashbord" ng-model-onblur ng-change="updated()">
</li>
</ul>
<div class="clearfix"></div>

2
public/app/features/dashlinks/module.html
View File

@ -1,4 +1,4 @@
<a class="pointer dash-nav-link" bs-tooltip="'asd'">
<a class="pointer dash-nav-link" href="/asd" data-placement="bottom">
<i class="fa fa-th-large"></i>
<span></span>
</a>

47
public/app/features/dashlinks/module.js
View File

@ -18,7 +18,7 @@ function (angular, _) {
link: function() {
}
};
}).directive('dashLink', function(linkSrv) {
}).directive('dashLink', function(linkSrv, $rootScope) {
return {
scope: {
link: "="
@ -27,29 +27,52 @@ function (angular, _) {
controller: 'DashLinkCtrl',
templateUrl: 'app/features/dashlinks/module.html',
link: function(scope, elem) {
var linkInfo;
var anchor = elem.find('a');
var icon = elem.find('i');
var span = elem.find('span');
function update() {
var linkInfo = linkSrv.getPanelLinkAnchorInfo(scope.link);
elem.find("span").text(linkInfo.title);
elem.find("a").attr("href", linkInfo.href);
linkInfo = linkSrv.getPanelLinkAnchorInfo(scope.link);
span.text(linkInfo.title);
anchor.attr("href", linkInfo.href);
if (scope.link.type === 'dashboard') {
scope.tooltip = 'Go to dashboard';
if (scope.link.type === 'absolute') {
icon.attr('class', 'fa fw fa-external-link');
anchor.attr('target', '_blank');
} else {
icon.attr('class', 'fa fw fa-th-large');
anchor.attr('target', '');
}
}
// tooltip
elem.find('a').tooltip({
title: function () {
if (scope.link.tooltip) {
return scope.link.tooltip;
}
else if (scope.link.type === 'dashboard') {
return 'Open dashboard';
} else if (scope.link.type === 'absolute') {
return 'Open external page';
}
},
html: true,
container: 'body', // Grafana change
});
update();
scope.$on('refresh', update);
$rootScope.onAppEvent('dash-links-updated', update);
}
};
})
.controller("DashLinkCtrl", function($scope) {
.controller("DashLinkCtrl", function() {
})
.controller('DashLinkEditorCtrl', function($scope, backendSrv) {
.controller('DashLinkEditorCtrl', function($scope, backendSrv, $rootScope) {
$scope.dashboard.links = $scope.dashboard.links || [];
$scope.addLink = function() {
$scope.dashboard.links.push({
type: 'dashboard',
@ -57,6 +80,10 @@ function (angular, _) {
});
};
$scope.updated = function() {
$rootScope.appEvent('dash-links-updated');
};
$scope.searchDashboards = function(queryStr, callback) {
var query = {query: queryStr};

2
public/css/less/navbar.less
View File

@ -66,7 +66,7 @@
color: #a2a2a2;
border: 1px solid @grafanaTargetFuncHightlight;
a {
.buttonBackground(@btnInverseBackground, @btnInverseBackgroundHighlight);
background-color: @btnInverseBackgroundHighlight;
display: inline-block;
//background: @btnInverseBackground;
padding: 5px 15px 5px 10px;