@extends('web.layout.app')
@section('css')

@endsection
@section('content')
	<div class="page-title donate-page-title">
    	<h1></h1>

    </div>
    {!! Form::open(['url' => 'donation', 'method' => "POST", 'onsubmit' => "return checkForm()"]) !!}
	<div class="section donate-section">
        <div class="container">
        <h2>DONATE HERE</h2>
        	<div class="row">
        		<div class="col-md-3">
                
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="18" onclick="addSubTotalDollarAmt(this.form);" > <span>1 x Chai = $18</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="36" onclick="addSubTotalDollarAmt(this.form);"> <span>2 x Chai = $36</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="54" onclick="addSubTotalDollarAmt(this.form);"> <span>3 x Chai = $54</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="72" onclick="addSubTotalDollarAmt(this.form);"> <span>4 x Chai = $72</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="90" onclick="addSubTotalDollarAmt(this.form);"> <span>5 x Chai = $90</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="108" onclick="addSubTotalDollarAmt(this.form);"> <span>6 x Chai = $108</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="126" onclick="addSubTotalDollarAmt(this.form);"> <span>7 x Chai = $126</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="144" onclick="addSubTotalDollarAmt(this.form);"> <span>8 x Chai = $144</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="162" onclick="addSubTotalDollarAmt(this.form);"> <span>9 x Chai = $162</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="Chai[]" value="180" onclick="addSubTotalDollarAmt(this.form);"> <span>10 x Chai = $180</span>
                    </label>
                  </div>
                  <div class="clearfix"></div>
                </div>
                
        		<div class="col-md-3">
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="250" onclick="addSubTotalDollarAmt(this.form);"> <span>$250</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="360" onclick="addSubTotalDollarAmt(this.form);"> <span>$360</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="500" onclick="addSubTotalDollarAmt(this.form);"> <span>$500</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="720" onclick="addSubTotalDollarAmt(this.form);"> <span>$720</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="1000" onclick="addSubTotalDollarAmt(this.form);"> <span>$1,000</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="2500" onclick="addSubTotalDollarAmt(this.form);"> <span>$2,500</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="5000" onclick="addSubTotalDollarAmt(this.form);"> <span>$5,000</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="10000" onclick="addSubTotalDollarAmt(this.form);"> <span>$10,000</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="25000" onclick="addSubTotalDollarAmt(this.form);"> <span>$25,000</span>
                    </label>
                  </div>
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit[]" value="0"> <span>Other $</span> <input type="text" onChange="addSubTotalDollarAmt(this.form);" onKeyUp="addSubTotalDollarAmt(this.form);" name="any_amount" style="width:50%;" value="">
                    </label>
                  </div>
                  <div class="clearfix"></div>
                </div>
                
        		<div class="col-md-6">
                
                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              <input type="checkbox" name="addit_Keren_Kayemes1" value="300" onclick="addSubTotalDollarAmt(this.form);"> <span>Keren Kayemes-Plan 1</span>
                            </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              Plan 1 $300.00
                            </label>
                          </div>
						</div>
					</div>
                    
                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              <input type="checkbox" name="addit_Keren_Kayemes2" value="600" onclick="addSubTotalDollarAmt(this.form);"> <span>Keren Kayemes-Plan 2</span>
                            </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              Plan 2 $600.00
                            </label>
                          </div>
						</div>
					</div>
                    
                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              <input type="checkbox" name="addit_Keren_Kayemes3" value="1200" onclick="addSubTotalDollarAmt(this.form);"> <span>Keren Kayemes-Plan 3</span>
                            </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              Plan 3 $1,200.00
                            </label>
                          </div>
						</div>
					</div>
                    
                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              <input type="checkbox" name="addit_Keren_GMach" value="5000" onclick="addSubTotalDollarAmt(this.form);"> <span>Keren G’Mach</span>
                            </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                            <label>
                              $5,000.00
                            </label>
                          </div>
						</div>
					</div>

                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                                <label>
                                  <input type="checkbox" value="0" onclick="addSubTotalDollarAmt(this.form);"> <span>Ezer L'Yoldos</span>
                                </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                              <label>
                              	<input class="contact" type="text" name="any_amount2" value="" onChange="addSubTotalDollarAmt(this.form);" onKeyUp="addSubTotalDollarAmt(this.form);">
                              </label>
                          </div>
						</div>
					</div>

                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                                <label>
                                  <input type="checkbox" name="addit_Ezer_Nisuin" value="0"> <span>Ezer Nisuin</span>
                                </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                              <label>
                              	<input class="contact" type="text" name="any_amount3"  value="" onChange="addSubTotalDollarAmt(this.form);" onKeyUp="addSubTotalDollarAmt(this.form);">
                              </label>
                          </div>
						</div>
					</div>

                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                                <label>
                                  <input type="checkbox" value="0" onclick="addSubTotalDollarAmt(this.form);"> <span>Ezer L'Cholim</span>
                                </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                              <label>
                              	<input class="contact" type="text" name="any_amount4" value="" onChange="addSubTotalDollarAmt(this.form);" onKeyUp="addSubTotalDollarAmt(this.form);">
                              </label>
                          </div>
						</div>
					</div>
                  

                	<div class="row">
                        <div class="col-md-6">
                          <div class="checkbox">
                                <label>
                                  <input type="checkbox" value="0" onclick="addSubTotalDollarAmt(this.form);"> <span>Keren Toldos Eluzer</span>
                                </label>
                          </div>
						</div>
                        <div class="col-md-6">
                          <div class="checkbox">
                              <label>
                              	<input class="contact" type="text" name="any_amount5" value="" onChange="addSubTotalDollarAmt(this.form);" onKeyUp="addSubTotalDollarAmt(this.form);">
                              </label>
                          </div>
						</div>
					</div>

                	<div class="row">
                        <div class="col-md-12">
                          <div class="checkbox">
                              <label>
                              	<br>
                              </label>
                          </div>

                        	<label>
                            </label>
						</div>
					</div>
                    
                </div>
        	</div>
            
			<div class="row">
            	<div class="col-md-6">
                	<small>* For a minimal donation of $180, a minyan Talmidei Chachomim will be sent out at your request to pray at the Kosel HaMaravi, or at the Kever of Reb Meyer Baal Haness on your behalf and read your Kvitel.</small>
				</div>
            	<div class="col-md-6">
                	<small>The holy Tzadik the Chozeh from Lublin TZ”L said that in order for a Kvitel to be of help, a person should give “Kvital Gelt” for Charity.</small>
				</div>
			</div>
            
			<div class="row">
            	<div class="col-md-6 col-md-push-6">
                    	<h3>YOUR TOTAL DONATION</h3>
                 
                    	<div class="total-donation">$<span>0</span></div>
                    <input class=biginput type="text" size="5" value="" readonly name="x_amount" id="total_donation" style="font-weight:bold;color:#000000;">
				</div>
			</div>
            
            
        </div>
    </div>
    
	<div class="section donate-type-section">
        <div class="container">
        <h2>DONATION TYPE</h2>
        	<p>I would like this to be a:</p>
            <div class="row">
            	<div class="col-md-6">
                	<div class="donate-type-box">
                        <div class="radio">
                          <label>
                            <input type="radio" name="donation_type" value="one-time" checked="">
                            <span>ONE TIME DONATION</span>
                          </label>
                        </div>       
                        <p>Select the type of donation you would like to make below</p>

                        <select class="contact" name="donation_area">
							<option value="General" selected="">General</option>
						    <option value="Empty a Pushka">Empty a Pushka</option>
						    <option value="Dinner Pledge">Dinner Pledge</option>
							<option value="Memorial Gift">Memorial Gift</option>
						    <option value="Honor Gift">Honor Gift</option>
						</select>
                    </div>         
                	<div class="donate-type-box">
                        <div class="radio">
                          <label>
                            <input type="radio" name="donation_type" value="recurring">
                            <span>RECURRING DONATION</span>
                          </label>
                        </div>     
                        <p>How frequently would you like to donate</p>
                        
                        <select class="contact" name="donation_frequency">
							<option value="Weekly">Weekly</option>
							<option value="Bi-Weekly">Bi-Weekly</option>
						    <option value="Monthly">Monthly</option>
							<option value="Bi-Monthly">Bi-Monthly</option>
							<option value="Quarterly">Quarterly</option>
						    <option value="Semi-Annually">Semi-Annually</option>
							<option value="Annually" selected="">Annually</option>
						</select>                        
                    </div>         
                </div>
            	<div class="col-md-6">
                	<h3>WHO WOULD YOU LIKE TO MEMORIALIZE/HONOR?</h3>
                    <p style="
    margin-top: -30px;
    font-size: 12px;
