Skip to content

Instantly share code, notes, and snippets.

@mscharl
Created August 29, 2013 10:52
Show Gist options
  • Select an option

  • Save mscharl/6376670 to your computer and use it in GitHub Desktop.

Select an option

Save mscharl/6376670 to your computer and use it in GitHub Desktop.
jQuery plugin for links to open in a popup (built for share links)
// the semi-colon before function invocation is a safety net against concatenated
// scripts and/or other plugins which may not be closed properly.
;(function ( $, window, document, undefined ) {
// undefined is used here as the undefined global variable in ECMAScript 3 is
// mutable (ie. it can be changed by someone else). undefined isn't really being
// passed in so we can ensure the value of it is truly undefined. In ES5, undefined
// can no longer be modified.
// window and document are passed through as local variable rather than global
// as this (slightly) quickens the resolution process and can be more efficiently
// minified (especially when both are regularly referenced in your plugin).
// Create the defaults once
var pluginName = "socialPopup",
defaults = {
width: 500, // Defines the width of the popup
height: 300, // Defines the height if the popup
top: 'auto', // Defines the top position of the window (use auto for a centered window)
left: 'auto', // Defines the left position of the window (use auto for a centered window)
windowTitle: 'SocialPopup' // Defines the window title
};
var _this;
// The actual plugin constructor
function Plugin ( element, options ) {
_this = this;
_this.element = element;
// jQuery has an extend method which merges the contents of two or
// more objects, storing the result in the first object. The first object
// is generally empty as we don't want to alter the default options for
// future instances of the plugin
_this.settings = $.extend( {}, defaults, options );
_this._defaults = defaults;
_this._name = pluginName;
_this.init();
}
Plugin.prototype = {
init: function () {
// You already have access to the DOM element and
// the options via the instance, e.g. this.element
// and this.settings
// you can add more functions like the one below and
// call them like so: this.yourOtherFunction(this.element, this.settings).
$(_this.element).bind('click', _this.openPopup);
},
openPopup: function (event) {
event.preventDefault();
var href = this.getAttribute('href'),
windowLeft = _this.settings.left == 'auto' ? left = (screen.width/2)-(_this.settings.width/2) : _this.settings.left,
windowTop = _this.settings.top == 'auto' ? (screen.height/2)-(_this.settings.height/2) : _this.settings.top;
var popupWindow = window.open(
href,
_this.settings.windowTitle,
"width="+ _this.settings.width +","+
"height="+ _this.settings.height +","+
"resizable=yes,"+
"menubar=no,"+
"status=no,"+
"toolbar=no,"+
"dependent=yes,"+
"location=no,"+
"left=" + windowLeft +","+
"top=" + windowTop
);
popupWindow.focus();
}
};
// A really lightweight plugin wrapper around the constructor,
// preventing against multiple instantiations
$.fn[ pluginName ] = function ( options ) {
return this.each(function() {
if ( !$.data( this, "plugin_" + pluginName ) ) {
$.data( this, "plugin_" + pluginName, new Plugin( this, options ) );
}
});
};
})( jQuery, window, document );
!function(a,b){function h(b,c){g=this,g.element=b,g.settings=a.extend({},f,c),g._defaults=f,g._name=e,g.init()}var g,e="socialPopup",f={width:500,height:300,top:"auto",left:"auto",windowTitle:"SocialPopup"};h.prototype={init:function(){a(g.element).bind("click",g.openPopup)},openPopup:function(a){a.preventDefault();var c=this.getAttribute("href"),d="auto"==g.settings.left?left=screen.width/2-g.settings.width/2:g.settings.left,e="auto"==g.settings.top?screen.height/2-g.settings.height/2:g.settings.top,f=b.open(c,g.settings.windowTitle,"width="+g.settings.width+","+"height="+g.settings.height+","+"resizable=yes,"+"menubar=no,"+"status=no,"+"toolbar=no,"+"dependent=yes,"+"location=no,"+"left="+d+","+"top="+e);f.focus()}},a.fn[e]=function(b){return this.each(function(){a.data(this,"plugin_"+e)||a.data(this,"plugin_"+e,new h(this,b))})}}(jQuery,window,document);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment