5
5
*/
6
6
declare (strict_types=1 );
7
7
8
+ use Hyva \Theme \Model \ViewModelRegistry ;
8
9
use Magento \Framework \View \Element \Template ;
9
10
use Opengento \Snowflake \ViewModel \Snowflake ;
10
11
11
12
/** @var Template $block */
12
- /** @var Snowflake $viewModel */
13
- $ viewModel = $ block ->getData ('viewModel ' );
13
+ /** @var Snowflake $snowflake */
14
+ $ snowflake = $ block ->getData ('viewModel ' );
14
15
?>
15
16
<div id="snowflake_container"></div>
16
17
17
18
<script>
18
- require([
19
- 'jquery',
20
- 'jquery/ui',
21
- 'domReady!'
22
- ], function($) {
23
- "use strict";
24
-
25
- <?php if ($ viewModel ->isForceSnow ()): ?>
19
+ "use strict";
20
+
21
+ document.addEventListener('DOMContentLoaded', function() {
22
+
23
+ // Vérifiez si la neige de saucisses doit commencer
24
+ if (forceSnow()) {
26
25
letSnow();
27
- <?php elseif ($ viewModel ->isApiEnabled ()): ?>
28
- let lat, lon, settings = {
29
- "url": "<?= $ viewModel ->getIpLocatorApiUrl () ?> ",
30
- "method": "GET",
31
- "timeout": 0
32
- };
33
- $.ajax(settings).done(function (response) {
34
- [lat, lon] = response.loc.split(',');
35
- $.ajax({
36
- url: '<?= $ block ->getData ('meteoUrl ' ) ?> lat/' + lat + '/lon/' + lon,
37
- type: "GET",
38
- }).done(function (data) {
26
+ } else if (isApiEnabled()) {
27
+ fetch("<?= $ snowflake ->getIpLocatorApiUrl () ?> ")
28
+ .then(response => response.json())
29
+ .then(data => {
30
+ let [lat, lon] = data.loc.split(',');
31
+ return fetch(`<?= $ block ->getData ('meteoUrl ' ) ?> lat/${lat}/lon/${lon}`);
32
+ })
33
+ .then(response => response.json())
34
+ .then(data => {
39
35
if (data.is_snowing) {
40
36
letSnow();
41
37
}
42
- });
43
- } );
44
- <?php endif ; ?>
38
+ })
39
+ .catch(error => console.error('Error:', error) );
40
+ }
45
41
46
42
function letSnow() {
47
- let snowMax = <?= $ viewModel ->getSnowflakeQty () ?> ;
48
- let snowColor = ["#DDD", "#BBB", "#AAA", "#EEE", "#CCC"];
49
- let snowEntity = "<?= $ viewModel ->getSnowflakeChar () ?> ";
50
- let snowVSpeed = <?= $ viewModel ->getSnowflakeVSpeed () ?> ;
51
- let snowHSpeed = <?= $ viewModel ->getSnowflakeHSpeed () ?> ;
52
- let snowRotSpeed = <?= $ viewModel ->getSnowflakeRotSpeed () ?> ;
53
- let snowMinSize = <?= $ viewModel ->getSnowflakeMinSize () ?> ;
54
- const snowMaxSize = <?= $ viewModel ->getSnowflakeMaxSize () ?> ;
43
+ let snowMax = <?= $ snowflake ->getSnowflakeQty () ?> ;
44
+ let snowEntities = <?= $ snowflake ->getIconsForSelectedSeason () ?> ;
45
+ let snowVSpeed = <?= $ snowflake ->getSnowflakeVSpeed () ?> ;
46
+ let snowHSpeed = <?= $ snowflake ->getSnowflakeHSpeed () ?> ;
47
+ let snowRotSpeed = <?= $ snowflake ->getSnowflakeRotSpeed () ?> ;
48
+ let snowMinSize = <?= $ snowflake ->getSnowflakeMinSize () ?> ;
49
+ const snowMaxSize = <?= $ snowflake ->getSnowflakeMaxSize () ?> ;
55
50
const snowRefresh = 50;
56
- const snowMaxBlur = 3 ;
51
+ const snowMaxBlur = 0 ;
57
52
const snowStyles = "cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;";
58
53
59
- let snow = [],
60
- pos = [],
61
- coords = [],
62
- left = [],
63
- marginBottom,
64
- marginRight;
54
+ let snow = [];
55
+ let pos = [];
56
+ let coords = [];
57
+ let left = [];
58
+ let marginBottom;
59
+ let marginRight;
65
60
66
61
let newPositions = '';
67
62
68
63
for (let i = 0; i <= snowMax; i++) {
69
- newPositions += ("<span id='flake" + i + "'" +
70
- " style='" + snowStyles + "position:absolute;top:-" + snowMaxSize + "'>"
71
- + snowEntity + " </span>") ;
64
+ // Utiliser l'index modulo pour choisir une icône différente à chaque itération
65
+ let entity = snowEntities[i % snowEntities.length].trim(); // Utilisation de trim() pour éviter les espaces indésirables
66
+ newPositions += `<span id='flake${i}' style='${snowStyles} position:absolute; top:-${snowMaxSize}px;'>${entity} </span>` ;
72
67
}
73
- $('# snowflake_container').html( newPositions) ;
68
+ document.getElementById(' snowflake_container').innerHTML = newPositions;
74
69
75
70
let snowSize = snowMaxSize - snowMinSize;
76
71
marginBottom = document.body.scrollHeight - 5;
@@ -80,23 +75,22 @@ $viewModel = $block->getData('viewModel');
80
75
coords[i] = 0;
81
76
left[i] = Math.random() * 15;
82
77
pos[i] = 0.03 + Math.random() / 10;
83
- snow[i] = document.getElementById(" flake" + i );
78
+ snow[i] = document.getElementById(` flake${i}` );
84
79
snow[i].style.fontFamily = "inherit";
85
- let size = randomise(snowSize) + snowMinSize
80
+ let size = randomise(snowSize) + snowMinSize;
86
81
snow[i].size = size;
87
82
snow[i].speedFactor = snowMaxSize / size / 2;
88
- snow[i].style.filter = "blur(" + (snowMaxBlur * ((snowMaxSize - size) / (snowMaxSize - snowMinSize))) / 2 + "px)";
89
- snow[i].style.fontSize = snow[i].size + "px";
90
- snow[i].style.color = snowColor[randomise(snowColor.length)];
83
+ snow[i].style.filter = `blur(${(snowMaxBlur * ((snowMaxSize - size) / (snowMaxSize - snowMinSize))) / 2}px)`;
84
+ snow[i].style.fontSize = `${size}px`;
91
85
snow[i].style.zIndex = 1000;
92
86
snow[i].style.textShadow = "1px 1px 5px #0000DD55";
93
87
snow[i].style.transform = "rotate(0deg)";
94
- snow[i].vsink = snowVSpeed * snow[i]. size / 5;
95
- snow[i].hsink = snowHSpeed * snow[i]. size / 5;
96
- snow[i].posX = randomise(marginRight - snow[i]. size);
97
- snow[i].posY = randomise(2 * marginBottom - marginBottom - 2 * snow[i]. size);
98
- snow[i].style.left = snow[i].posX + "px" ;
99
- snow[i].style.top = snow[i].posY + "px" ;
88
+ snow[i].vsink = snowVSpeed * size / 5;
89
+ snow[i].hsink = snowHSpeed * size / 5;
90
+ snow[i].posX = randomise(marginRight - size);
91
+ snow[i].posY = randomise(2 * marginBottom - marginBottom - 2 * size);
92
+ snow[i].style.left = `${ snow[i].posX}px` ;
93
+ snow[i].style.top = `${ snow[i].posY}px` ;
100
94
101
95
snow[i].rotationAngleStep = 0;
102
96
snow[i].rotationAngActual = 0;
@@ -125,31 +119,38 @@ $viewModel = $block->getData('viewModel');
125
119
coords[i] += pos[i];
126
120
snow[i].posY += snow[i].vsink;
127
121
snow[i].posX += snow[i].hsink * snow[i].speedFactor;
128
- snow[i].style.left = snow[i].posX + left[i] * Math.sin(coords[i]) + "px" ;
129
- snow[i].style.top = snow[i].posY + "px" ;
122
+ snow[i].style.left = `${ snow[i].posX + left[i] * Math.sin(coords[i])}px` ;
123
+ snow[i].style.top = `${ snow[i].posY}px` ;
130
124
snow[i].rotationAngActual += snow[i].rotationAngleStep;
131
- snow[i].style.transform = " rotate(" + snow[i].rotationAngActual + " deg)" ;
125
+ snow[i].style.transform = ` rotate(${ snow[i].rotationAngActual} deg)` ;
132
126
133
- // if (snowVSpeed > 0 && (snow[i].posY >= marginBottom - 2 * snow[i].size || parseInt(snow[i].style.left) > (marginRight - 3 * left[i]))) {
134
- if (snowVSpeed > 0 && (snow[i].posY >= marginBottom - 2 * snow[i].size)) {
127
+ if (snowVSpeed > 0 && snow[i].posY >= marginBottom - 2 * snow[i].size) {
135
128
snow[i].posX = randomise(marginRight - snow[i].size);
136
129
snow[i].posY = 0;
137
130
}
138
- if (snowVSpeed < 0 && ( snow[i].posY < 0) ) {
139
- snow[i].posY = document.body.scrollHeight - snow[i].size *2;
131
+ if (snowVSpeed < 0 && snow[i].posY < 0) {
132
+ snow[i].posY = document.body.scrollHeight - snow[i].size * 2;
140
133
}
141
- if (snowHSpeed > 0 && ( snow[i].posX >= marginRight - 2 * snow[i].size) ) {
134
+ if (snowHSpeed > 0 && snow[i].posX >= marginRight - 2 * snow[i].size) {
142
135
snow[i].posX = randomise(marginRight - snow[i].size);
143
136
snow[i].posY = 0;
144
137
}
145
- if (snowHSpeed < 0 && ( snow[i].posX < 0) ) {
138
+ if (snowHSpeed < 0 && snow[i].posX < 0) {
146
139
snow[i].posY = document.body.clientWidth - snow[i].size * 2;
147
140
}
148
141
}
149
142
}
150
143
151
144
window.addEventListener('resize', resize);
152
- window.setInterval(moveSnow, snowRefresh);
145
+ setInterval(moveSnow, snowRefresh);
146
+ }
147
+
148
+ function forceSnow() {
149
+ return <?= $ snowflake ->isForceSnow () ?> ;
150
+ }
151
+
152
+ function isApiEnabled() {
153
+ return <?= $ snowflake ->isApiEnabled () ?> ;
153
154
}
154
155
});
155
156
</script>
0 commit comments