Spaces:
Running
Running
Delete index2.html
Browse files- index2.html +0 -1135
index2.html
DELETED
@@ -1,1135 +0,0 @@
|
|
1 |
-
<!DOCTYPE html><title>E.MOji.Monster.Squad</title>
|
2 |
-
<head><meta charset="utf-8"/>
|
3 |
-
<style>#javas { top: 0; left: 0; position: absolute; z-index: 1000; width: 100%; height: 100%; }</style>
|
4 |
-
</head><body encoding='utf8'>
|
5 |
-
<canvas id="javas"></canvas>
|
6 |
-
<script type='text/javascript'>
|
7 |
-
var javas = document.querySelector('#javas');
|
8 |
-
javas.height = window.innerHeight;
|
9 |
-
javas.width = window.innerWidth;
|
10 |
-
var c = javas.getContext('2d');
|
11 |
-
|
12 |
-
var mouse = {
|
13 |
-
x: undefined,
|
14 |
-
y: undefined
|
15 |
-
};
|
16 |
-
var newX = 0;
|
17 |
-
var newY = 0;
|
18 |
-
var traker = 0;
|
19 |
-
var score = 0;
|
20 |
-
var level = 1;
|
21 |
-
var instant = Date.now();
|
22 |
-
var startTime=Date.now();
|
23 |
-
var cycleTime=1000*1;
|
24 |
-
var elapsed = 0;
|
25 |
-
var elapsedCycle=0;
|
26 |
-
var elapsedCyclePercent=0;
|
27 |
-
var moment = 0;
|
28 |
-
var frame = 0;
|
29 |
-
var squareArray = [];
|
30 |
-
var togle = 0;
|
31 |
-
var kit;
|
32 |
-
var tik;
|
33 |
-
var farts = [];
|
34 |
-
var muf;
|
35 |
-
var guf;
|
36 |
-
var trip = 0;
|
37 |
-
var intro = 1;
|
38 |
-
var tod = 0;
|
39 |
-
var tgt = 0;
|
40 |
-
var rrror = "";
|
41 |
-
var hscore = 0;
|
42 |
-
var emi = [];
|
43 |
-
var cuboids = [];
|
44 |
-
var kills = 0;
|
45 |
-
var marq = 0;
|
46 |
-
var barq = 0;
|
47 |
-
var bigX;
|
48 |
-
var bigY;
|
49 |
-
var vit;
|
50 |
-
var darq = 0;
|
51 |
-
var ppp;
|
52 |
-
var noob;
|
53 |
-
var emos = [];
|
54 |
-
|
55 |
-
var tempArr = [];
|
56 |
-
var many = 0;
|
57 |
-
var word = "heureux";
|
58 |
-
|
59 |
-
var who = new Request('https://api.dictionaryapi.dev/api/v2/entries/en/victory');
|
60 |
-
var wha = new Request('https://api.dictionaryapi.dev/api/v2/entries/en/happy');
|
61 |
-
|
62 |
-
async function cookie() {
|
63 |
-
try{
|
64 |
-
var [vicResponse, hapResponse] = await Promise.all([fetch(who),fetch(wha)]);
|
65 |
-
var vic = await vicResponse.json();
|
66 |
-
var hap = await hapResponse.json();
|
67 |
-
return [vic, hap];
|
68 |
-
} catch(e) { console.log(e); };
|
69 |
-
};
|
70 |
-
|
71 |
-
cookie().then(([vic, hap]) => {
|
72 |
-
|
73 |
-
var flob = document.createElement('ul');
|
74 |
-
var goo = vic[0].meanings[3].synonyms;
|
75 |
-
var foo = hap[0].meanings[3].synonyms;
|
76 |
-
if (goo){
|
77 |
-
for (let i = 0; i < goo.length; i++) {
|
78 |
-
emos.push(''+goo[i]+'');
|
79 |
-
};
|
80 |
-
}
|
81 |
-
|
82 |
-
if (foo){
|
83 |
-
for (let j = 0; j < foo.length; j++) {
|
84 |
-
emos.push(''+foo[j]+'');
|
85 |
-
};
|
86 |
-
}
|
87 |
-
|
88 |
-
}).catch(console.error);
|
89 |
-
|
90 |
-
if(localStorage.SqrScore) {
|
91 |
-
hscore = localStorage.SqrScore;
|
92 |
-
} else {
|
93 |
-
localStorage.SqrScore = score;
|
94 |
-
};
|
95 |
-
|
96 |
-
window.addEventListener('resize', function(){
|
97 |
-
javas.height = window.innerHeight;
|
98 |
-
javas.width = window.innerWidth;
|
99 |
-
event.preventDefault();
|
100 |
-
init();
|
101 |
-
//var tag = document.createElement('meta');
|
102 |
-
//tag.name = "viewport";
|
103 |
-
//tag.content = "user-scalable=0";
|
104 |
-
//document.head.appendChild(tag);
|
105 |
-
});
|
106 |
-
|
107 |
-
window.addEventListener('mousemove',
|
108 |
-
function (event) {
|
109 |
-
mouse.x = event.x;
|
110 |
-
mouse.y = event.y;
|
111 |
-
|
112 |
-
//bobd();
|
113 |
-
|
114 |
-
});
|
115 |
-
|
116 |
-
window.addEventListener('touchstart',
|
117 |
-
function (event) {
|
118 |
-
let touchtart = event.touches[0];
|
119 |
-
event.preventDefault();
|
120 |
-
mouse.x = touchtart.clientX;
|
121 |
-
mouse.y = touchtart.clientY;
|
122 |
-
newX = mouse.x;
|
123 |
-
newY = mouse.y;
|
124 |
-
|
125 |
-
for (var jy in squareArray) {
|
126 |
-
var a = 0;
|
127 |
-
var b = 0;
|
128 |
-
var c = 0;
|
129 |
-
var d = 50 + squareArray[jy].height;
|
130 |
-
|
131 |
-
if(newX < squareArray[jy].x && newY < squareArray[jy].y){
|
132 |
-
a = squareArray[jy].x - newX;
|
133 |
-
b = squareArray[jy].y - newY;
|
134 |
-
}
|
135 |
-
if(newX > squareArray[jy].x && newY < squareArray[jy].y){
|
136 |
-
a = newX - squareArray[jy].x;
|
137 |
-
b = squareArray[jy].y - newY;
|
138 |
-
}
|
139 |
-
if(newX > squareArray[jy].x && newY > squareArray[jy].y){
|
140 |
-
a = newX - squareArray[jy].x;
|
141 |
-
b = newY - squareArray[jy].y;
|
142 |
-
}
|
143 |
-
if(newX < squareArray[jy].x && newY > squareArray[jy].y){
|
144 |
-
a = squareArray[jy].x - newX;
|
145 |
-
b = newY - squareArray[jy].y;
|
146 |
-
}
|
147 |
-
|
148 |
-
var asq = a*a;
|
149 |
-
var bsq = b*b;
|
150 |
-
var summ = asq + bsq;
|
151 |
-
if(summ < 0){
|
152 |
-
summ = summ *(0-1);
|
153 |
-
}
|
154 |
-
c = Math.sqrt(summ);
|
155 |
-
|
156 |
-
if(c <= d){
|
157 |
-
traker -= 1;
|
158 |
-
kills += 1;
|
159 |
-
darq = frame+25;
|
160 |
-
barq = frame+15;
|
161 |
-
marq = 1;
|
162 |
-
bigX = squareArray[jy].x;
|
163 |
-
bigY = squareArray[jy].y;
|
164 |
-
explode(squareArray[jy].x, squareArray[jy].y);
|
165 |
-
navigator.vibrate([50]);
|
166 |
-
|
167 |
-
(function (){
|
168 |
-
var audioCtx = new(window.AudioContext || window.webkitAudioContext)();
|
169 |
-
|
170 |
-
function playNote(frequency, duration) {
|
171 |
-
// create Oscillator node
|
172 |
-
var oscillator = audioCtx.createOscillator();
|
173 |
-
let gain = audioCtx.createGain();
|
174 |
-
gain.gain.value = 0.1;
|
175 |
-
oscillator.type = 'sine';
|
176 |
-
oscillator.frequency.value = frequency; // value in hertz
|
177 |
-
//oscillator.connect(audioCtx.destination);
|
178 |
-
oscillator.connect(gain);
|
179 |
-
gain.connect(audioCtx.destination);
|
180 |
-
oscillator.start();
|
181 |
-
|
182 |
-
setTimeout(
|
183 |
-
function() {
|
184 |
-
oscillator.stop();
|
185 |
-
playMelody();
|
186 |
-
}, duration);
|
187 |
-
};
|
188 |
-
|
189 |
-
function playMelody() {
|
190 |
-
if (notes.length > 0) {
|
191 |
-
note = notes.pop();
|
192 |
-
playNote(note[0], 1000 * 256 / (note[1] * tempo));
|
193 |
-
}
|
194 |
-
};
|
195 |
-
|
196 |
-
notes = [
|
197 |
-
[1280, 256],
|
198 |
-
[768, 256],
|
199 |
-
[1024, 256],
|
200 |
-
[512, 256],
|
201 |
-
[256, 256]
|
202 |
-
];
|
203 |
-
|
204 |
-
//notes.reverse();
|
205 |
-
tempo = 100;
|
206 |
-
|
207 |
-
playMelody();
|
208 |
-
})();
|
209 |
-
|
210 |
-
if(kills == 10){
|
211 |
-
congrat(0, 0);
|
212 |
-
navigator.vibrate([250]);
|
213 |
-
level += 1;
|
214 |
-
document.body.style.backgroundColor = "black";
|
215 |
-
}
|
216 |
-
if(kills == 50){
|
217 |
-
congrat(0, 0);
|
218 |
-
navigator.vibrate([250]);
|
219 |
-
level += 1;
|
220 |
-
}
|
221 |
-
if(kills == 100){
|
222 |
-
congrat(0, 0);
|
223 |
-
navigator.vibrate([250]);
|
224 |
-
level += 1;
|
225 |
-
document.body.style.backgroundColor = "white";
|
226 |
-
}
|
227 |
-
if(kills == 300){
|
228 |
-
congrat(0, 0);
|
229 |
-
navigator.vibrate([250]);
|
230 |
-
level += 1;
|
231 |
-
document.body.style.backgroundColor = "black";
|
232 |
-
}
|
233 |
-
if(kills == 400){
|
234 |
-
congrat(0, 0);
|
235 |
-
navigator.vibrate([250]);
|
236 |
-
level += 1;
|
237 |
-
}
|
238 |
-
|
239 |
-
if(trip == 1){
|
240 |
-
trip = 0;
|
241 |
-
level = 1;
|
242 |
-
score = 0;
|
243 |
-
intro = 1;
|
244 |
-
frame = 0;
|
245 |
-
}
|
246 |
-
if(squareArray[jy].golf == 0){
|
247 |
-
vit = 0;
|
248 |
-
ppp = Math.floor(frame/squareArray[jy].eater);
|
249 |
-
score -= ppp;
|
250 |
-
}
|
251 |
-
if(squareArray[jy].golf > 0){
|
252 |
-
vit = Math.floor(frame/squareArray[jy].height)*level;
|
253 |
-
score += vit;
|
254 |
-
}
|
255 |
-
delete squareArray[jy];
|
256 |
-
}
|
257 |
-
};
|
258 |
-
|
259 |
-
//bobd();
|
260 |
-
|
261 |
-
}, false);
|
262 |
-
|
263 |
-
window.addEventListener("touchmove",
|
264 |
-
function (event) {
|
265 |
-
let touchmvo = event.touches[0];
|
266 |
-
event.preventDefault();
|
267 |
-
mouse.x = touchmvo.clientX;
|
268 |
-
mouse.y = touchmvo.clientY;
|
269 |
-
|
270 |
-
}, false);
|
271 |
-
|
272 |
-
window.addEventListener('touchend',
|
273 |
-
function (event) {
|
274 |
-
let touchtend = event.touches[0];
|
275 |
-
event.preventDefault();
|
276 |
-
mouse.x = touchtend.clientX;
|
277 |
-
mouse.y = touchtend.clientY;
|
278 |
-
}, false);
|
279 |
-
|
280 |
-
var ze = 0;
|
281 |
-
function color(r, g, b, a){
|
282 |
-
this.r = r;
|
283 |
-
this.g = g;
|
284 |
-
this.b = b;
|
285 |
-
this.a = a;
|
286 |
-
}
|
287 |
-
|
288 |
-
function point2D(x, y){
|
289 |
-
this.x = x;
|
290 |
-
this.y = y;
|
291 |
-
}
|
292 |
-
point2D.prototype.move = function(p2D){
|
293 |
-
this.x += p2D.x;
|
294 |
-
this.y += p2D.y;
|
295 |
-
}
|
296 |
-
|
297 |
-
function point3D(x, y, z){
|
298 |
-
this.x = x;
|
299 |
-
this.y = y;
|
300 |
-
this.z = z;
|
301 |
-
}
|
302 |
-
point3D.prototype.move = function(p3D){
|
303 |
-
this.x += p3D.x;
|
304 |
-
this.y += p3D.y;
|
305 |
-
this.z += p3D.z;
|
306 |
-
}
|
307 |
-
point3D.prototype.swap = function(p3D){
|
308 |
-
this.x = p3D.x;
|
309 |
-
this.y = p3D.y;
|
310 |
-
this.z = p3D.z;
|
311 |
-
}
|
312 |
-
point3D.prototype.rotate = function(axis, angleGr){
|
313 |
-
angleRad = angleGr * Math.PI / 180;
|
314 |
-
switch (axis)
|
315 |
-
{
|
316 |
-
case "x":{
|
317 |
-
var tempPoint = new point3D(
|
318 |
-
this.x,
|
319 |
-
this.y * Math.cos(angleRad) - this.z * Math.sin(angleRad),
|
320 |
-
this.y * Math.sin(angleRad) + this.z * Math.cos(angleRad)
|
321 |
-
);
|
322 |
-
this.swap(tempPoint);
|
323 |
-
break;
|
324 |
-
}
|
325 |
-
case "y":{
|
326 |
-
var tempPoint = new point3D(
|
327 |
-
this.x * Math.cos(angleRad) + this.z * Math.sin(angleRad),
|
328 |
-
this.y,
|
329 |
-
-this.x * Math.sin(angleRad) + this.z * Math.cos(angleRad)
|
330 |
-
);
|
331 |
-
this.swap(tempPoint);
|
332 |
-
break;
|
333 |
-
}
|
334 |
-
case "z":{
|
335 |
-
var tempPoint = new point3D(
|
336 |
-
this.x * Math.cos(angleRad) - this.y * Math.sin(angleRad),
|
337 |
-
this.x * Math.sin(angleRad) + this.y * Math.cos(angleRad),
|
338 |
-
this.z
|
339 |
-
);
|
340 |
-
this.swap(tempPoint);
|
341 |
-
break;
|
342 |
-
}
|
343 |
-
}
|
344 |
-
}
|
345 |
-
|
346 |
-
function normal3D(p3D, length){
|
347 |
-
this.point = p3D;
|
348 |
-
this.length = length;
|
349 |
-
}
|
350 |
-
|
351 |
-
function poly(){
|
352 |
-
var points = [];
|
353 |
-
for(var i = 0; i < arguments.length; i++)
|
354 |
-
points.push(arguments[i]);
|
355 |
-
|
356 |
-
this.points = points;
|
357 |
-
|
358 |
-
// Calculating normal
|
359 |
-
var v1 = new point3D(points[2].x - points[1].x, points[2].y - points[1].y, points[2].z - points[1].z);
|
360 |
-
var v2 = new point3D(points[0].x - points[1].x, points[0].y - points[1].y, points[0].z - points[1].z);
|
361 |
-
|
362 |
-
var normalP3D = new point3D(v1.y*v2.z-v2.y*v1.z, v1.z*v2.x-v2.z*v1.x, v1.x*v2.y-v2.x*v1.y);
|
363 |
-
var normalLen = Math.sqrt(normalP3D.x*normalP3D.x + normalP3D.y*normalP3D.y + normalP3D.z*normalP3D.z);
|
364 |
-
|
365 |
-
this.normal = new normal3D(normalP3D, normalLen);
|
366 |
-
}
|
367 |
-
poly.prototype.move = function(p3D){
|
368 |
-
for(var i = 0; i < this.points.length; i++)
|
369 |
-
{
|
370 |
-
var point = this.points[i];
|
371 |
-
point.move(p3D);
|
372 |
-
}
|
373 |
-
}
|
374 |
-
poly.prototype.rotate = function(axis, angle){
|
375 |
-
for(var i = 0; i < this.points.length; i++)
|
376 |
-
{
|
377 |
-
var point = this.points[i];
|
378 |
-
point.rotate(axis, angle);
|
379 |
-
}
|
380 |
-
|
381 |
-
this.normal.point.rotate(axis, angle);
|
382 |
-
}
|
383 |
-
poly.prototype.put = function(center, fillColor, edgeColor){
|
384 |
-
// Calulate visibility
|
385 |
-
var normalAngleRad = Math.acos(this.normal.point.z/this.normal.length);
|
386 |
-
if(normalAngleRad / Math.PI * 180 >= 90)
|
387 |
-
return;
|
388 |
-
|
389 |
-
var lightIntensity = 1 - 2 * (normalAngleRad / Math.PI);
|
390 |
-
|
391 |
-
c.fillStyle = 'rgba('+fillColor.r+','+fillColor.g+','+fillColor.b+','+(fillColor.a*lightIntensity)+')';
|
392 |
-
c.beginPath();
|
393 |
-
for(var i = 0; i < this.points.length; i++)
|
394 |
-
{
|
395 |
-
var point = this.points[i];
|
396 |
-
if(i)
|
397 |
-
c.lineTo(center.x + parseInt(point.x), center.y - parseInt(point.y));
|
398 |
-
else
|
399 |
-
c.moveTo(center.x + parseInt(point.x), center.y - parseInt(point.y));
|
400 |
-
}
|
401 |
-
c.fill();
|
402 |
-
|
403 |
-
c.lineWidth = 1;
|
404 |
-
c.strokeStyle = 'rgba('+edgeColor.r+','+edgeColor.g+','+edgeColor.b+','+(edgeColor.a*lightIntensity)+')';
|
405 |
-
c.beginPath();
|
406 |
-
var point = this.points[this.points.length-1];
|
407 |
-
c.moveTo(center.x + parseInt(point.x), center.y - parseInt(point.y));
|
408 |
-
for(var i = 0; i < this.points.length; i++)
|
409 |
-
{
|
410 |
-
var point = this.points[i];
|
411 |
-
c.lineTo(center.x + parseInt(point.x), center.y - parseInt(point.y));
|
412 |
-
}
|
413 |
-
c.stroke();
|
414 |
-
}
|
415 |
-
|
416 |
-
function Cube(size, fillColor, edgeColor){
|
417 |
-
var p000 = new point3D(0,0,0);
|
418 |
-
var p0S0 = new point3D(0,size,0);
|
419 |
-
var pSS0 = new point3D(size,size,0);
|
420 |
-
var pS00 = new point3D(size,0,0);
|
421 |
-
|
422 |
-
var p00S = new point3D(0,0,size);
|
423 |
-
var p0SS = new point3D(0,size,size);
|
424 |
-
var pSSS = new point3D(size,size,size);
|
425 |
-
var pS0S = new point3D(size,0,size);
|
426 |
-
|
427 |
-
var polys = [];
|
428 |
-
polys.push(new poly(p000,p0S0,pSS0,pS00));
|
429 |
-
polys.push(new poly(pS00,pSS0,pSSS,pS0S));
|
430 |
-
polys.push(new poly(pS0S,pSSS,p0SS,p00S));
|
431 |
-
polys.push(new poly(p00S,p0SS,p0S0,p000));
|
432 |
-
polys.push(new poly(p0S0,p0SS,pSSS,pSS0));
|
433 |
-
polys.push(new poly(p00S,p000,pS00,pS0S));
|
434 |
-
this.polys = polys;
|
435 |
-
|
436 |
-
var points = [];
|
437 |
-
points.push(p000);
|
438 |
-
points.push(p0S0);
|
439 |
-
points.push(pSS0);
|
440 |
-
points.push(pS00);
|
441 |
-
points.push(p00S);
|
442 |
-
points.push(p0SS);
|
443 |
-
points.push(pSSS);
|
444 |
-
points.push(pS0S);
|
445 |
-
for(var i = 0; i < polys.length; i++)
|
446 |
-
{
|
447 |
-
points.push(polys[i].normal.point);
|
448 |
-
}
|
449 |
-
this.points = points;
|
450 |
-
|
451 |
-
this.fillColor = fillColor;
|
452 |
-
this.edgeColor = edgeColor;
|
453 |
-
}
|
454 |
-
|
455 |
-
function move(o3D, p3D){
|
456 |
-
for(var i = 0; i < o3D.points.length - o3D.polys.length; i++)
|
457 |
-
{
|
458 |
-
var point = o3D.points[i];
|
459 |
-
point.move(p3D);
|
460 |
-
}
|
461 |
-
}
|
462 |
-
function put(o3D, center)
|
463 |
-
{
|
464 |
-
for(var i = 0; i < o3D.polys.length; i++)
|
465 |
-
{
|
466 |
-
var poly = o3D.polys[i];
|
467 |
-
poly.put(center, o3D.fillColor, o3D.edgeColor);
|
468 |
-
}
|
469 |
-
}
|
470 |
-
function rotate(o3D, axis, angle){
|
471 |
-
for(var i = 0; i < o3D.points.length; i++)
|
472 |
-
{
|
473 |
-
var point = o3D.points[i];
|
474 |
-
point.rotate(axis, angle);
|
475 |
-
}
|
476 |
-
}
|
477 |
-
|
478 |
-
function pnit(){
|
479 |
-
ze += 1;
|
480 |
-
cube = new Cube(100, new color(38,161,220,1), new color(38,161,220,1));
|
481 |
-
move(cube, new point3D(-javas.width/2,-50,-50));
|
482 |
-
rotate(cube, 'x', 45);
|
483 |
-
rotate(cube, 'y', 45);
|
484 |
-
rotate(cube, 'z', 45);
|
485 |
-
|
486 |
-
centerScreen = new point2D((javas.width / 2)+ze, javas.height / 2);
|
487 |
-
put(cube, centerScreen);
|
488 |
-
|
489 |
-
//timer = setInterval(nextFrame, 1000 / 60);
|
490 |
-
}
|
491 |
-
|
492 |
-
function nextFrame(){
|
493 |
-
ze += 1;
|
494 |
-
|
495 |
-
rotate(cube, 'x', 0.4);
|
496 |
-
rotate(cube, 'y', 0.6);
|
497 |
-
rotate(cube, 'z', 0.3);
|
498 |
-
|
499 |
-
c.fillStyle = 'rgba(50, 50, 200, 1)';
|
500 |
-
c.strokeStyle = 'rgba(60, 60, 210, 1)';
|
501 |
-
put(cube, new point2D((javas.width / 2)+Math.random()*2, javas.height / 2));
|
502 |
-
move(cube, new point3D(0+ze,0,0));
|
503 |
-
}
|
504 |
-
|
505 |
-
function explode(x, y){
|
506 |
-
togle = 1;
|
507 |
-
kit = x;
|
508 |
-
tik = y;
|
509 |
-
ash();
|
510 |
-
};
|
511 |
-
|
512 |
-
function congrat(x, y){
|
513 |
-
togle = 1;
|
514 |
-
muf = x;
|
515 |
-
guf = y;
|
516 |
-
upgra();
|
517 |
-
};
|
518 |
-
|
519 |
-
function drawScore() {
|
520 |
-
c.font = "120px Arial";
|
521 |
-
c.fillStyle = "#0095DD";
|
522 |
-
c.fillText("Score: "+score, 20, 120);
|
523 |
-
c.fill();
|
524 |
-
};
|
525 |
-
function drawHcore() {
|
526 |
-
c.font = "60px Arial";
|
527 |
-
c.fillStyle = "#0095DD";
|
528 |
-
c.fillText("HighScore: "+hscore, javas.width-450, 220);
|
529 |
-
c.fill();
|
530 |
-
};
|
531 |
-
function drawLevel() {
|
532 |
-
c.font = "32px Arial";
|
533 |
-
c.fillStyle = "#0095DD";
|
534 |
-
c.fillText("Level: "+level, 30, 160);
|
535 |
-
c.fill();
|
536 |
-
};
|
537 |
-
function drawFrames() {
|
538 |
-
c.font = "16px Arial";
|
539 |
-
c.fillStyle = "#0095DD";
|
540 |
-
c.fillText("Frame: "+frame, 30, 180);
|
541 |
-
c.fill();
|
542 |
-
};
|
543 |
-
|
544 |
-
function drawMomentos() {
|
545 |
-
c.font = "16px Arial";
|
546 |
-
c.fillStyle = "#0095DD";
|
547 |
-
c.fillText("Elapsed: "+elapsed+"ms", 30, 195);
|
548 |
-
c.fill();
|
549 |
-
};
|
550 |
-
|
551 |
-
function drawFps() {
|
552 |
-
c.font = "16px Arial";
|
553 |
-
c.fillStyle = "#0095DD";
|
554 |
-
c.fillText("fps: "+elapsed/frame, 30, 210);
|
555 |
-
c.fill();
|
556 |
-
};
|
557 |
-
|
558 |
-
function drawOver() {
|
559 |
-
c.font = "170px Arial";
|
560 |
-
c.fillStyle = "#0095DD";
|
561 |
-
c.fillText("GAME OVER", 10, (javas.height/2)-100);
|
562 |
-
c.fill();
|
563 |
-
};
|
564 |
-
|
565 |
-
function newLev() {
|
566 |
-
c.font = "170px Arial";
|
567 |
-
c.fillStyle = "#0095DD";
|
568 |
-
c.fillText("LEVEL: "+level, 40, (javas.height/2)-100);
|
569 |
-
c.fill();
|
570 |
-
};
|
571 |
-
|
572 |
-
function newIntro(){
|
573 |
-
c.fillStyle = 'rgb(38,161,220)';
|
574 |
-
c.fillRect(0,0,javas.width,javas.height);
|
575 |
-
c.fill();
|
576 |
-
c.font = "120px Arial";
|
577 |
-
c.fillStyle = "#FFFFFF";
|
578 |
-
c.fillText("SQUARE HEADS", 20, (javas.height/2)-100);
|
579 |
-
c.fill();
|
580 |
-
c.font = "150px Arial";
|
581 |
-
c.fillStyle = "#FFFFFF";
|
582 |
-
c.fillText("Loading..."+Math.floor((frame/100)*100)+"%", 20, (javas.height/2)+100);
|
583 |
-
c.fill();
|
584 |
-
};
|
585 |
-
|
586 |
-
function drawGoodies(x, y, hoot) {
|
587 |
-
c.font = "130px Arial";
|
588 |
-
c.fillStyle = "#0095DD";
|
589 |
-
c.fillText("+"+hoot+"points", x-100, y-100);
|
590 |
-
c.fill();
|
591 |
-
};
|
592 |
-
|
593 |
-
function drawNoogies(x, y, boot) {
|
594 |
-
c.font = "150px Arial";
|
595 |
-
c.fillStyle = 'red';
|
596 |
-
c.fillText("-"+boot+"points", x-100, y-100);
|
597 |
-
c.fill();
|
598 |
-
};
|
599 |
-
|
600 |
-
function ters(x, y, vx, vy){
|
601 |
-
this.x = x;
|
602 |
-
this.y = y;
|
603 |
-
this.vx = vx*((0-1)*(Math.random()*3));
|
604 |
-
this.vy = vy*((0-1)*(Math.random()*2));
|
605 |
-
this.live = 0;
|
606 |
-
this.die = 6+(Math.random()*10);
|
607 |
-
};
|
608 |
-
ters.prototype.draw = function() {
|
609 |
-
this.x += this.vx;
|
610 |
-
this.y += this.vy;
|
611 |
-
this.live += 1;
|
612 |
-
if(kills < 10){
|
613 |
-
c.fillStyle = 'rgba(38,161,220,'+(1/(this.live/this.die))+')';
|
614 |
-
}
|
615 |
-
if(kills > 10){
|
616 |
-
c.fillStyle = 'orange';
|
617 |
-
}
|
618 |
-
if(kills > 50){
|
619 |
-
c.fillStyle = 'red';
|
620 |
-
}
|
621 |
-
if(kills > 100){
|
622 |
-
c.fillStyle = 'pink';
|
623 |
-
}
|
624 |
-
if(kills > 200){
|
625 |
-
c.fillStyle = 'green';
|
626 |
-
}
|
627 |
-
if(kills > 300){
|
628 |
-
c.fillStyle = 'hsl('+Math.floor(Math.random()*360)+',100%,'+Math.floor(Math.random()*100)+'%)';
|
629 |
-
}
|
630 |
-
c.fillRect(this.x,this.y, Math.floor(Math.random()*10),Math.floor(Math.random()*10));
|
631 |
-
|
632 |
-
};
|
633 |
-
ters.prototype.update = function(){
|
634 |
-
this.draw();
|
635 |
-
};
|
636 |
-
|
637 |
-
function vixul(x, y){
|
638 |
-
this.x = x;
|
639 |
-
this.y = y;
|
640 |
-
this.vx = Math.random();
|
641 |
-
this.vy = Math.random()*4;
|
642 |
-
this.live = 0;
|
643 |
-
this.die = 30+(Math.random()*10);
|
644 |
-
};
|
645 |
-
vixul.prototype.draw = function() {
|
646 |
-
this.x -= this.vx;
|
647 |
-
this.y += this.vy;
|
648 |
-
this.live += 1;
|
649 |
-
if(kills < 10){
|
650 |
-
c.fillStyle = 'rgba(38,161,220,'+(1/(this.live/this.die))+')';
|
651 |
-
}
|
652 |
-
if(kills >= 10){
|
653 |
-
c.fillStyle = 'orange';
|
654 |
-
}
|
655 |
-
if(kills >= 50){
|
656 |
-
c.fillStyle = 'red';
|
657 |
-
}
|
658 |
-
if(kills >= 100){
|
659 |
-
c.fillStyle = 'pink';
|
660 |
-
}
|
661 |
-
if(kills >= 200){
|
662 |
-
c.fillStyle = 'green';
|
663 |
-
}
|
664 |
-
if(kills >= 300){
|
665 |
-
c.fillStyle = 'hsl('+Math.floor(Math.random()*360)+',100%,'+Math.floor(Math.random()*100)+'%)';
|
666 |
-
}
|
667 |
-
c.fillRect(this.x,this.y, Math.floor(Math.random()*12),Math.floor(Math.random()*12));
|
668 |
-
|
669 |
-
};
|
670 |
-
vixul.prototype.update = function(){
|
671 |
-
this.draw();
|
672 |
-
};
|
673 |
-
|
674 |
-
function ash() {
|
675 |
-
for(var dr = 0; dr < 60; dr++){
|
676 |
-
farts.push(new vixul((kit+(Math.random()*100)), (tik+(Math.random()*100))));
|
677 |
-
};
|
678 |
-
};
|
679 |
-
|
680 |
-
function upgra() {
|
681 |
-
for(var pr = 0; pr < 1000; pr++){
|
682 |
-
farts.push(new vixul((muf+(Math.random()*javas.width)), (guf+(Math.random()*javas.height))));
|
683 |
-
};
|
684 |
-
};
|
685 |
-
|
686 |
-
function square(){
|
687 |
-
var mpo = 0;
|
688 |
-
traker += 1;
|
689 |
-
mpo = traker+0;
|
690 |
-
//var emos = ['\+','\#','\@','\%','\&','\?','$','\*','\~','\-','\π','\∆','\√','\°','\÷','\×'];
|
691 |
-
//var emos = ['word','crazy','beast','warlock'];
|
692 |
-
var emos = ['🦖','🌑','🦎','🐙','🐙','🎈','���','👾','🐊','🐍','🦇','🐌','🕷️','🐡'];
|
693 |
-
var moas = Math.floor(Math.random()*100);
|
694 |
-
this.x = Math.floor(Math.random()*window.innerWidth);
|
695 |
-
this.y = 1;
|
696 |
-
if(moas <= 25){
|
697 |
-
this.x = 1;
|
698 |
-
this.y = Math.floor(Math.random() * javas.height);
|
699 |
-
this.vx = ((Math.random()*20)*level)+3;
|
700 |
-
this.vy = 0;
|
701 |
-
}
|
702 |
-
if(moas >= 26 && moas <= 50){
|
703 |
-
this.x = Math.floor(Math.random() * javas.width);
|
704 |
-
this.y = 1;
|
705 |
-
this.vx = 0;
|
706 |
-
this.vy = (Math.random()*20)*level+3;
|
707 |
-
}
|
708 |
-
if(moas >= 51 && moas <= 75){
|
709 |
-
this.x = javas.width-1;
|
710 |
-
this.y = Math.floor(Math.random()*javas.height);
|
711 |
-
this.vx = 0-1*Math.random()*20*level+3;
|
712 |
-
this.vy = 0;
|
713 |
-
}
|
714 |
-
if(moas >= 76 && moas <= 100){
|
715 |
-
this.x = Math.floor(Math.random()*javas.width);
|
716 |
-
this.y = javas.height-1;
|
717 |
-
this.vx = 0;
|
718 |
-
this.vy = 0-1*Math.random()*20*level+3;
|
719 |
-
}
|
720 |
-
this.id = mpo;
|
721 |
-
this.height = Math.floor((50+(Math.random()*200))/level);
|
722 |
-
this.live = 0;
|
723 |
-
this.die = (300+(Math.random()*100))-(score/100);
|
724 |
-
this.golf = 1;
|
725 |
-
this.eater = 0;
|
726 |
-
this.char = emos[Math.floor(Math.random() * emos.length)];
|
727 |
-
};
|
728 |
-
square.prototype.draw = function() {
|
729 |
-
this.x += this.vx;
|
730 |
-
this.y += this.vy;
|
731 |
-
if(kills < 10){
|
732 |
-
c.fillStyle = 'rgb(38,161,220)';
|
733 |
-
}
|
734 |
-
if(kills >= 10){
|
735 |
-
c.fillStyle = 'orange';
|
736 |
-
}
|
737 |
-
if(kills >= 50){
|
738 |
-
c.fillStyle = 'red';
|
739 |
-
}
|
740 |
-
if(kills >= 100){
|
741 |
-
c.fillStyle = 'pink';
|
742 |
-
}
|
743 |
-
if(kills >= 200){
|
744 |
-
c.fillStyle = 'green';
|
745 |
-
}
|
746 |
-
if(kills >= 300){
|
747 |
-
c.fillStyle = 'hsl('+Math.floor(Math.random()*360)+',100%,'+Math.floor(Math.random()*100)+'%)';
|
748 |
-
}
|
749 |
-
|
750 |
-
if(this.live >= this.die/4){
|
751 |
-
c.fillStyle = 'hsl(360,0%,50%)';
|
752 |
-
this.golf = 0;
|
753 |
-
this.eater += 1;
|
754 |
-
}
|
755 |
-
|
756 |
-
c.font = ""+this.height+"px Arial";
|
757 |
-
c.fillText(""+this.char+"", this.x, this.y);
|
758 |
-
//c.fillRect(this.x,this.y,this.height,this.height);
|
759 |
-
};
|
760 |
-
square.prototype.update = function(){
|
761 |
-
this.draw();
|
762 |
-
};
|
763 |
-
|
764 |
-
if(traker < 3){
|
765 |
-
squareArray.push(new square());
|
766 |
-
}
|
767 |
-
|
768 |
-
for(var de in squareArray){
|
769 |
-
for(var ml = 0; ml < 10; ml++){
|
770 |
-
emi.push(new ters(squareArray[de].x, squareArray[de].y, squareArray[de].vx, squareArray[de].vy));
|
771 |
-
};
|
772 |
-
};
|
773 |
-
|
774 |
-
noob = setInterval(function(){
|
775 |
-
draw();
|
776 |
-
|
777 |
-
}, 32/1000);
|
778 |
-
|
779 |
-
(function init() {
|
780 |
-
|
781 |
-
c.clearRect(0, 0, javas.width, javas.height);
|
782 |
-
ze += 1;
|
783 |
-
|
784 |
-
cube = new Cube((Math.random()*100)+50, new color(38,161,220,0.8), new color(38,161,220,0.8));
|
785 |
-
move(cube, new point3D(-javas.width/2,-50,-50));
|
786 |
-
rotate(cube, 'x', 45);
|
787 |
-
rotate(cube, 'y', 45);
|
788 |
-
rotate(cube, 'z', 45);
|
789 |
-
centerScreen = new point2D(-javas.width / 2, javas.height * Math.random());
|
790 |
-
put(cube, centerScreen);
|
791 |
-
|
792 |
-
cabe = new Cube((Math.random()*100)+50, new color(38,161,220,0.8), new color(38,161,220,0.8));
|
793 |
-
move(cabe, new point3D(-javas.width/2,-50,-50));
|
794 |
-
rotate(cabe, 'x', 45);
|
795 |
-
rotate(cabe, 'y', 45);
|
796 |
-
rotate(cabe, 'z', 45);
|
797 |
-
centerScreen = new point2D(-javas.width / 2, -(javas.height/2) + (Math.random()*javas.height));
|
798 |
-
put(cabe, centerScreen);
|
799 |
-
|
800 |
-
cebe = new Cube((Math.random()*100)+50, new color(38,161,220,0.8), new color(38,161,220,0.8));
|
801 |
-
move(cebe, new point3D(+javas.width/2,-50,-50));
|
802 |
-
rotate(cebe, 'x', 45);
|
803 |
-
rotate(cebe, 'y', 45);
|
804 |
-
rotate(cebe, 'z', 45);
|
805 |
-
centerScreen = new point2D(+javas.width / 2, -javas.height/2);
|
806 |
-
put(cebe, centerScreen);
|
807 |
-
|
808 |
-
//recordCanvas(javas, 30000);
|
809 |
-
|
810 |
-
requestAnimationFrame(noob);
|
811 |
-
|
812 |
-
})();
|
813 |
-
|
814 |
-
function draw(){
|
815 |
-
|
816 |
-
frame += 1;
|
817 |
-
elapsed=Date.now()-startTime;
|
818 |
-
elapsedCycle=elapsed%cycleTime;
|
819 |
-
elapsedCyclePercent=elapsedCycle/cycleTime;
|
820 |
-
moment += elapsed;
|
821 |
-
|
822 |
-
if(score > localStorage.SqrScore){
|
823 |
-
localStorage.SqrScore = score;
|
824 |
-
hscore = score;
|
825 |
-
}
|
826 |
-
|
827 |
-
c.clearRect(0, 0, javas.width, javas.height);
|
828 |
-
|
829 |
-
if(trip == 1){
|
830 |
-
drawOver();
|
831 |
-
}
|
832 |
-
|
833 |
-
if(traker < 3 && intro == 0){
|
834 |
-
squareArray.push(new square());
|
835 |
-
}
|
836 |
-
|
837 |
-
for (var uy in squareArray) {
|
838 |
-
squareArray[uy].live += 1;
|
839 |
-
squareArray[uy].height += Math.random();
|
840 |
-
if(squareArray[uy].y >= javas.height){
|
841 |
-
squareArray[uy].y = 1;
|
842 |
-
}
|
843 |
-
if(squareArray[uy].y < 1){
|
844 |
-
squareArray[uy].y = javas.height-1;
|
845 |
-
}
|
846 |
-
if(squareArray[uy].x < 1){
|
847 |
-
squareArray[uy].x = javas.width-1;
|
848 |
-
}
|
849 |
-
if(squareArray[uy].x >= javas.width){
|
850 |
-
squareArray[uy].x = 1;
|
851 |
-
}
|
852 |
-
|
853 |
-
for(var ml = 0; ml < 3; ml++){
|
854 |
-
emi.push(new ters((squareArray[uy].x+(squareArray[uy].height/2)), (squareArray[uy].y+(squareArray[uy].height/2)), squareArray[uy].vx, squareArray[uy].vy));
|
855 |
-
emi.push(new ters(squareArray[uy].x, squareArray[uy].y, squareArray[uy].vx, squareArray[uy].vy));
|
856 |
-
emi.push(new ters((squareArray[uy].x+(squareArray[uy].height)), (squareArray[uy].y+(squareArray[uy].height)), squareArray[uy].vx, squareArray[uy].vy));
|
857 |
-
};
|
858 |
-
|
859 |
-
if(marq == 1 && frame <= barq && squareArray[uy].golf == 1 && vit > 1){
|
860 |
-
drawGoodies(bigX, bigY, vit);
|
861 |
-
}
|
862 |
-
|
863 |
-
if(marq == 1 && frame <= darq && squareArray[uy].golf == 0 && vit == 0){
|
864 |
-
drawNoogies(bigX, bigY, ppp);
|
865 |
-
}
|
866 |
-
|
867 |
-
if(squareArray[uy].live >= squareArray[uy].die){
|
868 |
-
delete squareArray[uy];
|
869 |
-
trip = 1;
|
870 |
-
tgt = 1;
|
871 |
-
traker -= 1;
|
872 |
-
drawOver();
|
873 |
-
intro = 1;
|
874 |
-
|
875 |
-
} else{
|
876 |
-
squareArray[uy].draw();
|
877 |
-
};
|
878 |
-
};
|
879 |
-
|
880 |
-
if(frame > 100){
|
881 |
-
ze += 1;
|
882 |
-
rotate(cube, 'x', -0.4*3);
|
883 |
-
rotate(cube, 'y', -0.6*3);
|
884 |
-
rotate(cube, 'z', -0.3*3);
|
885 |
-
put(cube, new point2D(0, javas.height/2));
|
886 |
-
move(cube, new point3D(0+ze/50,0,0));
|
887 |
-
|
888 |
-
rotate(cabe, 'x', -0.4);
|
889 |
-
rotate(cabe, 'y', -0.6);
|
890 |
-
rotate(cabe, 'z', -0.3);
|
891 |
-
put(cabe, new point2D((javas.width/2)-50, javas.height));
|
892 |
-
move(cabe, new point3D(0,0+ze/10,0));
|
893 |
-
|
894 |
-
rotate(cebe, 'x', 0.4);
|
895 |
-
rotate(cebe, 'y', 0.6);
|
896 |
-
rotate(cebe, 'z', 0.3);
|
897 |
-
put(cebe, new point2D(javas.width, javas.height/2));
|
898 |
-
move(cebe, new point3D(0-ze/50,0,0));
|
899 |
-
|
900 |
-
}
|
901 |
-
|
902 |
-
if(cabe.y > 0){
|
903 |
-
put(cabe, new point2D((javas.width/2)-50, javas.height));
|
904 |
-
move(cabe, new point3D(0,1,0));
|
905 |
-
}
|
906 |
-
|
907 |
-
for(var zx in farts){
|
908 |
-
if(farts[zx].live >= farts[zx].die){
|
909 |
-
delete farts[zx];
|
910 |
-
} else {
|
911 |
-
farts[zx].draw();
|
912 |
-
};
|
913 |
-
};
|
914 |
-
|
915 |
-
for(var ix in emi){
|
916 |
-
if(emi[ix].live >= emi[ix].die){
|
917 |
-
delete emi[ix];
|
918 |
-
} else {
|
919 |
-
emi[ix].draw();
|
920 |
-
};
|
921 |
-
};
|
922 |
-
|
923 |
-
var beaut = c.createRadialGradient(mouse.x, mouse.y, 200, mouse.x, mouse.y, 700);
|
924 |
-
beaut.addColorStop(0, "hsla(111,100%,40%,0.1)");
|
925 |
-
beaut.addColorStop(1, "hsla(111,100%,0%,1.0)");
|
926 |
-
c.fillStyle = beaut;
|
927 |
-
//c.fillStyle = '#000';
|
928 |
-
c.beginPath();
|
929 |
-
c.fillRect(0,0,javas.width,javas.height);
|
930 |
-
c.closePath();
|
931 |
-
c.fill();
|
932 |
-
bobd();
|
933 |
-
|
934 |
-
|
935 |
-
drawFrames();
|
936 |
-
drawLevel();
|
937 |
-
drawScore();
|
938 |
-
drawMomentos();
|
939 |
-
drawFps();
|
940 |
-
drawHcore();
|
941 |
-
|
942 |
-
if(tgt == 1 && frame > 1 && trip == 1){
|
943 |
-
(function (){
|
944 |
-
var oudioCtx = new(window.AudioContext || window.webkitAudioContext)();
|
945 |
-
|
946 |
-
function playNote(frequency, duration) {
|
947 |
-
// create Oscillator node
|
948 |
-
var osxillator = oudioCtx.createOscillator();
|
949 |
-
let goin = oudioCtx.createGain();
|
950 |
-
goin.gain.value = 0.3;
|
951 |
-
osxillator.type = 'sine';
|
952 |
-
osxillator.frequency.value = frequency; // value in hertz
|
953 |
-
//osxillator.connect(oudioCtx.destination);
|
954 |
-
osxillator.connect(goin);
|
955 |
-
goin.connect(oudioCtx.destination);
|
956 |
-
osxillator.start();
|
957 |
-
|
958 |
-
setTimeout(
|
959 |
-
function() {
|
960 |
-
osxillator.stop();
|
961 |
-
playMelody();
|
962 |
-
}, duration);
|
963 |
-
}
|
964 |
-
|
965 |
-
function playMelody() {
|
966 |
-
if (notes.length > 0) {
|
967 |
-
note = notes.pop();
|
968 |
-
playNote(note[0], 1000 * 256 / (note[1] * tempo));
|
969 |
-
}
|
970 |
-
}
|
971 |
-
|
972 |
-
notes = [
|
973 |
-
[1280, 32],
|
974 |
-
[1024, 32],
|
975 |
-
[896, 32],
|
976 |
-
[768, 32],
|
977 |
-
[512, 32],
|
978 |
-
[384, 32]
|
979 |
-
];
|
980 |
-
|
981 |
-
notes.reverse();
|
982 |
-
tempo = 100;
|
983 |
-
playMelody();
|
984 |
-
})();
|
985 |
-
tgt = 0;
|
986 |
-
}
|
987 |
-
|
988 |
-
if(intro == 1 && frame < 100){
|
989 |
-
c.clearRect(0, 0, javas.width, javas.height);
|
990 |
-
|
991 |
-
newIntro();
|
992 |
-
} else {
|
993 |
-
intro = 0; };
|
994 |
-
|
995 |
-
if(frame == 60){
|
996 |
-
(function (){
|
997 |
-
var uudioCtx = new(window.AudioContext || window.webkitAudioContext)();
|
998 |
-
|
999 |
-
function playNote(frequency, duration) {
|
1000 |
-
// create Oscillator node
|
1001 |
-
var osvillator = uudioCtx.createOscillator();
|
1002 |
-
let guin = uudioCtx.createGain();
|
1003 |
-
guin.gain.value = 0.3;
|
1004 |
-
osvillator.type = 'sine';
|
1005 |
-
osvillator.frequency.value = frequency; // value in hertz
|
1006 |
-
//osvillator.connect(uudioCtx.destination);
|
1007 |
-
osvillator.connect(guin);
|
1008 |
-
guin.connect(uudioCtx.destination);
|
1009 |
-
osvillator.start();
|
1010 |
-
|
1011 |
-
setTimeout(
|
1012 |
-
function() {
|
1013 |
-
osvillator.stop();
|
1014 |
-
playMelody();
|
1015 |
-
}, duration);
|
1016 |
-
}
|
1017 |
-
|
1018 |
-
function playMelody() {
|
1019 |
-
if (notes.length > 0) {
|
1020 |
-
note = notes.pop();
|
1021 |
-
playNote(note[0], 1000 * 256 / (note[1] * tempo));
|
1022 |
-
}
|
1023 |
-
}
|
1024 |
-
|
1025 |
-
notes = [
|
1026 |
-
[2048, 32],
|
1027 |
-
[1024, 32],
|
1028 |
-
[896, 32],
|
1029 |
-
[768, 32],
|
1030 |
-
[896, 32],
|
1031 |
-
[1024, 32],
|
1032 |
-
[1280, 32],
|
1033 |
-
[1024, 32],
|
1034 |
-
[768, 32],
|
1035 |
-
[512, 32],
|
1036 |
-
[256, 32],
|
1037 |
-
[128, 32]
|
1038 |
-
];
|
1039 |
-
|
1040 |
-
//notes.reverse();
|
1041 |
-
tempo = 100;
|
1042 |
-
playMelody();
|
1043 |
-
})();
|
1044 |
-
}
|
1045 |
-
|
1046 |
-
//requestAnimationFrame(draw);
|
1047 |
-
};
|
1048 |
-
|
1049 |
-
function bobd(){
|
1050 |
-
|
1051 |
-
c.fillStyle = '#FFF';
|
1052 |
-
c.font = "16px Arial";
|
1053 |
-
c.fillText("This is Title Graph",javas.width/4,18);
|
1054 |
-
c.fill();
|
1055 |
-
|
1056 |
-
c.save();
|
1057 |
-
c.translate(18,javas.height*3/4);
|
1058 |
-
c.rotate(-6.35/4);
|
1059 |
-
c.fillStyle = '#FFF';
|
1060 |
-
c.font = "16px Arial";
|
1061 |
-
c.fillText("this is Title Y",0,0);
|
1062 |
-
c.fill();
|
1063 |
-
c.restore();
|
1064 |
-
|
1065 |
-
c.fillStyle = '#000';
|
1066 |
-
c.beginPath();
|
1067 |
-
c.fillRect(mouse.x-300,mouse.y,600,1);
|
1068 |
-
c.closePath();
|
1069 |
-
c.fill();
|
1070 |
-
|
1071 |
-
c.fillStyle = '#000';
|
1072 |
-
c.beginPath();
|
1073 |
-
c.fillRect(mouse.x,mouse.y-300,1,100);
|
1074 |
-
c.closePath();
|
1075 |
-
c.fill();
|
1076 |
-
|
1077 |
-
for(var qw = 0; qw < 30; qw++){
|
1078 |
-
c.fillStyle = '#000';
|
1079 |
-
c.beginPath();
|
1080 |
-
c.fillRect(mouse.x+(qw*10),((mouse.y)-5)-qw,1,10+qw+qw);
|
1081 |
-
c.closePath();
|
1082 |
-
c.fill();
|
1083 |
-
};
|
1084 |
-
|
1085 |
-
for(var ww = 0; ww < 30; ww++){
|
1086 |
-
c.fillStyle = '#000';
|
1087 |
-
c.beginPath();
|
1088 |
-
c.fillRect(mouse.x-(ww*10),((mouse.y)-5)-ww,1,10+ww+ww);
|
1089 |
-
c.closePath();
|
1090 |
-
c.fill();
|
1091 |
-
};
|
1092 |
-
|
1093 |
-
for(var ow = 0; ow < 30; ow++){
|
1094 |
-
c.fillStyle = '#000';
|
1095 |
-
c.beginPath();
|
1096 |
-
c.fillRect(((mouse.x)-5)-(ow),mouse.y+(ow*10),10+ow+ow,1);
|
1097 |
-
c.closePath();
|
1098 |
-
c.fill();
|
1099 |
-
};
|
1100 |
-
|
1101 |
-
for(var lw = 0; lw < 30; lw++){
|
1102 |
-
c.fillStyle = '#000';
|
1103 |
-
c.beginPath();
|
1104 |
-
c.fillRect(((mouse.x)-5)-(lw),mouse.y-(lw*10),10+lw+lw,1);
|
1105 |
-
c.closePath();
|
1106 |
-
c.fill();
|
1107 |
-
};
|
1108 |
-
|
1109 |
-
c.fillStyle = '#FFF';
|
1110 |
-
c.font = "16px Arial";
|
1111 |
-
c.fillText("This is Title X",javas.width/4,javas.height-2);
|
1112 |
-
c.fill();
|
1113 |
-
};
|
1114 |
-
|
1115 |
-
function recordCanvas(canvas, videoLength) {
|
1116 |
-
const recordedChunks = [];
|
1117 |
-
const mediaRecorder = new MediaRecorder(
|
1118 |
-
canvas.captureStream(32), {mimeType: 'video/webm; codecs=vp8'});
|
1119 |
-
mediaRecorder.ondataavailable = event => recordedChunks.push(event.data);
|
1120 |
-
mediaRecorder.onstop = () => {
|
1121 |
-
const url = URL.createObjectURL(
|
1122 |
-
new Blob(recordedChunks, {type: "video/webm"}));
|
1123 |
-
const anchor = document.createElement("a");
|
1124 |
-
anchor.href = url;
|
1125 |
-
anchor.download = "video.webm";
|
1126 |
-
anchor.click();
|
1127 |
-
window.URL.revokeObjectURL(url);
|
1128 |
-
}
|
1129 |
-
mediaRecorder.start();
|
1130 |
-
window.setTimeout(() => {mediaRecorder.stop();}, 30000);
|
1131 |
-
};
|
1132 |
-
|
1133 |
-
</script>
|
1134 |
-
</body>
|
1135 |
-
</html>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|