Getting Started in the UI
Reporting

Using gdprApplies Flag to Display Privacy Manager Link

You may want to display the link to the Sourcepoint Privacy Manager based on the location of the site visitor. In this case you can use the __tcfapi('addEventListener') function to determine whether GDPR applies to the user and conditionally display the link to the user.

The first step in the process is to create a link to the privacy manager using an element's onclick event and setting that element's display to none. This will mean that the link will not be available to the user initially. See the example element below.

<button id="gdpr_link" style="display:none" onclick="window._sp_.loadPrivacyManagerModal(135789)">Manage Settings</button>

Step 2: Create A Function to Change Element's Display Style

The next step is to create a function to change the elements style from display:none to a visible style such as display:block or display:inline-block. We will pass a true or false (boolean) value to the function. Below is an example of a function that will accomplish this.

function showPrivacyManager(sp_gdpr){
if(sp_gdpr){
document.getElementById("gdpr_link").style.display="inline-block";
}
}

Step 3: Create A Call to __tcfapi('addEventListener') to Capture gdprApplies value.

The last step is create a __tcfapi('addEventListener') function to capture whether or not the site visitor is located in a region where GDPR applies by check the gdprApplies property of the tcData object. This property is then passed to the function defined above.

window.__tcfapi('addEventListener', 2, function (tcData, success) {
console.log("tcData.gdprApplies: " + tcData.gdprApplies);
if (success) {
if (tcData.eventStatus === 'tcloaded'||tcData.eventStatus === 'cmpuishown') {
console.log(tcData.publisherCC);
showPrivacyManager(tcData.gdprApplies) // triggers 2x
window.__tcfapi('removeEventListener', 2, function (success) {
if(success) {
console.log('removed: '+tcData.listenerId);
}
}, tcData.listenerId);
}
}
});

Example of Complete Solution

Below is a working example HTML page that encompasses all of the pieces defined above. To use this example with your own account, you would change the accountId parameter and either remove or change the propertyHref parameter.

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
// GDPR Stub Function
!function () { var e = function () { var e, t = "__tcfapiLocator", a = [], n = window; for (; n;) { try { if (n.frames[t]) { e = n; break } } catch (e) { } if (n === window.top) break; n = n.parent } e || (!function e() { var a = n.document, r = !!n.frames[t]; if (!r) if (a.body) { var i = a.createElement("iframe"); i.style.cssText = "display:none", i.name = t, a.body.appendChild(i) } else setTimeout(e, 5); return !r }(), n.__tcfapi = function () { for (var e, t = arguments.length, n = new Array(t), r = 0; r < t; r++)n[r] = arguments[r]; if (!n.length) return a; if ("setGdprApplies" === n[0]) n.length > 3 && 2 === parseInt(n[1], 10) && "boolean" == typeof n[3] && (e = n[3], "function" == typeof n[2] && n[2]("set", !0)); else if ("ping" === n[0]) { var i = { gdprApplies: e, cmpLoaded: !1, cmpStatus: "stub" }; "function" == typeof n[2] && n[2](i) } else a.push(n) }, n.addEventListener("message", (function (e) { var t = "string" == typeof e.data, a = {}; try { a = t ? JSON.parse(e.data) : e.data } catch (e) { } var n = a.__tcfapiCall; n && window.__tcfapi(n.command, n.version, (function (a, r) { var i = { __tcfapiReturn: { returnValue: a, success: r, callId: n.callId } }; t && (i = JSON.stringify(i)), e.source.postMessage(i, "*") }), n.parameter) }), !1)) }; "undefined" != typeof module ? module.exports = e : e() }();
</script>
<script>
window._sp_ = {
config: {
accountId: 1319,
baseEndpoint: 'https://cdn.privacy-mgmt.com',
propertyHref: 'https://www.property3.com'
}
}
</script>
<script src="https://cdn.privacy-mgmt.com/wrapperMessagingWithoutDetection.js"></script>
<script type="text/javascript">
function showPrivacyManager(sp_gdpr){
if(sp_gdpr){
document.getElementById("gdpr_link").style.display="inline-block";
}
}
window.__tcfapi('addEventListener', 2, function (tcData, success) {
console.log("tcData.gdprApplies: " + tcData.gdprApplies);
if (success) {
if (tcData.eventStatus === 'tcloaded'||tcData.eventStatus === 'cmpuishown') {
console.log(tcData.publisherCC);
showPrivacyManager(tcData.gdprApplies) // triggers 2x
window.__tcfapi('removeEventListener', 2, function (success) {
if(success) {
console.log('removed: '+tcData.listenerId); // triggers 1x
}
}, tcData.listenerId);
}
}
});
</script>
<button id="gdpr_link" style="display:none" onclick="window._sp_.loadPrivacyManagerModal(135789)">Manage Settings</button>
</body>
</html>