{{ header }}
<div class="container">
  	<ul class="breadcrumb">
    	{% for breadcrumb in breadcrumbs %}
    		<li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
    	{% endfor %}
  	</ul>
  	{% if error_warning %}
  		<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error_warning }}
    		<button type="button" class="close" data-dismiss="alert">&times;</button>
  		</div>
  	{% endif %}
  	<div class="row">
  		{{ column_left }}
    	{% if column_left and column_right %}
    		{% set class = 'col-sm-6' %}
    	{% elseif column_left or column_right %}
    		{% set class = 'col-sm-9' %}
    	{% else %}
    		{% set class = 'col-sm-12' %}
    	{% endif %}
    	<div id="content" class="{{ class }}">
    		{{ content_top }}
    		<h1>{{ heading_title }}</h1>
    		<div class="so-onepagecheckout {% if is_logged_in %} {{ 'is_customer' }} {% endif %} {{ layout == 2 ? 'layout2' : '' }}">
    			<div class="row">
                    <div class="col-left col-sm-5">
        				{% if not is_logged_in %}
    	    				<div class="checkout-content login-box">
    	    					<h2 class="secondary-title"><i class="fa fa-user"></i>{{ text_checkout_create_account_login }}</h2>
                                <div class="box-inner">
                                    {% if allow_register_checkout %}
                                    <div class="radio">
        								<label><input type="radio" name="account" value="register" {% if default_auth == 'register' %} checked="checked" {% endif %}>{{ text_register }}</label>
        							</div>
                                    {% endif %}

        							{% if allow_guest_checkout %}
        	                        <div class="radio">
        	                            <label><input type="radio" name="account" value="guest" {% if default_auth == 'guest' %} checked="checked" {% endif %} />{{ text_guest }}</label>
        	                        </div>
        	                        {% endif %}

                                    {% if allow_login_checkout %}
        							<div class="radio">
        								<label><input type="radio" name="account" value="login" {% if default_auth == 'login' %} checked="checked" {% endif %}>{{ text_returning_customer }}</label>
                                    </div>
                                    {% endif %}
    							</div>                                
    						</div>

                            <script type="text/javascript">
                                $(document).delegate('.so-onepagecheckout input[name="shipping_address"]', 'change', function() {
                                    var $this = $(this);

                                    if ($this.is(':checked')) {
                                        $('.so-onepagecheckout #shipping-address').hide();
                                        $this.val(1);
                                        $(document).trigger('so_checkout_address_changed', 'payment');
                                    } else {
                                        $('.so-onepagecheckout #shipping-address').show().find('input[type="text"]').val('');
                                        $(document).trigger('so_checkout_address_changed', 'payment');
                                        $(document).trigger('so_checkout_address_changed', 'shipping');
                                        $this.val(0);
                                    }
                                });

                                $(document).delegate('.so-onepagecheckout input[name="account"]', 'change', function() {
                                    if (this.value === 'login') {
                                        $('.so-onepagecheckout .checkout-login').slideDown(300);
                                        $('.so-onepagecheckout .checkout-register').parent().addClass('login-mobile');
                                    } else {
                                        $('.so-onepagecheckout .checkout-login').slideUp(300);
                                        $('.so-onepagecheckout .checkout-register').parent().removeClass('login-mobile');
                                        if (this.value === 'register') {
                                            $('.so-onepagecheckout #password').slideDown(300);
                                        } else {
                                            $('.so-onepagecheckout #password').slideUp(300);
                                        }
                                    }

                                    $('html').removeClass('checkout-type-login checkout-type-register checkout-type-guest').addClass('checkout-type-' + this.value);
                                });
                            </script>
    					{% endif %}

    					{% if not is_logged_in and allow_login_checkout %}
    	                    <div class="checkout-content checkout-login">
    	                        <fieldset>
    	                            <h2 class="secondary-title"><i class="fa fa-unlock"></i>{{ text_returning_customer }}</h2>
    	                            <div class="box-inner">
                                        <div class="form-group">
        	                                <input type="text" name="login_email" value="" placeholder="{{ entry_email }}" id="input-login_email" class="form-control" />
        	                            </div>
        	                            <div class="form-group">
        	                                <input type="password" name="login_password" value="" placeholder="{{ entry_password }}" id="input-login_password" class="form-control" />
        	                                <a href="{{ forgotten }}">{{ text_forgotten }}</a>
        	                            </div>
        	                            <div class="form-group">
        	                                <input type="button" value="{{ button_login }}" id="button-login" data-loading-text="{{ text_loading }}" class="btn-primary button" />
        	                            </div>
                                    </div>
    	                        </fieldset>
    	                    </div>
    	                    {{ register_form }}
                        {% endif %}

                        {% if is_logged_in %}
                            {{ payment_address }}
                        {% endif %}

                        {% if is_logged_in %}
                            {% if is_shipping_required %}
                                {{ shipping_address }}
                            {% endif %}
                        {% endif %}
        			</div>
        			<div class="col-right col-sm-7">
                        <div class="row">
                            <div class="col-md-6 col-xs-12">
                                {{ payment_methods }}
                            </div>
                            <div class="col-md-6 col-xs-12">
                                {% if is_shipping_required %}
                                    {{ shipping_methods }}
                                {% endif %}
                            </div>
                        </div>
        				
        				<section class="section-right">
                            <div id="coupon_voucher_reward">
        					   {{ coupon_voucher_reward }}
                            </div>

                            {{ cart }}
                            
        					<div class="checkout-content confirm-section">
                                {% if comment_status %}
                                <div>
                                    <h2 class="secondary-title"><i class="fa fa-comment"></i>{{ text_comments }}</h2>
                                    <label>
                                        <textarea name="comment" rows="8" class="form-control {% if setting_so_onepagecheckout_layout_setting.require_comment_status %} {{ 'requried' }} {% endif %}">{{ comment }}</textarea>
                                    </label>
                                </div>
                                {% endif %}
                                <div class="box-inner">
                                    {% if entry_newsletter and show_newsletter %}
                                    <div class="checkbox check-newsletter">
                                        <label for="newsletter">
                                            <input type="checkbox" name="newsletter" value="1" id="newsletter" />
                                            {{ entry_newsletter }}
                                        </label>
                                    </div>
                                    {% endif %}

                                    {% if text_privacy and show_privacy %}
                                    <div class="checkbox check-privacy">
                                        <label>
                                            <input type="checkbox" name="privacy" value="1" />
                                            {{ text_privacy }}
                                        </label>
                                    </div>
                                    {% endif %}

                                    {% if text_agree and show_term %}
                                    <div class="checkbox check-terms">
                                        <label>
                                            <input type="checkbox" name="agree" value="1" />
                                            {{ text_agree }}
                                        </label>
                                    </div>
                                    {% endif %}
                                    <div class="confirm-order">
                                        <button id="so-checkout-confirm-button" data-loading-text="{{ text_loading }}" class="btn btn-primary button confirm-button">{{ text_confirm_order }}</button>
                                    </div>
                                </div>
                            </div>
        				</section>
                    </div>
    			</div>
    		</div>
    		{{ content_bottom }}
    	</div>
    </div>
