# HG changeset patch
# User ymh <ymh.work@gmail.com>
# Date 1483641293 -3600
# Node ID e388117572d868c238495a7238ecca60b28daa03
# Parent  eaaa1efce3966a70f83e834634d0fb2a89ff5090
Improve display of editor tooltip. Add a vertical scroll if they too tall.

diff -r eaaa1efce396 -r e388117572d8 client/js/main.js
--- a/client/js/main.js	Thu Jan 05 16:26:07 2017 +0100
+++ b/client/js/main.js	Thu Jan 05 19:34:53 2017 +0100
@@ -550,10 +550,22 @@
         },
         /* Drawing an edit box with an arrow and positioning the edit box according to the position of the node/edge being edited
          * Called by Rkns.Renderer.NodeEditor and Rkns.Renderer.EdgeEditor */
-        drawEditBox: function(_options, _coords, _path, _xmargin, _selector) {
+        drawEditBox: function(_options, _coords, _path, _xmargin, _selector, _renkan) {
             _selector.css({
                 width: (_options.tooltip_width - 2 * _options.tooltip_padding)
             });
+            
+            var rect = _selector[0].getBoundingClientRect();
+            var container_rect = _renkan.$[0].getBoundingClientRect();
+
+            if(rect.bottom > (container_rect.bottom - 2 * _options.tooltip_padding - 10)) {
+                _selector.css({
+                    'overflow-x': 'hidden',
+                    'overflow-y': 'scroll',
+                    'max-height':(container_rect.bottom - 2 * _options.tooltip_padding - 10 - rect.top) + 'px'
+                });
+            }
+
             var _height = _selector.outerHeight() + 2 * _options.tooltip_padding,
                 _isLeft = (_coords.x < paper.view.center.x ? 1 : -1),
                 _left = _coords.x + _isLeft * (_xmargin + _options.tooltip_arrow_length),
@@ -575,10 +587,12 @@
             _path.segments[1].point.y = _coords.y - _options.tooltip_arrow_width / 2;
             _path.segments[6].point.y = _coords.y + _options.tooltip_arrow_width / 2;
             _path.fillColor = new paper.Color(new paper.Gradient([_options.tooltip_top_color, _options.tooltip_bottom_color]), [0, _top], [0, _bottom]);
+
             _selector.css({
                 left: (_options.tooltip_padding + Math.min(_left, _right)),
                 top: (_options.tooltip_padding + _top)
             });
+            
             return _path;
         },
         // from http://stackoverflow.com/a/6444043
diff -r eaaa1efce396 -r e388117572d8 client/js/renderer/edgeeditor.js
--- a/client/js/renderer/edgeeditor.js	Thu Jan 05 16:26:07 2017 +0100
+++ b/client/js/renderer/edgeeditor.js	Thu Jan 05 19:34:53 2017 +0100
@@ -178,7 +178,7 @@
         redraw: function() {
             if (this.options.popup_editor){
                 var _coords = this.source_representation.paper_coords;
-                Utils.drawEditBox(this.options, _coords, this.editor_block, 5, this.editor_$);
+                Utils.drawEditBox(this.options, _coords, this.editor_block, 5, this.editor_$, this.renderer.renkan);
             }
             this.editor_$.show();
             paper.view.draw();
diff -r eaaa1efce396 -r e388117572d8 client/js/renderer/nodeeditor.js
--- a/client/js/renderer/nodeeditor.js	Thu Jan 05 16:26:07 2017 +0100
+++ b/client/js/renderer/nodeeditor.js	Thu Jan 05 19:34:53 2017 +0100
@@ -307,7 +307,7 @@
         redraw: function() {
             if (this.options.popup_editor){
                 var _coords = this.source_representation.paper_coords;
-                Utils.drawEditBox(this.options, _coords, this.editor_block, this.source_representation.circle_radius * 0.75, this.editor_$);
+                Utils.drawEditBox(this.options, _coords, this.editor_block, this.source_representation.circle_radius * 0.75, this.editor_$, this.renderer.renkan);
             }
             this.editor_$.show();
             paper.view.draw();