jquery-bridget
    Overview
    Documentation
    Insights
    Code
    Contributors
    Dependencies
    Alternatives

jquery-bridget

Bridget makes jQuery widgets

2.0.1  •  Updated 2 years ago  •  by David DeSandro  •  MIT License

Bridget makes jQuery plugins

Bridget makes a jQuery plugin out of a constructor 🏭

It’s based off of the jQuery UI widget factory. You should probably use that, since it’s very good. I use this, since it’s a bit simpler. Used for Masonry, Isotope, Packery, Flickity, and Draggabilly.

Plugin constructor

A plugin constructor uses Prototypal pattern. It needs to have a ._init() method used for its main logic.

// plugin constructor
// accepts two argments, element and options object
function NiceGreeter( element, options ) {
  this.element = $( element );
  this.options = $.extend( true, {}, this.options, options );
  this._init();
}
// defaults for plugin options
NiceGreeter.prototype.options = {
  greeting: 'hello',
  recipient: 'world'
};
// main plugin logic
NiceGreeter.prototype._init = function() {
  var message = this.getMessage();
  this.element.text( message );
};
// getter method
NiceGreeter.prototype.getMessage = function() {
  return this.options.greeting + ' ' + this.options.recipient;
};

Usage

Bridget can make this constructor work as a jQuery plugin. The namespace is the plugin method - $elem.namespace().

// convert constructor to jQuery plugin
jQueryBridget( 'niceGreeter', NiceGreeter );
// optional: pass in jQuery variable
jQueryBridget( 'niceGreeter', NiceGreeter, jQuery );
// or: use $.bridget
$.bridget( 'niceGreeter', NiceGreeter );

// now the constructor can be used as a jQuery plugin
var $elem = $('#elem');
$elem.niceGreeter();
// >> h1 text will be 'hello world'

// set options
$elem.niceGreeter({
  greeting: 'bonjour',
  recipient: 'mon ami'
});
// >> text will be 'bonjour mon ami'

// access constructor instance via .data()
var myGreeter = $elem.data('niceGreeter');

Getter methods can still be used. For jQuery objects with multiple elements, getter methods will return the value of the first element.

Package managers

Install with Bower 🐦: bower install jquery-bridget

Install with npm npm install jquery-bridget

MIT license

Bridget is released under the MIT license.

Popularity

Weekly Downloads
7.9K
Stars
97

Maintenance

Development

Last ver 4 years ago
Created 5 years ago
Last commit 4 years ago
1 month between commits

Technology

Node version: 4.2.4
0 unpacked

Compliance

MIT License
OSI Approved
0 vulnerabilities

Contributors

2 contributors
David DeSandro
Maintainer, 52 commits, 1 merges
Works at Compass
Rob Loach
1 commits, 1 PRs
Works at Kalamuna
silvenon
1 PRs
wbinnssmith
1 PRs
braznaavtrav
1 PRs
SergioCrisostomo
2 PRs

Dependencies

Tags

jquery
jquery-plugin
Ready for the next level?
Join Openbase's founding team to help us build the ultimate open-source app store, work with the latest technologies, and enjoy great culture, impact and autonomy
Openbase helps developers choose among and use millions of open-source packages, so they can build amazing products faster.
FacebookLinkedIn
© 2020 Devstore, Inc.