</div>
<script type="text/javascript">
    $(document).delegate('.so-onepagecheckout input[name="shipping_method"]', 'change', function() {
        $(document).trigger('so_checkout_shipping_changed', this.value);
    });

    $(document).delegate('input[name="payment_method"]', 'change', function() {
        $(document).trigger('so_checkout_payment_changed', this.value);
    });

    $(document).delegate('.so-onepagecheckout #input-login_email, .so-onepagecheckout #input-login_password, .so-onepagecheckout #button-login', 'keydown', function(e) {
        if (e.keyCode == 13) {
            so_ajax_login();
        }
    });

    $(document).delegate('.so-onepagecheckout #button-login', 'click', function() {
        so_ajax_login();
    });

    var count_loading = 0;
    function ajaxLoadingOn(){
        $('body > .tooltip').remove();
        count_loading++;
        if(count_loading===1){
            $('.so-onepagecheckout #so-checkout-confirm-button').button('loading');
            $('.so-onepagecheckout #so-checkout-confirm-button, .so-onepagecheckout .checkout-register, .so-onepagecheckout .checkout-payment-form, .so-onepagecheckout .checkout-shipping-form, .so-onepagecheckout .checkout-cart, .so-onepagecheckout .confirm-section, .so-onepagecheckout .checkout-shipping-methods, .so-onepagecheckout .checkout-payment-methods, .so-onepagecheckout .coupon-voucher').addClass('checkout-loading');
        }
    }

    function ajaxLoadingOff(){
        count_loading--;
        if(count_loading===0){
            $('.so-onepagecheckout #so-checkout-confirm-button').button('reset');
            $('.so-onepagecheckout #so-checkout-confirm-button, .so-onepagecheckout .checkout-register, .so-onepagecheckout .checkout-payment-form, .so-onepagecheckout .checkout-shipping-form, .so-onepagecheckout .checkout-cart, .so-onepagecheckout .confirm-section, .so-onepagecheckout .checkout-shipping-methods, .so-onepagecheckout .checkout-payment-methods, .so-onepagecheckout .coupon-voucher').removeClass('checkout-loading');
        }
    }

    function so_ajax_login(){
        $.ajax({
            url:'index.php?route=checkout/checkout/login',
            type:'post',
            cache:false,
            data:{email: $('.so-onepagecheckout input[name="login_email"]').val(),password: $('.so-onepagecheckout input[name="login_password"]').val()},
            dataType:'json',
            beforeSend:function(){
                ajaxLoadingOn();
                $('.so-onepagecheckout #button-login').button('loading');
            },
            complete:function(){
                ajaxLoadingOff();
                $('.so-onepagecheckout #button-login').button('reset');
            },
            success:function(json){
                if(json['error']&&json['error']['warning']){
                    alert(json['error']['warning']);
                }
                if(json['redirect']){
                    location=json['redirect'];
                }
            },
            error:function(xhr,ajaxOptions,thrownError){
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    }

    $(document).delegate('.so-onepagecheckout .confirm-button', 'click', function(){
        var data={};
        $('.so-onepagecheckout input[type="text"], .so-onepagecheckout input[type="number"], .so-onepagecheckout input[type="password"], .so-onepagecheckout select, .so-onepagecheckout input:checked, .so-onepagecheckout textarea[name="comment"]').each(function(){
            data[$(this).attr('name')]=$(this).val();
        });

        $.ajax({
            url:'index.php?route=checkout/checkout/confirm',
            type:'post',
            cache:false,
            data:data,
            dataType:'json',
            beforeSend:function(){
                ajaxLoadingOn();
            },
            success:function(json){
                $('.so-onepagecheckout .text-danger').remove();
                $('.so-onepagecheckout .has-error').removeClass('has-error');
                if(json['redirect_cart']){
                    location=json['redirect_cart'];return;
                }
                
                if(json['errors']){
                    $.each(json['errors'],function(k,v){
                        if(k==='shipping_method'||k==='payment_method'){
                            return;
                        }
                        if($.inArray(k,['payment_country','payment_zone','shipping_country','shipping_zone'])!==-1){
                            k+='_id';
                        }else if(k.indexOf('custom_field')===0){
                            k=k.replace('custom_field','');
                            k='custom_field['+k+']';
                        }else if(k.indexOf('payment_custom_field')===0){
                            k=k.replace('payment_custom_field','');
                            k='payment_custom_field['+k+']';
                        }else if(k.indexOf('shipping_custom_field')===0){
                            k=k.replace('shipping_custom_field','');
                            k='shipping_custom_field['+k+']';
                        }
                        
                        var $element=$('.so-onepagecheckout [name="'+k+'"]');
                        $element.closest('.form-group').addClass('has-error');
                        if ($element.closest('label').length)
                            $element.closest('label').after('<div class="text-danger">'+v+'</div>');
                        else
                            $element.after('<div class="text-danger">'+v+'</div>');
                    });
                    
                    ajaxLoadingOff();
                    
                    try{
                        $('html, body').animate({scrollTop:$('.has-error').offset().top},'slow');
                    }catch(e){
                        if (json['errors']['account'][0]) alert(json['errors']['account'][0]);
                    }
                    
                    return false;
                }
                else if(json['redirect']){
                    location=json['redirect'];
                }else{
                    var $btn=$('.so-onepagecheckout #payment-confirm-button input[type="button"], .so-onepagecheckout #payment-confirm-button input[type="submit"], .so-onepagecheckout #payment-confirm-button .pull-right a, .so-onepagecheckout #payment-confirm-button .right a, .so-onepagecheckout #payment-confirm-button a.button, .so-onepagecheckout #button-confirm, .so-onepagecheckout #button-pay, .so-onepagecheckout #payment-confirm-button.payment-iyzico_checkout_installment .submitButton, .so-onepagecheckout #stripe-confirm').first();
                    if($btn.attr('href')){
                        location=$btn.attr('href');
                    }else{
                        $btn.trigger('click');
                    }
                }
            },
            error:function(xhr,ajaxOptions,thrownError){
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_customer_group_changed', function(e, value){
        $.ajax({
            url:'index.php?route=checkout/checkout',
            type:'get',
            cache:false,
            data:{customer_group_id:value},
            beforeSend:function(){
                ajaxLoadingOn();
                $('.so-onepagecheckout #account, .so-onepagecheckout #address').addClass('checkout-loading');
            },
            complete:function(){
                ajaxLoadingOff();
                $('.so-onepagecheckout #account, .so-onepagecheckout #address').removeClass('checkout-loading');
            },
            success:function(html){
                var $html=$(html);
                $('.so-onepagecheckout #account').html($html.find('#account'));
                //$('.so-onepagecheckout #address').html($html.find('#address'));
                $('.so-onepagecheckout #password').html($html.find('#password'));
                $('.so-onepagecheckout #account .form-group[data-sort]').detach().each(function(){
                    if($(this).attr('data-sort')>=0 && $(this).attr('data-sort')<=$('.so-onepagecheckout #account .form-group').length){
                        $('.so-onepagecheckout #account .form-group').eq($(this).attr('data-sort')).before(this);
                    }
                    if($(this).attr('data-sort')>$('#account .form-group').length){
                        $('.so-onepagecheckout #account .form-group:last').after(this);
                    }
                    if($(this).attr('data-sort')<-$('#account .form-group').length){
                        $('.so-onepagecheckout #account .form-group:first').before(this);
                    }
                });
                
                $(document).trigger('so_checkout_reload_payment');

                if($('.so-onepagecheckout input[name="shipping_address"]').is(':checked')){
                    $(document).trigger('so_checkout_reload_shipping');
                }
            },
            error:function(xhr,ajaxOptions,thrownError){
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_address_changed', function(e, type){
        var data={};
        if($('.so-onepagecheckout input[name="'+type+'_address"]:checked').val()==='existing'){
            data[type+'_address_id']=$('select[name="'+type+'_address_id"]').val();
        }else{
            data[type+'_country_id']=$('select[name="'+type+'_country_id"]').val();
            data[type+'_postcode']=$('input[name="'+type+'_postcode"]').val();
            data[type+'_zone_id']=$('select[name="'+type+'_zone_id"]').val();
            {% if not is_logged_in %}
                if(type==='payment'&&$('input[name="shipping_address"]').is(":checked")){
                    data['shipping_country_id']=$('select[name="'+type+'_country_id"]').val();
                    data['shipping_postcode']=$('input[name="'+type+'_postcode"]').val();
                    data['shipping_zone_id']=$('select[name="'+type+'_zone_id"]').val();
                }
            {% endif %}
        }

        $.ajax({
            url:'index.php?route=checkout/checkout/save',
            type:'post',
            cache:false,
            data:data,
            dataType:'json',
            success:function(json){
                $(document).trigger('so_checkout_reload_'+type);
                {% if not is_logged_in %}
                    if(type==='payment'&&$('input[name="shipping_address"]').is(':checked')){
                        $(document).trigger('so_checkout_reload_shipping');
                    }
                {% endif %}
            },
            error:function(xhr,ajaxOptions,thrownError){
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_shipping_changed', function (e, value) {
        $.ajax({
            url: 'index.php?route=checkout/checkout/save',
            type: 'post',
            data: {
                shipping_method: value
            },
            dataType: 'json',
            success: function() {
                $(document).trigger('so_checkout_reload_payment');
                $(document).trigger('so_checkout_reload_cart');
            },
            error: function(xhr, ajaxOptions, thrownError) {
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_payment_changed', function (e, value) {
        $.ajax({
            url: 'index.php?route=checkout/checkout/save',
            type: 'post',
            data: {
                payment_method: value
            },
            dataType: 'json',
            success: function() {
                $(document).trigger('so_checkout_reload_cart');
            },
            error: function(xhr, ajaxOptions, thrownError) {
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_reload_shipping', function () {
        $.ajax({
            url: 'index.php?route=checkout/checkout/shipping',
            type: 'get',
            dataType: 'html',
            beforeSend: function() {
                ajaxLoadingOn();
                $('.checkout-shipping-methods').addClass('checkout-loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('.checkout-shipping-methods').removeClass('checkout-loading');
            },
            success: function(html) {
                $('.checkout-shipping-methods').replaceWith(html);
                $(document).trigger('so_checkout_reload_cart');
            },
            error: function(xhr, ajaxOptions, thrownError) {
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_reload_payment', function () {
        $.ajax({
            url: 'index.php?route=checkout/checkout/payment',
            type: 'get',
            dataType: 'html',
            beforeSend: function() {
                ajaxLoadingOn();
                $('.checkout-payment-methods').addClass('checkout-loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('.checkout-payment-methods').removeClass('checkout-loading');
            },
            success: function(html) {
                $('.checkout-payment-methods').replaceWith(html);
                $(document).trigger('so_checkout_reload_cart');
            },
            error: function(xhr, ajaxOptions, thrownError) {
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).on('so_checkout_reload_cart', function (e, first) {
        $.ajax({
            url: 'index.php?route=checkout/checkout/cart',
            type: 'get',
            dataType: 'html',
            beforeSend: function() {
                if (!first) {
                    ajaxLoadingOn();
                    $('.so-onepagecheckout .checkout-cart').addClass('checkout-loading');
                }
            },
            complete: function() {
                if (!first) {
                    ajaxLoadingOff();
                    $('.so-onepagecheckout .checkout-cart').removeClass('checkout-loading');
                }
            },
            success: function(html) {
                $('.so-onepagecheckout .checkout-cart').replaceWith(html);
            },
            error: function(xhr, ajaxOptions, thrownError) {
                console.error && console.error(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    });

    $(document).delegate('.so-onepagecheckout .checkout-product .input-group .btn-update', 'click', function () {
        var key = $(this).attr('data-product-key');
        var qty  = $('input[name="quantity[' + key + ']"]').val();
        $.ajax({
            url: 'index.php?route=checkout/checkout/cart_update',
            type: 'post',
            data: {
                key: key,
                quantity: qty
            },
            dataType: 'json',
            beforeSend: function() {
                ajaxLoadingOn();
                $('#cart > button > a > span').button('loading');
                $('.so-onepagecheckout .checkout-cart').addClass('checkout-loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('#cart > button > a > span').button('reset');
            },
            success: function(json) {
                setTimeout(function () {
                    $('#cart-total').html(json['total']);
                }, 100);

                if (json['redirect']) {
                    location = json['redirect'];
                } else {
                    $('#cart ul').load('index.php?route=common/cart/info ul li');

                    $(document).trigger('so_checkout_reload_payment');
                    $(document).trigger('so_checkout_reload_shipping');
                }
            }
        });
    });

    $(document).delegate('.so-onepagecheckout .checkout-product .input-group .btn-delete', 'click', function () {
        var key = $(this).attr('data-product-key');
        $.ajax({
            url: 'index.php?route=checkout/checkout/cart_delete',
            type: 'post',
            data: {
                key: key
            },
            dataType: 'json',
            beforeSend: function() {
                ajaxLoadingOn();
                $('#cart > button > a > span').button('loading');
                $('.so-onepagecheckout .checkout-cart').addClass('checkout-loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('#cart > button > a > span').button('reset');
            },
            success: function(json) {
                setTimeout(function () {
                    $('#cart-total').html(json['total']);
                }, 100);

                if (json['redirect']) {
                    location = json['redirect'];
                } else {
                    $('#cart ul').load('index.php?route=common/cart/info ul li');

                    $(document).trigger('so_checkout_reload_payment');
                    $(document).trigger('so_checkout_reload_shipping');
                }
            }
        });
    });

    $(document).delegate('#button-voucher', 'click', function() {
        $.ajax({
            url:'index.php?route=extension/total/voucher/voucher',
            type: 'post',
            data: 'voucher=' + encodeURIComponent($('input[name=\'voucher\']').val()),
            dataType: 'json',
            beforeSend: function() {
                ajaxLoadingOn();
                $('.so-onepagecheckout #button-voucher').button('loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('.so-onepagecheckout #button-voucher').button('reset');
            },
            success: function(json) {
                if (json['error']) {
                    alert(json['error']);
                } else {
                    $('#cart ul').load('index.php?route=common/cart/info ul li');

                    $(document).trigger('so_checkout_reload_payment');
                    $(document).trigger('so_checkout_reload_shipping');
                }
            }
        });
    });

    $(document).delegate('#button-coupon', 'click', function() {
        $.ajax({
            url:'index.php?route=extension/total/coupon/coupon',
            type: 'post',
            data: 'coupon=' + encodeURIComponent($('input[name=\'coupon\']').val()),
            dataType: 'json',
            beforeSend: function() {
                ajaxLoadingOn();
                $('.so-onepagecheckout #button-coupon').button('loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('.so-onepagecheckout #button-coupon').button('reset');
            },
            success: function(json) {
                if (json['error']) {
                    alert(json['error']);
                } else {
                    $('#cart ul').load('index.php?route=common/cart/info ul li');

                    $(document).trigger('so_checkout_reload_payment');
                    $(document).trigger('so_checkout_reload_shipping');
                }
            }
        });
    });

    $(document).delegate('#button-reward', 'click', function() {
        $.ajax({
            url:'index.php?route=extension/total/reward/reward',
            type: 'post',
            data: 'reward=' + encodeURIComponent($('input[name=\'reward\']').val()),
            dataType: 'json',
            beforeSend: function() {
                ajaxLoadingOn();
                $('.so-onepagecheckout #button-reward').button('loading');
            },
            complete: function() {
                ajaxLoadingOff();
                $('.so-onepagecheckout #button-reward').button('reset');
            },
            success: function(json) {
                if (json['error']) {
                    alert(json['error']);
                } else {
                    $('#cart ul').load('index.php?route=common/cart/info ul li');

                    $(document).trigger('so_checkout_reload_payment');
                    $(document).trigger('so_checkout_reload_shipping');
                }
            }
        });
    });

    {% if is_logged_in %}
        $('.so-onepagecheckout [value="existing"]').trigger('change');
    {% else %}
        $('.so-onepagecheckout input[name="account"]:checked').trigger('change');
    {% endif %}

    $(document).trigger('so_checkout_reload_cart', true);
</script>
{{ footer }}