diff --git a/pkg/api/index.go b/pkg/api/index.go
index 5b0c5df2c29..723f1bc74b1 100644
--- a/pkg/api/index.go
+++ b/pkg/api/index.go
@@ -61,9 +61,6 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) {
},
})
- // data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{Text: "Playlists", Icon: "fa fa-fw fa-list", Url: setting.AppSubUrl + "/playlists"})
- // data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{Text: "Snapshots", Icon: "fa-fw icon-gf icon-gf-snapshot", Url: setting.AppSubUrl + "/dashboard/snapshots"})
-
if c.OrgRole == m.ROLE_ADMIN {
data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{
Text: "Data Sources",
diff --git a/public/app/core/components/colorpicker/colorpicker.ts b/public/app/core/components/colorpicker/colorpicker.ts
new file mode 100644
index 00000000000..9c879b867ff
--- /dev/null
+++ b/public/app/core/components/colorpicker/colorpicker.ts
@@ -0,0 +1,81 @@
+///
+
+import config from 'app/core/config';
+import _ from 'lodash';
+import $ from 'jquery';
+import coreModule from 'app/core/core_module';
+
+var template = `
+
+
+
+
+
+
+ Y Axis:
+
+ Left
+
+
+ Right
+
+
+
+
+
+
+
+
+`;
+
+export class ColorPickerCtrl {
+ colors: any;
+ autoClose: boolean;
+ series: any;
+ showAxisControls: boolean;
+
+ /** @ngInject */
+ constructor(private $scope, private $rootScope) {
+ this.colors = $rootScope.colors;
+ this.autoClose = $scope.autoClose;
+ this.series = $scope.series;
+ }
+
+ toggleAxis(yaxis) {
+ this.$scope.toggleAxis();
+
+ if (!this.$scope.autoClose) {
+ this.$scope.dismiss();
+ }
+ }
+
+ colorSelected(color) {
+ this.$scope.colorSelected(color);
+ if (!this.$scope.autoClose) {
+ this.$scope.dismiss();
+ }
+ }
+
+ close() {
+ this.$scope.dismiss();
+ }
+}
+
+export function colorPicker() {
+ return {
+ restrict: 'E',
+ controller: ColorPickerCtrl,
+ bindToController: true,
+ controllerAs: 'ctrl',
+ template: template,
+ };
+}
+
+coreModule.directive('gfColorPicker', colorPicker);
diff --git a/public/app/core/core.ts b/public/app/core/core.ts
index e9b5e3c71a3..c7c917378c7 100644
--- a/public/app/core/core.ts
+++ b/public/app/core/core.ts
@@ -25,6 +25,7 @@ import {grafanaAppDirective} from './components/grafana_app';
import {sideMenuDirective} from './components/sidemenu/sidemenu';
import {searchDirective} from './components/search/search';
import {popoverDirective} from './components/popover/popover';
+import {colorPicker} from './components/colorpicker/colorpicker';
import {navbarDirective} from './components/navbar/navbar';
import {arrayJoin} from './directives/array_join';
import 'app/core/controllers/all';
@@ -40,5 +41,6 @@ export {
sideMenuDirective,
navbarDirective,
searchDirective,
+ colorPicker,
popoverDirective
};
diff --git a/public/app/core/services/popover_srv.ts b/public/app/core/services/popover_srv.ts
index 64ff1b7af11..4711dc1b23c 100644
--- a/public/app/core/services/popover_srv.ts
+++ b/public/app/core/services/popover_srv.ts
@@ -4,45 +4,51 @@ import config from 'app/core/config';
import _ from 'lodash';
import $ from 'jquery';
import coreModule from 'app/core/core_module';
+import Drop from 'tether-drop';
/** @ngInject **/
-function popoverSrv($templateCache, $timeout, $q, $http, $compile) {
-
- this.getTemplate = function(url) {
- return $q.when($templateCache.get(url) || $http.get(url, {cache: true}));
- };
+function popoverSrv($compile, $rootScope) {
this.show = function(options) {
+ var popoverScope = _.extend($rootScope.$new(true), options.model);
+ var drop;
- options.scope.dismiss = function() {
- var popover = options.element.data('popover');
- if (popover) {
- popover.destroy();
- }
- options.scope.$destroy();
+ function destroyDrop() {
+ setTimeout(function() {
+ if (drop.tether) {
+ drop.destroy();
+ }
+ });
+ }
+
+ popoverScope.dismiss = function() {
+ popoverScope.$destroy();
+ destroyDrop();
};
- this.getTemplate(options.templateUrl).then(function(result) {
- $timeout(function() {
- var template = _.isString(result) ? result : result.data;
+ var contentElement = document.createElement('div');
+ contentElement.innerHTML = options.template;
+ $compile(contentElement)(popoverScope);
- options.element.popover({
- content: template,
- placement: options.placement || 'bottom',
- html: true
- });
-
- var popover = options.element.data('popover');
- popover.hasContent = function () {
- return template;
- };
-
- popover.toggle();
- popover.scope = options.scope;
- $compile(popover.$tip)(popover.scope);
- }, 1);
+ drop = new Drop({
+ target: options.element,
+ content: contentElement,
+ position: options.position,
+ classes: 'drop-popover',
+ openOn: options.openOn || 'hover',
+ hoverCloseDelay: 200,
+ tetherOptions: {
+ constraints: [{to: 'window', pin: true, attachment: "both"}]
+ }
});
+
+ drop.on('close', () => {
+ popoverScope.dismiss({fromDropClose: true});
+ destroyDrop();
+ });
+
+ drop.open();
};
}
diff --git a/public/app/features/datasources/partials/edit.html b/public/app/features/datasources/partials/edit.html
index 7dff11ac1c2..c74ac22827f 100644
--- a/public/app/features/datasources/partials/edit.html
+++ b/public/app/features/datasources/partials/edit.html
@@ -15,11 +15,10 @@