﻿/*
 *
 *
 *
 */
(function($) { 
$.Checkout = function(options) {
	this.options = $.extend({}, $.Checkout.DEFAULTS, options || {}); 
	this.id = this.options.planid;
    if(options.planid)this.planid = options.planid;
    if(options.channel)this.channel= options.channel;
    if(options.type) this.type = options.type;
	this.run(options);
};

$.Checkout.EF = function() {};
$.extend($.Checkout, {DEFAULTS: {id:'checkout',onPaid:$.Checkout.EF}});

$.Checkout.prototype ={
   debug:false,
   planid:'',
   type:3,
   channel:0,
   win :false,
   addr :{},
   cc:{},
   CouponCode:{},
   ShowGoogleCheckout: false,
   run:function(options){
      if(options.planid)this.planid = options.planid;
      if(options.channel)this.channel= options.channel;
      if(options.type) this.type = options.type;
      if(this.win) return;
	 var self = this;
	 this.win = new Boxy(this._createLayout(), { title: 'CellSwapper.com Checkout',beforeUnload:function(){  	       
	        self.win = false;
	       return true;
	 }});
	  
	 var t = {method:"post",step:3,postingtype:this.type,planid:this.planid};
	 $.postJSON("/plan/plan.ashx?r="+(new Date().getTime()),t,function(msg) {
         if(msg.success){
           self.go();
         }else{//fix hash
           self.status('&nbsp;');  
         }
      });   
   },
   
   go:function(){  
     var t = {method:"go"};
     var self = this;
	 $.postJSON("/checkout/checkout.ashx?r="+(new Date().getTime()),t,function(msg) {
         self.status('&nbsp;'); 
         if(msg.success){ 
            if(msg.message.ShowGoogleCheckout!=null)
                self.ShowGoogleCheckout = msg.message.ShowGoogleCheckout;
                
           self[msg.message.method](msg.message.args);
         }else{//fix hash
         }
      });
   },
   
   _createLayout:function(){
	  var content = '<ul class="menu"><li><a class="address" href="javascript:void(0);">Address</a></li>';
	  content += '<li><a class="payment" href="javascript:void(0);">Pay</a></li>';
	  content += '</ul>';
	  content +='<div class="checkout"><p style="width:300px;padding:20px;">Loading...<img scr="/images/loading.gif" alt="" /></p></div>';
	  return content  ;
   },
   
   OnCartEmty:function(){
       alert('Your cart is empty');
   },
   
   getState:function(){
	    var content = "";
	    for(var i = 0; i< loc.States.length;i++){
	      content += '<option value="'+loc.States[i].Id+'">'+loc.States[i].Name+'</option>';
	   }
	   
	  return content;
	},
	
	updateAddr:function(){
	   var self = this;
	   $.postJSON("/checkout/checkout.ashx",self.addr, function(msg) {
	       // checkout.win.setStatusBar('&nbsp;');
           if(self.debug==true)
            alert("msg.message.method="+ msg.message.method);
            
           self[msg.message.method](msg.message.args);
        });
	},
	
   ShowAddress:function(arg){
       var content =  '  <div class="address"> ' 
                  +'       <h1> '+arg.Title+'          </h1>'
                  +'        <span class="CheckoutDescription"><span>Please enter your billing address</span> </span>'
                  +'          <ul class="login address">'
                  +'              <li>'
                  +'                  <label>Country</label>'
                  +'                  <select class="country">'
                  +'                      <option value="en-AU">Australia</option>'
                  +'                      <option value="en-CA">Canada</option>'
                  +'                      <option value="es-ES">Spain</option>'
                  +'                      <option value="en-GB">United Kingdom</option>'
                  +'                      <option selected="selected" value="en-US">United States</option>'
                  +'                  </select>'
                  +'              </li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      First Name'
                  +'                  </label>'
                  +'                  <input size="20" type="text" class="firstname" /></li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      Middle Initial'
                  +'                  </label>'
                  +'                  <input maxlength="1" size="2" class="middlename" type="text" /></li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      Last Name'
                  +'                  </label>'
                  +'                  <input size="20" class="lastname" type="text"></li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      Company Name'
                  +'                  </label>'
                  +'                  <input size="20" class="company" type="text" />'
                  +'              </li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      Address'
                  +'                  </label>'
                  +'                  <input size="20" class="address" type="text" />'
                  +'              </li>'
                  +'              <li>'
                  +'                  <label>&nbsp;</label>'
                  +'                  <input size="20" class="address2" type="text" />'
                  +'              </li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      City/Locality'
                  +'                  </label>'
                  +'                  <input class="city" type="text" />'
                  +'              </li>'
                  +'              <li>'
                  +'                  <label>Province</label>'
                  +'                  <select class="state">' ;
                  content +=this.getState();
                  content +='                  </select>'
                  +'              </li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      Postal Code</label>'
                  +'                  <input class="zip" type="text" /></li>'
                  +'              <li>'
                  +'                  <label>'
                  +'                      Phone</label>'
                  +'                  <input class="phone" type="text" />'
                  +'              </li>'
                  +'              <li>'
                  +'                  <input class="button"  src="/images/Continue.png" type="image" />'
                  +'              </li>'
                  +'          </ul>'
                  +'      </div>';

	   $("div.checkout").html(content);
	   this.win.setTitle(arg.Title);
	   
	   if(arg.Address.length >0) {
	       this.addr = arg.Address[arg.Address.length-1];
	       $(".address .country").val(this.addr.CountryCode);
	       $(".address .firstname").val(this.addr.FirstName);
	       $(".address .middlename").val(this.addr.MiddleInitial);
	       $(".address .lastname").val(this.addr.LastName);
	       $(".address .company").val(this.addr.CompanyName);
	       $(".address input.address").val(this.addr.StreetLine1);
	       $(".address .address2").val(this.addr.StreetLine2);
	       $(".address .city").val(this.addr.City);
	       $(".address .state").val(this.addr.StateCode);
	       $(".address .zip").val(this.addr.PostalCode);
	       $(".address .phone").val(this.addr.PhoneNumber);
	    }         
	    
	    this.addr.type = arg.Type;
	    this.addr.method = "address";
	    var self = this;
	    $(".address .button").click(function(){
	       self.addr.CountryCode=$(".address .country").val();
	       self.addr.CountryName=$('.address .country').find(':selected').text();
	       
	       self.addr.FirstName=$(".address .firstname").val();
	       self.addr.MiddleInitial=$(".address .middlename").val();
	       self.addr.LastName=$(".address .lastname").val();
	       self.addr.CompanyName=$(".address .company").val();
	       self.addr.StreetLine1=$(".address input.address").val();
	       self.addr.StreetLine2=$(".address .address2").val();
	       self.addr.City=$(".address .city").val();
	       self.addr.StateCode=$(".address .state").val();
	       self.addr.PostalCode=$(".address .zip").val();
	       self.addr.Phone=$(".address .phone").val();
	       self.updateAddr();
	    });
   },
   getMonths:function(){
      var months = '<select class="exp_month" style="width:40px;">';
      for(var i = 1 ; i< 13 ;i++){
         months += '<option value='+i+' >'+i+'</option>';
      }
      
      return months + "</select>";
   },
   
   getYears:function(){
       var years = '<select class="exp_year"  style="width:70px;">';
       var cur = new Date().getFullYear();
      for(var i = cur ; i< cur+10 ;i++){
         years += '<option value='+i+' >'+i+'</option>';
      }
      
      return years + "</select>";
   },
  
   ShowPayment:function(){
       var content = '<div class="payment" style="height:auto">'
                  + '<h3>'
                  + '<img  src="/images/resources/CC_Visa.gif" /><img src="/images/resources/CC_MasterCard.gif" /><img  src="/images/resources/CC_Discover.gif" /><img  src="/images/resources/CC_Amex.gif" /> </h3>'
                  + '<ul class="login cards"><li><label>Card Type</label><select class="cc"><option value="0" selected="selected">< Select A Card Type ></option>'
		          + '<option value="4">American Express</option><option value="3">Discover</option><option value="2">MasterCard</option><option value="1">Visa</option>'
		          + '</select></li><li><label>Card Number</label>'
                  + '<input type="text" size="20" maxlength="20" class="number" id="cardnumber" /></li>'
                  + '<li><label>Exp. Date</label>'
                  + this.getMonths()+"/"+this.getYears()+'</li>'
                  + '<li><label>Security Code<a onclick="JavaScript:window.open(\'/cvv.aspx\',\'CVV\',\'width=320, height=400, menubar=no, scrollbars=yes, resizable=yes, status=no, toolbar=no\')" style="cursor: pointer;">?</a></label><input type="text" class="code" id="cardcode" autocomplete="off" maxlength="4" />'
                  + ' </li>'
                  + '<li><label>Name On Card</label><input type="text" id="cardholder" autocomplete="off" class="name" size="20"/></li></ul>'
                  + '<p style="padding:5px; text-align:center;"><input type="image" name="cctype" class="button" src="/images/Continue.png" /></p>'
                  
                  + '<ul class="login cards"><li><label>Coupon Code</label><input type="text" size="20" maxlength="15" class="number" id="txtCouponCode" name="txtCouponCode" /><input class="promocode" type="button" id="btnCouponCode" name="btnCouponCode" value="Apply" /></li></ul>'
                  
                  + '<p style="padding:5px;"><a href="javascript:void(0);" class="paypal"><img src="/images/resources/PayPal.gif" /></a>';
            //alert(this.ShowGoogleCheckout);
            if( this.ShowGoogleCheckout){
                content+=' <a href="javascript:void(0);" class="google" stylel="margin-left:7px;"><img src="/images/google_checkout.gif" /></a>';
            }
                content+='</div>';
                
	  $("div.checkout").html(content);
	  this.win.setTitle('Shipping and Payment');
	  new LiveValidation("cardcode",{validMessage:''}).add(Validate.Format, { pattern: /\d{3,4}/i ,failureMessage:''});
	  new LiveValidation("cardnumber",{validMessage:''}).add(Validate.Format, { pattern: /[\d\-\s]+/i ,failureMessage:''});
	  var lvh = new LiveValidation("cardholder",{validMessage:''});
	  lvh.add(Validate.Presence,{ failureMessage:''});
	 // lvh.add(Validate.Format,{pattern: /\w{1,15}/i , failureMessage:''});
	 var self = this;
	 
	 self.ShowCouponCode();
	 
	 $(".paypal").click(function(){  self.win.setTitle('Paypal');
        $("div.checkout").html('<div style="position:relative;clear:both;display:block;overflow:hidden;width:880px;height:650px;border:0"><iframe src="/checkout/Paypal_Redirect2.aspx" style="width:880px;height:650px;border:0;overflow:hidden;" /></div>'); 
      });
      $(".google").click(function(){  self.win.setTitle('Google Checkout');
        $("div.checkout").html('<div style="position:relative;clear:both;display:block;overflow:hidden;width:880px;height:650px;border:0"><iframe src="/GoogleCheckout.aspx" style="width:880px;height:650px;border:0;overflow:hidden;" /></div>'); 
      });
	  $(".payment .button").click(function(){
	       self.cc.method = "payment";
	           self.cc.CreditCardType = $(".payment .cc").val();
	           if(self.cc.CreditCardType<=0){
	                alert("Please select a card type. ");
	                return false;
	           }
	           self.cc.PaymentMethod =0;
	           self.cc.PaymentType=0;
	           self.cc.CreditCardNumber=$(".payment .number").val();
	           if(self.cc.CreditCardNumber.trim()==""){
	            alert("Card Number is required");
	            return false;
	           }
	           self.cc.CreditCardHolder=$(".payment .name").val();
	           if(self.cc.CreditCardHolder.trim()==""){alert("Name on card is required");return false;}
	           self.cc.CreditCardExpMonth=$(".payment .exp_month").val();
			   self.cc.CreditCardExpYear=$(".payment .exp_year").val();
			    if(self.cc.CreditCardExpYear< new Date().getFullYear()) {
			      alert("Please input card expiration date. ");
				  return false;  
			    } 
			    
	           self.cc.CVV = $(".payment .code").val();
	           if(self.cc.CVV.trim() == ""){
	             alert("Security code is required");
	             return false;
	            }
	            self.SavePayment();
	    });
	    $(".payment #btnCouponCode").click(function(){
	        
	        self.CouponCode.method = "CouponCode";
	        self.CouponCode.txtCouponCode = $(".payment #txtCouponCode").val();
	        if(self.CouponCode.txtCouponCode.trim()=="")
	        {
	            alert("Promo code is required.");
	            return false;
	        }
	        self.SaveCouponCode();
	    });
   },
  
   loading:function(){
      this.status('<img src="/im/images/load2.gif" alt="" />Processing...');
   },
  
   status:function(msg){
       var odc = this.win.getContent();
       if(odc.find("div.status").length>0)
       {
          odc.find("div.status").html(msg);
       }else{
          odc.append($('<div class="status" />').html(msg));
       }
   },
   
   SavePayment:function(){
       this.loading();
       var self = this;
	   $.postJSON("/checkout/checkout.ashx",self.cc, function(msg) {
	     self.status('');
         ////
         ////alert(msg.success);
         if(msg.success){
           alert("Thank you! Your payment has successfully been processed.");
             self._fire("onPaid",self.planid);
           self[msg.message.method](msg.message.args);
         }else{
            alert(msg.message.args);
         }
       });
	},
	ShowCouponCode: function(){
	    var self = this;
	    var t= {method:"showcoupon"}
	    $.postJSON("/checkout/checkout.ashx?r="+(new Date().getTime()),t,function(msg) {
             self.status('&nbsp;'); 
             if(msg.success){ 
               //self[msg.message.method](msg.message.args);
               $(".payment #txtCouponCode").val(msg.message.args.CouponCode);
	            self.CouponCode.txtCouponCode = msg.message.args.CouponCode;
             }
          });
	},
	
	SaveCouponCode:function(){
     //var qstr = {method:"CouponCode"};
     var self = this;
     $.postJSON("/checkout/checkout.ashx",self.CouponCode, 
	    function(msg) 
	    {
            self.status('&nbsp;'); 
            if(msg.success)
             { 
               if(msg.message.args.CouponCode != null)
               alert("Thank you! Your promotional code has been accepted.");
               //self[msg.message.method](msg.message.args);
             }
             else
             {
               alert("Sorry! Coupon code cannot be applied.");
             //fix hash
             }
      });
	},
	close:function(){
	   if(this.win)this.win.unload();
	},
	done:function(){
	   this.win.unload();
//	   if(chat.channel(this.channel)!=undefined) 
//	    chat.channel(this.channel).swapper.onPaid();  
//       if(this.type==3){
//	       this.win.setTitle('Checkout Ready');
//           this.win.setContent('<div style="text-align:center;padding:10px;" ><h3>Please wait for a while.</h3></div>');
//       }else{
//          //checkout.win.getContent().update('<div style="text-align:center;padding:10px;" ><h3>Thanks for your posting.</h3></div>');
//          $.wizard.promote();
//       }
       var self = this;
       window.setTimeout(function(){self.close();},500);
	 
	},
	
	_fire: function(event,args) {
        this.options[event].call(this,args);
    }
}

})(jQuery);	