<div class="" id="checkout">
	<div class="row">
		<div class="col col-sm-12 col-md-12">
		{$pp_message}
		{$message}
		</div><!-- .column .xt-grid-16 -->
	</div><!--  .row -->

	<div id="checkout-confirmation" class="row">
		<div class="col col-sm-4 col-md-3">
			<div class="well shipping-address address">
				<p class="headline-underline clearfix">{txt key=TEXT_SHIPPING_ADDRESS}</p>

				{if $shipping_address.allow_change == true && $shipping_address.address_class=='shipping'}
				<p class="right"><a class="highlight" href="{link page='customer' paction='edit_address' params='adType=shipping&abID' params_value=$shipping_address.address_book_id conn=SSL}">{txt key=TEXT_EDIT}</a></p>
				{/if}

				{if $shipping_address.customers_company}<p>{$shipping_address.customers_company}</p>{/if}
				<p>{$shipping_address.customers_firstname} {$shipping_address.customers_lastname}</p>
				<p>{$shipping_address.customers_street_address}</p>
                {if $shipping_address.customers_address_addition}<p>{$shipping_address.customers_address_addition}</p>{/if}
				{if $shipping_address.customers_suburb}<p>{$shipping_address.customers_suburb}</p>{/if}
				<p>{$shipping_address.customers_postcode} {$shipping_address.customers_city}</p>
				<p>{$shipping_address.customers_country}</p>
				<p><br /></p>

			</div><!-- .box -->
			{if $shipping_data|count neq 0}
			<div class="well payment-address address ppcp-express">
				<p class="headline-underline">{txt key=TEXT_PAYMENT_ADDRESS}</p>

				{if $payment_address.customers_company}<p>{$payment_address.customers_company}</p>{/if}
				<p>{$payment_address.customers_firstname} {$payment_address.customers_lastname}</p>
				<p>{$payment_address.customers_street_address}</p>
                {if $payment_address.customers_address_addition}<p>{$payment_address.customers_address_addition}</p>{/if}
				{if $payment_address.customers_suburb}<p>{$payment_address.customers_suburb}</p>{/if}
				<p>{$payment_address.customers_postcode} {$payment_address.customers_city}</p>
				<p>{$payment_address.customers_country}</p>
                {if $payment_address.allow_change == true }
                    <p class=""><a class="highlight" href="{link page='customer' paction='edit_address' params='adType=payment&abID' params_value=$payment_address.address_book_id conn=SSL}">{txt key=TEXT_EDIT}</a></p>
                {/if}
				<p><br /></p>
                {if $smarty.session.customer->customer_info.account_type == 0}
				{txt key=TEXT_SELECT_PAYMENT_ADDRESS}
				{form type=form name=payment_address action='dynamic' link_params='page_action=payment' method=post conn=SSL}
				{form type=select name=adID value=$address_data params='onchange="this.form.submit();"'}
				{form type=hidden name=adType value=payment}
				{form type=hidden name=action value=select_address}
				{form type=formend}
                {/if}

			</div>
			{/if}
		</div>

		{if $shipping_data|count eq 0 && $smarty.session.cart->type != 'virtual'}
		<div class="col col-sm-8 col-md-9">
			<div class="box error">{txt key=PAYPAL_EXPRESS_ERROR_UNSUPPORTED_COUNTRY}</div>
			<p class="right">{$pp_express_button}</p>
		</div>

		{else}

		<div class="col col-sm-8 col-md-9">
            <h1>{txt key=TEXT_CONFIRMATION_DESC}</h1>
			{hook key=checkout_tpl_info}
			
			{form id="checkout-form" type=form name=process action='checkout' method=post conn=SSL}
			{form type=hidden name=action value=process}

			<div class="alert alert-warning">
                {if $smarty.const.XT_PAYPAL_REGISTER_CHECKBOX == 1 && !$smarty.session.registered_customer}
                <p class="checkbox">
                    <label>
                        {form type=checkbox name=paypal_create_account}
                        {txt key=TEXT_I_WANT_TO_REGISTER}
                    </label>
                </p>
                {/if}
            {if $smarty.const._STORE_TERMSCOND_CHECK eq 'true'}
                {content cont_id=3 is_id='false'}
                <p class="checkbox">
                    <label>
                        {form type=checkbox name=conditions_accepted class="xt-form-required"}
                        {txt key=TEXT_TERMSANDCOND_CONFIRMATION_1} <a href="{$_content_3.content_link}" target="_blank">{txt key=TEXT_TERMSANDCOND_CONFIRMATION_2}</a> {txt key=TEXT_TERMSANDCOND_CONFIRMATION_3}
                    </label>
                </p>
            {else}
                {content cont_id=3 is_id='false'}
                <p><span class="glyphicon glyphicon-ok"></span> <strong>{txt key=TEXT_TERMSANDCOND_CONFIRMATION_1} <a href="{$_content_3.content_link}" target="_blank">{txt key=TEXT_TERMSANDCOND_CONFIRMATION_2}</a> {txt key=TEXT_TERMSANDCOND_CONFIRMATION_3}</strong></p>
            {/if}
            {if $show_digital_checkbox eq 'true'}
                <p class="checkbox">
                    <label>
                        {form type=checkbox name=withdrawal_reject_accepted}
                        {txt key=TEXT_DIGITALCOND_CHECK}
                    </label>
                </p>
            {/if}
            {hook key=checkout_tpl_form}
			</div>
			
            <div class="well form-counter">
                <p class="h4">{txt key=TEXT_COMMENTS} <small>{txt key=TEXT_MAX_CHARACTERS}</small></p>
                <textarea name="comments" id="comments" class="form-control autosizejs" cols="50" rows="3" placeholder="{txt key=TEXT_COMMENTS_DESC}" maxlength="255">{$smarty.session.order_comments}</textarea>
            </div>
			
			<div class="div-table table-hover table-bordered">
            <div class="row th">
                <div class="col col-md-8">
                    {txt key=TEXT_ARTICLE}
                </div>
                <div class="col col-md-2 hidden-xs hidden-sm text-right">
                    {txt key=TEXT_SINGLE_PRICE}
                </div>
                <div class="col col-md-2 hidden-xs hidden-sm text-right">
                    {txt key=TEXT_TOTAL_PRICE}
                </div>
            </div>
            {foreach key=key item=product from=$data}
                {form type=hidden name='products_key[]' value=$product.products_key}
                <div class="row tr">
                    <div class="col col-xs-5 col-md-2">
                        <p class="image">
                            {if !$product.products_image || $product.products_image == 'product:noimage.gif'}
                                <a href="{$product.products_link}" class="vertical-helper image-link no-image img-thumbnail">
                                    <i class="no-image-icon"></i>
                                </a>
                            {else}
                                <a href="{$product.products_link}" class="vertical-helper image-link img-thumbnail" target="_blank">{img img=$product.products_image type=m_thumb class="productImageBorder img-responsive" alt=$product.products_name|escape:"html"}</a>
                            {/if}
                        </p>
                    </div>
                    <div class="col col-xs-7 col-md-6">
                        <p class="product-name break-word bold"><a href="{$product.products_link}" target="_blank">{$product.products_name}</a></p>
                        {hook key=cart_xt_options pid=$product.products_id}
                        {if $product.products_short_description}
                            <p class="product-description text-muted hidden-xs">{$product.products_short_description|strip_tags|truncate:100:'...'} (<a href="{$product.products_link}" target="_blank">{txt key=TEXT_MORE}</a>)</p>
                        {elseif $product.products_description}
                            <p class="product-description text-muted hidden-xs">{$product.products_description|strip_tags|truncate:100:'...'} (<a href="{$product.products_link}" target="_blank">{txt key=TEXT_MORE}</a>)</p>
                        {/if}
                        <ul class="label-list fixed-padding">
                            {if $product.products_information}<li><span class="badge">{$product.products_information|replace:'<tr class="contentrow1">':''|replace:'<tr class="contentrow2">':''|replace:'<td>':''|replace:'<td class="left" colspan="4">':''|replace:'</td>':''|replace:'</tr>':''}</span></li>{/if}
                            {if $product.products_model!=''}<li><span class="badge">{txt key=TEXT_PRODUCTS_MODEL} {$product.products_model}</span></li>{/if}
                            {if $product.products_weight > 0}<li><span class="badge">{txt key=TEXT_PRODUCTS_WEIGHT} {$product.products_weight|weight_format:"kg"}</span></li>{/if}
                            {if $product.shipping_status_data.name}<li><span class="badge">{txt key=TEXT_SHIPPING_STATUS} {$product.shipping_status_data.name}</span></li>{/if}
                        </ul>

                        {*<!-- price info visible-xs visible-sm part --- start -->*}
                        <div class="hidden-md hidden-lg text-left-xs">
                            <span class="text-middle">{txt key=TEXT_SINGLE_PRICE}:</span><br />
                            <p class="product-price">
                                    {$product.products_price.formated}
                            </p>
                            <span class="text-middle">{txt key=TEXT_TOTAL_PRICE}:</span><br />
                            <p class="product-price final-price">{$product.products_final_price.formated}</p>
                        </div>
                        {*<!-- / price info visible-xs visible-sm part --- end -->*}

                        <div class="form-inline">
                            <div class="form-group form-group-sm">
                                <div class="input-group">
                                    <label for="form-qty-{$product.products_id}" class="input-group-addon text-regular">{txt key=TEXT_QTY}</label>
                                    <input type="text"
                                           class="form-control disabled"
                                           disabled="disabled"
                                           id="form-qty-{$product.products_id}"
                                           value="{$product.products_quantity}"
                                           style="width: 6em" />
                                </div>
                            </div>
                            <a href="{link page='cart'}" type="button" class="btn btn-sm btn-primary">
                                <span class="glyphicon glyphicon-pencil"></span>
                                {txt key=TEXT_EDIT}
                            </a>
                        </div>
                    </div>
                    <div class="col col-md-2 hidden-xs hidden-sm text-right">
                        <p class="product-price">
                                {$product.products_price.formated}
                        </p>
                    </div>
                    <div class="col col-md-2 hidden-xs hidden-sm text-right">
                        <p class="product-price final-price">{$product.products_final_price.formated}</p>
                    </div>
                </div>
            {/foreach}
            <div class="row tfoot text-right">
                <div class="col col-md-offset-8 col-xs-5 col-md-2">
                    {hook key=checkout_tpl_form_total_lines_top}
                    {hook key=checkout_tpl_form_total_lines}
                    {txt key=TEXT_SUB_TOTAL}
                </div>
                <div class="col col-xs-7 col-md-2">
                    {$sub_total}
                </div>
            </div>
            {foreach item=total from=$sub_data}
                <div class="row tfoot text-right">
                    <div class="col col-md-offset-8 col-xs-5 col-md-2">
                        {$total.products_name}
                    </div>
                    <div class="col col-xs-7 col-md-2">
                        {$total.products_price.formated}
                    </div>
                </div>
            {/foreach}
            <div class="row tfoot bold text-right">
                <div class="col col-md-offset-8 col-xs-5 col-md-2">
                    {txt key=TEXT_TOTAL}
                </div>
                <div class="col col-xs-7 col-md-2">
                    <span id="grand-total-value">{$total}</span>
                </div>
            </div>
            {foreach item=tax_data from=$tax}
                <div class="row tfoot text-right">
                    <div class="col col-md-offset-8 col-xs-5 col-md-2">
                        {txt key=TEXT_TAX} {$tax_data.tax_key}%
                    </div>
                    <div class="col col-xs-7 col-md-2">
                        {$tax_data.tax_value.formated|replace:"*":""}
                    </div>
                </div>
            {/foreach}
            {if $discount}
                <div class="row tfoot text-right">
                    <div class="col col-md-offset-8 col-xs-5 col-md-2">
                        <strong>{txt key=TEXT_DISCOUNT_MADE}</strong>
                    </div>
                    <div class="col col-xs-7 col-md-2">
                        {$discount.formated}
                    </div>
                </div>
            {/if}

            {hook key=checkout_tpl_form_total_lines_bottom}
        </div><!-- .div-table -->
        <br />

        {if $payment_info.payment_cost_info eq '1'}
            <p class="alert alert-info">{txt key=TEXT_ORDER_CONFIRMATION_BUTTON_LAW}</p>
        {/if}
        {if $post_form eq '1'}
            <p class="alert alert-info">{txt key=TEXT_INFO_PAY_NEXT_STEP}</p>
        {/if}

			<div class="clearfix">
				<div class="hidden-lg hidden-md hidden-sm">
					<button type="submit" class="btn btn-success btn-block btn-lg">
						<span class="glyphicon glyphicon-flag"></span>
						{txt key=BUTTON_CONFIRM_ORDER}
					</button>
					<br />
				</div>
				<button type="submit" class="btn btn-success pull-right hidden-xs">
					<span class="glyphicon glyphicon-flag"></span>
					{txt key=BUTTON_CONFIRM_ORDER}
				</button>
			</div>
		<br />
		</div><!-- .column .xt-grid-12 -->
		{/if} {* end shipping country supported *}
	</div><!-- #checkout-confirmation .row -->
    {hook key=checkout_tpl_confiramtion}{* deprecated *}
    {hook key=checkout_tpl_confirmation}
	{form type=formend}
</div>

{include file="./paypal-checkout-wait-modal.tpl.html"}

<script>
    document.addEventListener('DOMContentLoaded', function ()
    {
        try {
            document.querySelector('#checkout-form').addEventListener("submit", (e) => {
                const form =  ppcGetCheckoutForm();
                let valid = false;
                if(form) valid = xtSimpleCheckForm_ppc(form);
                if(valid)
                {
                    ppcWaitModal();
                    setTimeout(function () {
                        document.getElementById("ppc_oops").style.display = "block"
                    }, 4000);
                }
            })

        }
        catch(e)
        {
            console.log(e);
        }
    });
</script>

