Current File : /home/itiffy/public_html/resources/views/frontend/express.blade.php

@extends('frontend.layouts.master')
@section('content')
<!-- BREADCRUMB SECTION -->
<div class="breadcrumb-box">
  <ol class="breadcrumb container">
    <li class="breadcrumb-item"><a href="{{ route('home')}}"><i class="fa fa-home" aria-hidden="true"></i></a></li>
    <li class="breadcrumb-item active">Express</li>
  </ol>
</div>
<!-- /BREADCRUMB SECTION --> 
<!-- CONTENT SECTION -->
  <div class="content-section"> 
    <!-- Section01 -->
    <div class="express-section-01">
      <div class="container">
        <div class="row">
          <div class="col-sm-6">
            <h2>Start your website with one of the following <strong>Beautiful Designs</strong></h2>
            <p>Browse our collection of unique designs. <br />The next website could be yours.</p>
          </div>
          <div class="col-sm-6">
            <div class="total-cost">
              <h4>Total Cost</h4>
              <h5><span>USD</span> 499</h5>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- /Section01 --> 
    <!-- Section02 -->
    <div class="express-section-02">
      <div class="container">
        <div class="row">
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-01.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme-01">Live Demo</a></div>
                <div class="get-started"><a href="javascript:void(0)" class="express-payment" id="Demo 01" price="499" hires_hour_or_month="0">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-02.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme-02">Live Demo</a></div>
                <div class="get-started"><a href="javascript:void(0)" class="express-payment" id="Demo 02" price="499" hires_hour_or_month="0">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-03.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme_03">Live Demo</a></div>
                <div class="get-started"><a href="javascript:void(0)" class="express-payment" id="Demo 03" price="499" hires_hour_or_month="0">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-04.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme-04">Live Demo</a></div>
                <div class="get-started"><a href="javascript:void(0)" class="express-payment" id="Demo 04" price="499" hires_hour_or_month="0">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-05.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme-05">Live Demo</a></div>
                <div class="get-started"><a href="javascript:void(0)" class="express-payment" id="Demo 05" price="499" hires_hour_or_month="0">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-06.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme_06">Live Demo</a></div>
                <div class="get-started"><a href="javascript:void(0)" class="express-payment" id="Demo 06" price="499" hires_hour_or_month="0">Get Started</a></div>
              </div>
            </div>
          </div>
          {{-- <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-07.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a target=_blank href="https://www.theme.itiffyprojects.com/theme_07">Live Demo</a></div>
                <div class="get-started"><a href="{{ route('request-a-quote') }}">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-08.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a href="#">Live Demo</a></div>
                <div class="get-started"><a href="#">Get Started</a></div>
              </div>
            </div>
          </div>
          <div class="col-sm-4">
            <div class="image-container"><img src="{{ url('public/images') }}/theme-demo-09.jpg" alt="" class="image">
              <div class="middle">
                <div class="live-demo"><a href="#">Live Demo</a></div>
                <div class="get-started"><a href="#">Get Started</a></div>
              </div>
            </div>
          </div> --}}
        </div>
      </div>
    </div>
    <!-- /Section02 --> 
    <!-- Section03 -->
    <div class="express-section-03">
      <div class="container">
        <h3>Amazing Features</h3>
        <h6>With unlimited features that we offer, we promise it’s possible to make everything that was impossible for you !</h6>
        <div class="row">
          <div class="col-md-4 col-sm-12">
            <div class="box clearfix">
              <figure><img src="{{ url('public/images') }}/icon-express-01.png" alt=""></figure>
              <article>
                <h5>Responsive &amp; Multipurpose</h5>
                <p>Web design approach aimed at crafting sites to provide an optimal viewing experience.</p>
              </article>
            </div>
            <div class="box clearfix">
              <figure><img src="{{ url('public/images') }}/icon-express-02.png" alt=""></figure>
              <article>
                <h5>Easy Customization</h5>
                <p>Full access of managing all contents on the website.</p>
              </article>
            </div>
            <div class="box clearfix">
              <figure><img src="{{ url('public/images') }}/icon-express-03.png" alt=""></figure>
              <article>
                <h5>Powerful Features</h5>
                <p>A website ready with features to take on the modern world.</p>
              </article>
            </div>
          </div>
          <div class="col-md-1 col-sm-12"></div>
          <div class="col-md-7 col-sm-12"><img src="{{ url('public/images') }}/express-img-01.png" alt=""></div>
        </div>
      </div>
    </div>
    <!-- /Section03 --> 
    <!-- Section04 -->
    <div class="express-section-04">
      <div class="container">
        <div class="row">
          <div class="col-md-4 col-sm-6 clearfix">
            <figure><img src="{{ url('public/images') }}/icon-express-11.png" alt=""></figure>
            <article>
              <h4>Easy Media Management</h4>
              <h6>Image editing tools you can have fun with.</h6>
              <p>Drag and drop your media into the uploader to add it to your website and insert images and galleries into your content.</p>
            </article>
          </div>
          <div class="col-md-4 col-sm-6 clearfix">
            <figure><img src="{{ url('public/images') }}/icon-express-12.png" alt=""></figure>
            <article>
              <h4>Easy Customization</h4>
              <h6>Simplicity for you to get online quickly.</h6>
              <p>Nothing should get in the way of you getting your website up and and running in no time. Our sites are built to make that happen.</p>
            </article>
          </div>
          <div class="col-md-4 col-sm-6 clearfix">
            <figure><img src="{{ url('public/images') }}/icon-express-13.png" alt=""></figure>
            <article>
              <h4>UNLIMITED FLEXIBILITY</h4>
              <h6>Our Themes support any type of website you want.</h6>
              <p>You can make your website beautiful with our themes, and extend it with plugins.</p>
            </article>
          </div>
        </div>
        <div class="row">
          <div class="col-md-4 col-sm-6 clearfix">
            <figure><img src="{{ url('public/images') }}/icon-express-14.png" alt=""></figure>
            <article>
              <h4>Clean &amp; Modular Coding</h4>
              <h6>100% Clean, Valid &amp; Well-Commented Coding</h6>
              <p>Every piece of Theme generated code is in full compliance with the coding standards. This means that your website will work in today’s browser, while maintaining forward compatibility.</p>
            </article>
          </div>
          <div class="col-md-4 col-sm-6 clearfix">
            <figure><img src="{{ url('public/images') }}/icon-express-15.png" alt=""></figure>
            <article>
              <h4>The Best E-commerce Solutions</h4>
              <h6>WooCommerce Integration Ready</h6>
              <p>Our themes are wordpress compatible and ready to upgrade your website into a fully functioning ECommerce, whenever you are.</p>
            </article>
          </div>
          <div class="col-md-4 col-sm-6 clearfix">
            <figure><img src="{{ url('public/images') }}/icon-express-16.png" alt=""></figure>
            <article>
              <h4>Awesome Friendly Support</h4>
              <h6>Free 1st Month Support</h6>
              <p>A Customer service that empowers you for smarter Business Solutions and better Customer Relations.</p>
            </article>
          </div>
        </div>
      </div>
    </div>
    <!-- /Section04 --> 
  </div>
  <!-- /CONTENT SECTION --> 
  <!--Payment modal-->
  <!-- Modal -->
  <div class="modal fade" role="dialog" id="host_payment">
    <div class="mask_part"></div>
    <div class="modal-dialog">
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title" id="modal_title">Pay With Paypal</h4>
        </div>
        <form action="{{ route('payment-create') }}" method="post" id="pay_now_form" name="pay_now_form" onsubmit="return false"> 
          <div class="modal-body">
              <div class="form-group">
                <label class="col-sm-4 control-label">Payment Type :</label>
                <div class="col-sm-8">
                  <select name="payment_type" id="payment_type" class="selectpicker">
                    <!-- <option value="">Select Currency</option> -->
                    <option value="0">Full Payment</option>
                    <option value="1">Half Payment</option>
                  </select>
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Currency :</label>
                <div class="col-sm-8">
                  <select name="currency_code" id="currency_code" class="selectpicker">
                    <!-- <option value="">Select Currency</option> -->
                    <option value="AUD">Australian Dollar</option>
                    <option value="BRL">Brazilian Real </option>
                    <option value="CAD">Canadian Dollar</option>
                    <option value="CZK">Czech Koruna</option>
                    <option value="DKK">Danish Krone</option>
                    <option value="EUR">Euro</option>
                    <option value="HKD">Hong Kong Dollar</option>
                    <option value="HUF">Hungarian Forint </option>
                    <option value="ILS">Israeli New Sheqel</option>
                    <option value="JPY">Japanese Yen</option>
                    <option value="MYR">Malaysian Ringgit</option>
                    <option value="MXN">Mexican Peso</option>
                    <option value="NOK">Norwegian Krone</option>
                    <option value="NZD">New Zealand Dollar</option>
                    <option value="PHP">Philippine Peso</option>
                    <option value="PLN">Polish Zloty</option>
                    <option value="GBP">Pound Sterling</option>
                    <option value="SGD">Singapore Dollar</option>
                    <option value="SEK">Swedish Krona</option>
                    <option value="CHF">Swiss Franc</option>
                    <option value="TWD">Taiwan New Dollar</option>
                    <option value="THB">Thai Baht</option>
                    <option value="TRY">Turkish Lira</option>
                    <option value="USD" SELECTED="YES">U.S. Dollar</option>
                  </select>
                </div>
              </div>
              
              <div class="form-group">
                <label class="col-sm-4 control-label">Card Number :</label>
                <div class="col-sm-8">
                 <input name="ccNo" id="ccNo" type="text" placeholder="Enter card number" autocomplete="off">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Expiry Month :</label>
                <div class="col-sm-8">
                 <select id="expMonth" name="expMonth" class="selectpicker">
                    <option value="">Select Month</option>
                    <option value="01">01</option>
                    <option value="02">02</option>
                    <option value="03">03</option>
                    <option value="04">04</option>
                    <option value="05">05</option>
                    <option value="06">06</option>
                    <option value="07">07</option>
                    <option value="08">08</option>
                    <option value="09">09</option>
                    <option value="10">10</option>
                    <option value="11">11</option>
                    <option value="12">12</option>
                </select>
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Expiry Year :</label>
                <div class="col-sm-8">
                 <select id="expYear" name="expYear" class="selectpicker">
                  <option value="">Select Year</option>
                  
                        @for($i=0;$i<21;$i++)
                        
                          <option value="{{ date('Y')+$i }}">{{ date('Y')+$i }}</option>
                  
                        @endfor
                      
                  </select>
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">CVV :</label>
                <div class="col-sm-8">
                 <input name="cvv" id="cvv" type="text" placeholder="Enter cvv" autocomplete="off">
                </div>
              </div>
               <div class="form-group">
                <label class="col-sm-4 control-label">Name :</label>
                <div class="col-sm-8">
                 <input name="name" id="name" type="text" placeholder="Enter name"  autocomplete="off">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Address :</label>
                <div class="col-sm-8">
                 <input name="address" id="address" type="text" placeholder="Enter Address" autocomplete="off">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">City :</label>
                <div class="col-sm-8">
                 <input name="city" id="city" type="text" placeholder="Enter City"  autocomplete="off">
                </div>
              </div>

              <div class="form-group">
                <label class="col-sm-4 control-label">State :</label>
                <div class="col-sm-8">
                 <input name="state" id="state" type="text" placeholder="Enter state"  autocomplete="off">
                </div>
              </div>

              <div class="form-group">
                <label class="col-sm-4 control-label">Country :</label>
                <div class="col-sm-8">
                 <select class="selectpicker" id="country" name="country" autocomplete="on">
              <option value="">Choose Country</option>
              <option value="IND">India</option>
              <option value="USA">United States</option>
              <option value="GBR">United Kingdom</option>
              <option value="CAN">Canada</option>
              <option value="AUS">Australia</option>
              <option disabled="">—</option>
              <option value="ALA">Åland Islands</option>
              <option value="AFG">Afghanistan</option>
              <option value="ALB">Albania</option>
              <option value="DZA">Algeria</option>
              <option value="ASM">American Samoa</option>
              <option value="AND">Andorra</option>
              <option value="AGO">Angola</option>
              <option value="AIA">Anguilla</option>
              <option value="ATA">Antarctica</option>
              <option value="ATG">Antigua and Barbuda</option>
              <option value="ARG">Argentina</option>
              <option value="ARM">Armenia</option>
              <option value="ABW">Aruba</option>
              <option value="AUS">Australia</option>
              <option value="AUT">Austria</option>
              <option value="AZE">Azerbaijan</option>
              <option value="BHS">Bahamas</option>
              <option value="BHR">Bahrain</option>
              <option value="BGD">Bangladesh</option>
              <option value="BRB">Barbados</option>
              <option value="BLR">Belarus</option>
              <option value="BEL">Belgium</option>
              <option value="BLZ">Belize</option>
              <option value="BEN">Benin</option>
              <option value="BMU">Bermuda</option>
              <option value="BTN">Bhutan</option>
              <option value="BOL">Bolivia</option>
              <option value="BES">Bonaire, Sint Eustatius and Saba</option>
              <option value="BIH">Bosnia and Herzegovina</option>
              <option value="BWA">Botswana</option>
              <option value="BVT">Bouvet Island</option>
              <option value="BRA">Brazil</option>
              <option value="IOT">British Indian Ocean Territory</option>
              <option value="BRN">Brunei Darussalam</option>
              <option value="BGR">Bulgaria</option>
              <option value="BFA">Burkina Faso</option>
              <option value="BDI">Burundi</option>
              <option value="KHM">Cambodia</option>
              <option value="CMR">Cameroon</option>
              <option value="CAN">Canada</option>
              <option value="CPV">Cape Verde</option>
              <option value="CYM">Cayman Islands</option>
              <option value="CAF">Central African Republic</option>
              <option value="TCD">Chad</option>
              <option value="CHL">Chile</option>
              <option value="CHN">China</option>
              <option value="CXR">Christmas Island</option>
              <option value="CCK">Cocos (Keeling) Islands</option>
              <option value="COL">Colombia</option>
              <option value="COM">Comoros</option>
              <option value="COG">Congo</option>
              <option value="COD">Congo, the Democratic Republic of the</option>
              <option value="COK">Cook Islands</option>
              <option value="CRI">Costa Rica</option>
              <option value="CIV">Cote D'ivoire</option>
              <option value="HRV">Croatia (Hrvatska)</option>
              <option value="CYP">Cyprus</option>
              <option value="CZE">Czech Republic</option>
              <option value="DNK">Denmark</option>
              <option value="DJI">Djibouti</option>
              <option value="DMA">Dominica</option>
              <option value="DOM">Dominican Republic</option>
              <option value="ECU">Ecuador</option>
              <option value="EGY">Egypt</option>
              <option value="SLV">El Salvador</option>
              <option value="GNQ">Equatorial Guinea</option>
              <option value="ERI">Eritrea</option>
              <option value="EST">Estonia</option>
              <option value="ETH">Ethiopia</option>
              <option value="FLK">Falkland Islands (Malvinas)</option>
              <option value="FRO">Faroe Islands</option>
              <option value="FJI">Fiji</option>
              <option value="FIN">Finland</option>
              <option value="FRA">France</option>
              <option value="FXX">France, Metropolitan</option>
              <option value="GUF">French Guiana</option>
              <option value="PYF">French Polynesia</option>
              <option value="ATF">French Southern Territories</option>
              <option value="GAB">Gabon</option>
              <option value="GMB">Gambia</option>
              <option value="GEO">Georgia</option>
              <option value="DEU">Germany</option>
              <option value="GHA">Ghana</option>
              <option value="GIB">Gibraltar</option>
              <option value="GRC">Greece</option>
              <option value="GRL">Greenland</option>
              <option value="GRD">Grenada</option>
              <option value="GLP">Guadeloupe</option>
              <option value="GUM">Guam</option>
              <option value="GTM">Guatemala</option>
              <option value="GGY">Guernsey</option>
              <option value="GIN">Guinea</option>
              <option value="GNB">Guinea-Bissau</option>
              <option value="GUY">Guyana</option>
              <option value="HTI">Haiti</option>
              <option value="HMD">Heard Island and Mcdonald Islands</option>
              <option value="HND">Honduras</option>
              <option value="HKG">Hong Kong</option>
              <option value="HUN">Hungary</option>
              <option value="ISL">Iceland</option>
              <option value="IND">India</option>
              <option value="IDN">Indonesia</option>
              <option value="IRQ">Iraq</option>
              <option value="IRL">Ireland</option>
              <option value="IMN">Isle of Man</option>
              <option value="ISR">Israel</option>
              <option value="ITA">Italy</option>
              <option value="JAM">Jamaica</option>
              <option value="JPN">Japan</option>
              <option value="JEY">Jersey</option>
              <option value="JOR">Jordan</option>
              <option value="KAZ">Kazakhstan</option>
              <option value="KEN">Kenya</option>
              <option value="KIR">Kiribati</option>
              <option value="KOR">Korea, Republic of</option>
              <option value="KWT">Kuwait</option>
              <option value="KGZ">Kyrgyzstan</option>
              <option value="LAO">Lao People's Democratic Republic</option>
              <option value="LVA">Latvia</option>
              <option value="LBN">Lebanon</option>
              <option value="LSO">Lesotho</option>
              <option value="LBR">Liberia</option>
              <option value="LBY">Libyan Arab Jamahiriya</option>
              <option value="LIE">Liechtenstein</option>
              <option value="LTU">Lithuania</option>
              <option value="LUX">Luxembourg</option>
              <option value="MAC">Macao</option>
              <option value="MKD">Macedonia</option>
              <option value="MDG">Madagascar</option>
              <option value="MWI">Malawi</option>
              <option value="MYS">Malaysia</option>
              <option value="MDV">Maldives</option>
              <option value="MLI">Mali</option>
              <option value="MLT">Malta</option>
              <option value="MHL">Marshall Islands</option>
              <option value="MTQ">Martinique</option>
              <option value="MRT">Mauritania</option>
              <option value="MUS">Mauritius</option>
              <option value="MYT">Mayotte</option>
              <option value="MEX">Mexico</option>
              <option value="FSM">Micronesia, Federated States of</option>
              <option value="MDA">Moldova, Republic of</option>
              <option value="MCO">Monaco</option>
              <option value="MNG">Mongolia</option>
              <option value="MNE">Montenegro</option>
              <option value="MSR">Montserrat</option>
              <option value="MAR">Morocco</option>
              <option value="MOZ">Mozambique</option>
              <option value="MMR">Myanmar</option>
              <option value="NAM">Namibia</option>
              <option value="NRU">Nauru</option>
              <option value="NPL">Nepal</option>
              <option value="NLD">Netherlands</option>
              <option value="ANT">Netherlands Antilles</option>
              <option value="NCL">New Caledonia</option>
              <option value="NZL">New Zealand</option>
              <option value="NIC">Nicaragua</option>
              <option value="NER">Niger</option>
              <option value="NGA">Nigeria</option>
              <option value="NIU">Niue</option>
              <option value="NFK">Norfolk Island</option>
              <option value="MNP">Northern Mariana Islands</option>
              <option value="NOR">Norway</option>
              <option value="OMN">Oman</option>
              <option value="PAK">Pakistan</option>
              <option value="PLW">Palau</option>
              <option value="PSE">Palestinian Territory, Occupied</option>
              <option value="PAN">Panama</option>
              <option value="PNG">Papua New Guinea</option>
              <option value="PRY">Paraguay</option>
              <option value="PER">Peru</option>
              <option value="PHL">Philippines</option>
              <option value="PCN">Pitcairn</option>
              <option value="POL">Poland</option>
              <option value="PRT">Portugal</option>
              <option value="PRI">Puerto Rico</option>
              <option value="QAT">Qatar</option>
              <option value="REU">Reunion</option>
              <option value="ROU">Romania</option>
              <option value="RUS">Russian Federation</option>
              <option value="RWA">Rwanda</option>
              <option value="SHN">Saint Helena</option>
              <option value="KNA">Saint Kitts and Nevis</option>
              <option value="LCA">Saint Lucia</option>
              <option value="SPM">Saint Pierre and Miquelon</option>
              <option value="VCT">Saint Vincent and the Grenadines</option>
              <option value="WSM">Samoa</option>
              <option value="SMR">San Marino</option>
              <option value="STP">Sao Tome and Principe</option>
              <option value="SAU">Saudi Arabia</option>
              <option value="SEN">Senegal</option>
              <option value="SRB">Serbia</option>
              <option value="SCG">Serbia and Montenegro</option>
              <option value="SYC">Seychelles</option>
              <option value="SLE">Sierra Leone</option>
              <option value="SGP">Singapore</option>
              <option value="SVK">Slovakia</option>
              <option value="SVN">Slovenia</option>
              <option value="SLB">Solomon Islands</option>
              <option value="SOM">Somalia</option>
              <option value="ZAF">South Africa</option>
              <option value="SGS">South Georgia and the South Sandwich Islands</option>
              <option value="ESP">Spain</option>
              <option value="LKA">Sri Lanka</option>
              <option value="SUR">Suriname</option>
              <option value="SJM">Svalbard and Jan Mayen Islands</option>
              <option value="SWZ">Swaziland</option>
              <option value="SWE">Sweden</option>
              <option value="CHE">Switzerland</option>
              <option value="TWN">Taiwan</option>
              <option value="TJK">Tajikistan</option>
              <option value="TZA">Tanzania, United Republic of</option>
              <option value="THA">Thailand</option>
              <option value="TLS">Timor-Leste</option>
              <option value="TGO">Togo</option>
              <option value="TKL">Tokelau</option>
              <option value="TON">Tonga</option>
              <option value="TTO">Trinidad and Tobago</option>
              <option value="TUN">Tunisia</option>
              <option value="TUR">Turkey</option>
              <option value="TKM">Turkmenistan</option>
              <option value="TCA">Turks and Caicos Islands</option>
              <option value="TUV">Tuvalu</option>
              <option value="UGA">Uganda</option>
              <option value="UKR">Ukraine</option>
              <option value="ARE">United Arab Emirates</option>
              <option value="GBR">United Kingdom</option>
              <option value="USA">United States</option>
              <option value="UMI">United States Minor Outlying Islands</option>
              <option value="URY">Uruguay</option>
              <option value="UZB">Uzbekistan</option>
              <option value="VUT">Vanuatu</option>
              <option value="VAT">Vatican City State (Holy See)</option>
              <option value="VEN">Venezuela</option>
              <option value="VNM">Viet Nam</option>
              <option value="VGB">Virgin Islands, British</option>
              <option value="VIR">Virgin Islands, U.S.</option>
              <option value="WLF">Wallis and Futuna Islands</option>
              <option value="ESH">Western Sahara</option>
              <option value="YEM">Yemen</option>
              <option value="YUG">Yugoslavia</option>
              <option value="ZAR">Zaire</option>
              <option value="ZMB">Zambia</option>
              <option value="ZWE">Zimbabwe</option>
            </select>
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Zip Code :</label>
                <div class="col-sm-8">
                  <input name="zip_code" id="zip_code" type="text" placeholder="Enter Zipcode"  autocomplete="off">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Phone Number :</label>
                <div class="col-sm-8">
                  <input name="phone_number" id="phone_number" type="text" placeholder="Enter Phone Number"  autocomplete="off">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-4 control-label">Email :</label>
                <div class="col-sm-8">
                  <input name="email" id="email" type="text" placeholder="Enter Email"  autocomplete="off">
                </div>
              </div>

              <input type="hidden" name="_token" value="{{ csrf_token() }}">
              <input name="token" id="token" type="hidden" value="" />
              <input name="price" id="price" type="hidden">
              <input name="hires_hour_or_month" id="hires_hour_or_month" type="hidden">
              <input name="how_many_hour_or_month" id="how_many_hour_or_month" type="hidden" value="1">
              <input name="hires_for" id="hires_for" type="hidden">
              <input name="usd_price" id="usd_price" type="hidden">

          </div>
          <div class="modal-footer"> 
            <div class="loader"><img src="{{ url('public/images/') }}/loader2.png"></div>
            <h2>Total : <span id="total_price">USD 499</span></h2>
            <button type="submit" name="pay_now" id="pay_now" class="btn btn btn-success">Pay Now</button>
          </div>
          <span id="msg"></span> 
        </form>
      </div>
    </div>
  </div>
  <!--End -->
