<script src="https://payment.qubotic.name/tmt-payment-modal.3.5.0.js"></script> <script> window.tmtPaymentModalReady = function () { const button = document.getElementById("trigger-modal") button.addEventListener("click", function () { const tmtPaymentModal = new window.tmtPaymentModalSdk({ path: "tmt-test", environment: "test", data: { // Booking Data booking_id: "0", channels: "1918", country: "GB", date: "2020-05-12", currencies: "USD", total: "5000", // Authentication booking_auth: "7e2d3fb2a77ee73dd6f7de4bfd50ebebdba994af777fa4a2c3583996e4d223f420240908023316", // Lead Traveller firstname: "John", surname: "Smith", email: "john.smith@example.org", // Payment details payee_name: "Jane Smith", payee_email: "jane.smith@example.org", payee_address: "123 test address", payee_city: "Test city", payee_country: "GB", payee_postcode: "0000" } }) // Available Callbacks tmtPaymentModal.on("booking_logged", function(data) { console.log("BOOKING LOGGED - ", data); }) tmtPaymentModal.on("booking_exists", function (data) { console.log("BOOKING EXISTS - ", data); }) tmtPaymentModal.on("booking_error", function (data) { console.log("BOOKING ERROR - ", data); }) tmtPaymentModal.on("transaction_logged", function (data) { console.log("TRANSACTION LOGGED - ", data); tmtPaymentModal.closeModal(); var formData = new FormData(); formData.append("id", data.id); formData.append("status", data.status); formData.append("total", data.total); formData.append("hash", data.hash); var xmlHttp = new XMLHttpRequest(); xmlHttp.onreadystatechange = function() { if(xmlHttp.readyState == 4 && xmlHttp.status == 200) { const output = document.getElementById("outer") output.innerHTML = "<div id='outcome' class='container content'><h2>" + xmlHttp.responseText + "</h2></div>"; } } xmlHttp.open("post", "server.php"); xmlHttp.send(formData); }) tmtPaymentModal.on("transaction_failed", function (data) { console.log("TRANSACTION FAILED - ", data); tmtPaymentModal.closeModal(); var formData = new FormData(); formData.append("id", data.id); formData.append("status", data.status); formData.append("total", data.total); formData.append("hash", data.hash); var xmlHttp = new XMLHttpRequest(); xmlHttp.onreadystatechange = function() { if(xmlHttp.readyState == 4 && xmlHttp.status == 200) { const output = document.getElementById("outer") output.innerHTML = "<div id='outcome' class='container content'><h2>" + xmlHttp.responseText + "</h2></div>"; } } xmlHttp.open("post", "server.php"); xmlHttp.send(formData); }) tmtPaymentModal.on("transaction_error", function (data) { console.log("TRANSACTION ERROR - ", data); }) tmtPaymentModal.on("modal_closed", function (data) { console.log("MODAL CLOSED - ", data); }) tmtPaymentModal.on("transaction_result_available", function (data) { console.log("TRANSACTION RESULT AVAILABLE - ", data); }) tmtPaymentModal.on("close_window_attempted", function (data) { console.log("USER ATTEMPTED TO CLOSE BROWSER WINDOW ", data); }) }) } </script>