">(optional)</p>
                    <p>Name and address information so that Kilel Chibas Yerushalayim can send this person(s) an acknowledgment card</p>
                    

                      <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">Name</label>
                        <div class="col-sm-10">
                          <input class="form-control" type="text" name="ack_name"  value="">
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label">Address</label>
                        <div class="col-sm-10">
                          <input class="form-control" type="text" name="ack_addy" value="">
                          <input class="form-control" type="text" name="ack_addy2" value="">
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label">City</label>
                        <div class="col-sm-10">
                          <input class="form-control" type="text" name="ack_city"  value="">
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label">State</label>
                        <div class="col-sm-10">
                          <input class="form-control" type="text" name="ack_state"  value="">
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label">Zip</label>
                        <div class="col-sm-10">
                        	<input class="form-control" type="text" name="ack_zip"  value="">
                        </div>
                      </div>

                    
                </div>
            </div>
        </div>
    </div>
    
	<div class="section donate-finish-section">
        <div class="container">
        	<div class="col-md-6">
        		<h2>SUBMIT A PRAYER / KVITEL INFORMATION</h2>

                <h3>FILL OUT YOUR KVITEL TEXT</h3>
                <p>You can enter all the names of family members and their mothers names, or people who need a Yeshua-Help, also specify what type of Yeshua you need.</p>
                <textarea name="kvittel_info" rows="11" cols="45"></textarea>
                <p>Please insert my Kvitel at:</p>
                <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit_Kever_Reb_Meyer_Baal_Haness" value="0">The Kever of Reb Meyer Baal Haness
                    </label>
                 </div>
                <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit_Kosel_HaMaravi" value="0">The Kosel HaMaravi
                    </label>
                 </div>
                <div class="checkbox">
                    <label>
                      <input type="checkbox" name="addit_Both" value="0">Both
                    </label>
                 </div>
        	</div>
        	<div class="col-md-6">
        		<h2>CREDIT CARD INFORMATION   <p style="
    float: right;
    font-size: 12px;
    margin-top: -12px;
