refactor(): trying to move app events away from rootScope
This commit is contained in:
@@ -0,0 +1,6 @@
|
||||
///<reference path="../headers/common.d.ts" />
|
||||
|
||||
import {Emitter} from './utils/emitter';
|
||||
|
||||
var appEvents = new Emitter();
|
||||
export default appEvents;
|
||||
@@ -36,6 +36,8 @@ import 'app/core/services/all';
|
||||
import 'app/core/routes/routes';
|
||||
import './filters/filters';
|
||||
import coreModule from './core_module';
|
||||
import appEvents from './app_events';
|
||||
|
||||
|
||||
export {
|
||||
arrayJoin,
|
||||
@@ -48,5 +50,6 @@ export {
|
||||
liveSrv,
|
||||
layoutSelector,
|
||||
infoPopover,
|
||||
Emitter
|
||||
Emitter,
|
||||
appEvents,
|
||||
};
|
||||
|
||||
@@ -1,91 +0,0 @@
|
||||
define([
|
||||
'angular',
|
||||
'lodash',
|
||||
'../core_module',
|
||||
],
|
||||
function (angular, _, coreModule) {
|
||||
'use strict';
|
||||
|
||||
coreModule.default.service('alertSrv', function($timeout, $sce, $rootScope, $modal, $q) {
|
||||
var self = this;
|
||||
|
||||
this.init = function() {
|
||||
$rootScope.onAppEvent('alert-error', function(e, alert) {
|
||||
self.set(alert[0], alert[1], 'error');
|
||||
}, $rootScope);
|
||||
$rootScope.onAppEvent('alert-warning', function(e, alert) {
|
||||
self.set(alert[0], alert[1], 'warning', 5000);
|
||||
}, $rootScope);
|
||||
$rootScope.onAppEvent('alert-success', function(e, alert) {
|
||||
self.set(alert[0], alert[1], 'success', 3000);
|
||||
}, $rootScope);
|
||||
$rootScope.onAppEvent('confirm-modal', this.showConfirmModal, $rootScope);
|
||||
};
|
||||
|
||||
// List of all alert objects
|
||||
this.list = [];
|
||||
|
||||
this.set = function(title,text,severity,timeout) {
|
||||
var newAlert = {
|
||||
title: title || '',
|
||||
text: text || '',
|
||||
severity: severity || 'info',
|
||||
};
|
||||
|
||||
var newAlertJson = angular.toJson(newAlert);
|
||||
|
||||
// remove same alert if it already exists
|
||||
_.remove(self.list, function(value) {
|
||||
return angular.toJson(value) === newAlertJson;
|
||||
});
|
||||
|
||||
self.list.push(newAlert);
|
||||
if (timeout > 0) {
|
||||
$timeout(function() {
|
||||
self.list = _.without(self.list,newAlert);
|
||||
}, timeout);
|
||||
}
|
||||
|
||||
if (!$rootScope.$$phase) {
|
||||
$rootScope.$digest();
|
||||
}
|
||||
|
||||
return(newAlert);
|
||||
};
|
||||
|
||||
this.clear = function(alert) {
|
||||
self.list = _.without(self.list,alert);
|
||||
};
|
||||
|
||||
this.clearAll = function() {
|
||||
self.list = [];
|
||||
};
|
||||
|
||||
this.showConfirmModal = function(e, payload) {
|
||||
var scope = $rootScope.$new();
|
||||
|
||||
scope.title = payload.title;
|
||||
scope.text = payload.text;
|
||||
scope.text2 = payload.text2;
|
||||
scope.onConfirm = payload.onConfirm;
|
||||
scope.icon = payload.icon || "fa-check";
|
||||
scope.yesText = payload.yesText || "Yes";
|
||||
scope.noText = payload.noText || "Cancel";
|
||||
|
||||
var confirmModal = $modal({
|
||||
template: 'public/app/partials/confirm_modal.html',
|
||||
persist: false,
|
||||
modalClass: 'confirm-modal',
|
||||
show: false,
|
||||
scope: scope,
|
||||
keyboard: false
|
||||
});
|
||||
|
||||
$q.when(confirmModal).then(function(modalEl) {
|
||||
modalEl.modal('show');
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,99 @@
|
||||
///<reference path="../../headers/common.d.ts" />
|
||||
|
||||
import angular from 'angular';
|
||||
import _ from 'lodash';
|
||||
import $ from 'jquery';
|
||||
import coreModule from 'app/core/core_module';
|
||||
import appEvents from 'app/core/app_events';
|
||||
|
||||
export class AlertSrv {
|
||||
list: any[];
|
||||
|
||||
/** @ngInject */
|
||||
constructor(private $timeout, private $sce, private $rootScope, private $modal) {
|
||||
this.list = [];
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$rootScope.onAppEvent('alert-error', (e, alert) => {
|
||||
this.set(alert[0], alert[1], 'error', 0);
|
||||
}, this.$rootScope);
|
||||
|
||||
this.$rootScope.onAppEvent('alert-warning', (e, alert) => {
|
||||
this.set(alert[0], alert[1], 'warning', 5000);
|
||||
}, this.$rootScope);
|
||||
|
||||
this.$rootScope.onAppEvent('alert-success', (e, alert) => {
|
||||
this.set(alert[0], alert[1], 'success', 3000);
|
||||
}, this.$rootScope);
|
||||
|
||||
appEvents.on('confirm-modal', this.showConfirmModal.bind(this));
|
||||
|
||||
this.$rootScope.onAppEvent('confirm-modal', (e, data) => {
|
||||
this.showConfirmModal(data);
|
||||
}, this.$rootScope);
|
||||
}
|
||||
|
||||
set(title, text, severity, timeout) {
|
||||
var newAlert = {
|
||||
title: title || '',
|
||||
text: text || '',
|
||||
severity: severity || 'info',
|
||||
};
|
||||
|
||||
var newAlertJson = angular.toJson(newAlert);
|
||||
|
||||
// remove same alert if it already exists
|
||||
_.remove(this.list, function(value) {
|
||||
return angular.toJson(value) === newAlertJson;
|
||||
});
|
||||
|
||||
this.list.push(newAlert);
|
||||
if (timeout > 0) {
|
||||
this.$timeout(() => {
|
||||
this.list = _.without(this.list, newAlert);
|
||||
}, timeout);
|
||||
}
|
||||
|
||||
if (!this.$rootScope.$$phase) {
|
||||
this.$rootScope.$digest();
|
||||
}
|
||||
|
||||
return(newAlert);
|
||||
}
|
||||
|
||||
clear(alert) {
|
||||
this.list = _.without(this.list, alert);
|
||||
}
|
||||
|
||||
clearAll() {
|
||||
this.list = [];
|
||||
}
|
||||
|
||||
showConfirmModal(payload) {
|
||||
var scope = this.$rootScope.$new();
|
||||
|
||||
scope.title = payload.title;
|
||||
scope.text = payload.text;
|
||||
scope.text2 = payload.text2;
|
||||
scope.onConfirm = payload.onConfirm;
|
||||
scope.icon = payload.icon || "fa-check";
|
||||
scope.yesText = payload.yesText || "Yes";
|
||||
scope.noText = payload.noText || "Cancel";
|
||||
|
||||
var confirmModal = this.$modal({
|
||||
template: 'public/app/partials/confirm_modal.html',
|
||||
persist: false,
|
||||
modalClass: 'confirm-modal',
|
||||
show: false,
|
||||
scope: scope,
|
||||
keyboard: false
|
||||
});
|
||||
|
||||
confirmModal.then(function(modalEl) {
|
||||
modalEl.modal('show');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
coreModule.service('alertSrv', AlertSrv);
|
||||
@@ -1,3 +1,4 @@
|
||||
///<reference path="../../headers/common.d.ts" />
|
||||
|
||||
import {Subject} from 'vendor/npm/rxjs/Subject';
|
||||
|
||||
|
||||
@@ -2,8 +2,9 @@
|
||||
|
||||
import angular from 'angular';
|
||||
import _ from 'lodash';
|
||||
import coreModule from 'app/core/core_module';
|
||||
|
||||
import config from 'app/core/config';
|
||||
import {coreModule, appEvents} from 'app/core/core';
|
||||
|
||||
var datasourceTypes = [];
|
||||
|
||||
@@ -142,7 +143,7 @@ export class DataSourceEditCtrl {
|
||||
}
|
||||
|
||||
delete(s) {
|
||||
this.$scope.appEvent('confirm-modal', {
|
||||
appEvents.emit('confirm-modal', {
|
||||
title: 'Delete',
|
||||
text: 'Are you sure you want to delete this datasource?',
|
||||
yesText: "Delete",
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
import {describe, beforeEach, it, sinon, expect} from 'test/lib/common';
|
||||
|
||||
import {GrafanaApp} from 'app/app';
|
||||
|
||||
describe('GrafanaApp', () => {
|
||||
|
||||
var app = new GrafanaApp();
|
||||
|
||||
it('can call inits', () => {
|
||||
expect(app).to.not.be(null);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
+2
-70
@@ -79,76 +79,7 @@ angular.module('$strap.directives').factory('$modal', [
|
||||
return ModalFactory;
|
||||
}
|
||||
])
|
||||
'use strict';
|
||||
angular.module('$strap.directives').directive('bsTabs', [
|
||||
'$parse',
|
||||
'$compile',
|
||||
'$timeout',
|
||||
function ($parse, $compile, $timeout) {
|
||||
var template = '<div class="tabs">' + '<ul class="nav nav-tabs">' + '<li ng-repeat="pane in panes" ng-class="{active:pane.active}">' + '<a data-target="#{{pane.id}}" data-index="{{$index}}" data-toggle="tab">{{pane.title}}</a>' + '</li>' + '</ul>' + '<div class="tab-content" ng-transclude>' + '</div>';
|
||||
return {
|
||||
restrict: 'A',
|
||||
require: '?ngModel',
|
||||
priority: 0,
|
||||
scope: true,
|
||||
template: template,
|
||||
replace: true,
|
||||
transclude: true,
|
||||
compile: function compile(tElement, tAttrs, transclude) {
|
||||
return function postLink(scope, iElement, iAttrs, controller) {
|
||||
var getter = $parse(iAttrs.bsTabs), setter = getter.assign, value = getter(scope);
|
||||
scope.panes = [];
|
||||
var $tabs = iElement.find('ul.nav-tabs');
|
||||
var $panes = iElement.find('div.tab-content');
|
||||
var activeTab = 0, id, title, active;
|
||||
$timeout(function () {
|
||||
$panes.find('[data-title], [data-tab]').each(function (index) {
|
||||
var $this = angular.element(this);
|
||||
id = 'tab-' + scope.$id + '-' + index;
|
||||
title = $this.data('title') || $this.data('tab');
|
||||
active = !active && $this.hasClass('active');
|
||||
$this.attr('id', id).addClass('tab-pane');
|
||||
if (iAttrs.fade)
|
||||
$this.addClass('fade');
|
||||
scope.panes.push({
|
||||
id: id,
|
||||
title: title,
|
||||
content: this.innerHTML,
|
||||
active: active
|
||||
});
|
||||
});
|
||||
if (scope.panes.length && !active) {
|
||||
$panes.find('.tab-pane:first-child').addClass('active' + (iAttrs.fade ? ' in' : ''));
|
||||
scope.panes[0].active = true;
|
||||
}
|
||||
});
|
||||
if (controller) {
|
||||
iElement.on('show', function (ev) {
|
||||
var $target = $(ev.target);
|
||||
scope.$apply(function () {
|
||||
controller.$setViewValue($target.data('index'));
|
||||
});
|
||||
});
|
||||
scope.$watch(iAttrs.ngModel, function (newValue, oldValue) {
|
||||
if (angular.isUndefined(newValue))
|
||||
return;
|
||||
activeTab = newValue;
|
||||
setTimeout(function () {
|
||||
// Check if we're still on the same tab before making the switch
|
||||
if(activeTab === newValue) {
|
||||
var $next = $($tabs[0].querySelectorAll('li')[newValue * 1]);
|
||||
if (!$next.hasClass('active')) {
|
||||
$next.children('a').tab('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
}
|
||||
]);
|
||||
|
||||
'use strict';
|
||||
angular.module('$strap.directives').directive('bsTooltip', [
|
||||
'$parse',
|
||||
@@ -202,6 +133,7 @@ angular.module('$strap.directives').directive('bsTooltip', [
|
||||
};
|
||||
}
|
||||
]);
|
||||
|
||||
'use strict';
|
||||
angular.module('$strap.directives').directive('bsTypeahead', [
|
||||
'$parse',
|
||||
|
||||
Reference in New Issue
Block a user