(function($) {
	'use strict';

	// create outer variables
	var wrapper, container, ajax, modal, content, info, prev, next, close, keybind, rsz, loadedcontent = {};

	// set default parameters
	var defaultsettings = {
		arrowkeys:     true,                // left and right arrow keys for controls, esc to close
		controls:      true,                // display next / prev controls
		loop:          true,                // loop back to the beginning
		maxwidth:      null,                // maximum amount of pixels for width
		maxheight:     null,                // maximum amount of pixels for height
		maxscreen:     90,                  // percentage of screen size (overrides maxwidth and maxheight)
		updatersz:     true,                // update on window resize
		callback:      null,                // callback function after every panel load
		lockscroll:    true,                // prevent scrolling when pop-up is open
		contenttype:   'image',             // type of content to load,
		ajaxcontainer: 'body > *',          // html element to laod into ajax
	}; // end options


	var methods = {
		init : function(settings) {

			return this.click(function(e) {

				$(this).galpop('openbox',settings);

				e.preventdefault();


			}); // end click

		}, // end init
		openbox : function(settings,target,index) {
			// override default options
			settings = $.extend({}, defaultsettings, settings);

			// bind variables
			wrapper.data({
				controls:      settings.controls,
				loop:          settings.loop,
				maxwidth:      settings.maxwidth,
				maxheight:     settings.maxheight,
				maxscreen:     settings.maxscreen,
				callback:      settings.callback,
				contenttype:   settings.contenttype,
			}); // end data

			var url           = target;
			var rel           = '';
			var group         = this;
			var ajaxcontainer = ((this.data('galpop-container')) ? this.data('galpop-container') : settings.ajaxcontainer);

			if (!index) {
				index = 0;
			}

			// group items if is an array
			if( object.prototype.tostring.call( target ) === '[object array]' ) {
				group = target;
				url   = group[index];
			}

			// if no target, use normal link
			if (!target) {
				url   = this.attr('href');
				rel   = this.data('galpop-group');
				group = $('[data-galpop-group="'+ rel +'"]');
				index = group.index(this);

				if (settings.arrowkeys) {
					$(document).on('keydown',keybind);
				}

				if (settings.updatersz) {
					$(window).resize(rsz);
				}

				if (settings.lockscroll) {
					$('html').addclass('lock-scroll');
				}
			}

			wrapper.data({
				rel:           rel,
				group:         group,
				index:         index,
				status:        true,
				count:         group.length,
				ajaxcontainer: ajaxcontainer,
			});

			wrapper.fadein(500,'swing');

			// load the item
			this.galpop('preload',url);

			return this;
		}, // end open box
		closebox : function() {

			wrapper.removeclass('complete').fadeout(500,'swing',function() {
				content.empty();
				info.hide().empty();
				$(this).data('status',false);
				prev.hide();
				next.hide();
				container.removeattr('style');
				wrapper.removeclass('loaded-ajax loaded-image loaded-iframe');

				// remove bound functions
				$(document).off('keydown',keybind);
				$(window).off('resize',rsz);
				$('html').removeclass('lock-scroll');
			});

		}, // end close box
		preload : function(url) {
			var contenttype = wrapper.data('contenttype');
			switch (contenttype) {
				case 'ajax':
					wrapper.addclass('loaded-ajax');
					this.galpop('loadajax',url);
					break;
				case 'iframe':
					wrapper.addclass('loaded-iframe');
					this.galpop('loadiframe',url);
					break;
				case 'image':
				default:
					wrapper.addclass('loaded-image');
					this.galpop('loadimage',url);
					break;
			}

			return this;
		}, // end preload
		loadimage : function(url) {
			var image = new image();
			image.src = url;
			loadedcontent.object    = image;
			loadedcontent.resizable = true;
			image.onload = function() {
				// alert('good');
				wrapper.galpop('display');
			}; // end onload
			image.onerror = function() {
				// alert(url +' contains a broken image!');
				console.log(url +' contains a broken image!');
			}; // end onerror
			return this;
		}, // load image
		loadiframe : function(url) {
			var iframe = $('<iframe src="'+ url +'" />');
			loadedcontent.object    = iframe;
			loadedcontent.resizable = false;

			wrapper.galpop('display');

			return this;
		}, // load image
		loadajax : function(url) {
			var ajaxcontainer = wrapper.data('ajaxcontainer');
			loadedcontent.resizable = false;
			$.ajax({
				url:url,
				type:'get',
				datatype:'html',
				success: function(data){
					var jqueryfilter = $(data).filter(ajaxcontainer);
					var jqueryfind   = $(data).find(ajaxcontainer);
					if (jqueryfilter.length) {
						loadedcontent.object = jqueryfilter;
						wrapper.galpop('display');
					} else if (jqueryfind.length) {
						loadedcontent.object = jqueryfind;
						wrapper.galpop('display');
					} else {
						console.log('element '+ ajaxcontainer +' not found in dom.');
					}
				},
				error: function (jqxhr, exception) {
					if (jqxhr.status === 0) {
						console.log('not connect.\n verify network.');
					} else if (jqxhr.status == 404) {
						console.log('requested page not found. [404]');
					} else if (jqxhr.status == 500) {
						console.log('internal server error [500].');
					} else if (exception === 'parsererror') {
						console.log('requested json parse failed.');
					} else if (exception === 'timeout') {
						console.log('time out error.');
					} else if (exception === 'abort') {
						console.log('ajax request aborted.');
					} else {
						console.log('uncaught error.\n' + jqxhr.responsetext);
					}
				},
			});
			return this;
		}, // load image
		resize : function() {
			var resizable    = loadedcontent.resizable;
			var imageheight  = loadedcontent.object.naturalheight;
			var imagewidth   = loadedcontent.object.naturalwidth;
			var maxwidth     = wrapper.data('maxwidth');
			var maxheight    = wrapper.data('maxheight');
			var maxscreen    = wrapper.data('maxscreen');
			var screenheight = $(window).height();
			var screenwidth  = $(window).width();
			var ratio        = 0;
			// var extrawidth   = container.outerwidth() - container.width();
			// var extraheight  = container.outerheight() - container.height();

			// set max width and height
			if (!maxwidth || maxwidth > screenwidth * maxscreen / 100) {
				maxwidth = screenwidth * maxscreen / 100;
			}
			if (!maxheight || maxheight > screenheight * maxscreen / 100) {
				maxheight = screenheight * maxscreen / 100;
			}

			// only resize locked aspect ratio content (images)
			if (resizable) {
				// check if the current width is larger than the max
				if (imagewidth > maxwidth) {
					ratio       = maxwidth / imagewidth;
					imageheight = imageheight * ratio;
					imagewidth  = imagewidth * ratio;
				}

				// check if current height is larger than max
				if (imageheight > maxheight) {
					ratio       = maxheight / imageheight;
					imagewidth  = imagewidth * ratio;
					imageheight = imageheight * ratio;
				}
			}

			container.css({
				height:     imageheight,
				width:      imagewidth
			});

			return this;
		}, // end resize
		display : function() {
			this.galpop('resize');
			// wait for container to finish animations before displaying image
			settimeout(function() {
				wrapper.addclass('complete');
				content.append(loadedcontent.object).fadein(500,'swing',function() {
					wrapper.galpop('complete');
				});
			},500);

		}, // end display
		complete : function() {
			var controls = wrapper.data('controls');
			var callback = wrapper.data('callback');
			var index    = wrapper.data('index');
			var count    = wrapper.data('count');
			var loop     = wrapper.data('loop');

			wrapper.galpop('infoparse');

			// check if on first item and hide prev
			if (!controls || (index === 0 && !loop) || count <= 1) {
				prev.hide();
			} else {
				prev.show();
			}

			// check if on last item and hide next
			if (!controls || (index + 1 >= count && !loop) || count <= 1) {
				next.hide();
			} else {
				next.show();
			}

			// initiate callback function
			if ($.isfunction(callback)) {
				callback.call(this);
			}
		}, // end display
		moveitem : function(index) {
			// console.log('moveitem '+index);
			var group = wrapper.data('group');
			var next  = false;
			var url   = '';

			wrapper.removeclass('complete');
			info.fadeout(500,'swing',function() {
				$(this).contents().remove();
			});
			content.fadeout(500, 'swing', function() {
				// remove current image
				$(this).empty();

				if (object.prototype.tostring.call( group ) === '[object array]') {
					url = group[index];
				} else {
					// get the next item to show
					next = group.eq(index);

					if (next.attr('href')) {
						url = next.attr('href');
					} else if (next.attr('src')) {
						url = next.attr('href');
					}
				}

				$.fn.galpop('preload',url);

				wrapper.data('index',index);
			});

			return this;
		}, // end move item
		next : function() {
			var index = wrapper.data('index');
			var loop  = wrapper.data('loop');
			// var group = wrapper.data('group');
			var count = wrapper.data('count');
			// alert(count + 5);
			// alert(index + 1 +' '+ count);
			// check if last item
			if (index + 1 < count) {
				// alert(index + 1 +' '+ count);
				// move to next item
				index++;
				wrapper.galpop('moveitem',index);
			} else if (loop) {
				// move to first item
				index = 0;
				wrapper.galpop('moveitem',index);
			}

			return this;
		}, // end next
		prev : function() {
			var index = wrapper.data('index');
			var loop  = wrapper.data('loop');
			// var group = wrapper.data('group');
			var count = wrapper.data('count');

			// check if first item
			if (index > 0) {
				index--;
				wrapper.galpop('moveitem',index);
			} else if (loop) {
				index = count - 1;
				wrapper.galpop('moveitem',index);
			}

			return this;
		}, // end prev
		infoparse : function() {
			var group = wrapper.data('group');

			if (group instanceof jquery) {
				var index     = wrapper.data('index');
				var anchor    = group.eq(index);
				var title     = $.trim(anchor.attr('title'));
				var url       = $.trim(anchor.data('galpop-link'));
				var urltitle  = $.trim(anchor.data('galpop-link-title'));
				var urltarget = $.trim(anchor.data('galpop-link-target'));

				// clear info box
				info.html('');

				// new title
				if (title) {
					$('<p>'+ title +'</p>').appendto(info);
				}

				// new link
				if (url) {
					if (!urltitle) {
						urltitle = url;
					}

					if (urltarget) {
						urltarget = 'target="'+ urltarget +'"';
					}

					$('<p><a href="'+ url +'" '+ urltarget +'>'+ urltitle +'</a></p>').appendto(info);
				}

				// show info box
				if (title || url) {
					info.fadein(500,'swing');
				}
			}

		}, // end info parse
		update : function() {
			var index = wrapper.data('index');
			wrapper.galpop('moveitem',index);
			return this;
		}, // end update
		destroy : function() {
			return this.off('click');
		} // end destroy
	}; // end method

	// create the plugin name and defaults once
	var pluginname = 'galpop';

	$.fn[pluginname] = function(method) {

		if ( methods[method] ) {
			return methods[method].apply( this, array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
			return methods.init.apply( this, arguments );
		} else {
			$.error( 'method ' +  method + ' does not exist on jquery.'+ pluginname );
		}

	}; // end plugin

	$[pluginname] = {};
	$[pluginname].extend = function(name, method) {
		methods[name] = method;
	};


	$(document).ready(function() {
		wrapper   = $('<div id="galpop-wrapper" />').appendto('body');
		container = $('<div id="galpop-container" />').appendto(wrapper);
		prev      = $('<a href="#" id="galpop-prev" />').appendto(container);
		next      = $('<a href="#" id="galpop-next" />').appendto(container);
		ajax      = $('<div id="galpop-ajax" />').appendto(container);
		modal     = $('<div id="galpop-modal" />').appendto(container);
		content   = $('<div id="galpop-content" />').appendto(modal);
		info      = $('<div id="galpop-info" />').appendto(modal);
		close     = $('<a href="#" id="galpop-close" />').appendto(modal);

		wrapper.click(function(e) {
			$(this).galpop('closebox');

			e.preventdefault();
		});
		container.click(function(e) {
			e.stoppropagation();
		});
		prev.hide().click(function(e) {
			wrapper.galpop('prev');
			e.preventdefault();
		});
		next.hide().click(function(e) {
			wrapper.galpop('next');
			e.preventdefault();
		});
		close.click(function(e) {
			wrapper.galpop('closebox');
			e.preventdefault();
		});
		info.on('click', 'a', function() {
			wrapper.galpop('closebox');
		});
		keybind = function(e){
			var key  = e.which;
			var stop = false;
			switch (key) {
				case 27: // esc
					wrapper.galpop('closebox');
					stop = true;
					break;
				case 37: // left arrow
					wrapper.galpop('prev');
					stop = true;
					break;
				case 39: // right arrow
					wrapper.galpop('next');
					stop = true;
					break;
			}
			if (stop) {
				e.preventdefault();
			}
		}; // end keybind
		rsz = function() {
			wrapper.galpop('resize');
		}; // end resize

	}); // end document ready

})(jquery);
// (function($) {
// 	$.galpop.extend('samplemethod', function(prop, value) {
// 	  alert('extended sample method');
// 	});
// })(jquery);