cytoscape-qtip - npm Package Compare versions

Comparing version 2.4.0 to 2.5.0

cytoscape-qtip.js

@@ -180,2 +180,7 @@ /*!
 
+    $qtipContainer.css({
+      'z-index': -1,
+      'position': 'absolute'
+    });
+
     function generateOpts( target, passedOpts ){
@@ -206,6 +211,2 @@ var qtip = target.scratch().qtip;
 
-      if( isUndef(adjust.cyAdjustToEleBB) ){
-        adjust.cyAdjustToEleBB = true;
-      }
-
       // default show event
@@ -243,2 +244,43 @@ opts.show = opts.show || {};
 
+    function updatePosition(ele, qtip, evt){
+      var e = evt;
+      var isCy = isFunction( ele.pan );
+      var isEle = !isCy;
+      var isNode = isEle && ele.isNode();
+      var cy = isCy ? ele : ele.cy();
+      var cOff = cy.container().getBoundingClientRect();
+      var pos = isNode ? ele.renderedPosition() : ( e ? e.cyRenderedPosition : undefined );
+      if( !pos || pos.x == null || isNaN(pos.x) ){ return; }
+
+      var bb = isNode ? ele.renderedBoundingBox({
+        includeLabels: false
+      }) : {
+        x1: pos.x - 1,
+        x2: pos.x + 1,
+        w: 3,
+        y1: pos.y - 1,
+        y2: pos.y + 1,
+        h: 3
+      };
+
+      if( qtip.$domEle.parent().length === 0 ){
+        qtip.$domEle.appendTo(document.body);
+      }
+
+      qtip.$domEle.css({
+        'width': bb.w,
+        'height': bb.h,
+        'top': bb.y1 + cOff.top + window.pageYOffset,
+        'left': bb.x1 + cOff.left + window.pageXOffset,
+        'position': 'absolute',
+        'pointer-events': 'none',
+        'background': 'red',
+        'z-index': 99999999,
+        'opacity': 0.5,
+        'visibility': 'hidden'
+      });
+
+      qtip.api.set('position.target', qtip.$domEle);
+    }
+
     $$('collection', 'qtip', function( passedOpts ){
@@ -259,3 +301,2 @@ var eles = this;
 
-
         qtip.$domEle.qtip( opts );
@@ -265,43 +306,6 @@ var qtipApi = qtip.api = qtip.$domEle.qtip('api'); // save api ref
 
-        var updatePosition = function(e){
-          var cOff = container.getBoundingClientRect();
-          var pos = ele.renderedPosition() || ( e ? e.cyRenderedPosition : undefined );
-          if( !pos || pos.x == null || isNaN(pos.x) ){ return; }
+        updatePosition(ele, qtip);
 
-          if( opts.position.adjust.cyAdjustToEleBB && ele.isNode() ){
-            var my = opts.position.my.toLowerCase();
-            var at = opts.position.at.toLowerCase();
-            var z = cy.zoom();
-            var w = ele.outerWidth() * z;
-            var h = ele.outerHeight() * z;
-
-            if( at.match('top') ){
-              pos.y -= h/2;
-            } else if( at.match('bottom') ){
-              pos.y += h/2;
-            }
-
-            if( at.match('left') ){
-              pos.x -= w/2;
-            } else if( at.match('right') ){
-              pos.x += w/2;
-            }
-
-            if( isNumber(adjNums.x) ){
-              pos.x += adjNums.x;
-            }
-
-            if( isNumber(adjNums.y) ){
-              pos.y += adjNums.y;
-            }
-          }
-
-          qtipApi.set('position.adjust.x', cOff.left + pos.x + window.pageXOffset);
-          qtipApi.set('position.adjust.y', cOff.top + pos.y + window.pageYOffset);
-        };
-        updatePosition();
-
         ele.on( opts.show.event, function(e){
-          updatePosition(e);
-
+          updatePosition(ele, qtip, e);
           qtipApi.show();
@@ -322,3 +326,3 @@ } );
           cy.on('pan zoom', debounce(function(e){
-            updatePosition(e);
+            updatePosition(ele, qtip, e);
 
@@ -352,14 +356,5 @@ qtipApi.reposition();
 
-      var updatePosition = function(e){
-        var cOff = container.getBoundingClientRect();
-        var pos = e.cyRenderedPosition;
-        if( !pos || pos.x == null || isNaN(pos.x) ){ return; }
-
-        qtipApi.set('position.adjust.x', cOff.left + pos.x + window.pageXOffset);
-        qtipApi.set('position.adjust.y', cOff.top + pos.y + window.pageYOffset);
-      };
-
       cy.on( opts.show.event, function(e){
         if( !opts.show.cyBgOnly || (opts.show.cyBgOnly && e.cyTarget === cy) ){
-          updatePosition(e);
+          updatePosition(cy, qtip, e);
 
@@ -366,0 +361,0 @@ qtipApi.show();

package.json

 {
   "name": "cytoscape-qtip",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "description": "A Cytoscape.js extension that wraps the qTip jQuery library",
@@ -5,0 +5,0 @@ "main": "cytoscape-qtip.js",

README.md

@@ -96,4 +96,2 @@ cytoscape-qtip
 
- * `options.position.adjust.cyAdjustToEleBB` : When `true` (default), applies additional manual adjustments to make the positioning mechanism account for node sizes and `options.position.adjust.x` and `options.position.adjust.y` values.
-
 ## Publishing instructions
@@ -100,0 +98,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

36479

decreased by-1.45%

Number of lines in readme file

100

decreased by-1.96%

No dependency changes