bootstrap-dropdown-hover - npm Package Compare versions

Comparing version 1.0.0 to 4.0.0

bootstrap-dropdown-hover.jquery.json

@@ -11,3 +11,3 @@ {
     ],
-    "version": "1.0.0",
+    "version": "4.0.0",
     "author": {
@@ -14,0 +14,0 @@ "name": "István Ujj-Mészáros",

bower.json

 {
   "name": "bootstrap-dropdown-hover",
-  "version": "1.0.0",
-  "homepage": "http://www.virtuosoft.eu/code/bootstrap-dropdown-hover/",
+  "version": "4.0.0",
+  "homepage": "https://www.virtuosoft.eu/code/bootstrap-dropdown-hover/",
   "authors": [
-    {
-      "name": "István Ujj-Mészáros",
-      "url": "https://github.com/istvan-ujjmeszaros"
-    }
+    "István Ujj-Mészáros <[e-mail]>"
   ],
   "description": "Open dropdown menus on mouse hover, the proper way.",
-  "main": "src/jquery.bootstrap-dropdown-hover.js",
+  "main": "dist/jquery.bootstrap-dropdown-hover.js",
   "dependencies": {
@@ -23,3 +20,17 @@ "jquery": "~1.11.0",
   ],
-  "license": "Apache License v2.0"
+  "license": "Apache-2.0",
+  "moduleType": [
+    "node"
+  ],
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/istvan-ujjmeszaros/bootstrap-dropdown-hover.git"
+  }
 }

composer.json