">(required)</p></h2>

                <p>NOTICE: Credit card information is very sensitive to protect your card. Please be careful to enter your information correctly as printed on your statement. Please check again for typing errors before pressing submit. Example: Extra Spaces or ,/.;”!</p>
                
                      <div class="form-group">
                        <label for="inputEmail3" class="col-sm-4 control-label">First Name</label>
                        <div class="col-sm-8">
                          <input class="form-control" type="text" name="x_first_name" id="first_name"  required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">Last Name</label>
                        <div class="col-sm-8">
                          <input class="form-control" type="text" name="x_last_name" id="last_name" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">Address</label>
                        <div class="col-sm-8">
                          <input class="form-control" type="text" name="x_address" id="address" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">City</label>
                        <div class="col-sm-8">
                          <input class="form-control" type="text" name="x_city" id="city" value="" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">State</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_state" id="state" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">ZIP</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_zip" id="zip" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">Country</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_country" id="country" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">Phone</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_phone" id="phone" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">E-mail</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_email" id="email" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">Card Number</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_card_num" id="card_num" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">Exp. Date (MMYY)</label>
                        <div class="col-sm-8">
                        	<input class="form-control" id="exp_date" name="x_exp_date" value="" required>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                      <div class="form-group">
                        <label for="inputPassword3" class="col-sm-4 control-label">CVV</label>
                        <div class="col-sm-8">
                        	<input class="form-control" type="text" name="x_card_code" id="card_code" size="5" required>
                        </div>
                      </div>
                
        	</div>
            <div class="clearfix"></div>
            <div class="col-md-6 col-md-push-3 text-center">
            	<button type="submit" value="Submit" class="btn btn-default btn-lg btn-block donate-send-btn">SEND DONATION</button>
            </div>
		</div>
	</div>
    {!! Form::close() !!}
