Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Integration Example: ID import library example #6434

Merged
merged 2 commits into from
Mar 19, 2021
Merged

Integration Example: ID import library example #6434

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
cfe1ad4
ID Import Library example
Mar 17, 2021
d1d6988
Fixing review comments
Mar 18, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
351 changes: 351 additions & 0 deletions integrationExamples/gpt/idImportLibrary_example.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,351 @@
<html>
<head>
<script>
var pbjs = pbjs || {};
pbjs.que = pbjs.que || [];
</script>
<script src="../../build/dev/prebid.js" async></script>

<script>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
googletag.cmd.push(function() {
googletag.pubads().disableInitialLoad();
});

pbjs.que.push(function() {
pbjs.setConfig({
debug: true,
consentManagement: {
cmpApi: 'iab',
timeout: 1000,
allowAuctionWithoutConsent: true
smenzer marked this conversation as resolved.
Show resolved Hide resolved
},
userSync: {
userIds: [
{
name: "id5Id",
params: {
partner: 173 //Set your real ID5 partner ID here for production, please ask for one at http://id5.io/prebid
},
storage: {
type: "cookie",
smenzer marked this conversation as resolved.
Show resolved Hide resolved
name: "id5id",
expires: 90,
refreshInSeconds: 8*3600 // Refresh frequency of cookies, defaulting to 'expires'
},

}, {
name: "pubCommonId",
storage: {
type: "cookie",
name: "pubcid",
expires: 365
},
}, {
name: 'identityLink',
params: {
pid: '14' // Set your real identityLink placement ID here
},
storage: {
type: 'cookie',
name: 'idl_env',
expires: 30
}
},
{
name: "sharedId",
params: {
syncTime: 60 // in seconds, default is 24 hours
},
storage: {
type: "cookie",
name: "sharedid",
expires: 28
}
} , {
name: "liveIntentId",
params: {
publisherId: "9896876"
},
storage: {
type: "cookie",
name: "_li_pbid",
expires: 28
}
},
{
name: "zeotapIdPlus"
},
{
name: 'haloId',
storage: {
type: "cookie",
name: "haloId",
expires: 28
}
}, {
name: "merkleId",
params: {
ptk: '12345678-aaaa-bbbb-cccc-123456789abc', //Set your real merkle partner key here
pubid: 'EXAMPLE' //Set your real merkle publisher id here
},
storage: {
type: "html5",
name: "merkleId",
expires: 30
},

},{
name: "unifiedId",
params: {
partner: "prebid",
url: "http://match.adsrvr.org/track/rid?ttd_pid=prebid&fmt=json"
},
storage: {
type: "html5",
name: "unifiedid",
expires: 30
},
},{
name: "parrableId",
params: {
// change to Parrable Partner Client ID(s) you received from the Parrable Partners you are using
partner: '30182847-e426-4ff9-b2b5-9ca1324ea09b'
}
},{
name: "criteo"
}
],
syncDelay: 5000,
auctionDelay: 1000
}
});
pbjs.addAdUnits(adUnits);
pbjs.requestBids({
bidsBackHandler: sendAdserverRequest
});
});

function sendAdserverRequest() {
if (pbjs.adserverRequestSent) return;
pbjs.adserverRequestSent = true;
googletag.cmd.push(function() {
pbjs.que.push(function() {
pbjs.setTargetingForGPTAsync();
googletag.pubads().refresh();
});
});
}
var FAILSAFE_TIMEOUT = 2000;

setTimeout(function() {
sendAdserverRequest();
}, FAILSAFE_TIMEOUT);
</script>

<script>
googletag.cmd.push(function() {
googletag.defineSlot('/112115922/FL_PB_MedRect', [[300, 250],[300,600]], 'test-div').addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
pbjs.que.push(function() {
pbjs.setConfig({
idImportLibrary:{
url: 'http://localhost:8090/sync'
smenzer marked this conversation as resolved.
Show resolved Hide resolved
},
});
});
</script>
</head>

<style>
body {font-family: Arial, Helvetica, sans-serif;}

/* Full-width input fields */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}

/* Set a style for all buttons */
button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}

button:hover {
opacity: 0.8;
}

/* Extra styles for the cancel button */
.cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}

/* Center the image and position the close button */
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
position: relative;
}

img.avatar {
width: 40%;
border-radius: 50%;
}

.container {
padding: 16px;
}

span.psw {
float: right;
padding-top: 16px;
}

/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
padding-top: 60px;
}

/* Modal Content/Box */
.modal-content {
background-color: #fefefe;
margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
border: 1px solid #888;
width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button (x) */
.close {
position: absolute;
right: 25px;
top: 0;
color: #000;
font-size: 35px;
font-weight: bold;
}

.close:hover,
.close:focus {
color: red;
cursor: pointer;
}

/* Add Zoom Animation */
.animate {
-webkit-animation: animatezoom 0.6s;
animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
from {-webkit-transform: scale(0)}
to {-webkit-transform: scale(1)}
}

@keyframes animatezoom {
from {transform: scale(0)}
to {transform: scale(1)}
}

/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 200px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
}
th {
text-align: left;
}
</style>
</head>
<body>
<img src="https://prebid.org/wp-content/uploads/2021/02/Prebid-Logo-RGB-Full-Color-Medium.svg" alt="Prebid" class="logo-img" data-no-retina="data-no-retina" width="150" data-no-lazy="1">

<h2 style="color:#ff6f00;" >ID Import Library Example</h2>
<h4> Steps before logging in:</h4>

<ul style="font-size:18px;font-family:'Courier New'">
<li>Open console
<ul style="font-size:15px;font-family:'Courier New'">
<li>For Mac, Command+Option+J</li>
<li>Windows/Linux, Control+Shift+J</li>
</ul>
</li>
<li>Search for 'ID-Library' in console</li>
</ul>

<button onclick="document.getElementById('id01').style.display='block'" style="width:auto;">Login</button>

<div id="id01" class="modal">

<form class="modal-content animate">

<div class="container">
<label ><b>Username/Email</b></label>
<input type="text" placeholder="Enter Username/Email" name="uname" required>

<label ><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="psw" required>

<button type="submit">Login</button>
<label>
<input type="checkbox" checked="checked" name="remember"> Remember me
</label>
</div>

<div class="container" style="background-color:#f1f1f1">
<button type="button" onclick="document.getElementById('id01').style.display='none'" class="cancelbtn">Cancel</button>
<span class="psw">Forgot <a href="#">password?</a></span>
</div>
</form>
</div>

<script>
// Get the modal
var modal = document.getElementById('id01');

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script>

</body>
</html>