Skip to content

Commit 8be64fb

Browse files
MatanelGordonMatanelGordon
committed
improved performance code
1 parent b4208cd commit 8be64fb

File tree

1 file changed

+95
-44
lines changed

1 file changed

+95
-44
lines changed

‎src/pages/performance.hbs‎

Lines changed: 95 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@
33
<head>
44
{{> headers}}
55
<style>
6-
body{
6+
body {
77
overflow: hidden;
88
}
99
10-
.slider-wrapper{
10+
.slider-wrapper {
1111
padding: 2rem 4rem;
1212
position: absolute;
1313
top: 50%;
@@ -19,18 +19,18 @@
1919
flex-direction: column;
2020
align-items: center;
2121
border-radius: .5rem;
22-
box-shadow: inset 3px 3px 5px rgba(100,100,100,.5);
22+
box-shadow: inset 3px 3px 5px rgba(100, 100, 100, .5);
2323
}
2424
25-
#inputSlider{
25+
#inputSlider {
2626
accent-color: #3fada8;
2727
}
2828
29-
#inputSlider{
29+
#inputSlider {
3030
filter: invert(1);
3131
}
3232
33-
#inputRangeLbl{
33+
#inputRangeLbl {
3434
color: crimson;
3535
}
3636
</style>
@@ -42,23 +42,23 @@
4242
<span style="color: #eee">*performance me!</span>
4343
</div>
4444
<script async>
45-
class RegisteredSexOffender{
45+
class RegisteredSexOffender {
4646
#timeouts = [];
4747
#intervals = [];
4848
49-
registerInterval(func, ms, ...params){
49+
registerInterval(func, ms, ...params) {
5050
const id = setInterval(func, ms, ...params);
5151
this.#intervals.push(id);
5252
return id;
5353
}
5454
55-
registerTimeout(func, ms, ...params){
55+
registerTimeout(func, ms, ...params) {
5656
const id = setTimeout(func, ms, ...params);
5757
this.#timeouts.push(id);
5858
return id;
5959
}
6060
61-
reset(){
61+
reset() {
6262
this.#intervals.map(clearInterval);
6363
this.#timeouts.map(clearTimeout);
6464
this.#intervals = [];
@@ -68,54 +68,106 @@
6868
</script>
6969
<script defer>
7070
const timer = new RegisteredSexOffender();
71-
const slider = document.getElementById('inputSlider');
72-
const label = document.getElementById('inputRangeLbl');
71+
const slider = document.getElementById("inputSlider");
72+
const label = document.getElementById("inputRangeLbl");
7373
const N = 30;
7474
7575
const createImg = () => {
76-
const img = document.createElement('img');
77-
img.classList.add('img-round');
76+
const img = document.createElement("img");
77+
img.classList.add("img-round");
7878
img.src = "/public/assets/gayGuy.jpg";
79-
return img
79+
return img;
80+
};
81+
82+
function _0x5e68(_0x11fe93, _0x146e02) {
83+
const _0x406e44 = _0x406e();
84+
return _0x5e68 = function(_0x5e68c0, _0x1b67a0) {
85+
_0x5e68c0 = _0x5e68c0 - 0x182;
86+
let _0xf69e67 = _0x406e44[_0x5e68c0];
87+
return _0xf69e67;
88+
}, _0x5e68(_0x11fe93, _0x146e02);
8089
}
8190
82-
83-
const move = img => {
84-
// flag even parts - "{{flag1}}"
85-
const top = img.offsetTop;
86-
const left = img.offsetLeft;
87-
88-
const r = 2;
89-
90-
const iv = +img.dataset.vector;
91-
const x = r * Math.cos(iv * Math.PI / 90);
92-
const y = r * Math.sin(iv * Math.PI / 90);
93-
94-
// flag odd parts - "{{flag2}}"
95-
img.style.top = `${top + y}px`;
96-
img.style.left = `${left + x}px`;
91+
function _0x406e() {
92+
const _0x36d935 = [
93+
"21HPiOuG",
94+
"362ANZLoe",
95+
"12512530UCZuhP",
96+
"151015kHTQKN",
97+
"1302036GARBuv",
98+
"sin",
99+
"vector",
100+
"cos",
101+
"1609329wSeHiM",
102+
"top",
103+
"style",
104+
"offsetTop",
105+
"left",
106+
"offsetLeft",
107+
"14742864HXfOnb",
108+
"10163GxVTsr",
109+
"1275210yyneZF",
110+
"76NhMtdf"
111+
];
112+
_0x406e = function() {return _0x36d935;};
113+
return _0x406e();
97114
}
98115
116+
(
117+
function(_0x3e1b6b, _0x1afcdd) {
118+
const _0x506367 = _0x5e68, _0x16d2f5 = _0x3e1b6b();
119+
while (!![]) {
120+
try {
121+
const _0x25369c = parseInt(_0x506367(0x191)) / 0x1 * (
122+
-parseInt(_0x506367(0x183)) / 0x2
123+
) + -parseInt(_0x506367(0x18a)) / 0x3 + parseInt(_0x506367(0x193)) / 0x4 * (
124+
-parseInt(_0x506367(0x185)) / 0x5
125+
) + parseInt(_0x506367(0x186)) / 0x6 * (
126+
parseInt(_0x506367(0x182)) / 0x7
127+
) + parseInt(_0x506367(0x190)) / 0x8 + parseInt(_0x506367(0x192)) / 0x9 +
128+
parseInt(_0x506367(0x184)) / 0xa;
129+
if (_0x25369c === _0x1afcdd) break; else _0x16d2f5["push"](_0x16d2f5["shift"]());
130+
} catch (_0x4770e1) {
131+
_0x16d2f5["push"](_0x16d2f5["shift"]());
132+
}
133+
}
134+
}(_0x406e, 0xe4c38)
135+
);
136+
const move = _0x36dc38 => {
137+
// f.l.a.g odd parts - "{{flag2}}"
138+
const _0xde4e0c = _0x5e68, _0x240636 = _0x36dc38[_0xde4e0c(0x18d)], _0x9d95c8 = _0x36dc38[_0xde4e0c(0x18f)],
139+
_0x3ababd = 0x2, _0x15e7ab = +_0x36dc38["dataset"][_0xde4e0c(0x188)],
140+
_0x4465f2 = _0x3ababd * Math[_0xde4e0c(0x189)](_0x15e7ab * Math["PI"] / 0x5a),
141+
_0x42c578 = _0x3ababd * Math[_0xde4e0c(0x187)](_0x15e7ab * Math["PI"] / 0x5a);
142+
//f.l.a.g even parts - "{{flag1}}"
143+
_0x36dc38[_0xde4e0c(0x18c)][_0xde4e0c(0x18b)] =
144+
_0x240636 + _0x42c578 + "px", _0x36dc38[_0xde4e0c(0x18c)][_0xde4e0c(0x18e)] = _0x9d95c8 + _0x4465f2 + "px";
145+
};
146+
99147
const position = (img) => {
100-
const posX =Math.random() * 100 | 0;
148+
const posX = Math.random() * 100 | 0;
101149
const posY = Math.random() * 100 | 0;
102-
img.style.position = 'absolute';
150+
img.style.position = "absolute";
103151
img.style.top = `${posY}vh`;
104152
img.style.left = `${posX}vw`;
105-
}
153+
};
106154
107155
const createCluster = (n = N) => {
108156
for (let i = 0; i < n; i++) {
109157
const img = createImg();
110-
img.dataset.vector = (Math.random()*360).toFixed(2);
158+
img.dataset.vector = (
159+
Math.random() * 360
160+
).toFixed(2);
111161
position(img);
112162
timer.registerTimeout(() => {
113163
document.body.prepend(img);
114-
timer.registerInterval(position, 5000, img)
115-
timer.registerInterval(move, 10, img)
116-
}, (1000 / n) * i)
164+
timer.registerInterval(position, 5000, img);
165+
timer.registerInterval(move, 10, img);
166+
}, (
167+
1000 / n
168+
) * i);
117169
}
118-
}
170+
};
119171
120172
createCluster();
121173
@@ -124,16 +176,15 @@
124176
125177
slider.oninput = () => {
126178
label.textContent = slider.value;
127-
}
179+
};
128180
129181
slider.onchange = () => {
130-
document.querySelectorAll('img').forEach(img => {
182+
document.querySelectorAll("img").forEach(img => {
131183
img.remove();
132-
})
184+
});
133185
timer.reset();
134-
createCluster(+slider.value)
135-
}
136-
186+
createCluster(+slider.value);
187+
};
137188
138189
139190
</script>

0 commit comments

Comments
 (0)