// Javascript written by Lauren Schaible.
// http://www.laurenschaible.com
// If you would like to use this code, please keep this note in the file! Thank you!

var cl = {

	theTextarea : document.getElementById('message'),
	theForm : document.getElementById('sms'),
	theSubmit : document.getElementById('Submit'),
	theNumber : document.getElementById('to'),
	
	validPhoneNo : true,
	validMsg : true,
	
	init : function () {
	
		this.util.configEvents();
		this.theCounter.insertCounter();
		this.theTextarea.onkeyup = this.count;
		this.theNumber.onkeyup = this.validate;
		this.util.addEvent(this.theForm, 'submit', cl.submitTest, false)
		//cl.theSubmit.onclick = this.submitTest;
	},
	
	theCounter : {
	
		thePara : document.createElement('p'),
		theRemaining : document.createTextNode('100'),
		
		insertCounter : function(){
			//create elements to insert
			this.thePara.appendChild(this.theRemaining),
			this.thePara.id = 'characters';
	
			//append elements into document
			cl.theForm.appendChild(this.thePara);
		}
	},
	
	count : function (){
		var theValue = this.value;
		var theLength = this.value.length;
		var theTotal = (100 - theLength);
	
		cl.theCounter.thePara.firstChild.replaceData(0,4, theTotal);
	
		if(theTotal < 0){
			cl.theCounter.thePara.className = ' red';
			cl.theSubmit.className = 'invalid';
			cl.validMsg = false;
		}
		if(theTotal >= 0){
			cl.theCounter.thePara.className = '';
			cl.theSubmit.className = '';
			cl.validMsg = true;
		}
	},
	
	validate : function(){
	
		var phoneNo = cl.theNumber.value;
		var noTest = /^\d{0,10}$/;
		var validNo = noTest.test(phoneNo);
		
		if(!validNo){
			cl.theNumber.className = 'red';
			cl.validPhoneNo = false;
		}
		if(validNo){
			cl.theNumber.className = '';
			cl.validPhoneNo = true;
		}
	},
	
	submitTest : function (evt) {
	
		var targetSubmit = cl.util.findTarget(evt, 'input', this);
	
		if(targetSubmit.type = 'submit'){
		
			if(cl.validPhoneNo === false || cl.validMsg === false ){
				cl.util.stopDefault(evt);
				//alert('Sorry! You are either over the character limit or you need to enter a valid phone number.');
			}
		}
	},
	
	util : {
		configEvents : function() {
			if (document.addEventListener) {

				this.addEvent = function(el, type, func, capture) {
				  el.addEventListener(type, func, capture);
				};

				this.stopBubble = function(evt) { evt.stopPropagation(); };

				this.stopDefault = function(evt) { evt.preventDefault(); };

				this.findTarget = function(evt, targetNode, container) {
				  var currentNode = evt.target;
				  while (currentNode && currentNode !== container) {
					if (currentNode.nodeName.toLowerCase() === targetNode) {
						return currentNode; break;
					}
					else { currentNode = currentNode.parentNode; }
					};
				  return false;
				};
			}

			else if (document.attachEvent) {
				this.addEvent = function(el, type, func) {
				  el["e" + type + func] = func;
				  el[type + func] = function() { el["e" + type + func] (window.event); };
				  el.attachEvent("on" + type, el[type + func]);
				};

				this.stopBubble = function(evt) { evt.cancelBubble = true; };

				this.stopDefault = function(evt) { evt.returnValue = false; };

				this.findTarget = function(evt, targetNode, container) {
				  var currentNode = evt.srcElement;
				  while (currentNode && currentNode !== container) {
					if (currentNode.nodeName.toLowerCase() === targetNode) {
						return currentNode; break;
					}
					else { currentNode = currentNode.parentNode; }
				  };
				  return false;
				};
			}
		}
	}
};
cl.init();
