{extends file=$layout}

{block name='content'}

	{capture name=path}{l s='Payment' mod='imoje'}{/capture}
	<div class="text-center">{l s='Please wait, in the next step you will choose a payment method...' mod='imoje'}
		<br>
		<form action="{$payment_url}" id="imoje_method_form" method="post">
			<input type="hidden" name="imoje_method" value="PAYMENTPAGE"/>
			<input type="hidden" name="imoje_order_id" value="{$order_id}"/>
			<input type="hidden" name="imoje_customer_id" value="{$customer_id}"/>
			<input type="hidden" name="imoje_address_invoice_id" value="{$address_invoice_id}"/>
			<input type="hidden" name="imoje_address_delivery_id" value="{$address_delivery_id}"/>
			<input type="hidden" name="twisto_data" id="twisto_data" value=""/>
			<br/>
			<button style="display:none" type="submit" name="submit" id="twisto_submit">{$continue}</button>
		</form>
		<br>
		<script type="text/javascript">
			document.getElementById('twisto_submit').classList.add("btn", "btn-warning", "button-medium");

			(function () {

				var twistoConfig = {
					public_key: '{$payment_methods.twisto.pk}',
					script: '{$twisto_script_url}'
				};

				(function (e, g, a) {
					function h(a) {
						return function () {
							b._.push([a, arguments])
						}
					}

					var f = ["check"], b = e || {}, c = document.createElement(a);
					a = document.getElementsByTagName(a)[0];
					b._ = [];
					for (var d = 0; d < f.length; d++) {
						b[f[d]] = h(f[d]);
					}
					this[g] = b;
					c.type = "text/javascript";
					c.async = !0;
					c.src = e.script;
					a.parentNode.insertBefore(c, a);
					delete e.script
				}).call(window, twistoConfig, "Twisto", "script");

				document.addEventListener("DOMContentLoaded", function (event) {

					var twistoTimeout,
						twistoTimeoutFlag = false,
						timeBeforeCheck;

					function timeout() {

						return setTimeout(function () {
							processForm({
								"details": "timeout"
							});
						}, {$payment_methods.twisto.timeout});
					}

					function processForm(response) {

						clearTimeout(twistoTimeout);
						response.timeResponse = (new Date()).getTime() - timeBeforeCheck;
						document.getElementById('twisto_data').value = JSON.stringify(response);
						$("#twisto_submit").show().click();
					}

					timeBeforeCheck = (new Date()).getTime();

					twistoTimeout = timeout();

					Twisto.check("{$twisto_payload}", function (response) {

							processForm(response);
						}, function (response) {

							if (!response) {
								response = {
									"details": "errorCallback"
								}
							}

							processForm(response);
						}, {
							"processingStarted": function () {

								if (twistoTimeoutFlag) {
									return;
								}
								twistoTimeoutFlag = true;
								clearTimeout(twistoTimeout);
								twistoTimeout = timeout();
							}
						}
					);
				});
			})();

		</script>
	</div>
{/block}