Commit 69e80fd1 by Torkel Ödegaard

working on share feature, and refactorings

parent bef8cc2d
...@@ -78,7 +78,7 @@ function (angular, _, moment, config, store) { ...@@ -78,7 +78,7 @@ function (angular, _, moment, config, store) {
var clone = angular.copy($scope.dashboard); var clone = angular.copy($scope.dashboard);
$scope.db.saveDashboard(clone) $scope.db.saveDashboard(clone)
.then(function(result) { .then(function(result) {
alertSrv.set('Dashboard Saved', 'Saved as "' + result.title + '"','success', 3000); $scope.appEvent('alert-success', ['Dashboard saved', 'Saved as ' + result.title]);
if (result.url !== $location.path()) { if (result.url !== $location.path()) {
$location.search({}); $location.search({});
...@@ -88,7 +88,7 @@ function (angular, _, moment, config, store) { ...@@ -88,7 +88,7 @@ function (angular, _, moment, config, store) {
$rootScope.$emit('dashboard-saved', $scope.dashboard); $rootScope.$emit('dashboard-saved', $scope.dashboard);
}, function(err) { }, function(err) {
alertSrv.set('Save failed', err, 'error', 5000); $scope.emitAppEvent('alert-error', ['Save failed', err]);
}); });
}; };
......
...@@ -10,19 +10,19 @@ function (angular, config, _, $, store) { ...@@ -10,19 +10,19 @@ function (angular, config, _, $, store) {
var module = angular.module('grafana.controllers'); var module = angular.module('grafana.controllers');
module.controller('GrafanaCtrl', function($scope, alertSrv, grafanaVersion, $rootScope, $controller) { module.controller('GrafanaCtrl', function($scope, alertSrv, utilSrv, grafanaVersion, $rootScope, $controller) {
$scope.grafanaVersion = grafanaVersion[0] === '@' ? 'master' : grafanaVersion; $scope.grafanaVersion = grafanaVersion[0] === '@' ? 'master' : grafanaVersion;
$scope.consoleEnabled = store.getBool('grafanaConsole'); $scope._ = _;
$rootScope.profilingEnabled = store.getBool('profilingEnabled'); $rootScope.profilingEnabled = store.getBool('profilingEnabled');
$rootScope.performance = { loadStart: new Date().getTime() }; $rootScope.performance = { loadStart: new Date().getTime() };
$scope.init = function() { $scope.init = function() {
$scope._ = _;
if ($rootScope.profilingEnabled) { $scope.initProfiling(); } if ($rootScope.profilingEnabled) { $scope.initProfiling(); }
alertSrv.init();
utilSrv.init();
$scope.dashAlerts = alertSrv; $scope.dashAlerts = alertSrv;
$scope.grafana = { style: 'dark' }; $scope.grafana = { style: 'dark' };
}; };
......
<div ng-controller="SharePanelCtrl">
<div class="modal-header">
<div class="dashboard-editor-header">
<div class="dashboard-editor-title">
<i class="icon icon-share"></i>
Share
</div>
<div ng-model="editor.index" bs-tabs style="text-transform:capitalize;">
<div ng-repeat="tab in ['Link', 'Embedd', 'Image']" data-title="{{tab}}">
</div>
</div>
</div>
</div>
<div class="modal-body">
<div class="editor-row">
<input type="text" class="input input-xxlarge"></input>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-success pull-right" ng-click="dismiss();">close</button>
</div>
</div>
<div class="modal-header"> <div class="modal-header">
</div> </div>
<div class="modal-body">
<h3 class="text-center"><i class="icon-warning-sign"></i> Unsaved changes</h3> <div class="modal-body">
<h4 class="text-center"><i class="icon-warning-sign"></i> Unsaved changes</h4>
<div class="row-fluid"> <div class="row-fluid">
<span class="span3"> <span class="span3">
{{changes}} {{changes}}
</span> </span>
<button type="button" class="btn btn-success span2" ng-click="dismiss()">Cancel</button> <button type="button" class="btn btn-success span2" ng-click="dismiss()">Cancel</button>
<button type="button" class="btn btn-success span2" ng-click="save();dismiss();">Save</button> <button type="button" class="btn btn-success span2" ng-click="save();dismiss();">Save</button>
<button type="button" class="btn btn-warning span2" ng-click="ignore();dismiss();">Ignore</button> <button type="button" class="btn btn-warning span2" ng-click="ignore();dismiss();">Ignore</button>
<span class="span3"></span> <span class="span3"></span>
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
</div> </div>
...@@ -7,9 +7,21 @@ function (angular, _) { ...@@ -7,9 +7,21 @@ function (angular, _) {
var module = angular.module('grafana.services'); var module = angular.module('grafana.services');
module.service('alertSrv', function($timeout, $sce) { module.service('alertSrv', function($timeout, $sce, $rootScope) {
var self = this; var self = this;
this.init = function() {
$rootScope.onAppEvent('alert-error', function(e, alert) {
self.set(alert[0], alert[1], 'error');
});
$rootScope.onAppEvent('alert-warning', function(e, alert) {
self.set(alert[0], alert[1], 'warning', 5000);
});
$rootScope.onAppEvent('alert-success', function(e, alert) {
self.set(alert[0], alert[0], 'success', 3000);
});
};
// List of all alert objects // List of all alert objects
this.list = []; this.list = [];
......
define([ define([
'./alertSrv', './alertSrv',
'./utilSrv',
'./datasourceSrv', './datasourceSrv',
'./timeSrv', './timeSrv',
'./templateSrv', './templateSrv',
......
...@@ -56,6 +56,13 @@ function (angular, _) { ...@@ -56,6 +56,13 @@ function (angular, _) {
} }
}; };
$scope.sharePanel = function() {
$scope.emitAppEvent('show-modal', {
src: './app/partials/share-panel.html',
scope: $scope.$new()
});
};
$scope.editPanelJson = function() { $scope.editPanelJson = function() {
$scope.emitAppEvent('show-json-editor', { object: $scope.panel, updateHandler: $scope.replacePanel }); $scope.emitAppEvent('show-json-editor', { object: $scope.panel, updateHandler: $scope.replacePanel });
}; };
......
define([
'angular',
],
function (angular) {
'use strict';
var module = angular.module('grafana.services');
module.service('utilSrv', function($rootScope, $modal, $q) {
this.init = function() {
$rootScope.onAppEvent('show-modal', this.showModal);
};
this.showModal = function(e, options) {
var modal = $modal({
template: options.src,
persist: false,
show: false,
scope: options.scope,
keyboard: false
});
$q.when(modal).then(function(modalEl) {
modalEl.modal('show');
});
};
});
});
...@@ -57,7 +57,7 @@ hr { ...@@ -57,7 +57,7 @@ hr {
.brand { .brand {
padding: 0px 15px; padding: 0px 15px;
color: @grayLighter; color: @navbarBrandColor;
font-weight: normal; font-weight: normal;
text-shadow: none; text-shadow: none;
} }
......
...@@ -53,8 +53,12 @@ ...@@ -53,8 +53,12 @@
} }
.modal { .modal {
margin: 5%; max-width: 1024px;
width: 90%; left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
top: 200px;
} }
.grafana-search-metric-actions { .grafana-search-metric-actions {
......
...@@ -252,11 +252,6 @@ form input.ng-invalid { ...@@ -252,11 +252,6 @@ form input.ng-invalid {
max-width: 480px; max-width: 480px;
} }
.modal {
width: 100%;
top: 0px !important;
}
.tiny { .tiny {
font-size: 50%; font-size: 50%;
} }
......
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
} }
.panel-menu { .panel-menu {
z-index: 10000; z-index: 1000;
position: absolute; position: absolute;
background: @grafanaTargetFuncBackground; background: @grafanaTargetFuncBackground;
border: 1px solid black; border: 1px solid black;
......
...@@ -219,7 +219,7 @@ ...@@ -219,7 +219,7 @@
@navbarLinkBackgroundHover: transparent; @navbarLinkBackgroundHover: transparent;
@navbarLinkBackgroundActive: @navbarBackground; @navbarLinkBackgroundActive: @navbarBackground;
@navbarBrandColor: @navbarLinkColor; @navbarBrandColor: @linkColor;
// Inverted navbar // Inverted navbar
@navbarInverseBackground: #252A30; @navbarInverseBackground: #252A30;
......
...@@ -435,7 +435,8 @@ angular.module('$strap.directives').factory('$modal', [ ...@@ -435,7 +435,8 @@ angular.module('$strap.directives').factory('$modal', [
return res.data; return res.data;
})).then(function onSuccess(template) { })).then(function onSuccess(template) {
var id = templateUrl.replace('.html', '').replace(/[\/|\.|:]/g, '-') + '-' + scope.$id; var id = templateUrl.replace('.html', '').replace(/[\/|\.|:]/g, '-') + '-' + scope.$id;
var $modal = $('<div class="modal hide" tabindex="-1"></div>').attr('id', id).addClass('fade').html(template); // grafana change, removed fade
var $modal = $('<div class="modal hide" tabindex="-1"></div>').attr('id', id).html(template);
if (options.modalClass) if (options.modalClass)
$modal.addClass(options.modalClass); $modal.addClass(options.modalClass);
$('body').append($modal); $('body').append($modal);
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
.modal-backdrop, .modal-backdrop,
.modal-backdrop.fade.in { .modal-backdrop.fade.in {
.opacity(80); .opacity(70);
} }
// Base modal // Base modal
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment