/**
  Austereo Custom Functionality
    CHANGELOG:
      20080926 - Born, broken out from todayNetwork custom JS.
      20081001 - Updating rotator to update every 3 seconds.
      20081002 - Moved more todayNetwork specific JS to fd.todayNetwork.custom.js.
      20081210 - Moved showControlPanelHeight to fd.todaynetwork.custom.js to allow for scrolling in the music widget (applicable only to Today brands).
      20081215 - Added an anchor tag check on the rotator thumbnail (to resolve which feature div is "active")
 **/


if(window['FD']) {
  FD.austereo = new Class({

    backgroundResize: false,

    Implements: Options,

    options: {
      contentRegoCheckerEmailCheckPath: "/action/membershipEmailCheck",
      contentRegoCheckerRedirctPath: "/membership/forgottenDetails",
      featureLoopDelay: 3000
    },

    initialize: function() {
      this.setOptions();

      // Init feature loop (if any)
      this._initFeatureLoop();
      this._initControlTabs();
      this._initAutoInputs();
	  this._initValidateForm();
	  this._initRegistrationForm();
    },

    /* FEATURE LOOP */
    _initFeatureLoop: function() {
  		var featureParentDiv = $('featurehighlights'), subHighlights = $('sub_highlights');
  		if(featureParentDiv && subHighlights) {
        this._featureLoopPos = 0;
        // Add mouse events to stop/start feature looper
        featureParentDiv.addEvents({
          "mouseenter": this._stopFeatureLoop.bind(this)
        });
        // Add mouse over events to little icons change to hovered position
        featureParentDiv.getElements("div.heading").inject(subHighlights).addEvent("mouseenter", this._jumpLoopPos.bindWithEvent(this));
        subHighlights.getElement("div.heading").addClass("active");
        this._startFeatureLoop();
  		}
    },

    _startFeatureLoop: function() {
      this._featureLoopID = this._loopFeature.create({
        bind: this,
        periodical: this.options.featureLoopDelay
      })();
    },

    _stopFeatureLoop: function() {
      $clear(this._featureLoopID);
    },

    _loopFeature: function() {
      var features = this.getFeatureHighlights();
      if(features) {
        var pos = ((this._featureLoopPos + 1) == features.length) ? 0 : this._featureLoopPos + 1;
        this._setLoopPos(features, pos);
      }
    },

    _setLoopPos: function(features, pos) {
      if(features) {
        if(features && features[pos]) {
          features.removeClass("active");
          features[pos].addClass("active");
          var headings = this.getFeatureHeadings();
          headings.removeClass("active");
          headings[pos].addClass("active");
          this._featureLoopPos = pos;
        }
      }
    },

    _jumpLoopPos: function(e) {
      if(e && e.target) {
        var target = $(e.target);
        if(target.get('tag') == "img") {
          target = target.getParent();
        }
        if(target.get('tag') == "a") {
          target = target.getParent();
        }
        // Get the hovered pos
        var tag = target.get('tag');
        var headings = this.getFeatureHeadings();
        var features = this.getFeatureHighlights();
        for(var pos = 0; pos < headings.length; pos++) {
          if(headings[pos] == target) {
            this._setLoopPos(features, pos);
            return true;
          }
        }
      }
    },

    getFeatureHighlights: function() {
      return $$('#highlights .highlight');
    },

    getFeatureHeadings: function() {
      return $$('#sub_highlights .heading');
    },
    /* END FEATURE LOOP */

  	/* CONTROL TABS */
  	_initControlTabs: function() {
  		var cp = $$('.cPanel');
  		if(cp) {
			for (var i=0; i < cp.length; i++ ) {
				var tabs = cp[i].getElements("ul.controltabs");
				if(tabs) {
				  tabs.addEvent("click", this.swapTab.bindWithEvent(this, cp[i]));
				}
			}
  		}
  	},

  	swapTab: function(e, cp) {
  		if(e && e.target) {
  			new Event(e).stop();
  		   var target = $(e.target);
  		   if(target.get('tag') != "a") {
  			   target = target.getElement("a");
  		   }
  		   // Switch tabs:
  		   var tabAnchors = cp.getElements("ul.controltabs a");
  		   for(var a = 0; a < tabAnchors.length; a++) {
  			   var tabAnchorParent = tabAnchors[a].getParent();
  			   tabAnchorParent.removeClass("selected");
  			   if(tabAnchors[a] == target) {
  				   tabAnchorParent.addClass("selected");
  			   }
  		   }
  		   // Get the class of the tab to show
  		   if(target) {
  			   var href = target.href;
  			   var tabClass = href.substr(href.lastIndexOf("#") + 1);
  			   var tabDivs = cp.getElements("div.controltab");
  			   // Remove selected class from all divs
  			   for(var a = 0; a < tabDivs.length; a++) {
  				   tabDivs[a].removeClass("selected");
  				   if(tabDivs[a].hasClass(tabClass)) {
  					   tabDivs[a].addClass("selected");
  				   }
  			   }
  		   }
  		}
  	},

  	/* AUTO INPUTS */
  	_initAutoInputs: function() {
  		var inputs = $$("form.autoInput input");
  		for(var a = 0; a < inputs.length; a++) {
  			// Get inputs of type text from the form
  			if(inputs[a].type == "text") {
          if(inputs[a].value != "") {
            inputs[a].addClass("userInput");
          }
  				inputs.addEvent("focus", function(e) {
  					if(e && e.target) {
  						var f = $(e.target);
  						if(f.type == "text" && f.value == f.defaultValue) {
  							f.value = "";
  							f.addClass("userInput");
  						}
  					}
   			    }.bind(this));
  				inputs.addEvent("blur", function(e) {
  					if(e && e.target) {
  						var f = $(e.target);
  						if(f.type == "text" && f.value == "") {
  							f.value = f.defaultValue;
  							f.removeClass("userInput");
  						}
  					}
   			    }.bind(this));
  			}
  		}
  	},

	/* Validate forms
	   ------------------------------------------------------------------------------------------- */
	_initValidateForm: function() {
		var aForms = $$("form.validateMe");
		for ( i=0; i<aForms.length; i++ ) {
			var aButtonLinks = aForms[i].getElements('a.button');
			aButtonLinks[0].addEvent('click', this.triggerFormSubmit.bind(this, aButtonLinks[0])); // set the onclick handler for the button link
		}
	},

	validateRequired: function(oElement) {
		if (oElement && oElement.value) {
			this.toggleErrorMessage(oElement, '');
			return true;
		}
		this.toggleErrorMessage(oElement, 'This input is required.');
		return false;
	},

	validateMinLength: function(oElement, iLength) {
		if ( oElement && (oElement.value.length >= iLength) ) {
			this.toggleErrorMessage(oElement, '');
			return true;
		}
		this.toggleErrorMessage(oElement, 'The minimum length required is '+iLength+' characters.');
		return false;
	},

	toggleErrorMessage: function(oElement, sMessage) {
		var oMessageLI = oElement.getParent().getPrevious();
		var aMessageSpan = oMessageLI.getElements("span");

		if (sMessage) {
			aMessageSpan[0].innerHTML = sMessage;
			oMessageLI.removeClass("hidden");
		} else {
			oMessageLI.addClass("hidden");
		}
	},

	validateForm: function(oForm) {
			var aFormElements = oForm.getElements("input");
			var formValRes = true;

			for ( i=0; i<aFormElements.length; i++ ) {
				if ( aFormElements[i].hasClass("validate") ) {
					var elementValRes = true;
					var aClasses = aFormElements[i].className.split(' ');

					for ( j=0; j<aClasses.length; j++ ) {
						switch (aClasses[j]) {
							case 'required':
								if (!this.validateRequired(aFormElements[i])) elementValRes = false;
								break;
							case 'minLength3':
								if (!this.validateMinLength(aFormElements[i], 3)) elementValRes = false;
								break;
							case 'minLength6':
								if (!this.validateMinLength(aFormElements[i], 6)) elementValRes = false;
								break;
						}// switch
						// Break out of loop on first error, leaving first error message on screen:
						if ( elementValRes == false ) {
							break;
						}
					}// for
					if ( elementValRes == false ) formValRes= false;
				}// if
			}// for
			if ( formValRes == true ) {
				oForm.submit(); // submit form
			}
	},
	triggerFormSubmit: function(oLink) {
		var parent = oLink.getParent();
		while ( (parent.get("tag") != "form") && (parent.get("tag") != "body") ) {
			parent = parent.getParent();
		}
		this.validateForm(parent);
	},


	/* Registration form
	   ------------------------------------------------------------------------------------------- */
	_initRegistrationForm: function() {
		var aForms = $$("form.frmMemberProfile");
		for ( i=0; i<aForms.length; i++ ) {
			var aListElement = aForms[i].getElements('li');
			for ( j=0; j<aListElement.length; j++ ) {
				if ( aListElement[j].hasClass("country") ) {
					var oSelect = $('country');
					oSelect.addEvent('change', this.toggleStatePostcode.bind(this, oSelect));
				}
			}
            var logoutTest = $('logoutbutton');
            if(logoutTest) {}
            else {
                var aListElement = aForms[i].getElements('input');
                for ( j=0; j<aListElement.length; j++ ) {
				    if ( aListElement[j].id == "email") {
                        aListElement[j].addEvent("change", this.emailChanged.bindWithEvent(this, aListElement[j]));
                    }
		    	}
            }
        }
		if (oSelect) this.toggleStatePostcode(oSelect); // Show state/postcode if 'Australia' is selected
    },

    /* Makes a request to check email address */
      emailChanged: function(e, f) {
        if(e) {
         new Event(e).stop();
        }

        var emailvalue = f.value;
        if(emailvalue) {
            var params = {"email": emailvalue};
            var tabUrl = this.options.contentRegoCheckerEmailCheckPath;
            new Request({
              url: tabUrl,
              onComplete: this.handleEmailChangedResponse.create({"bind": this}),
              autoCancel: true
            }).get(params);
        }
      },

      /*          Note: Element.getElementById cannot be used to retrieve elements from the response as the elements we're
         looking for aren't actually in the document. */
      handleEmailChangedResponse: function(response) {
        if (response && response == "true") {
            var aForms = $$("form.frmMemberProfile");
            for ( i=0; i<aForms.length; i++ ) {
                var aListElement = aForms[i].getElements('input');
                var tabUrl = this.options.contentRegoCheckerRedirctPath;
                var separ = "?";
                for ( j=0; j<aListElement.length; j++ ) {
                    if ( aListElement[j].id == "email" && aListElement[j].value != "") {
                        tabUrl = tabUrl + separ + "email=" + aListElement[j].value;
                        separ = "&";
                    }
                    if ( aListElement[j].name == "newsletterId" && aListElement[j].value != "") {
                        tabUrl = tabUrl + separ + "newsletterId=" + aListElement[j].value;
                        separ = "&";
                    }
                    if ( aListElement[j].name == "function" && aListElement[j].value != "") {
                        tabUrl = tabUrl + separ + "function=" + aListElement[j].value;
                        separ = "&";
                    }
                    if ( aListElement[j].name == "action" && aListElement[j].value != "") {
                        tabUrl = tabUrl + separ + "action=" + aListElement[j].value;
                        separ = "&";
                    }
                }
                window.open(tabUrl,'details','width=350,height=192,resizable,noscroll');
             }
         }
      },


    toggleStatePostcode: function(oListElement) {
		var oUl = oListElement.getParent().getParent();
		var aListElement = oUl.getElements('li');
		for ( j=0; j<aListElement.length; j++ ) {
			if ( (aListElement[j].hasClass("state")) || (aListElement[j].hasClass("postcode")) ) {
				if (oListElement[oListElement.selectedIndex] && oListElement[oListElement.selectedIndex].text == 'Australia' ) {
					aListElement[j].removeClass("hidden");
				} else {
					aListElement[j].addClass("hidden");
				}
			}
		}
	}




  });


/* Profile form
   ------------------------------------------------------------------------------------------- */
function enableSave() {
	var newSpan = document.createElement("span");
	var newText = document.createElement('a');
	newText.setAttribute('class', 'button smallButton top');
	newText.setAttribute('className', 'button smallButton top');
	newText.setAttribute('href', 'javascript:document.profile.submit();');
	newText.setAttribute('onclick', 'document.profile.submit();');
	var theLinkText = document.createTextNode('Save Profile');
	newText.appendChild(theLinkText);
	var newSpanElem = document.createElement("span");
	newText.appendChild(newSpanElem);
	newSpan.appendChild(newText);

	var para = document.getElementById("saveBtn");
	var spanElm = document.getElementById("saveBtnSpan");
	var replaced = para.replaceChild(newSpan, spanElm);

	var newSpan1 = document.createElement("span");
	var newText1 = document.createElement('a');
	newText1.setAttribute('class', 'button smallButton');
	newText1.setAttribute('className', 'button smallButton');
	newText1.setAttribute('href', 'javascript:document.profile.submit();');
	newText1.setAttribute('onclick', 'document.profile.submit();');
	var theLinkText1 = document.createTextNode('Save Profile');
	newText1.appendChild(theLinkText1);
	var newSpanElem1 = document.createElement("span");
	newText1.appendChild(newSpanElem1);
	newSpan1.appendChild(newText1);

	var para1 = document.getElementById("saveBtn1");
	var spanElm1 = document.getElementById("saveBtnSpan1");
	var replaced1 = para1.replaceChild(newSpan1, spanElm1);
}

var austereo;
function initAustereo () {
	austereo = new FD.austereo();
}

FD.register("Austereo", 1);
}
