<script src="https://payment.tmtprotects.com/tmt-payment-modal.3.6.1.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: "14079", country: "GB", date: "2024-09-15", currencies: "GBP", total: "5000", reference: "SOMEBOOKING", // optional description: "Holiday for Two", // optional pax: "2", // optional, // Authentication booking_auth: "46b58751077d678f1267a26e9d43bd3774786b8f7e256d45948bd651ba6b3e0820240908005436", // 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", // optional payee_city: "Test city", // optional payee_country: "AR", payee_postcode: "0000", // optional // Allocations allocations: [{ // optional channels: "1552", currencies: "EUR", operator: "flat", total: 2500 }], charge_channel: 1552 // optional, but dependent on allocations }, paymentCurrency: "USD", disableLang: false, lang: "enGB", disableCloseWindowPrompt: false, debug: true, verify: [ "allocations", "firstname", "surname", "email", "date", "reference", "country", "description", "pax", "charge_channel", ], paymentMethods: [ "credit-card", "alipay", "dlocal", "giropay", "ideal", "sofort", "rapipago" ] }) // 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("close_window_attempted", function (data) { console.log("USER ATTEMPTED TO CLOSE BROWSER WINDOW ", data); }) }) } </script>