/*!
* jQuery Ajax Smoother Library v1.0
* http://www.logic-design.co.jp/
*
* Copyright 2014- LogicDesign Inc.
* Released under the Creative Commons license
*   1. Attribution, BY
*   2. Noncommercial, NC
* http://www.logic-design.co.jp/ license
*
* Date: 2014-05-31
*
* Base: jQuery(http://jquery.com/)
*/

/*
################################# REFERENCE ##################################

$.fn.popup
  @description
    指定要素をポップアップとして表示する。
  
  @parameters
  -options: 以下の要素からなる連想配列を指定する。
    -title: ポップアップのタイトル(省略時: 要素のdata-title属性値),
    -closeButton: ×ボタンの表示フラグ,
    -closeBackGround: 背景クリックによるポップアップ終了を行うか,
    -closeEvent: ポップアップ終了時イベント,
    -fadeSpeed: フェードのスピード,
    -draggable: タイトル部がドラッグ可能とするか,
    -marginTop: マージン(上),
    -marginLeft: マージン(左),
    -marginRight: マージン(右),
    -marginBottom: マージン(下),
    -wrapperClass: ポップアップの外枠に設定するクラス,

*/

(function($) {
	var popup_state = 0;
	var first_event = true;

	$.fn.popup = function(over_options){
		var $this = $(this);
		var id = "jqpid" + (+new Date());
		var $tmp = $("<div>").attr("id", id);
		var attributes = $this[0].attributes;
		for(var i = 0; i < attributes.length; i++){
			$tmp.attr("data-jqp-" + attributes[i].name, attributes[i].value);
		}
		$this.data("jqp-position-id", id);
		$tmp.insertAfter($this);
		
		var options = {
			wrapperClass: $this.data("class"),
			title: $this.data("jq-title"),
			closeButton: true,
			closeBackGround: true,
			closeEvent: null,
			fadeSpeed: 100,
			draggable: true,
			marginTop: 0,
			marginLeft: 0,
			marginRight: 0,
			marginBottom: 0
		}
		
		var tag_options = $this.data("jq-popup");
		if(tag_options != null) eval("$.extend(options, {" + tag_options + "});");
		$.extend(options, over_options);
		
		var $frame;
		var $background;
		var $wrapper;
		var $title;
		var $close;
		var $header;
		
		$this.appendTo($("body"));
		var this_width		= $this[0] != null ? $this[0].style.width : null;
		var this_height		= $this[0] != null ? $this[0].style.height : null;
		var this_max_width	= $this.css("max-width");
		var this_max_height = $this.css("max-height");
		$this.attr("data-jq-popup-wrapped", 1);
		$this.data("jq-popup-fade", options.fadeSpeed);

		$this.css({visibility: "hidden", position: "fixed"}).show();
		var max_sx, max_sy;
		var sx, sy;
		
		if((this_width  != null) && (this_width.indexOf("%") != -1)){
			sx = $(window).width() * parseInt(this_width.replace("%", ""), 10) / 100;
			if(parseInt(this_max_width, 10) < sx){
				sx = parseInt(this_max_width, 10);
			}
		} else {
			sx = $this.width();
		}
		if((this_height != null) && (this_height.indexOf("%") != -1)){
			sy = $(window).height() * parseInt(this_height.replace("%", ""), 10) / 100;
			if(parseInt(this_max_height, 10) < sy){
				sy = parseInt(this_max_height, 10);
			}
		} else {
			sy = $this.height();
		}

		$frame = $("<div class='jq-popup-frame'>");
		$background = $("<div class='jq-popup-background'/>");
		$title = $("<span>");
		$close = $("<div class='jq-popup-close'/>");
		$header = $("<div class='jq-popup-header'></div>").append($title).append($close);
		$wrapper = $this.wrap("<div class='jq-popup-wrapper'><div class='jq-popup-frame'><div><div class='jq-popup-content'/></div></div></div>")
						.show().closest(".jq-popup-wrapper");
		$background.on("touchmove", function(){return false;});
		$this.css({width: "100%", height: "100%", maxWidth: "none", maxHeight: "none", position: "static", visibility: "visible"});
		if(this_width  || (this_max_width  != "none" && this_max_width  != null))
			$this.width(sx);
		if(this_height || (this_max_height != "none" && this_max_height != null))
			$this.height(sy);

		if(options.wrapperClass) $wrapper.addClass(options.wrapperClass);
		$wrapper.css("visible", "hidden").show();
		$frame = $wrapper.prepend($background).find(".jq-popup-frame").prepend($("<div>").append($header));
		
		$title.text(options.title != null ? options.title : "");
		var close_event_trigger = "click";// + (getAndroidVersion(0) == "2" ? " touchend" : "");
		if(options.closeButton){
			$close.show().on(close_event_trigger, function(event){ $this.popupClose(); if(options.closeEvent) options.closeEvent(); })
						.on("touchstart", function(event){ event.stopPropagation(); })
						.css("margin", ($close.parent().height() - $close.height()) / 2);
		} else {
			$close.hide().off(close_event_trigger).off("touchstart");
		}
		
		var drag_sx, drag_sy;
		options.closeBackGround ? $background.on("click", function(){$this.popupClose(); if(options.closeEvent){options.closeEvent();} return false;}) : 
								  $background.off("click");
		options.draggable ? $header.on({
				"mousedown": function(e) {
					var event = e.originalEvent;
					var mx = e.pageX !== undefined ? e.pageX : event.changedTouches[0].pageX,
						my = e.pageY !== undefined ? e.pageY : event.changedTouches[0].pageY,
						nx = parseInt($frame.css("left")),
						ny = parseInt($frame.css("top")),
						max_x = $wrapper.outerWidth() - $frame.outerWidth(),
						max_y = $wrapper.outerHeight() - $frame.outerHeight();
					$(document).on({
						"mousemove.jqpopup": function(e) {
							var event = e.originalEvent;
							var x = nx + (e.pageX !== undefined ? e.pageX : event.changedTouches[0].pageX) - mx;
							var y = ny + (e.pageY !== undefined ? e.pageY : event.changedTouches[0].pageY) - my;
							if(x < 0) x = 0; else if(x > max_x) x = max_x;
							if(y < 0) y = 0; else if(y > max_y) y = max_y;
							$frame.css({left: x, top: y});
							e.preventDefault();
						},
						"mouseup.jqpopup": function(e) {
							$(document).off("mousemove.jqpopup mouseup.jqpopup");
							e.preventDefault();
						}
					});
					//e.preventDefault();
				},
				"touchstart touchmove": function(e) {
					e.stopPropagation();
					var event = e.originalEvent;
					var x = event.touches[0].clientX;
					var y = event.touches[0].clientY;
					if(e.type == "touchstart"){
						drag_sx = x - parseInt($frame.css("left"));
						drag_sy = y - parseInt($frame.css("top"));
					}
					var max_x = $wrapper.outerWidth() - $frame.outerWidth(),
						max_y = $wrapper.outerHeight() - $frame.outerHeight();
					x -= drag_sx;
					y -= drag_sy;
					if(x < 0) x = 0; else if(x > max_x) x = max_x;
					if(y < 0) y = 0; else if(y > max_y) y = max_y;
					$frame.css({left: x, top: y});
					return false;
				}
			}).css("cursor", "pointer") : $header.off("mousedown touchstart").css("cursor", "default");
		var wx = ($wrapper.outerWidth() - options.marginRight + options.marginLeft - $frame.outerWidth()) / 2,
			wy = ($wrapper.outerHeight() - options.marginBottom + options.marginTop - $frame.outerHeight()) / 2;
		$frame.css({left: wx, top: wy});
		$wrapper.hide().fadeIn(options.fadeSpeed);
		
		popup_state++;

		if(typeof getAndroidVersion != "undefined"){
			if(getAndroidVersion(0) == "2"){
				$wrapper.css("position", "absolute");
				if(first_event){
					$(window).scroll(function(){
						$(".jq-popup-wrapper:visible").css("top", $(window).scrollTop());
					});
				}
				$(".jq-popup-wrapper:visible").css("top", $(window).scrollTop());
			}
		}
		first_event = false;
		
		$("input,select").blur();
	};
	
	$.fn.popupClose = function(event){
		$fader = $(this).closest(".jq-popup-wrapper");
		$body = $fader.find("[data-jq-popup-wrapped]");
		$fader.fadeOut($body.data("jq-popup-fade"), function(){
			var $position = $("#" + $body.data("jqp-position-id"));
			if($position.length){
				var attributes = $body[0].attributes;
				while(attributes.length){
					$body.removeAttr(attributes[0].name);
				}
				attributes = $position[0].attributes;
				for(var i = 0; i < attributes.length; i++){
					if(attributes[i].name.lastIndexOf("data-jqp-", 0) === 0){
						$body.attr(attributes[i].name.substr(9), attributes[i].value);
					}
				}
				$body.insertAfter($position);
				
				$position.remove();
				$fader.remove();
			}
			if(event !== undefined) event();
		});
		
		popup_state--;
	};
	
	$.fn.popupIsOpen = function(){
		return $(this).is(":visible");
	}
	
	$.popup = {};
	$.popup.close = function(event){
		var $wrapper = $(".jq-popup-wrapper");
		$wrapper.each(function(){
			$(this).popupClose(event);
		});
		
		popup_state = 0;
	};
	$.popup.isOpen = function(){
		return popup_state > 0;
	}
})(jQuery);