///<reference path="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/>
(function () {
	var path = document.getElementById("nmajs").src.replace("nema.trc.widget.js", "");
	// Localize jQuery variable
	//    var jQuery;

	/******** Load jQuery if not present *********/
	if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.4.2') {
		var script_tag = document.createElement('script');
		script_tag.setAttribute("type", "text/javascript");
		script_tag.setAttribute("src",
        "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js");
		script_tag.onload = scriptLoadHandler;
		script_tag.onreadystatechange = function () { // Same thing but for IE
			if (this.readyState == 'complete' || this.readyState == 'loaded') {
				scriptLoadHandler();
			}
		};
		// Try to find the head, otherwise default to the documentElement
		(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
	} else {
		// The jQuery version on the window is the one we want to use
		jQuery = window.jQuery;
		main();
	}


	/******** Called once jQuery has loaded ******/
	function scriptLoadHandler() {
		// Restore $ and window.jQuery to their previous values and store the
		// new jQuery in our local jQuery variable
		jQuery = window.jQuery.noConflict(true);
		// Call our main function
		main();
	}

	/******** Our main function ********/
	function main() {
		jQuery.noConflict();
		jQuery(document).ready(function ($) {
			/****** Utils ******/
			function loadCss(vcss) {
				var css_link = $("<link>", {
					rel: "stylesheet",
					type: "text/css",
					href: vcss
				});
				css_link.appendTo('head');
			}
			function loadjscssfile(filename, filetype) {
				if (filetype == "js") { //if filename is a external JavaScript file
					var fileref = document.createElement('script')
					fileref.setAttribute("type", "text/javascript")
					fileref.setAttribute("src", filename)
				}
				else if (filetype == "css") { //if filename is an external CSS file
					var fileref = document.createElement("link")
					fileref.setAttribute("rel", "stylesheet")
					fileref.setAttribute("type", "text/css")
					fileref.setAttribute("href", filename)
				}
				if (typeof fileref != "undefined")
					document.getElementsByTagName("head")[0].appendChild(fileref)
			}
			function loadDdl(id, d) {
				$("#" + id).find("option").remove();
				for (var i = 0; i < d.length; i++) {
					if (d[i].indexOf("<All>", 0) != -1) {
						//                        $("#" + id).append(new Option(d[i], -1, true, true));
						$("#" + id).append("<option value='" + -1 + "'>" + d[i].replace("<", "&lt;") + "</option>");
					}
					else {
						$("#" + id).append("<option value='" + d[i] + "'>" + d[i] + "</option>");
					}
				}
				$("#" + id + " option[value='-1']").attr("selected", "selected");
				$("#" + id).attr("disabled", "");
			}
			function ajaxJsonPost(method, data, callback, error) {
				var url = "WidgetService.svc/" + method + "?$format=json";
				var e = $("#error");
				e.hide();
				$.ajax({
					url: url,
					data: data,
					dataType: 'jsonp',
					jsonp: "$callback",
					contentType: "application/json;  charset=utf-8",
					success: function (data) { callback(data); },
					error: function (XHR, textStatus, errorThrown) {
						e.show();
					}
				});
			}
			function numberKeyPress(event) {
				var key = event.which || event.keyCode;
				return (key <= 8 || key <= 13 || (key >= 48 && key <= 57) || key == 8 || key == 9 || key == 118 || key == 46 || key == 120 || key == 99 || (key <= 40 && key >= 35) || key == 127);
			}

			/******* Load CSS *******/
			loadjscssfile(path + "styles/jquery-ui-1.8.4.custom.css", "css");
			loadjscssfile(path + "styles/nema.trc.widget.css", "css");

			/****** load ui ******/
			jQuery.getScript("http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js", function (d, t) {
				widget.setcontrols();
			});

			/******** Widget functions ********/
			window.widget = {
				dialog: null,
				link: path + "wp.htm",
				frm: "<div class='frm'><h4>Find a Collection Point</h4>" +
                "<div id='tabs'>" +
                    "<ul>" +
		                "<li><a href='#tabs-1'>Distance</a></li>" +
		                "<li><a href='#tabs-2'>Name</a></li>" +
	                "</ul>" +
                    "<div id='tabs-1'>" +
                        "<label for='lstMiles'>Distance:</label><select id='lstMiles'><option value='5'>5 miles</option><option value='10'>10 miles</option><option value='25' selected='selected'>25 miles</option><option value='50'>50 miles</option><option value='100'>100 miles</option><option value='250'>250 miles</option></select><br>" +
                        "<label for='txtZip'>Zip Code:</label><input id='txtZip' type='text' class='t'/>" +
                    "</div>" +
                    "<div id='tabs-2'>" +
                        "<label for='txtName'>Name</label><input type='text' id='txtName' class='t'/><br>" +
                        "<label for='txtAddress'>Address</label><input type='text' id='txtAddress' class='t'/><br>" +
                        "<label for='ddlState'>State</label><select type='text' id='ddlState'></select><br>" +
                        "<label for='ddlCity'>City</label><select type='text' id='ddlCity' disabled='disabled'></select><br>" +
                        "<label for='ddlZipCode'>Zip Code</label><select id='ddlZipCode' disabled='disabled'></select><br>" +
                    "</div>" +
                "</div>" +
                "<button id='btnSend' type='button'>Submit</button><button id='btnClear' type='button'>Clear</button></div>",

				setcontrols: function () {
					$(widget.frm).appendTo("#widget_container");
					$("#btnSend").click(widget.showdialog);
					$("#btnClear").click(function () {
						$(".t").val("");
						$("#lstMiles option[value='25']").attr("selected", "selected");
						$("#ddlState option[value='-1']").attr("selected", "selected");
						$("#ddlCity").attr("disabled", "disabled").find("option").remove();
						$("#ddlZipCode").attr("disabled", "disabled").find("option").remove();
					});
					$("#txtZip").bind("keypress", function (event) { return numberKeyPress(event); });
					$("#tabs").tabs();
					ajaxJsonPost("GetStates", null, widget.showStates, null);
				},
				showStates: function (data, e) {
					loadDdl("ddlState", data);
					$("#ddlState").bind("change", function () {
						$("#ddlCity").attr("disabled", "disabled").find("option").remove();
						$("#ddlZipCode").attr("disabled", "disabled").find("option").remove();

						if ($("#ddlState").val() != '-1') {
							var s = $("#ddlState").val();
							ajaxJsonPost("GetCities", { "state": "'" + s + "'" }, widget.showCities, null);
						}
					});
				},
				showCities: function (data, e) {
					loadDdl("ddlCity", data);
					$("#ddlCity").bind("change", function () {
						$("#ddlZipCode").attr("disabled", "disabled").find("option").remove();
						if ($("#ddlCity").val() != '-1') {
							var c = $("#ddlCity").val(), s = $("#ddlState").val();

							ajaxJsonPost("GetZipCodes", { "city": "'" + c + "'", "state": "'" + s + "'" }, widget.showZipCodes, null);
						}
					});
				},
				showZipCodes: function (data, e) {
					loadDdl("ddlZipCode", data);
				},
				showdialog: function () {
					var link, indexid;
					if ($("#tabs").length == 0) {
						if ($("#lstMiles").val() != "") { indexid = 0; } else { indexid = 1; }
					}
					else {
						indexid = $("#tabs").tabs("option", "selected");
					}

					if (indexid == 0) {
						var d = $("#lstMiles").val(), z = $("#txtZip").val();
						link = widget.link + "?t=0&d=" + d + "&z=" + z + "&r=" + Math.random();
					}
					else {
						var n = $("#txtName").val(), a = $("#txtAddress").val(), s = $("#ddlState").val(), c = $("#ddlCity").val(), z = $("#ddlZipCode").val();
						if (s == null) s = '-1';
						if (c == null) c = '-1';
						if (z == null) z = '-1';
						link = widget.link + "?" + "t=1&n='" + n + "'&a='" + a + "'&s='" + s + "'&c='" + c + "'&z='" + z + "'&r=" + Math.random();
					}

					if (jQuery.trim($("#txtZip").val()) == '' && indexid == 0) { alert("Please, the zip code is required"); return; }

					widget.dialog = $('<iframe id="wp" scrolling="no" style="width:350px;border:0 !important;padding:0;">').css("height", "550").dialog({
						modal: true,
						open: function () {
							$("#wp").attr("src", link);
						},
						close: function () {
							$("#wp").remove();
							$("#txtZip").select();
						},
						height: 550,
						width: 450,
						resizable: false,
						draggable: false,
						title: 'TRC | COLLECTION POINT LOCATION SEARCH'
					});
					if (window.widgetWp != null) {
						window.widgetWp.main();
					}
				}
			};

		});
	}
})();