@betarena/ad-engine 0.0.67 → 0.0.69
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/package.json
CHANGED
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
|
|
53
53
|
import WidgetAdGeneral from './Advert-General-Child.svelte';
|
|
54
54
|
import AdvertInterScrollerChild from './Advert-InterScroller-Child.svelte';
|
|
55
|
-
import AdvertLeftSide from './Advert-LeftSide.svelte';
|
|
55
|
+
import AdvertLeftSide from './Advert-LeftSide-Child.svelte';
|
|
56
56
|
import WidgetAdvertSlide from './Advert-Slide-Child.svelte';
|
|
57
57
|
import DevInfoBox from './misc/admin/Dev-Info-Box.svelte';
|
|
58
58
|
|
|
@@ -344,7 +344,7 @@
|
|
|
344
344
|
// │ ➤ [1] loop over retrieved/fetched elements identified in 'document',
|
|
345
345
|
// │ ➤ [2] and inject target 'ADVERTS' in target specific locations.
|
|
346
346
|
// ┣─────
|
|
347
|
-
// ┃ ZONE-ID :: 1,2,3
|
|
347
|
+
// ┃ ZONE-ID :: 1,2,3,4
|
|
348
348
|
// ╰─────
|
|
349
349
|
for (const [zoneId, element] of mapBetarenaAdvertStandardElement)
|
|
350
350
|
{
|
|
@@ -432,25 +432,32 @@
|
|
|
432
432
|
else if (zoneId == 2 || zoneId == 3)
|
|
433
433
|
{
|
|
434
434
|
for (const adData of (creativeAdData ?? []))
|
|
435
|
-
|
|
436
|
-
|
|
435
|
+
new AdvertInterScrollerChild
|
|
436
|
+
(
|
|
437
|
+
{
|
|
437
438
|
target: element,
|
|
438
|
-
props:
|
|
439
|
-
objectAdvertData: adData
|
|
440
|
-
}
|
|
441
|
-
})
|
|
442
|
-
else
|
|
443
|
-
new AdvertInterScrollerChild
|
|
444
|
-
(
|
|
445
|
-
{
|
|
446
|
-
target: element,
|
|
447
|
-
props:
|
|
439
|
+
props:
|
|
448
440
|
{
|
|
449
441
|
instanceNode: element,
|
|
450
442
|
objectAdvertData: adData
|
|
451
443
|
}
|
|
444
|
+
}
|
|
445
|
+
);
|
|
446
|
+
;
|
|
447
|
+
}
|
|
448
|
+
else if (zoneId == 4)
|
|
449
|
+
{
|
|
450
|
+
for (const adData of (creativeAdData ?? []))
|
|
451
|
+
new AdvertLeftSide
|
|
452
|
+
(
|
|
453
|
+
{
|
|
454
|
+
target: element.parentElement,
|
|
455
|
+
props:
|
|
456
|
+
{
|
|
457
|
+
objectAdvertData: adData
|
|
452
458
|
}
|
|
453
|
-
|
|
459
|
+
}
|
|
460
|
+
);
|
|
454
461
|
;
|
|
455
462
|
}
|
|
456
463
|
}
|
|
@@ -692,7 +699,7 @@
|
|
|
692
699
|
(
|
|
693
700
|
{
|
|
694
701
|
deviceType,
|
|
695
|
-
// deviceType: '
|
|
702
|
+
// deviceType: 'desktop',
|
|
696
703
|
isoCountryCode: geoLocation.country_code ?? 'EN',
|
|
697
704
|
// isoCountryCode: 'BR',
|
|
698
705
|
authorId,
|
|
@@ -802,7 +809,7 @@
|
|
|
802
809
|
|
|
803
810
|
<hr>
|
|
804
811
|
|
|
805
|
-
<div
|
|
812
|
+
<!-- <div
|
|
806
813
|
data-betarena-zone-id=2,3
|
|
807
814
|
>
|
|
808
815
|
{#each { length: 25 } as _, i}
|
|
@@ -810,5 +817,10 @@
|
|
|
810
817
|
Loren ipsum dolor sit amet, consectetur adipiscing elit. Nulla nec purus feugiat, vestibulum mi id.
|
|
811
818
|
</p>
|
|
812
819
|
{/each}
|
|
820
|
+
</div> -->
|
|
821
|
+
|
|
822
|
+
<div
|
|
823
|
+
data-betarena-zone-id=4
|
|
824
|
+
>
|
|
813
825
|
</div>
|
|
814
826
|
{/if}
|
|
@@ -0,0 +1,166 @@
|
|
|
1
|
+
<!--
|
|
2
|
+
╭──────────────────────────────────────────────────────────────────────────────────╮
|
|
3
|
+
│ 📌 High Order Component Overview │
|
|
4
|
+
┣──────────────────────────────────────────────────────────────────────────────────┫
|
|
5
|
+
│ ➤ Internal Svelte Code Format :|: V.8.0 │
|
|
6
|
+
│ ➤ Status :|: 🔒 LOCKED │
|
|
7
|
+
│ ➤ Author(s) :|: @migbash │
|
|
8
|
+
┣──────────────────────────────────────────────────────────────────────────────────┫
|
|
9
|
+
│ 📝 Description │
|
|
10
|
+
┣──────────────────────────────────────────────────────────────────────────────────┫
|
|
11
|
+
│ Betarena Ad-Engine Component (Entrypoint) │
|
|
12
|
+
╰──────────────────────────────────────────────────────────────────────────────────╯
|
|
13
|
+
-->
|
|
14
|
+
|
|
15
|
+
<!--
|
|
16
|
+
╭──────────────────────────────────────────────────────────────────────────────────╮
|
|
17
|
+
│ 🟦 Svelte Component JS/TS │
|
|
18
|
+
┣──────────────────────────────────────────────────────────────────────────────────┫
|
|
19
|
+
│ ➤ HINT: │ Access snippets for '<script> [..] </script>' those found in │
|
|
20
|
+
│ │ '.vscode/snippets.code-snippets' via intellisense using 'doc' │
|
|
21
|
+
╰──────────────────────────────────────────────────────────────────────────────────╯
|
|
22
|
+
-->
|
|
23
|
+
|
|
24
|
+
<script lang="ts">
|
|
25
|
+
|
|
26
|
+
// #region ➤ 📦 Package Imports
|
|
27
|
+
|
|
28
|
+
// ╭────────────────────────────────────────────────────────────────────────╮
|
|
29
|
+
// │ NOTE: │
|
|
30
|
+
// │ Please add inside 'this' region the 'imports' that are required │
|
|
31
|
+
// │ by 'this' .svelte file is ran. │
|
|
32
|
+
// │ IMPORTANT │
|
|
33
|
+
// │ Please, structure the imports as follows: │
|
|
34
|
+
// │ 1. svelte/sveltekit imports │
|
|
35
|
+
// │ 2. project-internal files and logic │
|
|
36
|
+
// │ 3. component import(s) │
|
|
37
|
+
// │ 4. assets import(s) │
|
|
38
|
+
// │ 5. type(s) imports(s) │
|
|
39
|
+
// ╰────────────────────────────────────────────────────────────────────────╯
|
|
40
|
+
|
|
41
|
+
import { onMount } from 'svelte';
|
|
42
|
+
|
|
43
|
+
import { storeAdmin } from './store/admin';
|
|
44
|
+
|
|
45
|
+
import type { AdsCreativeMain } from '@betarena/scores-lib/types/v8/_HASURA-0';
|
|
46
|
+
import { ServiceAdEngine } from '@betarena/scores-lib/dist/classes/_service.adengine.js';
|
|
47
|
+
import { betarenaEndpoint } from './constants/instance.js';
|
|
48
|
+
|
|
49
|
+
// #endregion ➤ 📦 Package Imports
|
|
50
|
+
|
|
51
|
+
// #region ➤ 📌 VARIABLES
|
|
52
|
+
|
|
53
|
+
// ╭────────────────────────────────────────────────────────────────────────╮
|
|
54
|
+
// │ NOTE: │
|
|
55
|
+
// │ Please add inside 'this' region the 'variables' that are to be │
|
|
56
|
+
// │ and are expected to be used by 'this' .svelte file / component. │
|
|
57
|
+
// │ IMPORTANT │
|
|
58
|
+
// │ Please, structure the imports as follows: │
|
|
59
|
+
// │ 1. export const / let [..] │
|
|
60
|
+
// │ 2. const [..] │
|
|
61
|
+
// │ 3. let [..] │
|
|
62
|
+
// │ 4. $: [..] │
|
|
63
|
+
// ╰────────────────────────────────────────────────────────────────────────╯
|
|
64
|
+
|
|
65
|
+
export let
|
|
66
|
+
/**
|
|
67
|
+
* @augments AdsCreativeMain
|
|
68
|
+
*/
|
|
69
|
+
objectAdvertData: AdsCreativeMain
|
|
70
|
+
;
|
|
71
|
+
|
|
72
|
+
// #endregion ➤ 📌 VARIABLES
|
|
73
|
+
|
|
74
|
+
// #region ➤ 🔄 LIFECYCLE [SVELTE]
|
|
75
|
+
|
|
76
|
+
// ╭────────────────────────────────────────────────────────────────────────╮
|
|
77
|
+
// │ NOTE: │
|
|
78
|
+
// │ Please add inside 'this' region the 'logic' that should run │
|
|
79
|
+
// │ immediately and as part of the 'lifecycle' of svelteJs, │
|
|
80
|
+
// │ as soon as 'this' .svelte file is ran. │
|
|
81
|
+
// ╰────────────────────────────────────────────────────────────────────────╯
|
|
82
|
+
|
|
83
|
+
onMount
|
|
84
|
+
(
|
|
85
|
+
() =>
|
|
86
|
+
{
|
|
87
|
+
storeAdmin.updateData
|
|
88
|
+
(
|
|
89
|
+
[
|
|
90
|
+
[
|
|
91
|
+
'numberOfAdvertsActive',
|
|
92
|
+
null
|
|
93
|
+
]
|
|
94
|
+
]
|
|
95
|
+
);
|
|
96
|
+
return;
|
|
97
|
+
}
|
|
98
|
+
);
|
|
99
|
+
|
|
100
|
+
// #endregion ➤ 🔄 LIFECYCLE [SVELTE]
|
|
101
|
+
|
|
102
|
+
</script>
|
|
103
|
+
|
|
104
|
+
<!--
|
|
105
|
+
╭──────────────────────────────────────────────────────────────────────────────────╮
|
|
106
|
+
│ 💠 Svelte Component HTML │
|
|
107
|
+
┣──────────────────────────────────────────────────────────────────────────────────┫
|
|
108
|
+
│ ➤ HINT: │ Use 'Ctrl + Space' to autocomplete global class=styles, dynamically │
|
|
109
|
+
│ │ imported from './static/app.css' │
|
|
110
|
+
│ ➤ HINT: │ access custom Betarena Scores VScode Snippets by typing emmet-like │
|
|
111
|
+
│ │ abbrev. │
|
|
112
|
+
╰──────────────────────────────────────────────────────────────────────────────────╯
|
|
113
|
+
-->
|
|
114
|
+
|
|
115
|
+
<a
|
|
116
|
+
target='_blank'
|
|
117
|
+
href={objectAdvertData.data?.cta_link}
|
|
118
|
+
on:click=
|
|
119
|
+
{
|
|
120
|
+
() =>
|
|
121
|
+
{
|
|
122
|
+
new ServiceAdEngine
|
|
123
|
+
(
|
|
124
|
+
betarenaEndpoint
|
|
125
|
+
).updateAdEngineClickCounter
|
|
126
|
+
(
|
|
127
|
+
{
|
|
128
|
+
query: {
|
|
129
|
+
creativeId: objectAdvertData.id
|
|
130
|
+
},
|
|
131
|
+
body: {}
|
|
132
|
+
}
|
|
133
|
+
);
|
|
134
|
+
return;
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
>
|
|
138
|
+
<img
|
|
139
|
+
alt="ad_image"
|
|
140
|
+
src={objectAdvertData.data?.media}
|
|
141
|
+
class="desktop_ad"
|
|
142
|
+
/>
|
|
143
|
+
</a>
|
|
144
|
+
|
|
145
|
+
<!--
|
|
146
|
+
╭──────────────────────────────────────────────────────────────────────────────────╮
|
|
147
|
+
│ 🌊 Svelte Component CSS/SCSS │
|
|
148
|
+
┣──────────────────────────────────────────────────────────────────────────────────┫
|
|
149
|
+
│ ➤ HINT: │ auto-fill/auto-complete iniside <style> for var() │
|
|
150
|
+
│ │ values by typing/CTRL+SPACE │
|
|
151
|
+
│ ➤ HINT: │ access custom Betarena Scores CSS VScode Snippets by typing 'style...' │
|
|
152
|
+
╰──────────────────────────────────────────────────────────────────────────────────╯
|
|
153
|
+
-->
|
|
154
|
+
|
|
155
|
+
<style lang="scss">
|
|
156
|
+
|
|
157
|
+
.desktop_ad
|
|
158
|
+
{
|
|
159
|
+
position: fixed;
|
|
160
|
+
right: 0 !important;
|
|
161
|
+
max-height: 100% !important;
|
|
162
|
+
top: 0 !important;
|
|
163
|
+
width: initial !important;
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
</style>
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
import type { AdsCreativeMain } from '@betarena/scores-lib/types/v8/_HASURA-0';
|
|
3
|
-
import { onMount } from 'svelte';
|
|
4
|
-
import { storeAdmin } from './store/admin';
|
|
5
|
-
|
|
6
|
-
export let /**
|
|
7
|
-
* @augments AdsCreativeMain
|
|
8
|
-
*/
|
|
9
|
-
objectAdvertData: AdsCreativeMain;
|
|
10
|
-
|
|
11
|
-
onMount(() =>
|
|
12
|
-
{
|
|
13
|
-
storeAdmin.updateData([['numberOfAdvertsActive', null]]);
|
|
14
|
-
return;
|
|
15
|
-
});
|
|
16
|
-
</script>
|
|
17
|
-
|
|
18
|
-
<a
|
|
19
|
-
target="_blank"
|
|
20
|
-
href={objectAdvertData.data?.cta_link}
|
|
21
|
-
on:click={() =>
|
|
22
|
-
{
|
|
23
|
-
|
|
24
|
-
}}
|
|
25
|
-
>
|
|
26
|
-
<img alt="ad_image" src={objectAdvertData.data?.media} class="desktop_ad" />
|
|
27
|
-
</a>
|
|
28
|
-
|
|
29
|
-
<style>
|
|
30
|
-
.desktop_ad {
|
|
31
|
-
position: fixed;
|
|
32
|
-
right: 0 !important;
|
|
33
|
-
max-height: 100% !important;
|
|
34
|
-
top: 0 !important;
|
|
35
|
-
width: initial !important;
|
|
36
|
-
}
|
|
37
|
-
</style>
|