@everymatrix/general-preview-social-posts 1.87.25 → 1.87.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -105,6 +105,8 @@ const getDevicePlatform = () => {
|
|
|
105
105
|
}
|
|
106
106
|
};
|
|
107
107
|
|
|
108
|
+
const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
|
|
109
|
+
|
|
108
110
|
/**
|
|
109
111
|
* @name setClientStyling
|
|
110
112
|
* @description Method used to create and append to the passed element of the widget a style element with the content received
|
|
@@ -150,18 +152,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
|
|
|
150
152
|
* @param {HTMLElement} stylingContainer The highest element of the widget
|
|
151
153
|
* @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
|
|
152
154
|
* @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
|
|
155
|
+
* @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
|
|
153
156
|
*/
|
|
154
|
-
function setStreamStyling(stylingContainer, domain, subscription) {
|
|
155
|
-
if (window.emMessageBus)
|
|
156
|
-
const sheet = document.createElement('style');
|
|
157
|
+
function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
|
|
158
|
+
if (!window.emMessageBus) return;
|
|
157
159
|
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
160
|
+
const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
|
|
161
|
+
|
|
162
|
+
if (!supportAdoptStyle || !useAdoptedStyleSheets) {
|
|
163
|
+
subscription = getStyleTagSubscription(stylingContainer, domain);
|
|
164
|
+
|
|
165
|
+
return subscription;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
if (!window[StyleCacheKey]) {
|
|
169
|
+
window[StyleCacheKey] = {};
|
|
164
170
|
}
|
|
171
|
+
subscription = getAdoptStyleSubscription(stylingContainer, domain);
|
|
172
|
+
|
|
173
|
+
const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
|
|
174
|
+
const wrappedUnsubscribe = () => {
|
|
175
|
+
if (window[StyleCacheKey][domain]) {
|
|
176
|
+
const cachedObject = window[StyleCacheKey][domain];
|
|
177
|
+
cachedObject.refCount > 1
|
|
178
|
+
? (cachedObject.refCount = cachedObject.refCount - 1)
|
|
179
|
+
: delete window[StyleCacheKey][domain];
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
originalUnsubscribe();
|
|
183
|
+
};
|
|
184
|
+
subscription.unsubscribe = wrappedUnsubscribe;
|
|
185
|
+
|
|
186
|
+
return subscription;
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
function getStyleTagSubscription(stylingContainer, domain) {
|
|
190
|
+
const sheet = document.createElement('style');
|
|
191
|
+
|
|
192
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
193
|
+
if (stylingContainer) {
|
|
194
|
+
sheet.innerHTML = data;
|
|
195
|
+
stylingContainer.appendChild(sheet);
|
|
196
|
+
}
|
|
197
|
+
});
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
function getAdoptStyleSubscription(stylingContainer, domain) {
|
|
201
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
202
|
+
if (!stylingContainer) return;
|
|
203
|
+
|
|
204
|
+
const shadowRoot = stylingContainer.getRootNode();
|
|
205
|
+
const cacheStyleObject = window[StyleCacheKey];
|
|
206
|
+
let cachedStyle = cacheStyleObject[domain]?.sheet;
|
|
207
|
+
|
|
208
|
+
if (!cachedStyle) {
|
|
209
|
+
cachedStyle = new CSSStyleSheet();
|
|
210
|
+
cachedStyle.replaceSync(data);
|
|
211
|
+
cacheStyleObject[domain] = {
|
|
212
|
+
sheet: cachedStyle,
|
|
213
|
+
refCount: 1
|
|
214
|
+
};
|
|
215
|
+
} else {
|
|
216
|
+
cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
const currentSheets = shadowRoot.adoptedStyleSheets || [];
|
|
220
|
+
if (!currentSheets.includes(cachedStyle)) {
|
|
221
|
+
shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
|
|
222
|
+
}
|
|
223
|
+
});
|
|
165
224
|
}
|
|
166
225
|
|
|
167
226
|
const generalPreviewSocialPostsCss = ":host {\n font-family: \"Roboto\", sans-serif;\n display: block;\n}\n\n.ModalContainer {\n container-type: inline-size;\n}\n\n.sliderWidget {\n display: block;\n max-width: 780px;\n margin: 0 auto;\n padding: 16px;\n max-height: 500px;\n}\n.sliderWidget h2 {\n font-size: 20px;\n}\n.sliderWidget .headerHontainer {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n.sliderWidget .headerHontainer .viewAllButton {\n cursor: pointer;\n font-weight: bold;\n color: rgb(142, 142, 142);\n}\n.sliderWidget .postSlider {\n display: flex;\n overflow-x: auto;\n scroll-snap-type: x mandatory;\n gap: 24px;\n}\n.sliderWidget .postSlider .postCard {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n scroll-snap-align: start;\n padding: 20px;\n border-radius: 6px;\n min-width: 360px;\n background-color: rgb(244, 244, 244);\n}\n.sliderWidget .postSlider .postCard .Description {\n display: -webkit-box;\n -webkit-line-clamp: 5;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin-bottom: 14px;\n}\n.sliderWidget .postSlider .postCard .imageTitle {\n display: flex;\n justify-content: flex-start;\n gap: 20px;\n}\n.sliderWidget .postSlider .postCard .imageTitle img {\n height: 120px;\n width: 120px;\n border-radius: 6px;\n}\n.sliderWidget .postSlider .postCard .imageTitle .titleSubtitle {\n display: flex;\n flex-direction: column;\n}\n.sliderWidget .postSlider .postCard .buttons {\n display: flex;\n justify-content: center;\n gap: 12px;\n}\n.sliderWidget .postSlider .postCard .buttons .moreInfoButton, .sliderWidget .postSlider .postCard .buttons .playNowButton {\n width: 172px;\n display: block;\n padding: 8px 16px;\n border: 3px solid #63B250;\n border-radius: 6px;\n cursor: pointer;\n font-weight: bold;\n}\n.sliderWidget .postSlider .postCard .buttons .moreInfoButton {\n background-color: rgb(244, 244, 244);\n color: #63B250;\n}\n.sliderWidget .postSlider .postCard .buttons .playNowButton {\n background-color: #63B250;\n color: #fff;\n}\n\nh3, h4 {\n font-size: 18px;\n}\n\np {\n font-size: 14px;\n color: rgb(91, 91, 91);\n}\n\n@container (max-width: 480px) {\n .sliderWidget h2 {\n font-size: 18px;\n }\n .sliderWidget .postSlider .postCard {\n min-width: 250px;\n }\n h3, h4 {\n font-size: 16px;\n }\n p {\n font-size: 12px;\n }\n}";
|
|
@@ -272,7 +331,7 @@ const GeneralPreviewSocialPosts = class {
|
|
|
272
331
|
async componentDidLoad() {
|
|
273
332
|
if (this.stylingContainer) {
|
|
274
333
|
if (window.emMessageBus != undefined) {
|
|
275
|
-
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style
|
|
334
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
276
335
|
}
|
|
277
336
|
else {
|
|
278
337
|
if (this.clientStyling)
|
|
@@ -101,6 +101,8 @@ const getDevicePlatform = () => {
|
|
|
101
101
|
}
|
|
102
102
|
};
|
|
103
103
|
|
|
104
|
+
const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
|
|
105
|
+
|
|
104
106
|
/**
|
|
105
107
|
* @name setClientStyling
|
|
106
108
|
* @description Method used to create and append to the passed element of the widget a style element with the content received
|
|
@@ -146,18 +148,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
|
|
|
146
148
|
* @param {HTMLElement} stylingContainer The highest element of the widget
|
|
147
149
|
* @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
|
|
148
150
|
* @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
|
|
151
|
+
* @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
|
|
149
152
|
*/
|
|
150
|
-
function setStreamStyling(stylingContainer, domain, subscription) {
|
|
151
|
-
if (window.emMessageBus)
|
|
152
|
-
const sheet = document.createElement('style');
|
|
153
|
+
function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
|
|
154
|
+
if (!window.emMessageBus) return;
|
|
153
155
|
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
156
|
+
const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
|
|
157
|
+
|
|
158
|
+
if (!supportAdoptStyle || !useAdoptedStyleSheets) {
|
|
159
|
+
subscription = getStyleTagSubscription(stylingContainer, domain);
|
|
160
|
+
|
|
161
|
+
return subscription;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
if (!window[StyleCacheKey]) {
|
|
165
|
+
window[StyleCacheKey] = {};
|
|
160
166
|
}
|
|
167
|
+
subscription = getAdoptStyleSubscription(stylingContainer, domain);
|
|
168
|
+
|
|
169
|
+
const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
|
|
170
|
+
const wrappedUnsubscribe = () => {
|
|
171
|
+
if (window[StyleCacheKey][domain]) {
|
|
172
|
+
const cachedObject = window[StyleCacheKey][domain];
|
|
173
|
+
cachedObject.refCount > 1
|
|
174
|
+
? (cachedObject.refCount = cachedObject.refCount - 1)
|
|
175
|
+
: delete window[StyleCacheKey][domain];
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
originalUnsubscribe();
|
|
179
|
+
};
|
|
180
|
+
subscription.unsubscribe = wrappedUnsubscribe;
|
|
181
|
+
|
|
182
|
+
return subscription;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
function getStyleTagSubscription(stylingContainer, domain) {
|
|
186
|
+
const sheet = document.createElement('style');
|
|
187
|
+
|
|
188
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
189
|
+
if (stylingContainer) {
|
|
190
|
+
sheet.innerHTML = data;
|
|
191
|
+
stylingContainer.appendChild(sheet);
|
|
192
|
+
}
|
|
193
|
+
});
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
function getAdoptStyleSubscription(stylingContainer, domain) {
|
|
197
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
198
|
+
if (!stylingContainer) return;
|
|
199
|
+
|
|
200
|
+
const shadowRoot = stylingContainer.getRootNode();
|
|
201
|
+
const cacheStyleObject = window[StyleCacheKey];
|
|
202
|
+
let cachedStyle = cacheStyleObject[domain]?.sheet;
|
|
203
|
+
|
|
204
|
+
if (!cachedStyle) {
|
|
205
|
+
cachedStyle = new CSSStyleSheet();
|
|
206
|
+
cachedStyle.replaceSync(data);
|
|
207
|
+
cacheStyleObject[domain] = {
|
|
208
|
+
sheet: cachedStyle,
|
|
209
|
+
refCount: 1
|
|
210
|
+
};
|
|
211
|
+
} else {
|
|
212
|
+
cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
const currentSheets = shadowRoot.adoptedStyleSheets || [];
|
|
216
|
+
if (!currentSheets.includes(cachedStyle)) {
|
|
217
|
+
shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
|
|
218
|
+
}
|
|
219
|
+
});
|
|
161
220
|
}
|
|
162
221
|
|
|
163
222
|
const generalPreviewSocialPostsCss = ":host {\n font-family: \"Roboto\", sans-serif;\n display: block;\n}\n\n.ModalContainer {\n container-type: inline-size;\n}\n\n.sliderWidget {\n display: block;\n max-width: 780px;\n margin: 0 auto;\n padding: 16px;\n max-height: 500px;\n}\n.sliderWidget h2 {\n font-size: 20px;\n}\n.sliderWidget .headerHontainer {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n.sliderWidget .headerHontainer .viewAllButton {\n cursor: pointer;\n font-weight: bold;\n color: rgb(142, 142, 142);\n}\n.sliderWidget .postSlider {\n display: flex;\n overflow-x: auto;\n scroll-snap-type: x mandatory;\n gap: 24px;\n}\n.sliderWidget .postSlider .postCard {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n scroll-snap-align: start;\n padding: 20px;\n border-radius: 6px;\n min-width: 360px;\n background-color: rgb(244, 244, 244);\n}\n.sliderWidget .postSlider .postCard .Description {\n display: -webkit-box;\n -webkit-line-clamp: 5;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin-bottom: 14px;\n}\n.sliderWidget .postSlider .postCard .imageTitle {\n display: flex;\n justify-content: flex-start;\n gap: 20px;\n}\n.sliderWidget .postSlider .postCard .imageTitle img {\n height: 120px;\n width: 120px;\n border-radius: 6px;\n}\n.sliderWidget .postSlider .postCard .imageTitle .titleSubtitle {\n display: flex;\n flex-direction: column;\n}\n.sliderWidget .postSlider .postCard .buttons {\n display: flex;\n justify-content: center;\n gap: 12px;\n}\n.sliderWidget .postSlider .postCard .buttons .moreInfoButton, .sliderWidget .postSlider .postCard .buttons .playNowButton {\n width: 172px;\n display: block;\n padding: 8px 16px;\n border: 3px solid #63B250;\n border-radius: 6px;\n cursor: pointer;\n font-weight: bold;\n}\n.sliderWidget .postSlider .postCard .buttons .moreInfoButton {\n background-color: rgb(244, 244, 244);\n color: #63B250;\n}\n.sliderWidget .postSlider .postCard .buttons .playNowButton {\n background-color: #63B250;\n color: #fff;\n}\n\nh3, h4 {\n font-size: 18px;\n}\n\np {\n font-size: 14px;\n color: rgb(91, 91, 91);\n}\n\n@container (max-width: 480px) {\n .sliderWidget h2 {\n font-size: 18px;\n }\n .sliderWidget .postSlider .postCard {\n min-width: 250px;\n }\n h3, h4 {\n font-size: 16px;\n }\n p {\n font-size: 12px;\n }\n}";
|
|
@@ -268,7 +327,7 @@ const GeneralPreviewSocialPosts = class {
|
|
|
268
327
|
async componentDidLoad() {
|
|
269
328
|
if (this.stylingContainer) {
|
|
270
329
|
if (window.emMessageBus != undefined) {
|
|
271
|
-
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style
|
|
330
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
272
331
|
}
|
|
273
332
|
else {
|
|
274
333
|
if (this.clientStyling)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as i,c as t,h as n}from"./index-d101355b.js";let e={en:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},de:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},ro:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},fr:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},ar:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},hr:{loading:"Učitavanje…",viewAll:"Pogledaj sve …",moreInfo:"VIŠE INFORMACIJA",playNow:"IGRAJ SADA"}};const o=i=>new Promise((t=>{fetch(i).then((i=>i.json())).then((i=>{Object.keys(i).forEach((t=>{e[t]||(e[t]={});for(let n in i[t])e[t][n]=i[t][n]})),t(!0)}))})),s=(i,t)=>e[void 0!==t&&t in e?t:"en"][i];function
|
|
1
|
+
import{r as i,c as t,h as n}from"./index-d101355b.js";let e={en:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},de:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},ro:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},fr:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},ar:{loading:"loading...",viewAll:"View All ...",moreInfo:"MORE INFO",playNow:"PLAY NOW"},hr:{loading:"Učitavanje…",viewAll:"Pogledaj sve …",moreInfo:"VIŠE INFORMACIJA",playNow:"IGRAJ SADA"}};const o=i=>new Promise((t=>{fetch(i).then((i=>i.json())).then((i=>{Object.keys(i).forEach((t=>{e[t]||(e[t]={});for(let n in i[t])e[t][n]=i[t][n]})),t(!0)}))})),s=(i,t)=>e[void 0!==t&&t in e?t:"en"][i],l="__WIDGET_GLOBAL_STYLE_CACHE__";function r(i,t){if(i){const n=document.createElement("style");n.innerHTML=t,i.appendChild(n)}}function d(i,t){if(!i||!t)return;const n=new URL(t);fetch(n.href).then((i=>i.text())).then((t=>{const n=document.createElement("style");n.innerHTML=t,i&&i.appendChild(n)})).catch((i=>{console.error("There was an error while trying to load client styling from URL",i)}))}const a=class{constructor(n){i(this,n),this.moreInfo=t(this,"moreInfo",7),this.playNow=t(this,"playNow",7),this.viewAll=t(this,"viewAll",7),this.platform=(()=>{const i=(()=>{let i=window.navigator.userAgent;return i.toLowerCase().match(/android/i)?"Android":i.toLocaleLowerCase().match(/customnative:ios/)?"nativeIOS":i.toLowerCase().match(/iphone/i)?"iPhone":i.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})();if(i)return"PC"===i?"dk":"nativeIOS"==i?"ios":"mtWeb"})(),this.userId="",this.session="",this.postsTitle="",this.maxCards="",this.language="en",this.datasource="",this.endpoint="",this.cmsEndpoint="",this.userRoles="",this.translationUrl="",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.cmsEnv="stage",this.pageName="casino",this.posts=[],this.isLoading=!1,this.isLoggedIn=!1,this.dataImages=[],this.gameIds=""}handleNewTranslations(){this.isLoading=!0,o(this.translationUrl).then((()=>{this.isLoading=!1}))}handleClientStylingChange(i,t){i!=t&&r(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(i,t){i!=t&&this.clientStylingUrl&&d(this.stylingContainer,this.clientStylingUrl)}async componentWillLoad(){this.translationUrl.length>2&&await o(this.translationUrl)}watchSession(i,t){i!==t&&(this.isLoggedIn=""!==i)}connectedCallback(){this.session&&(this.isLoggedIn=!0)}getDataImage(i){try{let t=new URL(`${this.endpoint}/v2/casino/groups/${this.datasource}`);t.searchParams.append("language",this.language),t.searchParams.append("expand","games"),t.searchParams.append("fields","games(id,thumbnail,launchUrl)"),t.searchParams.append("filter",i),t.searchParams.append("device",this.platform),fetch(t.href,{method:"GET","Content-Type":"application/json"}).then((i=>{if(200===i.status)return i.json();throw new Error("HTTP status "+i.status)})).then((i=>{i.items.forEach((i=>{i.games.items.forEach((i=>{let{id:t,launchUrl:n,thumbnail:e}=i;this.dataImages=[{id:t,launchUrl:n,thumbnail:e}];let o=this.posts.findIndex((i=>i.gameId===t));-1!==o&&(this.posts[o].images=this.dataImages)}))}))})).catch((i=>{console.error(i)}))}catch(i){console.error("Error fetching verification types:",i)}}async componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(i,t,n,e=!1){if(!window.emMessageBus)return;if(!("adoptedStyleSheets"in Document.prototype)||!e)return function(i,t){const n=document.createElement("style");return window.emMessageBus.subscribe(t,(t=>{i&&(n.innerHTML=t,i.appendChild(n))}))}(i,t);window[l]||(window[l]={});const o=(n=function(i,t){return window.emMessageBus.subscribe(t,(n=>{if(!i)return;const e=i.getRootNode(),o=window[l];let s=o[t]?.sheet;s?o[t].refCount=o[t].refCount+1:(s=new CSSStyleSheet,s.replaceSync(n),o[t]={sheet:s,refCount:1});const r=e.adoptedStyleSheets||[];r.includes(s)||(e.adoptedStyleSheets=[...r,s])}))}(i,t)).unsubscribe.bind(n);n.unsubscribe=()=>{if(window[l][t]){const i=window[l][t];i.refCount>1?i.refCount=i.refCount-1:delete window[l][t]}o()}}(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription):(this.clientStyling&&r(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&d(this.stylingContainer,this.clientStylingUrl)));try{let i=new URL(`${this.cmsEndpoint}/${this.language}/content/social-posts`);i.searchParams.append("device",this.platform),i.searchParams.append("page",this.pageName),i.searchParams.append("language",this.language),i.searchParams.append("userRoles",this.userRoles),i.searchParams.append("env",this.cmsEnv),fetch(i.href,{method:"GET","Content-Type":"application/json"}).then((i=>{if(200===i.status)return i.json();throw new Error("HTTP status "+i.status)})).then((i=>{i.forEach((i=>{var t;const n=i.slug,e=i.id,{gameId:o,title:s,description:l,subtitle:r}=null!==(t=i.previewCard)&&void 0!==t?t:{};o&&(this.gameIds+=`games(id=${o}),`),this.posts.push({postId:e,gameId:o,title:s,description:l,subtitle:r,slug:n})})),this.gameIds.length>0&&(this.gameIds=this.gameIds.slice(0,-1),this.gameIds="$or("+this.gameIds+")"),this.getDataImage(this.gameIds)})).catch((i=>{console.error(i)}))}catch(i){console.error("Error fetching verification types:",i)}}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}hasUndefinedValues(i){return Object.values(i).some((i=>void 0===i))}render(){return this.isLoading?n("div",null,n("p",null,s("loading",this.language))):n("div",{class:"ModalContainer",ref:i=>this.stylingContainer=i},n("div",{class:"sliderWidget"},n("div",{class:"headerHontainer"},this.postsTitle&&n("h2",null,this.postsTitle),n("div",{class:"viewAllButton",onClick:()=>this.onViewAllClick()},s("viewAll",this.language))),n("div",{class:"postSlider"},this.posts.filter((i=>!this.hasUndefinedValues(i))).slice(0,+(this.maxCards||this.posts.length)).map((i=>{var t,e,o,l;return n("div",{class:"postCard"},n("div",{class:"imageTitle"},(null==i?void 0:i.images)?n("a",{href:(null===(e=null===(t=i.images)||void 0===t?void 0:t[0])||void 0===e?void 0:e.launchUrl)||"",target:"_blank",rel:"noopener noreferrer"},n("img",{src:(null===(l=null===(o=i.images)||void 0===o?void 0:o[0])||void 0===l?void 0:l.thumbnail)||"",alt:"Game Image"})):null,n("div",{class:"titleSubtitle"},i.title&&n("h3",null,i.title),i.subtitle&&n("p",{innerHTML:i.subtitle}))),i.description&&n("div",{class:"Description"},n("p",{innerHTML:i.description})),n("div",{class:"buttons"},n("button",{class:"moreInfoButton",onClick:()=>this.onMoreInfoClick(i.gameId,i.postId,i.title,i.slug)},s("moreInfo",this.language)),this.isLoggedIn&&i.gameId&&n("button",{class:"playNowButton",onClick:()=>this.onPlayNowClick(i.gameId)},s("playNow",this.language))))})))))}onViewAllClick(){this.viewAll.emit(),window.postMessage({type:"viewAllSocialPosts"},window.location.href)}onMoreInfoClick(i,t,n,e){this.moreInfo.emit(),window.postMessage({type:"moreInfoSocialPost",gameId:i,postId:t,postTitle:n,slug:e},window.location.href)}onPlayNowClick(i){this.playNow.emit(i),window.postMessage({type:"playNowSocialPost",gameId:i},window.location.href)}static get watchers(){return{translationUrl:["handleNewTranslations"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],session:["watchSession"]}}};a.style=':host {\n font-family: "Roboto", sans-serif;\n display: block;\n}\n\n.ModalContainer {\n container-type: inline-size;\n}\n\n.sliderWidget {\n display: block;\n max-width: 780px;\n margin: 0 auto;\n padding: 16px;\n max-height: 500px;\n}\n.sliderWidget h2 {\n font-size: 20px;\n}\n.sliderWidget .headerHontainer {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n.sliderWidget .headerHontainer .viewAllButton {\n cursor: pointer;\n font-weight: bold;\n color: rgb(142, 142, 142);\n}\n.sliderWidget .postSlider {\n display: flex;\n overflow-x: auto;\n scroll-snap-type: x mandatory;\n gap: 24px;\n}\n.sliderWidget .postSlider .postCard {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n scroll-snap-align: start;\n padding: 20px;\n border-radius: 6px;\n min-width: 360px;\n background-color: rgb(244, 244, 244);\n}\n.sliderWidget .postSlider .postCard .Description {\n display: -webkit-box;\n -webkit-line-clamp: 5;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin-bottom: 14px;\n}\n.sliderWidget .postSlider .postCard .imageTitle {\n display: flex;\n justify-content: flex-start;\n gap: 20px;\n}\n.sliderWidget .postSlider .postCard .imageTitle img {\n height: 120px;\n width: 120px;\n border-radius: 6px;\n}\n.sliderWidget .postSlider .postCard .imageTitle .titleSubtitle {\n display: flex;\n flex-direction: column;\n}\n.sliderWidget .postSlider .postCard .buttons {\n display: flex;\n justify-content: center;\n gap: 12px;\n}\n.sliderWidget .postSlider .postCard .buttons .moreInfoButton, .sliderWidget .postSlider .postCard .buttons .playNowButton {\n width: 172px;\n display: block;\n padding: 8px 16px;\n border: 3px solid #63B250;\n border-radius: 6px;\n cursor: pointer;\n font-weight: bold;\n}\n.sliderWidget .postSlider .postCard .buttons .moreInfoButton {\n background-color: rgb(244, 244, 244);\n color: #63B250;\n}\n.sliderWidget .postSlider .postCard .buttons .playNowButton {\n background-color: #63B250;\n color: #fff;\n}\n\nh3, h4 {\n font-size: 18px;\n}\n\np {\n font-size: 14px;\n color: rgb(91, 91, 91);\n}\n\n@container (max-width: 480px) {\n .sliderWidget h2 {\n font-size: 18px;\n }\n .sliderWidget .postSlider .postCard {\n min-width: 250px;\n }\n h3, h4 {\n font-size: 16px;\n }\n p {\n font-size: 12px;\n }\n}';export{a as general_preview_social_posts}
|