(function () {
function debounce(func, timeout = 1000) {
var timer;
return function () {
var args = arguments;
var context = this;
clearTimeout(timer);
timer = setTimeout(function() {
func.apply(context, args);
}, timeout);
};
}
function findTables() {
// Enable multiple tables on the page
return document.querySelectorAll("#purDiv");
}
function attachPurchaseEvents() {
document.querySelectorAll(".purRow").forEach(function(row) {
var dataset = row.dataset;
if (dataset && dataset.tid && dataset.b && dataset.username) {
row.querySelectorAll("a").forEach(function(link) {
function purPurchaseEvent(e) {
if (typeof gtag === 'function') {
gtag("event", "purchase", {
transaction_id: dataset.tid,
value: dataset.b,
currency: "USD",
items: [
{
item_id: dataset.tid,
item_name: dataset.username,
},
],
});
}
}
link.addEventListener("click", purPurchaseEvent);
link.addEventListener("contextmenu", purPurchaseEvent);
})
}
});
}
function loadTables() {
findTables().forEach(function(purDiv) {
var purUrl = purDiv.dataset.src;
if (purUrl) {
// Wordpress admin panel loads using blob addresses
const purQueryParams = new URLSearchParams();
const ref = window.location.href.replace("blob:", "");
purQueryParams.set('ref', ref);
// Pass along layout param from page or pur url
const pageQueryParams = new URLSearchParams(window.location.search);
const purLayoutParam = pageQueryParams.get('purLayout');
if (!purUrl.includes("layout=") && purLayoutParam) {
purQueryParams.set('layout', purLayoutParam);
}
fetch(`${purUrl}&${purQueryParams.toString()}`, { credentials: "omit" })
.then(function(response) {
if (response.ok) {
response.text()
.then(function(html) {
purDiv.innerHTML = html;
attachPurchaseEvents();
});
}
})
}
});
}
if (findTables().length > 0) {
// If there are tables, load them immediately
loadTables();
} else {
// Otherwise, wait until page load
window.addEventListener("load", function() {
loadTables();
});
}
// Debounce so that we dont hit the PUR endpoint on every keystroke
var debouncedLoadTables = debounce(loadTables);
// Listen to the render event emitted on the document:
// Example: document.dispatchEvent(new Event("onlyfinder:render"))
var RENDER_EVENT_NAME = "onlyfinder:render";
document.addEventListener(RENDER_EVENT_NAME, function(e) {
// Rerender any tables in this window
debouncedLoadTables();
// Find any iframes on the page (e.g. in the Wordpress block editor),
// and send the rerender event to them.
document.querySelectorAll("iframe").forEach(function (iframe) {
iframe.contentWindow.postMessage({
eventName: RENDER_EVENT_NAME
}, window.location.origin)
})
});
// Listen for the render event in the iframe rendering the table
window.addEventListener("message", function(e) {
if (e.data.eventName === RENDER_EVENT_NAME && e.origin === window.location.origin) {
debouncedLoadTables();
}
})
})()