@everymatrix/casino-my-games-nd 1.37.12

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.
package/index.html ADDED
@@ -0,0 +1,25 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset='utf-8'>
6
+ <meta name='viewport' content='width=device-width,initial-scale=1'>
7
+
8
+ <title>
9
+ casino-my-games
10
+ </title>
11
+ <link rel="stylesheet" href="public/reset.css">
12
+ <script src='dist/casino-my-games-nd.js'></script>
13
+ </head>
14
+
15
+ <body>
16
+
17
+ <casino-my-games-nd userid="4506648" session="bcd06787-a3e2-44c4-a662-c2cc4bac04d9"
18
+ endpoint="https://demo-api.stage.norway.everymatrix.com" datasource="RNG" lang="en" currency="USD" favorites="true"
19
+ clientstyling="" clientstylingurl="" livecasino="false" visiblegames="9" gamepagemodalurl="true"
20
+ integratedgameframedesktop="true" integratedgameframemobile="true" translationurl="" mostplayed="true"
21
+ lastplayed="true" filteredcategories="" activecategory=""></casino-my-games-nd>
22
+
23
+ </body>
24
+
25
+ </html>
package/index.js ADDED
@@ -0,0 +1 @@
1
+ import './dist/casino-my-games-nd.js';
package/package.json ADDED
@@ -0,0 +1,39 @@
1
+ {
2
+ "name": "@everymatrix/casino-my-games-nd",
3
+ "version": "1.37.12",
4
+ "main": "dist/casino-my-games.js",
5
+ "svelte": "src/index.ts",
6
+ "scripts": {
7
+ "start": "sirv public",
8
+ "build": "cross-env NODE_ENV=production rollup -c",
9
+ "dev": "cross-env NODE_ENV=\"development\" rollup -c -w",
10
+ "validate": "svelte-check",
11
+ "test": "echo"
12
+ },
13
+ "devDependencies": {
14
+ "@rollup/plugin-babel": "^5.3.0",
15
+ "@rollup/plugin-commonjs": "^16.0.0",
16
+ "@rollup/plugin-node-resolve": "^10.0.0",
17
+ "@rollup/plugin-typescript": "^6.0.0",
18
+ "@tsconfig/svelte": "^1.0.0",
19
+ "rollup": "^2.3.4",
20
+ "rollup-plugin-dev-server": "^0.4.3",
21
+ "rollup-plugin-livereload": "^2.0.0",
22
+ "rollup-plugin-svelte": "^7.0.0",
23
+ "rollup-plugin-terser": "^7.0.0",
24
+ "rollup-plugin-uglify": "^6.0.4",
25
+ "svelte-check": "^1.0.0",
26
+ "svelte-preprocess": "^5.0.0",
27
+ "tslib": "^2.0.0",
28
+ "typescript": "^3.9.3"
29
+ },
30
+ "dependencies": {
31
+ "cross-env": "^7.0.3",
32
+ "sirv-cli": "^1.0.0",
33
+ "svelte": "^3.0.0"
34
+ },
35
+ "publishConfig": {
36
+ "access": "public"
37
+ },
38
+ "gitHead": "284346262a669a2f5a5891d7ba9327b0c94aa44c"
39
+ }
Binary file
@@ -0,0 +1,48 @@
1
+ /* http://meyerweb.com/eric/tools/css/reset/
2
+ v2.0 | 20110126
3
+ License: none (public domain)
4
+ */
5
+
6
+ html, body, div, span, applet, object, iframe,
7
+ h1, h2, h3, h4, h5, h6, p, blockquote, pre,
8
+ a, abbr, acronym, address, big, cite, code,
9
+ del, dfn, em, img, ins, kbd, q, s, samp,
10
+ small, strike, strong, sub, sup, tt, var,
11
+ b, u, i, center,
12
+ dl, dt, dd, ol, ul, li,
13
+ fieldset, form, label, legend,
14
+ table, caption, tbody, tfoot, thead, tr, th, td,
15
+ article, aside, canvas, details, embed,
16
+ figure, figcaption, footer, header, hgroup,
17
+ menu, nav, output, ruby, section, summary,
18
+ time, mark, audio, video {
19
+ margin: 0;
20
+ padding: 0;
21
+ border: 0;
22
+ font-size: 100%;
23
+ font: inherit;
24
+ vertical-align: baseline;
25
+ }
26
+ /* HTML5 display-role reset for older browsers */
27
+ article, aside, details, figcaption, figure,
28
+ footer, header, hgroup, menu, nav, section {
29
+ display: block;
30
+ }
31
+ body {
32
+ line-height: 1;
33
+ }
34
+ ol, ul {
35
+ list-style: none;
36
+ }
37
+ blockquote, q {
38
+ quotes: none;
39
+ }
40
+ blockquote:before, blockquote:after,
41
+ q:before, q:after {
42
+ content: '';
43
+ content: none;
44
+ }
45
+ table {
46
+ border-collapse: collapse;
47
+ border-spacing: 0;
48
+ }
@@ -0,0 +1,59 @@
1
+ import svelte from 'rollup-plugin-svelte';
2
+ import commonjs from '@rollup/plugin-commonjs';
3
+ import resolve from '@rollup/plugin-node-resolve';
4
+ import serve from 'rollup-plugin-dev-server';
5
+ import livereload from 'rollup-plugin-livereload';
6
+ import { terser } from 'rollup-plugin-terser';
7
+ import sveltePreprocess from 'svelte-preprocess';
8
+ import typescript from '@rollup/plugin-typescript';
9
+ const production = process.env.NODE_ENV === 'production';
10
+ const dev = process.env.NODE_ENV === 'development';
11
+
12
+ export default {
13
+ input: 'src/index.ts',
14
+ output: {
15
+ sourcemap: true,
16
+ format: 'umd',
17
+ name: 'app',
18
+ file: 'dist/casino-my-games-nd.js'
19
+ },
20
+ plugins: [
21
+ svelte({
22
+ preprocess: sveltePreprocess(),
23
+ compilerOptions: {
24
+ // enable run-time checks when not in production
25
+ customElement: true,
26
+ dev: !production
27
+ }
28
+ }),
29
+ commonjs(),
30
+ resolve({
31
+ browser: true,
32
+ dedupe: ['svelte']
33
+ }),
34
+ dev && serve({
35
+ open: true,
36
+ verbose: true,
37
+ allowCrossOrigin: true,
38
+ historyApiFallback: false,
39
+ host: 'localhost',
40
+ port: 5050,
41
+ }),
42
+ dev && livereload({ watch: ['', 'dist'] }),
43
+ typescript({
44
+ sourceMap: !production,
45
+ inlineSources: !production,
46
+ }),
47
+ // If we're building for production (npm run build
48
+ // instead of npm run dev), minify
49
+ production &&
50
+ terser({
51
+ output: {
52
+ comments: "all"
53
+ },
54
+ })
55
+ ],
56
+ watch: {
57
+ clearScreen: false
58
+ }
59
+ };
@@ -0,0 +1,92 @@
1
+ export interface CasinoMyGames {
2
+ count: number,
3
+ items: Array<CategoriesItems>,
4
+ pages: CategoriesPages,
5
+ total: number ,
6
+ }
7
+
8
+ export interface CategoriesItems {
9
+ id: number,
10
+ name: String,
11
+ href: String,
12
+ games: Array<GamesItem>
13
+ };
14
+
15
+ interface GamesItem {
16
+ count: number,
17
+ items: Array<Object>,
18
+ pages: PagesItem,
19
+ total: number
20
+ }
21
+
22
+ interface PagesItem {
23
+ first: String,
24
+ last: String,
25
+ next: String,
26
+ previous: String
27
+ }
28
+
29
+ interface CategoriesPages {
30
+ first: String,
31
+ last: String,
32
+ next: String,
33
+ previous: String,
34
+ }
35
+
36
+ export interface CasinoData {
37
+ count: number,
38
+ items: CasinoItems[],
39
+ pages: CasinoPages,
40
+ total: number
41
+ }
42
+
43
+ export interface CasinoItems {
44
+ name: string,
45
+ games: CasinoGames,
46
+ moreBtn?: boolean
47
+ }
48
+
49
+ interface CasinoGames {
50
+ count: number,
51
+ items: [{href: string}],
52
+ pages: CasinoPages,
53
+ total: number
54
+ }
55
+
56
+ interface CasinoPages {
57
+ first: string,
58
+ last: string,
59
+ next: null,
60
+ previous: null
61
+ }
62
+
63
+ export interface CasinoGameData {
64
+ backgroundImageUrl: string,
65
+ categories: CasinoBaseData,
66
+ defaultThumbnail: string,
67
+ groups: CasinoGroups,
68
+ hasAnonymousFunMode: boolean,
69
+ hasFunMode: boolean,
70
+ href: string,
71
+ id: string,
72
+ isNew: boolean,
73
+ launchURL: string,
74
+ name: string,
75
+ platform: string[],
76
+ popularity: number,
77
+ thumbnail: string,
78
+ vendor: {href: string, name:string},
79
+ cellSize?: string
80
+ }
81
+
82
+ interface CasinoBaseData {
83
+ count: number,
84
+ items: [{href: string}],
85
+ pagination: CasinoPages,
86
+ total: number
87
+ }
88
+
89
+ interface CasinoGroups {
90
+ count: number,
91
+ items: string[]
92
+ }
@@ -0,0 +1,327 @@
1
+ <svelte:options tag={null} />
2
+ <script lang="ts">
3
+ import { isMobile, getDevice } from 'rvhelper';
4
+ import { _, addNewMessages, setupI18n, setLocale } from './i18n';
5
+ import { TRANSLATIONS } from './translations';
6
+ import { onMount } from 'svelte';
7
+
8
+ import '@everymatrix/casino-favorites-section-nd';
9
+ import '@everymatrix/casino-last-played-section-nd';
10
+ import '@everymatrix/casino-most-played-section-nd';
11
+
12
+ export let userid:string = '';
13
+ export let session:string = '';
14
+ export let endpoint:string = '';
15
+ export let datasource:string = '';
16
+ export let lang:string = '';
17
+ export let currency:string = '';
18
+ export let clientstyling:string = '';
19
+ export let clientstylingurl:string = '';
20
+ export let livecasino:string = '';
21
+ export let visiblegames:string = '';
22
+ export let gamepagemodalurl:string = '';
23
+ export let showgamename:string = '';
24
+ export let integratedgameframedesktop:string = '';
25
+ export let integratedgameframemobile:string = '';
26
+ export let translationurl:string = '';
27
+ export let favorites:string = 'false';
28
+ export let mostplayed:string = 'false';
29
+ export let lastplayed:string = 'false';
30
+ export let casinomygames:string = 'false';
31
+ export let lastplayedperiod:string = 'Last30Days';
32
+ export let mostplayedperiod:string = 'Last30Days';
33
+ export let lastplayedorder:string = '';
34
+ export let lastplayedlimit:string = '';
35
+ export let lastplayedunique: string = 'true';
36
+ export let mostplayedrounds: string = '';
37
+
38
+ let userAgent:any = window.navigator.userAgent;
39
+
40
+ // CasinoPage loading state
41
+ let isLoading:boolean = false;
42
+ let hasErrors:boolean = false;
43
+ let error:string = '';
44
+
45
+ let customStylingContainer:HTMLElement;
46
+ let gamesType:string = '';
47
+ let mobile:boolean = false;
48
+ let tabsArray:Array<string> = ['', '', ''];
49
+ let favoritesCount:string = '0';
50
+
51
+
52
+ setupI18n({ withLocale: 'en', translations: {}});
53
+
54
+ const setTranslationUrl = ():void => {
55
+ let url:string = translationurl;
56
+
57
+ fetch(url).then((res:any) => res.json())
58
+ .then((res) => {
59
+ Object.keys(res).forEach((item:any):void => {
60
+ addNewMessages(item, res[item]);
61
+ });
62
+ }).catch((err:any) => {
63
+ console.log(err);
64
+ });
65
+ }
66
+
67
+ Object.keys(TRANSLATIONS).forEach((item) => {
68
+ addNewMessages(item, TRANSLATIONS[item]);
69
+ });
70
+
71
+ const toggleTab = (type:string):void => {
72
+ if (gamesType === type) return
73
+ gamesType = type;
74
+ }
75
+
76
+ const initialSetup = ():void => {
77
+ gamesType = (favorites === 'true') ? 'Favorites' : (mostplayed === 'true') ? 'MostPlayed' : (lastplayed === 'true') ? 'LastPlayed' : ''
78
+
79
+ tabsArray[0] = (favorites === 'true') ? 'Favorites' : '';
80
+ tabsArray[1] = (mostplayed === 'true') ? 'MostPlayed' : '';
81
+ tabsArray[2] = (lastplayed === 'true') ? 'LastPlayed' : '';
82
+
83
+ isLoading = true;
84
+ setLocale(lang);
85
+ }
86
+
87
+ const setClientStyling = ():void => {
88
+ let sheet = document.createElement('style');
89
+ sheet.innerHTML = clientstyling;
90
+ customStylingContainer.appendChild(sheet);
91
+ }
92
+
93
+ const setClientStylingURL = ():void => {
94
+ let cssFile:HTMLElement = document.createElement('style');
95
+
96
+ fetch(new URL(clientstylingurl))
97
+ .then((res:any) => res.text())
98
+ .then((data:any) => {
99
+ cssFile.innerHTML = data
100
+
101
+ setTimeout(() => { customStylingContainer.appendChild(cssFile); }, 1);
102
+ });
103
+ }
104
+
105
+ const messageHandler = (e:any) => {
106
+ if (e.data) {
107
+ switch(e.data.type) {
108
+ case 'UpdateFavoritesCount':
109
+ if(e.data.favoriteGames){
110
+ favoritesCount = e.data.favoriteGames?.length;
111
+ } else {
112
+ favoritesCount = e.data.listOfFavoritesGames?.length;
113
+ }
114
+ isLoading = false;
115
+ break;
116
+ }
117
+ }
118
+ }
119
+
120
+ onMount(() => {
121
+ window.addEventListener('message', messageHandler, false);
122
+ mobile = isMobile(userAgent);
123
+
124
+ return () => {
125
+ window.removeEventListener('message', messageHandler);
126
+ }
127
+ });
128
+
129
+ $: endpoint && datasource && lang && initialSetup();
130
+ $: favorites && mostplayed && lastplayed && initialSetup();
131
+ $: translationurl && setTranslationUrl();
132
+ $: clientstyling && customStylingContainer && setClientStyling();
133
+ $: clientstylingurl && customStylingContainer && setClientStylingURL();
134
+ </script>
135
+
136
+ <div bind:this={customStylingContainer}>
137
+ {#if hasErrors}
138
+ <p class="SearchLoading" part="SearchLoading">{$_('500')}</p>
139
+ {:else}
140
+ {#if casinomygames}
141
+ <div class="CasinoMyGames { mobile ? 'Mobile' : '' }">
142
+ <div class="MyGamesHeader">
143
+ <div class="MyGamesButtonsContainer">
144
+ {#each tabsArray as tab}
145
+ {#if tab == 'Favorites'}
146
+ <button class="MyGamesButton {gamesType == 'Favorites' ? 'Active' : ''} { favorites == 'false' ? 'Off': ''}" on:click={() => toggleTab('Favorites')}>
147
+ {$_('favorites')} <span>({favoritesCount})</span>
148
+ </button>
149
+ {/if}
150
+ {#if tab == 'MostPlayed'}
151
+ <button class="MyGamesButton {gamesType == 'MostPlayed' ? 'Active' : ''} {mostplayed == 'false' ? 'Off': ''}" on:click={() => toggleTab('MostPlayed')}>
152
+ {$_('mostPlayed')}
153
+ </button>
154
+ {/if}
155
+ {#if tab == 'LastPlayed'}
156
+ <button class="MyGamesButton {gamesType == 'LastPlayed' ? 'Active' : ''} {lastplayed == 'false' ? 'Off': ''}" on:click={() => toggleTab('LastPlayed')}>
157
+ {$_('recentlyPlayed')}
158
+ </button>
159
+ {/if}
160
+ {/each}
161
+ </div>
162
+ </div>
163
+ <div>
164
+ {#if gamesType == 'Favorites'}
165
+ <casino-favorites-section-nd
166
+ session={session}
167
+ userid={userid}
168
+ endpoint={endpoint}
169
+ datasource={datasource}
170
+ lang={lang}
171
+ currency={currency}
172
+ favorites={favorites}
173
+ categoryid={"FAVORITES"}
174
+ class="CategoryContainer"
175
+ {showgamename}
176
+ {clientstyling}
177
+ {clientstylingurl}
178
+ {livecasino}
179
+ {visiblegames}
180
+ {gamepagemodalurl}
181
+ {integratedgameframedesktop}
182
+ {integratedgameframemobile}
183
+ {casinomygames} />
184
+ {:else if gamesType == 'MostPlayed'}
185
+ <casino-most-played-section-nd
186
+ endpoint={endpoint}
187
+ datasource={datasource}
188
+ lang={lang}
189
+ currency={currency}
190
+ session={session}
191
+ userid={userid}
192
+ favorites={favorites}
193
+ categoryindex="0"
194
+ class="CategoryContainer"
195
+ {showgamename}
196
+ {clientstyling}
197
+ {clientstylingurl}
198
+ {livecasino}
199
+ {visiblegames}
200
+ {gamepagemodalurl}
201
+ {mostplayedrounds}
202
+ {integratedgameframedesktop}
203
+ {integratedgameframemobile}
204
+ {mostplayedperiod}
205
+ {casinomygames} />
206
+ {:else if gamesType == 'LastPlayed'}
207
+ <casino-last-played-section-nd
208
+ userid={userid}
209
+ endpoint={endpoint}
210
+ datasource={datasource}
211
+ favorites={favorites}
212
+ lang={lang}
213
+ currency={currency}
214
+ session={session}
215
+ class="CategoryContainer"
216
+ {showgamename}
217
+ {clientstyling}
218
+ {clientstylingurl}
219
+ {livecasino}
220
+ {visiblegames}
221
+ {lastplayedperiod}
222
+ {lastplayedorder}
223
+ {lastplayedlimit}
224
+ {lastplayedunique}
225
+ {gamepagemodalurl}
226
+ {integratedgameframedesktop}
227
+ {integratedgameframemobile}
228
+ {casinomygames} />
229
+ {/if}
230
+ </div>
231
+ </div>
232
+ {/if}
233
+ {/if}
234
+ </div>
235
+
236
+
237
+ <style lang="scss">
238
+
239
+ .CasinoMyGames {
240
+ background-color: var(--emfe-w-casino-color-bg, var(--emfe-w-color-background, #07072A));
241
+ width: 100%;
242
+ margin: 50px 0;
243
+ box-sizing: border-box;
244
+ &.Mobile {
245
+ padding: 25px 10px;
246
+ }
247
+ }
248
+
249
+ .MyGamesHeader {
250
+ display: flex;
251
+ justify-content: space-between;
252
+ margin-bottom: 40px;
253
+ }
254
+
255
+ .MyGamesButtonsContainer{
256
+ display: flex;
257
+ flex-direction: row;
258
+ -ms-overflow-style: none; /* for Internet Explorer, Edge */
259
+ scrollbar-width: none; /* for Firefox */
260
+ overflow-y: scroll;
261
+ gap: 32px;
262
+ }
263
+
264
+ .MyGamesButton {
265
+ border: none;
266
+ background: none;
267
+ color: var(--emfe-w-casino-typography, var(--emfe-w-color-white, #FFFFFF));
268
+ font-size: 20px;
269
+ font-weight: 500;
270
+ margin-right: 0px;
271
+ transition: linear 100ms;
272
+ border-bottom: 1px solid transparent;
273
+
274
+ cursor: pointer;
275
+ &:hover {
276
+ border-bottom: 1px solid var(--emfe-w-casino-color-primary, var(--emfe-w-color-primary, #D0046C));
277
+ line-height: 36px;
278
+ padding-bottom: 10px;
279
+ }
280
+ &:focus {
281
+ color: var(--emfe-w-casino-color-primary, var(--emfe-w-color-primary, #D0046C));
282
+ line-height: 36px;
283
+ padding-bottom: 10px;
284
+ }
285
+ &.Active {
286
+ border-bottom: 1px solid var(--emfe-w-casino-color-primary, var(--emfe-w-color-primary, #D0046C));
287
+ color: var(--emfe-w-casino-color-primary, var(--emfe-w-color-primary, #D0046C));
288
+ padding-bottom: 10px;
289
+ }
290
+ &.Active {
291
+ border-bottom: 1px solid var(--emfe-w-casino-color-primary, var(--emfe-w-color-primary, #D0046C));
292
+ color: var(--emfe-w-casino-color-primary, var(--emfe-w-color-primary, #D0046C));
293
+ line-height: 36px;
294
+ }
295
+ }
296
+
297
+ .ButtonsContainerNone {
298
+ display: none;
299
+ }
300
+
301
+ .Mobile {
302
+ .MyGamesButtonsContainer{
303
+ width: 100%;
304
+ gap: 32px;
305
+ align-items: center;
306
+ justify-content: space-evenly;
307
+ }
308
+ .CasinoMyGames {
309
+ margin: 30px 0;
310
+ }
311
+ .CasinoMyGames {
312
+ width: 320px;
313
+ max-width: 320px;
314
+ }
315
+ .MyGamesHeader {
316
+ justify-content: flex-start;
317
+ }
318
+ .MyGamesButton {
319
+ font-size: 16px;
320
+ white-space: nowrap;
321
+ padding: 5px;
322
+ &.Active {
323
+ padding-bottom: 5px;
324
+ }
325
+ }
326
+ }
327
+ </style>
package/src/i18n.js ADDED
@@ -0,0 +1,27 @@
1
+ import {
2
+ dictionary,
3
+ locale,
4
+ addMessages,
5
+ _
6
+ } from 'svelte-i18n';
7
+
8
+ function setupI18n({ withLocale: _locale, translations }) {
9
+ locale.subscribe((data) => {
10
+ if (data == null) {
11
+ dictionary.set(translations);
12
+ locale.set(_locale);
13
+ }
14
+ }); // maybe we will need this to make sure that the i18n is set up only once
15
+ /*dictionary.set(translations);
16
+ locale.set(_locale);*/
17
+ }
18
+
19
+ function addNewMessages(lang, dict) {
20
+ addMessages(lang, dict);
21
+ }
22
+
23
+ function setLocale(_locale) {
24
+ locale.set(_locale);
25
+ }
26
+
27
+ export { _, setupI18n, addNewMessages, setLocale };
package/src/index.ts ADDED
@@ -0,0 +1,4 @@
1
+ import CasinoMyGamesNd from './CasinoMyGamesNd.svelte';
2
+
3
+ !customElements.get('casino-my-games-nd') && customElements.define('casino-my-games-nd', CasinoMyGamesNd);
4
+ export default CasinoMyGamesNd;