https://www.stuttgarter-zeitung.de/static/js/statamicFooterAd.js

1// This code comes from Marcus Scheib and loads the statamic footer ad
2
3function msRemoveEdgeAd(msEdgeAdID, msDaysInvisible) {
4	let msInvisibleTime = Date.now() + msDaysInvisible * 24 * 60 * 60 * 1000;
5	let msHideEdgeAdTime = Date.now() + 3 * 60 * 60 * 1000;
6	let msEdgeAd = document.getElementById(msEdgeAdID);
7	localStorage.setItem(msEdgeAdID, msInvisibleTime);
8	localStorage.setItem("msEdgeAdBlockTime", msHideEdgeAdTime);
9	msEdgeAd.remove();
10}
11
12function msMinimizeEdgeAd(msEdgeAdID, msDaysInvisible) {
13	let msEdgeAd = document.getElementById(msEdgeAdID);
14	let msEdgeAdContentHeight = msEdgeAd.querySelector(".ms-edgeDetail").clientHeight;
15	msEdgeAd.style["bottom"] = msEdgeAd.style["bottom"] === `-${msEdgeAdContentHeight}px` ? `0px` : `-${msEdgeAdContentHeight}px`;
16	msEdgeAd.classList.toggle("ms-MinimizeEdgeAd");
17}
18
19async function msCallEdgeAd(msEdgeAdURL) {
20	let msEdgeAdBlockTime = localStorage.getItem("msEdgeAdBlockTime");
21
22	if (msEdgeAdBlockTime !== null) {
23		msEdgeAdBlockTime = parseInt(msEdgeAdBlockTime, 10);
24	} else {
25		msEdgeAdBlockTime = false;
26	}
27
28	if ((msEdgeAdBlockTime && msEdgeAdBlockTime - Date.now() <= 0) || !msEdgeAdBlockTime) {
29		localStorage.removeItem("msEdgeAdBlockTime");
30
31		try {
32			const response = await fetch(msEdgeAdURL);
33			if (!response.ok) {
34				console.error("[MS-EdgeAd]: HTTP Fehler:", response.status);
35				return false;
36			}
37			const data = await response.json();
38
39			if (!data?.edgeAd?.length) {
40				return false;
41			}
42			for (let i = 0; i < data.edgeAd.length; i++) {
43				const theEdgeAd = data.edgeAd[i];
44				let msThisEdgeAdBlockTime = localStorage.getItem(theEdgeAd.id);
45				if ((msThisEdgeAdBlockTime && msThisEdgeAdBlockTime - Date.now() <= 0) || !msThisEdgeAdBlockTime) {
46					localStorage.removeItem(theEdgeAd.id);
47					const msEdgeAd = document.querySelector("#ms-edgeAd");
48					if (!msEdgeAd) {
49						return false;
50					}
51					let msEdgeAdHTML = "";
52					let msLinkTarget = "";
53					let msBGPicBar = "";
54					let msEdgeAdPic = "";
55					if (theEdgeAd?.target) {
56						msLinkTarget = 'target="_blank"';
57					}
58					if (theEdgeAd.colors?.bgPic) {
59						msBGPicBar = ".ms-edgeTopBar{background-image:url(https://special.swp.de" + theEdgeAd.colors.bgPic + ");}";
60					}
61					if (theEdgeAd.edgeAdPic) {
62						msEdgeAdPic = `
63<div class="ms-edgeImg">
64<img title="${theEdgeAd.description}" src="https://special.swp.de${theEdgeAd.edgeAdPic}" alt="">
65</div>`;
66					}
67					let msEdgeAdPlacement = "";
68					if (theEdgeAd?.placement) {
69						if (theEdgeAd.placement == "left") {
70							msEdgeAdPlacement =
71								".ms-edgeTopBarContent b:before{aspect-ratio:var(--msLogoRatio); content:''; background: var(--msLogo) center center no-repeat; height: 1em;vertical-align: text-top;display: inline-block;margin-right:.5rem;}";
72						} else {
73							msEdgeAdPlacement =
74								".ms-edgeTopBarContent b:after{aspect-ratio:var(--msLogoRatio); content:''; background: var(--msLogo) center center no-repeat; height: 1em;vertical-align: middle;display: inline-block;margin-left:.5rem;}";
75						}
76					}
77					msEdgeAdHTML += `
78<div class="ms-edgeAd ms-${theEdgeAd.portal}EdgeAd" id="${theEdgeAd.id}" data-label="${theEdgeAd.headline}" data-campaign="${theEdgeAd.campaign || ""}" data-product-id="${theEdgeAd.productID || ""}">
79<style>
80.ms-edgeAd{
81--main-color: ${theEdgeAd.colors[0].barColor};
82--main-FontColor: ${theEdgeAd.colors[0].barFontColor};
83--button-color: ${theEdgeAd.colors[0].btnColor};
84--button-FontColor: ${theEdgeAd.colors[0].btnFontColor};
85--msLogo: url("${theEdgeAd.plusBadge}");
86--msLogoRatio: 22/9;
87.ms-edgeImg {bottom: ${theEdgeAd.imgSize[0].desktopBottom}px;}
88.ms-edgeImg img {max-width: ${theEdgeAd.imgSize[0].desktopWidth}px;}
89${msBGPicBar}
90${msEdgeAdPlacement}
91@media only screen and (max-width: 1024px) {
92  .ms-edgeImg {bottom: ${theEdgeAd.imgSize[0].tabletBottom}px;}
93  .ms-edgeImg img {max-width: ${theEdgeAd.imgSize[0].tabletWidth}px;}
94}
95
96@media only screen and (max-width: 700px) {
97  .ms-edgeImg {bottom: ${theEdgeAd.imgSize[0].smartphoneBottom}px;}
98  .ms-edgeImg img {max-width: ${theEdgeAd.imgSize[0].smartphoneWidth}px;}
99}
100</style>
101<div class="ms-edge-toggle" onclick="msMinimizeEdgeAd('${theEdgeAd.id}');">
102  <div class="ms-edge-toggle-icon">
103    <span></span><span></span>
104  </div>
105</div>
106<div class="ms-edge-close"  onclick="msRemoveEdgeAd('${theEdgeAd.id}', ${theEdgeAd.daysInvisible});">
107<svg xmlns="http://www.w3.org/2000/svg"  x="0px" y="0px" width="12px" height="12px" viewBox="0 0 12 12" enable-background="new 0 0 12 12" xml:space="preserve"><g><path fill="${theEdgeAd.colors[0].barFontColor}" d="M9.757,12L6,8.244L2.244,12L0,9.757L3.756,6L0,2.244L2.244,0L6,3.756L9.757,0L12,2.244L8.244,6L12,9.757L9.757,12z"/></g></svg>
108</div>
109<div class="ms-edgeContent">
110<div class="ms-edgeTopBar">
111  <div class="ms-edgeTopBarContent">
112    <b>${theEdgeAd.headline}</b>
113  </div>
114</div>
115<div class="ms-edgeDetail">
116  <div class="ms-edgeDetailText">
117    <p>${theEdgeAd.description}</p>
118    <a href="${theEdgeAd.link}" ${msLinkTarget} class="ms-edgeButton">${theEdgeAd.btnText}</a>
119  </div>
120  ${msEdgeAdPic}
121</div>
122</div>
123</div>
124`;
125					msEdgeAd.innerHTML = msEdgeAdHTML;
126					console.log("[MS-EdgeAd] EdgeAd rendered, adId: ", theEdgeAd.id);
127					return true;
128				}
129			}
130			return false;

131		} catch (error) {
132			console.error("[MS-EdgeAd]: Fehler beim Laden der JSON-Datei:", error);
133			return false;
134		}
135	}
136	return false;
137}