//Load the signup widget application.
var PCJoiner1;
document.observe("dom:loaded",function(){
	PCJoiner1 = new consOpenSignupClass2({
		instance: "PCJoiner1", // Required
		triggerID: "PC_Add_Name_Button", // Required
		formconfig: "/modules/signup/2.0/signupforms/powercircles.json", // Required
		title: "Add your name to the Power Circle!", //Optional
		customCSS: "/modules/signup/2.0/signupforms/PowerCircles.css", //Optional
		onload: function(){
			//This fires after all other initialization has been completed.
			Event.observe($('PowerCircleMessage_PCJoiner1'), 'keyup', this.onmsgentry.bind(PCJoiner1));
			var msglabel = $$('#signup_widget_textarea_field_container_PowerCircleMessage_PCJoiner1_label label')[0];
			var maxdispitem = document.createElement('span');
			maxdispitem.id = 'PCJoiner1_maxcharacter_label';
			Element.insert(msglabel,{ bottom: maxdispitem });
			maxdispitem = $(maxdispitem);
			maxdispitem.setStyle({
				"fontSize":"0.75em",
				"paddingLeft":"2px"
			});
			Event.observe($(this.triggerID), 'click', this.onopen.bind(PCJoiner1));
		},//Optional
		onopen: function(){
			Event.observe($('consOpenSignupCloser_PCJoiner1'),'click',this.config.onclose.bind(this));
			Event.stopObserving($(this.config.triggerID), 'click');
			var PowerCircleFlashVid = document.createElement('div');
			PowerCircleFlashVid.id = "PowerCircleFlashVid2";
			Element.insert($('PowerCircleFlashVid'),{ before: PowerCircleFlashVid })
			Element.remove($('PowerCircleFlashVid'));
			PowerCircleFlashVid.setAttribute("id","PowerCircleFlashVid");
		},
		onclose: function(e){
			swfobject.embedSWF("/getinvolved/iampowerful/care.swf", "PowerCircleFlashVid", "490", "505", "8.0.0","", flashvars, params, attributes);
			Event.stopObserving($('consOpenSignupCloser_PCJoiner1'), 'click');
			Event.observe($(this.config.triggerID),'click',this.Display.bind(this));
			Event.observe($(this.config.triggerID),'click',this.config.onopen.bind(this));
		},
		onsubmit: function(e){
			//This is attached as a submit event handler to this form instances' submit button.
			//There is not guarentee it will fire before or after the default action, although it's
			//attached after that event is.  The binding for "this" is the current instance object.
			if(e.type == "submit"){
				if(this.formdata.form.usevalidation == "t" && this.Validate()){
					$('SignupWidgetSubmit_PCJoiner1').disable();
					var _RequestParams = this.FormInstanceID.serialize(true);
					var _method = "post";
					var _action = "powercircleapi.asp";
					this.Request(this.config.circlesubmited,_action,_RequestParams,_method);

					this.FormTitleID.style.display = "none";
					this.FormInstanceID.style.display = "none";

					var processingGif = document.createElement('img');
					processingGif.src = this.formdata.procimg;

					var workingElement = document.createElement('div');
					workingElement.id = this.config.instance + '_Working_Element';
					Element.insert(this.WidgetInstanceID,{ top: workingElement });
					workingElement = $(workingElement);
					this.workingElement = workingElement;
					workingElement.setStyle({
						"fontSize":"2.0em",
						"backgroundColor":"#333",
						"fontWeight":"700",
						"color":"#eee",
						"padding":"5px",
						"width":"98%",
						"border":"1px #333 solid",
						"marginTop":"4px",
						"display":"block",
						"textAlign":"center"
					});
					workingElement.innerHTML = 'Saving your Power Circle<br/>please wait...';
					Element.insert(workingElement,{ bottom: processingGif });

				}
			}
			else{}
		}, //Optional
		onerror: function(){}, //Optional
		onmsgentry: function(e){
			var msgField = $('PowerCircleMessage_PCJoiner1');
			var maxCharMsg = $('PCJoiner1_maxcharacter_label');
			var maxChars = 250;
			currentChars = msgField.value.length;
			var charsLeft = (maxChars - currentChars);
			maxCharMsg.innerHTML = charsLeft + " of 250 Maximum Characters";
			if(charsLeft <= 0){
				msgField.value = msgField.value.substr(0,maxChars);
				maxCharMsg.setStyle({"color":"#900"});
				maxCharMsg.innerHTML = "Maximum Characters Reached";
			}
			else{
				maxCharMsg.setStyle({"color":"#666"});
				maxCharMsg.innerHTML = charsLeft + " of 250 Maximum Characters";
			}
		},
		circlesubmited: function(http){
			var _this = http.request.options.scope;
			var successElement = document.createElement('div');
			successElement.id = 'PCJoiner1_Success_Element';
			Element.remove(_this.workingElement);
			Element.insert(_this.WidgetInstanceID,{ top: successElement })
			successElement = $(successElement);
			_this.successElement = successElement;
			successElement.setStyle({
				"fontSize":"1.0em",
				"marginLeft":"110px",
				"width":"336px",
				"height":"331px",
				"display":"none"
			});
			successElement.innerHTML = '<div><div id="PCJoiner1_Success_Element_Name"></div><div id="PCJoiner1_Success_Element_Country"></div></div><p id="PCJoiner1_Success_Element_Message"></p>';
			var _data = http.responseJSON;

			$('PCJoiner1_Success_Element_Name').innerHTML = _data.response_data.firstname + " " + _data.response_data.lastname;
			$('PCJoiner1_Success_Element_Country').innerHTML = _data.response_data.country;
			$('PCJoiner1_Success_Element_Message').innerHTML = _data.response_data.message;

			$('SignupWidgetSubmit_PCJoiner1').enable();
			_this.successElement.style.display = "block";
			Event.observe($$("body")[0], 'click', _this.config.onclose.bind(PCJoiner1));
			Event.observe($$("body")[0], 'click', _this.Reset.bind(PCJoiner1));
		}
	});
});