diff --git a/css/backoffice/pages/_impact-analysis.scss b/css/backoffice/pages/_impact-analysis.scss index e571ae0a4..9357552d6 100644 --- a/css/backoffice/pages/_impact-analysis.scss +++ b/css/backoffice/pages/_impact-analysis.scss @@ -3,6 +3,9 @@ $ibo-impact-analysis--graph-zoom-slider--width: 10em !default; $ibo-impact-analysis--graph-zoom-plus-minus--margin-x: 0.5em !default; +$ibo-simple-graph--margin-top: 10px !default; +$ibo-simple-graph--border-radius: 5px !default; +$ibo-simple-graph--hover--border-color: 10px !default; $ibo-simple-graph--grouping-threshold-additional-context--container--margin-right: 0.3em !default; $ibo-simple-graph--grouping-threshold-additional-context--content--margin-right: 1em !default; @@ -13,7 +16,15 @@ $ibo-display-graph--search-box--criterion--content--padding-x: 15px !default; $ibo-display-graph--search-box--criterion--content--checkbox--margin-right: 10px !default; +.itop-simple-graph { + margin-top: $ibo-simple-graph--margin-top; + border: 1px dotted transparent; + border-radius: $ibo-simple-graph--border-radius; + &.ibo-has-focus { + border: 1px dotted $ibo-simple-graph--hover--border-color; + } +} .graph_zoom { display: flex; float: right; diff --git a/js/simple_graph.js b/js/simple_graph.js index 614cacda1..8282fa13d 100644 --- a/js/simple_graph.js +++ b/js/simple_graph.js @@ -46,7 +46,10 @@ $(function() additional_contexts: [], context_key: '' }, - + css_classes: + { + has_focus: 'ibo-has-focus' + }, // the constructor _create: function() { @@ -85,9 +88,18 @@ $(function() } $(window).bind('resized', function() { var that = me; window.setTimeout(function() { that._on_resize(); }, 50); } ); $('#dh_flash').bind('toggle_complete', function() { var that = me; window.setTimeout(function() { that._on_resize(); }, 50); } ); - this.element.bind('mousewheel', function(event, delta, deltaX, deltaY) { + this.element.on('mousewheel', function(event, delta, deltaX, deltaY) { return me._on_mousewheel(event, delta, deltaX, deltaY); }); + $(document).on('click', function (e) { + if ($(e.target).closest(me.element).length === 0) { + me.element.removeClass(me.css_classes.has_focus); + } + else + { + me.element.addClass(me.css_classes.has_focus); + } + }); if (this.options.source_url != null) { this.load_from_url(this.options.source_url); @@ -677,9 +689,12 @@ $(function() }, _on_mousewheel: function(event, delta, deltaX, deltaY) { - var fStep = 0.25*delta; - var sId = this.element.attr('id'); - $('#'+sId+'_zoom').slider('value', fStep + $('#'+sId+'_zoom').slider('value')); + if(this.element.hasClass(this.css_classes.has_focus)) + { + var fStep = 0.25*delta; + var sId = this.element.attr('id'); + $('#'+sId+'_zoom').slider('value', fStep + $('#'+sId+'_zoom').slider('value')); + } }, _on_resize: function() {