Integrated Receipt Demo

by IntegrationSupport

HTML

<script src="https://iclientsimulator.test.tyro.com/iclient-with-ui-v1.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<h1>Integrated Receipt Demo</h1>
<h5>
    <a href="">Pair with the simulator by clicking the pairing button</a> if necessary.
<br>Please select the transaction amount from the drop-down and press the relevant button to process a purchase or refund transaction
</h5>
<select class="form-control" id="amount">
    <option value="10000">$100.00 (Approved; swiped + cheque + PIN; EFTPOS card type)</option>
    <option value="10001">$100.01 (Declined; swiped + cheque + PIN; EFTPOS card type)</option>
    <option value="10100">$101.00 (Approved; swiped + savings + PIN; EFTPOS card type)</option>
    <option value="10101">$101.01 (Declined; swiped + savings + PIN; EFTPOS card type)</option>
    <option value="10200">$102.00 (Approved; swiped + credit + PIN; Visa card type)</option>
    <option value="10201">$102.01 (Declined; swiped + credit + PIN; Visa card type)</option>
    <option value="10208">$102.08 (Approved; swiped + credit + signature; Visa card type)</option>
    <option value="10300">$103.00 (Approved; swiped + PIN; Mastercard card type)</option>
    <option value="10301">$103.01 (Declined; swiped + PIN; Mastercard card type)</option>
    <option value="10308">$103.08 (Approved; swiped + signature; Mastercard card type)</option>
    <option value="10400">$104.00 (Approved; swiped + PIN; AMEX card type)</option>
    <option value="10401">$104.01 (Declined; swiped + PIN; AMEX card type)</option>
    <option value="10408">$104.08 (Approved; swiped + signature; AMEX card type)</option>
    <option value="11200">$112.00 (Visa, issued in EUR, Approved;)</option>
    <option value="11201">$112.01 (Visa, issued in EUR, Declined;)</option>
    <option value="11208">$112.08 (Visa, issued in EUR,...

CSS

body {
    margin: 10px;
}
h3 {
    margin-top: 0;
}
td {
    padding: 3px;
}
.mt10 {1
    margin-top: 10px;
}

JavaScript

// Before running this fiddle, you will need to pair your virtual terminal with the browser using this page:
// https://iclientsimulator.test.tyro.com/configuration.html

var apiKey = "Test API Key"; // API Key not validated test environments
var posProductInfo = {
    posProductVendor: "Acme Co",
    posProductName: "Acme Cloud POS",
    posProductVersion: "1.0.0",
    siteReference: "E.g. my customer ID or address"
};
var iclient = new TYRO.IClientWithUI(apiKey, posProductInfo);
var transactionType = "purchase";

function pairing() {
   var x = document.getElementById("iClientFrame")
   x.src
   = "https://iclientsimulator.test.tyro.com/configuration.html";
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
        }

// The Tyro simulator uses 'magic' amounts. Refer to this page for more details:
// https://integrationsimulator.test.tyro.com/docs/
function purchase() {
    reset();
    doPurchase($("#amount").val());
}

function refund() {
    reset();
    doRefund($("#amount").val());
}

function continueLastTransaction() {
    reset();
    doContinueLastTransaction($("#amount").val());
}

function reset() {
    $("#merchantReceipt").html("Merchant Receipt");
    $("#customerReceipt").html("Customer Receipt");
    $("#result").html("Result");
}
var receiptCallbackImpl = function (receipt) {
    console.log("Merchant Receipt = " + JSON.stringify(receipt));
    $("#merchantReceipt").html(formatReceipt(receipt.merchantReceipt));
};
var transactionCompleteCallbackImpl = function (response) {
    console.log("Response = " + JSON.stringify(response));

    if (response.customerReceipt) {

        console.log("Customer Receipt = " + JSON.stringify(response.customerReceipt));

//Compiling the integrated receipt:
if(transactionType=="purchase" && response.result=="APPROVED"){
var posReceipt = formatReceipt("\tTAX INVOICE       \r\n\r\n      Merchant 1655650     \r\n      Address line 1       \r\n     ...