diff --git a/public/app/plugins/panel/graph/graph.js b/public/app/plugins/panel/graph/graph.js index 23c9cd65a9f..13dcf76857d 100755 --- a/public/app/plugins/panel/graph/graph.js +++ b/public/app/plugins/panel/graph/graph.js @@ -169,7 +169,6 @@ function (angular, $, moment, _, kbn, GraphTooltip) { var right = panel.yaxes[1]; if (left.show && left.label) { gridMargin.left = 20; } if (right.show && right.label) { gridMargin.right = 20; } - } // Function for rendering panel diff --git a/public/app/plugins/panel/graph/jquery.flot.alerts.ts b/public/app/plugins/panel/graph/jquery.flot.alerts.ts index 65229b31065..1ce4783cdf9 100644 --- a/public/app/plugins/panel/graph/jquery.flot.alerts.ts +++ b/public/app/plugins/panel/graph/jquery.flot.alerts.ts @@ -22,6 +22,17 @@ function getHandleTemplate(type, op, value) { `; } +var dragGhostElem = document.createElement('div'); + +function dragStartHandler(evt) { + evt.dataTransfer.setDragImage(dragGhostElem, -99999, -99999); +} + +function dragEndHandler() { + console.log('drag end'); +} + +var past; function drawAlertHandles(plot) { var options = plot.getOptions(); @@ -36,7 +47,7 @@ function drawAlertHandles(plot) { var height = plot.height(); function renderHandle(type, model) { - var $handle = $placeholder.find(`.alert-handle-${type}`); + var $handle = $placeholder.find(`.alert-handle-wrapper--${type}`); if (!_.isNumber(model.level)) { $handle.remove(); @@ -44,15 +55,19 @@ function drawAlertHandles(plot) { } if ($handle.length === 0) { + console.log('not found'); $handle = $(getHandleTemplate(type, model.op, model.level)); + $handle.attr('draggable', true); + $handle.bind('dragend', dragEndHandler); + $handle.bind('dragstart', dragStartHandler); $placeholder.append($handle); + console.log('registering drag events'); } else { + console.log('reusing!'); $handle.html(getHandleTemplate(type, model.op, model.level)); } var levelCanvasPos = plot.p2c({x: 0, y: model.level}); - console.log('canvas level pos', levelCanvasPos.top); - var levelTopPos = Math.min(Math.max(levelCanvasPos.top, 0), height) - 6; $handle.css({top: levelTopPos}); } @@ -62,6 +77,7 @@ function drawAlertHandles(plot) { } function shutdown() { + console.log('shutdown'); } function init(plot, classes) { diff --git a/public/app/plugins/panel/graph/partials/tab_alerting.html b/public/app/plugins/panel/graph/partials/tab_alerting.html index a81bbe2f996..a90c3b78209 100644 --- a/public/app/plugins/panel/graph/partials/tab_alerting.html +++ b/public/app/plugins/panel/graph/partials/tab_alerting.html @@ -36,28 +36,28 @@ -