diff --git a/IPython/frontend/html/notebook/static/css/tooltip.css b/IPython/frontend/html/notebook/static/css/tooltip.css index 0f20808..054d050 100644 --- a/IPython/frontend/html/notebook/static/css/tooltip.css +++ b/IPython/frontend/html/notebook/static/css/tooltip.css @@ -50,9 +50,21 @@ .bigtooltip { overflow: auto; height: 200px; + -webkit-transition-property: height; + -webkit-transition-duration: 1s; + -moz-transition-property: height; + -moz-transition-duration: 1s; + transition-property: height; + transition-duration: 1s; } /*properties of tooltip before "expand"*/ .smalltooltip { + -webkit-transition-property: height; + -webkit-transition-duration: 1s; + -moz-transition-property: height; + -moz-transition-duration: 1s; + transition-property: height; + transition-duration: 1s; text-overflow: ellipsis; overflow: hidden; height: 80px; @@ -64,18 +76,6 @@ right: 0px; } .tooltip { - -webkit-transition: all 0.8s ease; - -moz-transition: all 0.8s ease; - -ms-transition: all 0.8s ease; - -o-transition: all 0.8s ease; - /*transition when "expand"ing tooltip */ - - -webkit-transition-property: height; - -webkit-transition-duration: 1s; - -moz-transition-property: height; - -moz-transition-duration: 1s; - transition-property: height; - transition-duration: 1s; max-width: 700px; border-radius: 10px 10px 10px 10px; box-shadow: 3px 3px 5px #999; diff --git a/IPython/frontend/html/notebook/static/js/codecell.js b/IPython/frontend/html/notebook/static/js/codecell.js index cc47079..50241d9 100644 --- a/IPython/frontend/html/notebook/static/js/codecell.js +++ b/IPython/frontend/html/notebook/static/js/codecell.js @@ -42,6 +42,7 @@ var IPython = (function (IPython) { readOnly: this.read_only, onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this) }); + cm = this.code_mirror input.append(input_area); var output = $('
').addClass('output vbox'); cell.append(input).append(output); @@ -60,7 +61,7 @@ var IPython = (function (IPython) { } else { // Will set a timer to request tooltip in `time` that.tooltip_timeout = setTimeout(function(){ - IPython.notebook.request_tool_tip(that, pre_cursor) + IPython.tooltip.request(that, pre_cursor) },time); } }; @@ -76,7 +77,7 @@ var IPython = (function (IPython) { } // note that we are comparing and setting the time to wait at each key press. - // a better wqy might be to generate a new function on each time change and + // a better way might be to generate a new function on each time change and // assign it to CodeCell.prototype.request_tooltip_after_time var tooltip_wait_time = this.notebook.time_before_tooltip; var tooltip_on_tab = this.notebook.tooltip_on_tab; @@ -159,89 +160,8 @@ var IPython = (function (IPython) { return false; }; - CodeCell.prototype.finish_tooltip = function (reply) { - IPython.tooltip.show(reply,this.code_mirror.cursorCoords()); - return; - // Extract call tip data; the priority is call, init, main. - defstring = reply.call_def; - if (defstring == null) { defstring = reply.init_definition; } - if (defstring == null) { defstring = reply.definition; } - - docstring = reply.call_docstring; - if (docstring == null) { docstring = reply.init_docstring; } - if (docstring == null) { docstring = reply.docstring; } - if (docstring == null) { docstring = ""; } - - name=reply.name; - - var that = this; - var tooltip = $('
').attr('id', 'tooltip').addClass('tooltip'); - // remove to have the tooltip not Limited in X and Y - tooltip.addClass('smalltooltip'); - var pre=$('
').html(utils.fixConsole(docstring));
-        var expandlink=$('').attr('href',"#");
-            expandlink.addClass("ui-corner-all"); //rounded corner
-            expandlink.attr('role',"button");
-            //expandlink.addClass('ui-button');
-            //expandlink.addClass('ui-state-default');
-        var expandspan=$('').text('Expand');
-            expandspan.addClass('ui-icon');
-            expandspan.addClass('ui-icon-plus');
-        expandlink.append(expandspan);
-        expandlink.attr('id','expanbutton');
-        expandlink.click(function(){
-            tooltip.removeClass('smalltooltip');
-            tooltip.addClass('bigtooltip');
-            $('#expanbutton').remove();
-            setTimeout(function(){that.code_mirror.focus();}, 50);
-        });
-        var morelink=$('').attr('href',"#");
-            morelink.attr('role',"button");
-            morelink.addClass('ui-button');
-            //morelink.addClass("ui-corner-all"); //rounded corner
-            //morelink.addClass('ui-state-default');
-        var morespan=$('').text('Open in Pager');
-            morespan.addClass('ui-icon');
-            morespan.addClass('ui-icon-arrowstop-l-n');
-        morelink.append(morespan);
-        morelink.click(function(){
-            var msg_id = IPython.notebook.kernel.execute(name+"?");
-            IPython.notebook.msg_cell_map[msg_id] = IPython.notebook.get_selected_cell().cell_id;
-            IPython.tooltip.remove_and_cancel_tooltip();
-            setTimeout(function(){that.code_mirror.focus();}, 50);
-        });
-
-        var closelink=$('').attr('href',"#");
-            closelink.attr('role',"button");
-            closelink.addClass('ui-button');
-            //closelink.addClass("ui-corner-all"); //rounded corner
-            //closelink.adClass('ui-state-default'); // grey background and blue cross
-        var closespan=$('').text('Close');
-            closespan.addClass('ui-icon');
-            closespan.addClass('ui-icon-close');
-        closelink.append(closespan);
-        closelink.click(function(){
-            IPython.tooltip.remove_and_cancel_tooltip();
-            setTimeout(function(){that.code_mirror.focus();}, 50);
-            });
-        //construct the tooltip
-        tooltip.append(closelink);
-        tooltip.append(expandlink);
-        tooltip.append(morelink);
-        if(defstring){
-            defstring_html = $('
').html(utils.fixConsole(defstring));
-            tooltip.append(defstring_html);
-        }
-        tooltip.append(pre);
-        var pos = this.code_mirror.cursorCoords();
-        tooltip.css('left',pos.x+'px');
-        tooltip.css('top',pos.yBot+'px');
-        $('body').append(tooltip);
-
-        // issues with cross-closing if multiple tooltip in less than 5sec
-        // keep it comented for now
-        // setTimeout(that.remove_and_cancel_tooltip, 5000);
+        IPython.tooltip.show(reply, this);
     };
 
 
diff --git a/IPython/frontend/html/notebook/static/js/tooltip.js b/IPython/frontend/html/notebook/static/js/tooltip.js
index f6992db..de88531 100644
--- a/IPython/frontend/html/notebook/static/js/tooltip.js
+++ b/IPython/frontend/html/notebook/static/js/tooltip.js
@@ -46,7 +46,7 @@ var IPython = (function (IPython) {
                   text.removeClass('smalltooltip');
                   text.addClass('bigtooltip');
                   $('#expanbutton').addClass('hidden');
-                  //setTimeout(function(){that.code_mirror.focus();}, 50);
+                  that._cmfocus();
               })
             .append(
         $('').text('Expand')
@@ -63,10 +63,10 @@ var IPython = (function (IPython) {
             .addClass('ui-icon-arrowstop-l-n');
         morelink.append(morespan);
         morelink.click(function(){
-            var msg_id = IPython.notebook.kernel.execute(name+"?");
+            var msg_id = IPython.notebook.kernel.execute(that.name+"?");
             IPython.notebook.msg_cell_map[msg_id] = IPython.notebook.get_selected_cell().cell_id;
             that.remove_and_cancel_tooltip();
-            setTimeout(function(){that.code_mirror.focus();}, 50);
+            that._cmfocus();
         });
 
         // close the tooltip
@@ -125,10 +125,19 @@ var IPython = (function (IPython) {
         }
     }
 
-    Tooltip.prototype.show = function(reply,pos)
+    Tooltip.prototype.request = function(cell,text)
+    {
+            IPython.notebook.request_tool_tip(cell, text);
+    }
+
+    Tooltip.prototype.show = function(reply, codecell)
     {
         // move the bubble if it is not hidden
         // otherwise fade it
+        var editor = codecell.code_mirror;
+        this.name = reply.name;
+        this.code_mirror = editor;
+        var pos = editor.cursorCoords();
         var xinit = pos.x;
         var xinter = xinit/1000*600;
         var posarrowleft = xinit - xinter;
@@ -178,6 +187,12 @@ var IPython = (function (IPython) {
         setTimeout(function(){that.code_mirror.focus();}, 50);
     }
 
+    Tooltip.prototype._cmfocus = function()
+    {
+        var cm = this.code_mirror;
+        setTimeout(function(){cm.focus();}, 50);
+    }
+
 
     IPython.Tooltip = Tooltip;
 
diff --git a/IPython/frontend/html/notebook/static/less/tooltip.less b/IPython/frontend/html/notebook/static/less/tooltip.less
index ed8651a..bc9b5d6 100644
--- a/IPython/frontend/html/notebook/static/less/tooltip.less
+++ b/IPython/frontend/html/notebook/static/less/tooltip.less
@@ -26,6 +26,16 @@
 @borderwidth : 1px;
 @textColor : #000;
 
+// smoth height adaptation
+.smoothheight(@t:1s) {
+    -webkit-transition-property: height;
+    -webkit-transition-duration: 1s;
+    -moz-transition-property: height;
+    -moz-transition-duration: 1s;
+    transition-property: height;
+    transition-duration: 1s;
+}
+
 @-moz-keyframes fadeOut {
     from {opacity:1;}
     to {opacity:0;}
@@ -83,10 +93,12 @@
 .bigtooltip {
     overflow: auto;
     height: 200px;
+    .smoothheight();
 }
 
 /*properties of tooltip before "expand"*/
 .smalltooltip{
+    .smoothheight();
     text-overflow: ellipsis;
     overflow: hidden;
     height:80px;
@@ -103,17 +115,6 @@
 }
 
 .tooltip {
-    -webkit-transition: all 0.8s ease;
-    -moz-transition:    all 0.8s ease;
-    -ms-transition:     all 0.8s ease;
-    -o-transition:      all 0.8s ease;
-    /*transition when "expand"ing tooltip */
-    -webkit-transition-property: height;
-    -webkit-transition-duration: 1s;
-    -moz-transition-property: height;
-    -moz-transition-duration: 1s;
-    transition-property: height;
-    transition-duration: 1s;
     max-width:700px;
     border-radius: 10px 10px 10px 10px;
     box-shadow: 3px 3px 5px #999;
@@ -174,5 +175,4 @@
     -moz-animation: fadeOut 800ms;
     animation: fadeOut 800ms;
     opacity : 0;
-
 }