@endsection
@section('scripts')
    <script>

        function addSubTotalDollarAmt(form)

        {

            //

            //

            //if(amount !=4)

            var i = 0;

            total_donation = 0;

            for (i = 0 ; i < form.length ; i++)

            {
                if (form.elements[i].name.indexOf("Chai") == 0)

                {

                    if (form.elements[i].checked)

                        total_donation += parseInt(form.elements[i].value);

                }

                if (form.elements[i].name.indexOf("addit") == 0)

                {

                    if (form.elements[i].checked)

                        total_donation += parseInt(form.elements[i].value);

                }

            }

            //total_donation

            //any_amount

            if (form.any_amount.value != "" && isMoney(form.any_amount.value))

                total_donation += parseInt(form.any_amount.value);

            if (form.any_amount2.value != "" && isMoney(form.any_amount2.value))

                total_donation += parseInt(form.any_amount2.value);

            if (form.any_amount3.value != "" && isMoney(form.any_amount3.value))

                total_donation += parseInt(form.any_amount3.value);

            if (form.any_amount4.value != "" && isMoney(form.any_amount4.value))

                total_donation += parseInt(form.any_amount4.value);

            if (form.any_amount5.value != "" && isMoney(form.any_amount5.value))

                total_donation += parseInt(form.any_amount5.value);

            if (isMoney(total_donation))

                form.total_donation.value = total_donation;

            else

                form.total_donation.value = "0";


            //document.getElementById("span_total").innerHTML = total_donation;

        $('.total-donation span').text(form.total_donation.value);
        }



        function updateLocalTotal(qty, amount, frmObjectToUpdate)

        {

            //alert();

            frmObjectToUpdate.value = qty * amount;
            addSubTotalDollarAmt(frmObjectToUpdate.form);


        }



        function markRadioChecked(frmObjToMark)

        {

            frmObjToMark.checked = true;

        }



        function submitTheForm(form)

        {

            var i = 0;

            var isOnChecked = false;

            var strDonValue = "";

            if (parseInt(form.total_donation.value) == 0 && !form.chk_Kvittel.checked)

            {

                alert("Please choose your donation(s)!");

                return false;

            }

            if (form.name.value == "")

            {

                alert("Name is a required field!");

                form.name.focus();

                return false;

            }

            if (form.address.value == "")

            {

                alert("Address is a required field!");

                form.address.focus();

                return false;

            }

            if (form.city.value == "")

            {

                alert("City is a required field!");

                form.city.focus();

                return false;

            }

            if (form.state.value == "")

            {

                alert("State is a required field!");

                form.state.focus();

                return false;

            }

            if (form.zip.value == "")

            {

                alert("Zip is a required field!");

                form.zip.focus();

                return false;

            }


            if (form.email.value == "")

            {

                alert("Email is a required field!");

                form.email.focus();

                return false;

            }


            if (form.phone.value == "")

            {

                alert("Phone is a required field!");

                form.phone.focus();

                return false;

            }


            if (parseInt(form.total_donation.value) > 0)

            {

                if (form.nameoncard.value == "")

                {

                    alert("Name on card is a required field!");

                    form.nameoncard.focus();

                    return false;

                }

                if (form.ccnum.value == "")

                {

                    alert("Credit card number is a required field!");

                    form.ccnum.focus();

                    return false;

                }

                if (form.expmonth.selectedIndex == 0 || form.expyear.selectedIndex == 0)

                {

                    alert("Credit card expiration date is a required field!");

                    form.expmonth.focus();

                    return false;

                }


                if (form.cvvnum.value == "")

                {

                    alert("CVV (card security code) is a required field!");

                    form.cvvnum.focus();

                    return false;

                }

            }



            /*

             ref1_address

             ref1_city

             ref1_state

             ref1_zip

             ref2_name

             ref2_telephone

             ref2_address

             ref2_city

             ref2_state

             ref2_zip

             */



            return true;

        }


        function isMoney (passedVal)

        {

            for ( i = 0 ; i < passedVal.length ; i++ )

            {

                if ( (passedVal.charAt(i) < "0" || passedVal.charAt(i) > "9") && passedVal.charAt(i) != "." )

                    return false

            }

            return true;

        }



        function fillCheckboxes()

        {

            var form = document.frmDonate;

            var i = 0;


        }
    </script>
@endsection