@endsection
@section('javascript')
<script type="text/javascript" src="https://www.2checkout.com/checkout/api/2co.min.js"></script> 
<script type="text/javascript">
  $(document).ready(function() {
    $(".express-payment").click(function() {
        $(".loader").hide();
        $("#pay_now_form")[0].reset();
        $("#modal_title").html($(this).attr('id'));
        $("#price").val($(this).attr('price'));
        $("#usd_price").val($(this).attr('price'));
        $("#total_price").html('USD '+$(this).attr('price'));
        $("#hires_hour_or_month").val($(this).attr('hires_hour_or_month'));
        $("#hires_for").val($(this).attr('id')+'(Express)');
        $('#host_payment').modal('show'); 
    }); 
    $("#currency_code").change(function(){
        var payment_type=$("#payment_type").val();
        var currency_code=$(this).val();
        var currency_input = $("#usd_price").val();
        if(payment_type==1){
          currency_input=currency_input/2;
        }
        var currency_from = "USD"; // currency codes : http://en.wikipedia.org/wiki/ISO_4217
        var currency_to = currency_code;

       var new_price=CurrencyConvetor(currency_input,currency_from,currency_to);
        if(new_price==''){
          alert("Currently currency change is not avaiable.");
          $(this).val("USD");
        }else{
        var price_by_currency=parseFloat(new_price).toFixed(2);
        $("#price").val(price_by_currency);

        $("#total_price").html(currency_code+" "+ price_by_currency);
        }
    }); 

    $("#payment_type").change(function(){
        var payment_type=$(this).val();
        if(payment_type==1){
          var currency_input = ($("#usd_price").val()/2);
        }else{
          var currency_input = $("#usd_price").val();
        }
        var currency_code=$("#currency_code").val();
        var currency_from = "USD"; // currency codes : http://en.wikipedia.org/wiki/ISO_4217
        var currency_to = currency_code;

        var new_price=CurrencyConvetor(currency_input,currency_from,currency_to);
        if(new_price==''){
          $("#price").val(currency_input);
          $("#total_price").html(currency_code+" "+ currency_input);
        }else{
        var price_by_currency=parseFloat(new_price).toFixed(2);
        $("#price").val(price_by_currency);

        $("#total_price").html(currency_code+" "+ price_by_currency);
        }

    }); 

    function CurrencyConvetor(amount, from, to) {

      var price = '';
      convert_from_to=from+"_"+to;
      var url = "https://free.currencyconverterapi.com/api/v3/convert?q="+convert_from_to;
      $.ajaxSetup({async: false});
      $.get(url,
          function (data) {
              if(data.results){
                 price=amount*data.results[convert_from_to]['val'];
              }else{
                alert("error in convert price");
              }
      });
      return price;
    
    } 
     //TCO.loadPubKey('production');
    TCO.loadPubKey('{{ $gateway_credentials['mode'] }}');

    $("#pay_now_form").validate({
      onkeyup: function(element) { $(element).valid(); },
      onfocusout: function(element) { $(element).valid(); },
       rules: {
                how_many_hour_or_month: "required",
                ccNo:"required",
                expMonth:"required",
                expYear:"required",
                cvv:"required",
                name:"required",
                address:"required",
                city:"required",
                state:"required",
                country:"required",
                zip_code:{
                            required: true,
                            number:true
                        },
                email: {
                            required: true,
                            email:true
                        },
                phone_number:{
                            required: true,
                            number:true
                        }      
            },
        submitHandler: function(form) {
          $(".loader").show();
          $("#msg").html('');
            tokenRequest();
        }                   
       
    });

    // Called when token created successfully.
  var successCallback = function(data) {
    var myForm = document.getElementById('pay_now_form');
    // Set the token as the value for the token input
    myForm.token.value = data.response.token.token;

    // IMPORTANT: Here we call `submit()` on the form element directly instead of using jQuery to prevent and infinite token request loop.
    myForm.submit();
  };

  // Called when token creation fails.
  var errorCallback = function(data) {
    //console.log(data);
    if (data.errorCode === 200) {

    } else {
      $("#msg").html('<div class="alert alert-danger" role="alert"><a href="#" class="close" data-dismiss="alert">&times;</a>Error <i class="glyphicon glyphicon-thumbs-up"></i>'+data.errorMsg+'</div>');
      $(".loader").hide();
    }
  };

  var tokenRequest = function() {
    // Setup token request arguments
    var args = {
      sellerId: "{{ $gateway_credentials['sellerId'] }}",
      publishableKey: "{{ $gateway_credentials['publishableKey'] }}",
      ccNo: $("#ccNo").val(),
      cvv: $("#cvv").val(),
      expMonth: $("#expMonth").val(),
      expYear: $("#expYear").val()
    };

    // Make the token request
    TCO.requestToken(successCallback, errorCallback, args);
  };
  });
 </script>
@stop