Skip to content

N
nexpie-grafana-theme
Commit ab554122 by Torkel Ödegaard
Options

Refactoring of grafana (root scope view model), into contextSrv, made sidemenu… 

Refactoring of grafana (root scope view model), into contextSrv, made sidemenu always hide after login
parent f82cb3ae
Showing with 106 additions and 105 deletions
src/app/controllers/errorCtrl.js
......@@ -8,13 +8,13 @@ function (angular) {
var module = angular.module('grafana.controllers');
module.controller('ErrorCtrl', function($scope) {
module.controller('ErrorCtrl', function($scope, contextSrv) {
var showSideMenu = $scope.grafana.sidemenu;
$scope.grafana.sidemenu = false;
var showSideMenu = contextSrv.sidemenu;
contextSrv.sidemenu = false;
$scope.$on('$destroy', function() {
$scope.grafana.sidemenu = showSideMenu;
$scope.contextSrv.sidemenu = showSideMenu;
});
});
......
src/app/controllers/grafanaCtrl.js
......@@ -10,11 +10,11 @@ function (angular, config, _, $, store) {
var module = angular.module('grafana.controllers');
module.controller('GrafanaCtrl', function($scope, alertSrv, utilSrv, grafanaVersion, $rootScope, $controller, userSrv, $timeout) {
module.controller('GrafanaCtrl', function($scope, alertSrv, utilSrv, $rootScope, $controller, contextSrv) {
$scope.init = function() {
$scope.grafana = {};
$scope.grafana.version = grafanaVersion;
$scope.contextSrv = contextSrv;
$scope._ = _;
$rootScope.profilingEnabled = store.getBool('profilingEnabled');
......@@ -27,30 +27,12 @@ function (angular, config, _, $, store) {
utilSrv.init();
$scope.dashAlerts = alertSrv;
$scope.grafana.lightTheme = false;
$scope.grafana.user = userSrv.getSignedInUser();
$scope.grafana.sidemenu = store.getBool('grafana.sidemenu');
$scope.topnav = { title: 'Grafana' };
$scope.onAppEvent('logged-out', function() {
$scope.grafana.sidemenu = false;
$scope.grafana.user = {};
});
};
$scope.initDashboard = function(dashboardData, viewScope) {
$controller('DashboardCtrl', { $scope: viewScope }).init(dashboardData);
};
$scope.toggleSideMenu = function() {
$scope.grafana.sidemenu = !$scope.grafana.sidemenu;
store.set('grafana.sidemenu', $scope.grafana.sidemenu);
$timeout(function() {
$scope.$broadcast("render");
}, 50);
};
$rootScope.onAppEvent = function(name, callback) {
var unbind = $rootScope.$on(name, callback);
this.$on('$destroy', unbind);
......
src/app/controllers/loginCtrl.js
......@@ -7,14 +7,14 @@ function (angular, config) {
var module = angular.module('grafana.controllers');
module.controller('LoginCtrl', function($scope, backendSrv) {
module.controller('LoginCtrl', function($scope, backendSrv, contextSrv) {
$scope.formModel = {
user: '',
email: '',
password: '',
};
$scope.grafana.sidemenu = false;
contextSrv.setSideMenuState(false);
$scope.googleAuthEnabled = config.googleAuthEnabled;
$scope.githubAuthEnabled = config.githubAuthEnabled;
......
src/app/controllers/search.js
......@@ -74,8 +74,8 @@ function (angular, _, config, $) {
.then(function(results) {
if (localSearchId < $scope.currentSearchId) { return; }
if ($scope.query.query === "") {
results.dashboards.splice(0, 1, { title: 'Home', url: config.appSubUrl + '/', isHome: true });
if ($scope.query.query === "" && !$scope.query.starred) {
results.dashboards.unshift({ title: 'Home', url: config.appSubUrl + '/', isHome: true });
}
$scope.results.dashboards = results.dashboards;
......
src/app/controllers/sidemenuCtrl.js
......@@ -9,7 +9,7 @@ function (angular, _, $, config) {
var module = angular.module('grafana.controllers');
module.controller('SideMenuCtrl', function($scope, $location) {
module.controller('SideMenuCtrl', function($scope, $location, contextSrv) {
$scope.getUrl = function(url) {
return config.appSubUrl + url;
......@@ -22,7 +22,7 @@ function (angular, _, $, config) {
href: $scope.getUrl("/"),
});
if ($scope.grafana.user.accountRole === 'Admin') {
if (contextSrv.hasRole('Admin')) {
$scope.menu.push({
text: "Data Sources",
icon: "fa fa-database",
......@@ -35,7 +35,7 @@ function (angular, _, $, config) {
});
}
if ($scope.grafana.user.isGrafanaAdmin) {
if (contextSrv.user.isGrafanaAdmin) {
$scope.menu.push({
text: "Admin", href: $scope.getUrl("/admin/users"),
icon: "fa fa-cube",
......
src/app/directives/dashEditLink.js
......@@ -56,8 +56,8 @@ function (angular, $) {
function showEditorPane(evt, payload, editview) {
if (editview) {
scope.grafana.editview = editViewMap[editview];
payload.src = scope.grafana.editview.src;
scope.contextSrv.editview = editViewMap[editview];
payload.src = scope.contextSrv.editview.src;
}
if (lastEditor === payload.src) {
......@@ -106,12 +106,12 @@ function (angular, $) {
if (newValue) {
showEditorPane(null, {}, newValue);
} else if (oldValue) {
scope.grafana.editview = null;
scope.contextSrv.editview = null;
hideEditorPane();
}
});
scope.grafana.editview = null;
scope.contextSrv.editview = null;
scope.$on("$destroy", hideEditorPane);
scope.onAppEvent('hide-dash-editor', hideEditorPane);
scope.onAppEvent('show-dash-editor', showEditorPane);
......
src/app/directives/topnav.js
......@@ -7,7 +7,7 @@ function (angular) {
angular
.module('grafana.directives')
.directive('topnav', function() {
.directive('topnav', function($rootScope, contextSrv) {
return {
restrict: 'E',
transclude: true,
......@@ -15,8 +15,6 @@ function (angular) {
title: "@",
section: "@",
titleAction: "&",
toggle: "&",
showMenuBtn: "=",
subnav: "=",
},
template:
......@@ -43,6 +41,11 @@ function (angular) {
'</div><div ng-transclude></div></div></div></div>',
link: function(scope, elem, attrs) {
scope.icon = attrs.icon;
scope.showMenuBtn = !contextSrv.sidemenu;
scope.toggle = function() {
$rootScope.appEvent('toggle-sidemenu');
};
}
};
});
......
src/app/features/account/partials/account.html
<topnav toggle="toggleSideMenu()" icon="fa fa-shield" title="Account" show-menu-btn="!grafana.sidemenu" subnav="true">
<topnav icon="fa fa-shield" title="Account" subnav="true">
<ul class="nav">
<li class="active"><a href="account">Overview</a></li>
<li><a href="account/users">Users</a></li>
......
src/app/features/account/partials/apikeys.html
<topnav toggle="toggleSideMenu()"
title="API Keys"
<topnav title="API Keys"
icon="fa fa-shield"
section="Account"
show-menu-btn="!grafana.sidemenu">
section="Account">
</topnav>
<div class="gf-box" style="min-height: 500px">
......
src/app/features/account/partials/datasources.html
<topnav toggle="toggleSideMenu()"
title="Data sources"
icon="fa fa-database"
show-menu-btn="!grafana.sidemenu">
<topnav title="Data sources"
icon="fa fa-database">
</topnav>
<div class="gf-box" style="min-height: 500px; max-width: 900px">
......
src/app/features/account/partials/import.html
<topnav toggle="toggleSideMenu()" icon="fa fa-shield" title="Account" show-menu-btn="!grafana.sidemenu" subnav="true">
<topnav icon="fa fa-shield" title="Account" subnav="true">
<ul class="nav">
<li><a href="account">Overview</a></li>
<li><a href="account/users">Users</a></li>
......
src/app/features/account/partials/users.html
<topnav toggle="toggleSideMenu()" title="Account" icon="fa fa-shield" show-menu-btn="!grafana.sidemenu" subnav="true">
<topnav title="Account" icon="fa fa-shield" subnav="true">
<ul class="nav">
<li><a href="account">Overview</a></li>
<li class="active"><a href="account/users">Users</a></li>
......
src/app/features/admin/partials/admin.html
<topnav toggle="toggleSideMenu()" icon="fa fa-cube" title="Admin" show-menu-btn="!grafana.sidemenu" subnav="true">
<topnav icon="fa fa-cube" title="Admin" subnav="true">
<ul class="nav">
<li class="active"><a href="admin">Settings</a></li>
<li><a href="admin/users">Users</a></li>
......
src/app/features/admin/partials/users.html
<topnav toggle="toggleSideMenu()" icon="fa fa-cube" title="Admin" show-menu-btn="!grafana.sidemenu" subnav="true">
<topnav icon="fa fa-cube" title="Admin" subnav="true">
<ul class="nav">
<li><a href="admin">Settings</a></li>
<li class="active"><a href="admin/users">Users</a></li>
......
src/app/features/dashboard/dashboardCtrl.js
......@@ -61,11 +61,11 @@ function (angular, $, config) {
$scope.setWindowTitleAndTheme = function() {
window.document.title = config.window_title_prefix + $scope.dashboard.title;
$scope.grafana.lightTheme = $scope.dashboard.style === 'light';
$scope.contextSrv.lightTheme = $scope.dashboard.style === 'light';
};
$scope.styleUpdated = function() {
$scope.grafana.lightTheme = $scope.dashboard.style === 'light';
$scope.contextSrv.lightTheme = $scope.dashboard.style === 'light';
};
$scope.add_row = function(dash, row) {
......
src/app/features/panel/soloPanelCtrl.js
......@@ -25,10 +25,12 @@ function (angular, $) {
$scope.initPanelScope = function(dashboard) {
$scope.dashboard = dashboardSrv.create(dashboard.model);
$scope.grafana.style = $scope.dashboard.style;
$scope.contextSrv.lightTheme = $scope.dashboard.style === 'light';
$scope.row = {
height: $(window).height() + 'px',
};
$scope.test = "Hej";
$scope.$index = 0;
$scope.panel = $scope.getPanelById(panelId);
......
src/app/features/profile/partials/profile.html
<topnav toggle="toggleSideMenu()"
title="{{grafana.user.name}}"
<topnav title="{{contextSrv.user.name}}"
section="Profile"
icon="fa fa-user"
show-menu-btn="!grafana.sidemenu">
icon="fa fa-user">
</topnav>
<div class="page-container">
......
src/app/partials/console.html deleted 100644 → 0
<div class="grafana-console" ng-controller="ConsoleCtrl">
<div class="grafana-console-header">
<span class="grafana-console-title large"><i class="fa fa-terminal"></i></span>
</div>
<div class="grafana-console-body">
<div class="grafana-console-item" ng-repeat="item in events" ng-class="{'grafana-console-error': item.error}">
<span class="grafana-console-time gfc-col" ng-bind="item.time"></span>
<span class="grafana-console-type gfc-col">
<span class="label label-info" ng-bind="item.type"></span>
</span>
<span class="gfc-col grafana-console-method" ng-bind="item.method"></span>
<span class="gfc-col grafana-console-title" ng-bind="item.title"></span>
<span class="gfc-col grafana-console-elapsed" ng-bind="item.elapsed"></span>
<span class="gfc-col grafana-console-field1" ng-bind="item.field1"></span>
<span class="gfc-col grafana-console-field2" ng-bind="item.field2"></span>
<span class="gfc-col grafana-console-field3" ng-bind="item.field3"></span>
</div>
</div>
</div>
src/app/partials/dashboard_topnav.html
......@@ -3,7 +3,7 @@
<div class="container-fluid">
<div class="top-nav">
<a class="pointer top-nav-menu-btn" ng-if="!grafana.sidemenu" ng-click="toggleSideMenu()">
<a class="pointer top-nav-menu-btn" ng-if="!contextSrv.sidemenu" ng-click="contextSrv.toggleSideMenu()">
<img class="logo-icon" src="img/fav32.png"></img>
<i class="fa fa-bars"></i>
</a>
......
src/app/partials/dasheditor.html
......@@ -100,7 +100,7 @@
<div class="gf-box-footer">
<div class="grafana-version-info" ng-show="editor.index === 0">
<span class="editor-option small">
Grafana version: {{grafana.version}} &nbsp;&nbsp;
Grafana version: {{contextSrv.version}} &nbsp;&nbsp;
</span>
<span grafana-version-check>
</span>
......
src/app/partials/navbar.html deleted 100644 → 0
<div class="navbar navbar-static-top">
<div class="navbar-inner">
<div class="container-fluid">
<topnav toggle="toggleSideMenu()"
title="{{pageTitle}}"
icon="{{pageIcon}}"
section="{{pageSection}}"
show-menu-btn="!grafana.sidemenu">
</topnav>
</div>
</div>
</div>
src/app/partials/sidemenu.html
......@@ -2,7 +2,7 @@
<div ng-controller="SideMenuCtrl" ng-init="init()">
<ul class="sidemenu">
<li style="margin-bottom: 2px;">
<a class="pointer sidemenu-top-btn" ng-click="toggleSideMenu()">
<a class="pointer sidemenu-top-btn" ng-click="contextSrv.toggleSideMenu()">
<img class="logo-icon" src="img/fav32.png"></img>
<i class="pull-right fa fa-angle-left"></i>
</a>
......@@ -15,20 +15,20 @@
</a>
</li>
<li ng-if="grafana.user.isSignedIn" style="margin-top:50px">
<li ng-if="contextSrv.user.isSignedIn" style="margin-top:50px">
<a href="profile" class="sidemenu-item sidemenu-user">
<img ng-src="{{grafana.user.gravatarUrl}}">
<span class="sidemenu-item-text">{{grafana.user.name}}</a>
<img ng-src="{{contextSrv.user.gravatarUrl}}">
<span class="sidemenu-item-text">{{contextSrv.user.name}}</a>
</a>
</li>
<li ng-if="grafana.user.isSignedIn">
<li ng-if="contextSrv.user.isSignedIn">
<a href="logout" class="sidemenu-item" target="_self">
<span class="sidemenu-item-text no-icon">Sign out</span>
</a>
</li>
<li ng-if="!grafana.user.isSignedIn" style="margin-top:50px">
<li ng-if="!contextSrv.user.isSignedIn" style="margin-top:50px">
<a href="/login" class="sidemenu-item" target="_self">
<span class="sidemenu-icon"><i class="fa fa-sign-in"></i></span>
<span class="sidemenu-item-text">Sign in</span>
......
src/app/services/all.js
......@@ -2,7 +2,7 @@ define([
'./alertSrv',
'./utilSrv',
'./datasourceSrv',
'./userSrv',
'./contextSrv',
'./timer',
'./keyboardManager',
'./popoverSrv',
......
src/app/services/contextSrv.js 0 → 100644
define([
'angular',
'lodash',
'store',
],
function (angular, _, store) {
'use strict';
var module = angular.module('grafana.services');
module.service('contextSrv', function(grafanaVersion, $rootScope, $timeout) {
var self = this;
function User() {
if (window.grafanaBootData.user) {
_.extend(this, window.grafanaBootData.user);
}
}
this.version = grafanaVersion;
this.lightTheme = false;
this.user = new User();
this.sidemenu = store.getBool('grafana.sidemenu');
// events
$rootScope.$on('toggle-sidemenu', function() {
self.toggleSideMenu();
});
this.hasRole = function(role) {
return this.user.accountRole === role;
};
this.setSideMenuState = function(state) {
this.sidemenu = state;
store.set('grafana.sidemenu', state);
};
this.toggleSideMenu = function() {
this.setSideMenuState(!this.sidemenu);
$timeout(function() {
$rootScope.$broadcast("render");
}, 50);
};
});
});
src/test/specs/helpers.js
......@@ -34,7 +34,7 @@ define([
return inject(function($controller, $rootScope, $q, $location) {
self.scope = $rootScope.$new();
self.$location = $location;
self.scope.grafana = {};
self.scope.contextSrv = {};
self.scope.panel = {};
self.scope.row = { panels:[] };
self.scope.dashboard = {};
......
src/views/index.html
......@@ -20,16 +20,16 @@
<script src="[[.AppSubUrl]]/public/app/components/require.backend.js"></script>
<!-- endbuild -->
<script>require(['app'], function (app) { app.boot(); })</script>
</head>
<body ng-cloak ng-controller="GrafanaCtrl" ng-class="{'sidemenu-open': grafana.sidemenu}">
<body ng-cloak ng-controller="GrafanaCtrl" ng-class="{'sidemenu-open': contextSrv.sidemenu}">
<link rel="stylesheet" href="[[.AppSubUrl]]/css/grafana.light.min.css" ng-if="grafana.lightTheme">
<div class="sidemenu-canvas">
<aside class="sidemenu-wrapper" ng-if="grafana.sidemenu">
<aside class="sidemenu-wrapper" ng-if="contextSrv.sidemenu">
<div ng-include="'app/partials/sidemenu.html'"></div>
</aside>
......@@ -55,5 +55,9 @@
user:[[.User]],
settings: [[.Settings]],
};
require(['app'], function (app) {
app.boot();
})
</script>
</html>
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