@@ -6,4 +6,4 @@ {
     "description": "Open dropdown menus on mouse hover, the proper way.",
-    "homepage": "http://www.virtuosoft.eu/code/bootstrap-dropdown-hover/",
-    "version": "1.0.0",
+    "homepage": "https://www.virtuosoft.eu/code/bootstrap-dropdown-hover/",
+    "version": "4.0.0",
     "authors": [
@@ -10,0 +10,0 @@ {

CONTRIBUTING.md

@@ -0,0 +0,0 @@ # Contributing

dist/jquery.bootstrap-dropdown-hover.js

 /*
- *  Bootstrap Dropdown Hover - v1.0.0
+ *  Bootstrap Dropdown Hover - v4.0.0
  *  Open dropdown menus on mouse hover, the proper way.
@@ -9,3 +9,22 @@ *  http://www.virtuosoft.eu/code/bootstrap-dropdown-hover/
  */
-;(function ($, window, document, undefined) {
+(function(factory) {
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else if (typeof module === 'object' && module.exports) {
+    module.exports = function(root, jQuery) {
+      if (jQuery === undefined) {
+        if (typeof window !== 'undefined') {
+          jQuery = require('jquery');
+        }
+        else {
+          jQuery = require('jquery')(root);
+        }
+      }
+      factory(jQuery);
+      return jQuery;
+    };
+  } else {
+    factory(jQuery);
+  }
+}(function($) {
   var pluginName = 'bootstrapDropdownHover',
@@ -22,2 +41,3 @@ defaults = {
       _hardOpened = false,
+      _touchstartDetected = false,
       _mouseDetected = false;
@@ -33,8 +53,29 @@
   }
-  
+
   function bindEvents(dropdown) {
+    var $body = $('body');
+
+    $body.one('touchstart.dropdownhover', function() {
+      _touchstartDetected = true;
+    });
+
+    $body.one('mouseenter.dropdownhover', function() {
+      // touchstart fires before mouseenter on touch devices
+      if (!_touchstartDetected) {
+        _mouseDetected = true;
+      }
+    });
+
     $('.dropdown-toggle, .dropdown-menu', dropdown.element.parent()).on('mouseenter.dropdownhover', function () {
-      _mouseDetected = true;
+      // seems to be a touch device
+      if(_mouseDetected && !$(this).is(':hover')) {
+        _mouseDetected = false;
+      }
+
+      if (!_mouseDetected) {
+        return;
+      }
+
       clearTimeout(_hideTimeoutHandler);
-      if (!dropdown.element.parent().hasClass('open')) {
+      if (!dropdown.element.parent().is('.open, .show')) {
         _hardOpened = false;
@@ -46,2 +87,6 @@ dropdown.element.dropdown('toggle');
     $('.dropdown-toggle, .dropdown-menu', dropdown.element.parent()).on('mouseleave.dropdownhover', function () {
+      if (!_mouseDetected) {
+        return;
+      }
+
       if (_hardOpened) {
@@ -51,3 +96,3 @@ return;
       _hideTimeoutHandler = setTimeout(function () {
-        if (dropdown.element.parent().hasClass('open')) {
+        if (dropdown.element.parent().is('.open, .show')) {
           dropdown.element.dropdown('toggle');
@@ -59,25 +104,25 @@ }
     dropdown.element.on('click.dropdownhover', function (e) {
-      // do not modify behavior if mouse is not present (touch screens)
       if (!_mouseDetected) {
         return;
       }
-      if (dropdown.settings.clickBehavior === 'default') {
-        return;
-      }
-      if (dropdown.settings.clickBehavior === 'disable') {
-        e.preventDefault();
-        e.stopImmediatePropagation();
-        return;
-      }
-      if (dropdown.settings.clickBehavior === 'sticky') {
-        if (_hardOpened) {
-          _hardOpened = false;
-        }
-        else {
-          _hardOpened = true;
-          if (dropdown.element.parent().hasClass('open')) {
-            e.stopImmediatePropagation();
-            e.preventDefault();
+
+      switch(dropdown.settings.clickBehavior) {
+        case 'default':
+          return;
+        case 'disable':
+          e.preventDefault();
+          e.stopImmediatePropagation();
+          break;
+        case 'sticky':
+          if (_hardOpened) {
+            _hardOpened = false;
           }
-        }
+          else {
+            _hardOpened = true;
+            if (dropdown.element.parent().is('.open, .show')) {
+              e.stopImmediatePropagation();
+              e.preventDefault();
+            }
+          }
+          return;
       }
@@ -91,4 +136,6 @@ });
     $('.dropdown-toggle, .dropdown-menu', dropdown.element.parent()).off('.dropdown');
+    dropdown.element.off('.dropdownhover');
+    $('body').off('.dropdownhover');
   }
-  
+
   BootstrapDropdownHover.prototype = {
@@ -146,2 +193,3 @@ init: function () {
       });
+
       // If the first parameter is a string and it doesn't start with an underscore or "contains" the `init`-function,
@@ -170,2 +218,2 @@ // treat this as a call to a public method.
 
-})(jQuery, window, document);
+}));

dist/jquery.bootstrap-dropdown-hover.min.js

 /*
- *  Bootstrap Dropdown Hover - v1.0.0
+ *  Bootstrap Dropdown Hover - v4.0.0
  *  Open dropdown menus on mouse hover, the proper way.
@@ -9,2 +9,3 @@ *  http://www.virtuosoft.eu/code/bootstrap-dropdown-hover/
  */
-!function(a,b,c,d){function e(b,c){this.element=a(b),this.settings=a.extend({},j,c),this._defaults=j,this._name=i,this.init()}function f(b){a(".dropdown-toggle, .dropdown-menu",b.element.parent()).on("mouseenter.dropdownhover",function(){l=!0,clearTimeout(h),b.element.parent().hasClass("open")||(k=!1,b.element.dropdown("toggle"))}),a(".dropdown-toggle, .dropdown-menu",b.element.parent()).on("mouseleave.dropdownhover",function(){k||(h=setTimeout(function(){b.element.parent().hasClass("open")&&b.element.dropdown("toggle")},b.settings.hideTimeout))}),b.element.on("click.dropdownhover",function(a){return l&&"default"!==b.settings.clickBehavior?"disable"===b.settings.clickBehavior?(a.preventDefault(),void a.stopImmediatePropagation()):void("sticky"===b.settings.clickBehavior&&(k?k=!1:(k=!0,b.element.parent().hasClass("open")&&(a.stopImmediatePropagation(),a.preventDefault())))):void 0})}function g(b){a(".dropdown-toggle, .dropdown-menu",b.element.parent()).off(".dropdownhover"),a(".dropdown-toggle, .dropdown-menu",b.element.parent()).off(".dropdown")}var h,i="bootstrapDropdownHover",j={clickBehavior:"sticky",hideTimeout:200},k=!1,l=!1;e.prototype={init:function(){return this.setClickBehavior(this.settings.clickBehavior),this.setHideTimeout(this.settings.hideTimeout),f(this),this.element},setClickBehavior:function(a){return this.settings.clickBehavior=a,this.element},setHideTimeout:function(a){return this.settings.hideTimeout=a,this.element},destroy:function(){return clearTimeout(h),g(this),this.element.data("plugin_"+i,null),this.element}},a.fn[i]=function(b){var f=arguments;if(b===d||"object"==typeof b)return a.contains(c,a(this)[0])||a('[data-toggle="dropdown"]').each(function(c,d){a(d).bootstrapDropdownHover(b)}),this.each(function(){a(this).hasClass("dropdown-toggle")&&"dropdown"===a(this).data("toggle")?a.data(this,"plugin_"+i)||a.data(this,"plugin_"+i,new e(this,b)):a('[data-toggle="dropdown"]',this).each(function(c,d){a(d).bootstrapDropdownHover(b)})});if("string"==typeof b&&"_"!==b[0]&&"init"!==b){var g;return this.each(function(){var c=a.data(this,"plugin_"+i);c instanceof e&&"function"==typeof c[b]&&(g=c[b].apply(c,Array.prototype.slice.call(f,1)))}),g!==d?g:this}}}(jQuery,window,document);
+
+!function(o){"function"==typeof define&&define.amd?define(["jquery"],o):"object"==typeof module&&module.exports?module.exports=function(e,t){return void 0===t&&(t="undefined"!=typeof window?require("jquery"):require("jquery")(e)),o(t),t}:o(jQuery)}(function(i){var o,r="bootstrapDropdownHover",n={clickBehavior:"sticky",hideTimeout:200},d=!1,s=!1,a=!1;function u(e,t){this.element=i(e),this.settings=i.extend({},n,t),this._defaults=n,this._name=r,this.init()}u.prototype={init:function(){var t,e;return this.setClickBehavior(this.settings.clickBehavior),this.setHideTimeout(this.settings.hideTimeout),t=this,(e=i("body")).one("touchstart.dropdownhover",function(){s=!0}),e.one("mouseenter.dropdownhover",function(){s||(a=!0)}),i(".dropdown-toggle, .dropdown-menu",t.element.parent()).on("mouseenter.dropdownhover",function(){a&&!i(this).is(":hover")&&(a=!1),a&&(clearTimeout(o),t.element.parent().is(".open, .show")||(d=!1,t.element.dropdown("toggle")))}),i(".dropdown-toggle, .dropdown-menu",t.element.parent()).on("mouseleave.dropdownhover",function(){a&&(d||(o=setTimeout(function(){t.element.parent().is(".open, .show")&&t.element.dropdown("toggle")},t.settings.hideTimeout)))}),t.element.on("click.dropdownhover",function(e){if(a)switch(t.settings.clickBehavior){case"default":return;case"disable":e.preventDefault(),e.stopImmediatePropagation();break;case"sticky":return void(d?d=!1:(d=!0,t.element.parent().is(".open, .show")&&(e.stopImmediatePropagation(),e.preventDefault())))}}),this.element},setClickBehavior:function(e){return this.settings.clickBehavior=e,this.element},setHideTimeout:function(e){return this.settings.hideTimeout=e,this.element},destroy:function(){var e;return clearTimeout(o),i(".dropdown-toggle, .dropdown-menu",(e=this).element.parent()).off(".dropdownhover"),i(".dropdown-toggle, .dropdown-menu",e.element.parent()).off(".dropdown"),e.element.off(".dropdownhover"),i("body").off(".dropdownhover"),this.element.data("plugin_"+r,null),this.element}},i.fn[r]=function(o){var t,n=arguments;return void 0===o||"object"==typeof o?(i.contains(document,i(this)[0])||i('[data-toggle="dropdown"]').each(function(e,t){i(t).bootstrapDropdownHover(o)}),this.each(function(){i(this).hasClass("dropdown-toggle")&&"dropdown"===i(this).data("toggle")?i.data(this,"plugin_"+r)||i.data(this,"plugin_"+r,new u(this,o)):i('[data-toggle="dropdown"]',this).each(function(e,t){i(t).bootstrapDropdownHover(o)})})):"string"==typeof o&&"_"!==o[0]&&"init"!==o?(this.each(function(){var e=i.data(this,"plugin_"+r);e instanceof u&&"function"==typeof e[o]&&(t=e[o].apply(e,Array.prototype.slice.call(n,1)))}),void 0!==t?t:this):void 0}});

Gruntfile.js

@@ -0,0 +0,0 @@ module.exports = function (grunt) {

LICENSE.md

@@ -0,0 +0,0 @@ Bootstrap Dropdown Hover

package.json

 {
   "name": "bootstrap-dropdown-hover",
   "title": "Bootstrap Dropdown Hover",
-  "description": "Open dropdown menus on mouse hover, the proper way.",
+  "description": "Open Bootstrap dropdown menus on mouse hover, the proper way. Compatible with Bootstrap 3 & 4.",
   "author": "István Ujj-Mészáros (https://github.com/istvan-ujjmeszaros)",
@@ -9,12 +9,12 @@ "contributors": [],
     "type": "git",
-    "url": "http://github.com/istvan-ujjmeszaros/bootstrap-dropdown-hover.git"
+    "url": "https://github.com/istvan-ujjmeszaros/bootstrap-dropdown-hover.git"
   },
-  "homepage": "http://www.virtuosoft.eu/code/bootstrap-dropdown-hover/",
-  "version": "1.0.0",
+  "homepage": "https://www.virtuosoft.eu/code/bootstrap-dropdown-hover/",
+  "version": "4.0.0",
   "devDependencies": {
-    "grunt": "~0.4.1",
-    "grunt-cli": "~0.1.13",
-    "grunt-contrib-jshint": "~0.8.0",
-    "grunt-contrib-concat": "~0.3.0",
-    "grunt-contrib-uglify": "~0.3.2"
+    "grunt": "^1.0.2",
+    "grunt-cli": "^1.2.0",
+    "grunt-contrib-jshint": "^1.1.0",
+    "grunt-contrib-concat": "^1.0.1",
+    "grunt-contrib-uglify": "^3.3.0"
   },
@@ -28,9 +28,2 @@ "scripts": {
   "main": "dist/jquery.bootstrap-dropdown-hover.min.js",
-  "dependencies": {
-    "grunt-cli": "^0.1.13",
-    "grunt": "^0.4.5",
-    "grunt-contrib-jshint": "^0.8.0",
-    "grunt-contrib-concat": "^0.3.0",
-    "grunt-contrib-uglify": "^0.3.3"
-  },
   "keywords": [
@@ -43,3 +36,3 @@ "jquery-plugin",
   ],
-  "license": "Apache 2.0"
+  "license": "Apache-2.0"
 }

README.md

 # Bootstrap Dropdown Hover [![Build Status](https://secure.travis-ci.org/istvan-ujjmeszaros/bootstrap-dropdown-hover.png?branch=master)](https://travis-ci.org/istvan-ujjmeszaros/bootstrap-dropdown-hover)
 Bootstrap Dropdown Hover is a simple plugin which opens Bootstrap dropdown menus on mouse hover, the proper way.
 
+## Demo
+
 Check the [official website](http://www.virtuosoft.eu/code/bootstrap-dropdown-hover/) for a demo.
 
+## Why I made it, when there are many solutions already?
+
+I had issues with all the previously existing solutions. The simple CSS ones are not using the `.open` class on the parent element, so there will be no feedback on the dropdown toggle element when the dropdown menu is visible.
+
+The js ones are interfering with clicking on `.dropdown-toggle`, so the dropdown menu shows up on hover, then it is hiding when clicking on the `.dropdown-toggle` element, and moving out the mouse will trigger the dropdown menu to show up again.
+Some of the js solutions are braking iOS compatibility, some plugins are not working on modern desktop browsers which are supporting the touch events.
+
+That's why I made this proper plugin, which prevents all these issues by using only the standard Bootstrap javascript API, without any hack.
+
 ## Usage
@@ -7,0 +18,0 @@

src/jquery.bootstrap-dropdown-hover.js

@@ -1,2 +0,21 @@
-;(function ($, window, document, undefined) {
+(function(factory) {
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else if (typeof module === 'object' && module.exports) {
+    module.exports = function(root, jQuery) {
+      if (jQuery === undefined) {
+        if (typeof window !== 'undefined') {
+          jQuery = require('jquery');
+        }
+        else {
+          jQuery = require('jquery')(root);
+        }
+      }
+      factory(jQuery);
+      return jQuery;
+    };
+  } else {
+    factory(jQuery);
+  }
+}(function($) {
   var pluginName = 'bootstrapDropdownHover',
@@ -13,2 +32,3 @@ defaults = {
       _hardOpened = false,
+      _touchstartDetected = false,
       _mouseDetected = false;
@@ -24,8 +44,29 @@
   }
-  
+
   function bindEvents(dropdown) {
+    var $body = $('body');
+
+    $body.one('touchstart.dropdownhover', function() {
+      _touchstartDetected = true;
+    });
+
+    $body.one('mouseenter.dropdownhover', function() {
+      // touchstart fires before mouseenter on touch devices
+      if (!_touchstartDetected) {
+        _mouseDetected = true;
+      }
+    });
+
     $('.dropdown-toggle, .dropdown-menu', dropdown.element.parent()).on('mouseenter.dropdownhover', function () {
-      _mouseDetected = true;
+      // seems to be a touch device
+      if(_mouseDetected && !$(this).is(':hover')) {
+        _mouseDetected = false;
+      }
+
+      if (!_mouseDetected) {
+        return;
+      }
+
       clearTimeout(_hideTimeoutHandler);
-      if (!dropdown.element.parent().hasClass('open')) {
+      if (!dropdown.element.parent().is('.open, .show')) {
         _hardOpened = false;
@@ -37,2 +78,6 @@ dropdown.element.dropdown('toggle');
     $('.dropdown-toggle, .dropdown-menu', dropdown.element.parent()).on('mouseleave.dropdownhover', function () {
+      if (!_mouseDetected) {
+        return;
+      }
+
       if (_hardOpened) {
@@ -42,3 +87,3 @@ return;
       _hideTimeoutHandler = setTimeout(function () {
-        if (dropdown.element.parent().hasClass('open')) {
+        if (dropdown.element.parent().is('.open, .show')) {
           dropdown.element.dropdown('toggle');
@@ -50,25 +95,25 @@ }
     dropdown.element.on('click.dropdownhover', function (e) {
-      // do not modify behavior if mouse is not present (touch screens)
       if (!_mouseDetected) {
         return;
       }
-      if (dropdown.settings.clickBehavior === 'default') {
-        return;
-      }
-      if (dropdown.settings.clickBehavior === 'disable') {
-        e.preventDefault();
-        e.stopImmediatePropagation();
-        return;
-      }
-      if (dropdown.settings.clickBehavior === 'sticky') {
-        if (_hardOpened) {
-          _hardOpened = false;
-        }
-        else {
-          _hardOpened = true;
-          if (dropdown.element.parent().hasClass('open')) {
-            e.stopImmediatePropagation();
-            e.preventDefault();
+
+      switch(dropdown.settings.clickBehavior) {
+        case 'default':
+          return;
+        case 'disable':
+          e.preventDefault();
+          e.stopImmediatePropagation();
+          break;
+        case 'sticky':
+          if (_hardOpened) {
+            _hardOpened = false;
           }
-        }
+          else {
+            _hardOpened = true;
+            if (dropdown.element.parent().is('.open, .show')) {
+              e.stopImmediatePropagation();
+              e.preventDefault();
+            }
+          }
+          return;
       }
@@ -82,4 +127,6 @@ });
     $('.dropdown-toggle, .dropdown-menu', dropdown.element.parent()).off('.dropdown');
+    dropdown.element.off('.dropdownhover');
+    $('body').off('.dropdownhover');
   }
-  
+
   BootstrapDropdownHover.prototype = {
@@ -137,2 +184,3 @@ init: function () {
       });
+
       // If the first parameter is a string and it doesn't start with an underscore or "contains" the `init`-function,
@@ -161,2 +209,2 @@ // treat this as a call to a public method.
 
-})(jQuery, window, document);
+}));

New alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

91977

increased by63.87%

Dependency count

0

decreased by-100%

Lines of code

509

increased by21.77%

Number of lines in readme file

217

increased by5.34%

Worsened metrics

Number of package files

16

decreased by-5.88%

Number of low quality alerts

1

increased byInfinity%

Dependency changes

• - Removedgrunt@^0.4.5

• - Removedgrunt-cli@^0.1.13

• - Removedgrunt-contrib-concat@^0.3.0

• - Removedgrunt-contrib-jshint@^0.8.0

• - Removedgrunt-contrib-uglify@^0.3.3

• - Removedabbrev@1.1.1(transitive)

• - Removedamdefine@1.0.1(transitive)

• - Removedansi-styles@1.0.0(transitive)

• - Removedargparse@0.1.16(transitive)

• - Removedasync@0.1.220.2.10(transitive)

• - Removedcamelcase@1.2.1(transitive)

• - Removedchalk@0.4.0(transitive)

• - Removedcli@0.4.5(transitive)

• - Removedcoffee-script@1.3.3(transitive)

• - Removedcolors@0.6.2(transitive)

• - Removedconsole-browserify@0.1.6(transitive)

• - Removedcore-util-is@1.0.3(transitive)

• - Removeddateformat@1.0.2-1.2.3(transitive)

• - Removeddecamelize@1.2.0(transitive)

• - Removeddomelementtype@1.3.1(transitive)

• - Removeddomhandler@2.1.0(transitive)

• - Removeddomutils@1.1.6(transitive)

• - Removedesprima@1.0.4(transitive)

• - Removedeventemitter2@0.4.14(transitive)

• - Removedexit@0.1.2(transitive)

• - Removedfindup-sync@0.1.3(transitive)

• - Removedgetobject@0.1.0(transitive)

• - Removedglob@3.1.213.2.11(transitive)

• - Removedgraceful-fs@1.2.3(transitive)

• - Removedgrunt@0.4.5(transitive)

• - Removedgrunt-cli@0.1.13(transitive)

• - Removedgrunt-contrib-concat@0.3.0(transitive)

• - Removedgrunt-contrib-jshint@0.8.0(transitive)

• - Removedgrunt-contrib-uglify@0.3.3(transitive)

• - Removedgrunt-legacy-log@0.1.3(transitive)

• - Removedgrunt-legacy-log-utils@0.1.1(transitive)

• - Removedgrunt-legacy-util@0.2.0(transitive)

• - Removedgrunt-lib-contrib@0.6.1(transitive)

• - Removedhas-color@0.1.7(transitive)

• - Removedhooker@0.2.3(transitive)

• - Removedhtmlparser2@3.3.0(transitive)

• - Removediconv-lite@0.2.11(transitive)

• - Removedinherits@1.0.22.0.4(transitive)

• - Removedisarray@0.0.1(transitive)

• - Removedjs-yaml@2.0.5(transitive)

• - Removedjshint@2.4.4(transitive)

• - Removedlodash@0.9.22.4.2(transitive)

• - Removedlru-cache@2.7.3(transitive)

• - Removedminimatch@0.2.140.3.0(transitive)

• - Removednopt@1.0.10(transitive)

• - Removedreadable-stream@1.0.34(transitive)

• - Removedresolve@0.3.1(transitive)

• - Removedrimraf@2.2.8(transitive)

• - Removedshelljs@0.1.4(transitive)

• - Removedsigmund@1.0.1(transitive)

• - Removedsource-map@0.1.34(transitive)

• - Removedstring_decoder@0.10.31(transitive)

• - Removedstrip-ansi@0.1.1(transitive)

• - Removeduglify-js@2.4.24(transitive)

• - Removeduglify-to-browserify@1.0.2(transitive)

• - Removedunderscore@1.4.41.7.0(transitive)

• - Removedunderscore.string@2.2.12.3.32.4.0(transitive)

• - Removedwhich@1.0.9(transitive)

• - Removedwindow-size@0.1.0(transitive)

• - Removedwordwrap@0.0.2(transitive)

• - Removedyargs@3.5.4(transitive)

• - Removedzlib-browserify@0.0.1(transitive)