index.js

var __extends = this && this.__extends || function () { var e = function (t, r) { return (e = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (e, t) { e.__proto__ = t } || function (e, t) { for (var r in t) Object.prototype.hasOwnProperty.call(t, r) && (e[r] = t[r]) })(t, r) }; return function (t, r) { if ("function" != typeof r && null !== r) throw new TypeError("Class extends value " + String(r) + " is not a constructor or null"); function a() { this.constructor = t } e(t, r), t.prototype = null === r ? Object.create(r) : (a.prototype = r.prototype, new a) } }(); !function (e) { var t = [[[0, 1, 0, 0], [0, 1, 0, 0], [0, 1, 0, 0], [0, 1, 0, 0]], [[0, 0, 0, 0], [1, 1, 1, 1], [0, 0, 0, 0], [0, 0, 0, 0]], [[0, 0, 1, 0], [0, 0, 1, 0], [0, 0, 1, 0], [0, 0, 1, 0]], [[0, 0, 0, 0], [0, 0, 0, 0], [1, 1, 1, 1], [0, 0, 0, 0]]], r = [[[0, 2, 0], [0, 2, 0], [0, 2, 2]], [[0, 0, 0], [2, 2, 2], [2, 0, 0]], [[2, 2, 0], [0, 2, 0], [0, 2, 0]], [[0, 0, 2], [2, 2, 2], [0, 0, 0]]], a = [[[0, 3, 0], [0, 3, 0], [3, 3, 0]], [[3, 0, 0], [3, 3, 3], [0, 0, 0]], [[0, 3, 3], [0, 3, 0], [0, 3, 0]], [[0, 0, 0], [3, 3, 3], [0, 0, 3]]], i = [[[0, 0, 0], [4, 4, 4], [0, 4, 0]], [[0, 4, 0], [4, 4, 0], [0, 4, 0]], [[0, 4, 0], [4, 4, 4], [0, 0, 0]], [[0, 4, 0], [0, 4, 4], [0, 4, 0]]], o = [[[0, 0, 0], [0, 5, 5], [5, 5, 0]], [[5, 0, 0], [5, 5, 0], [0, 5, 0]], [[0, 5, 5], [5, 5, 0], [0, 0, 0]], [[0, 5, 0], [0, 5, 5], [0, 0, 5]]], h = [[[0, 0, 0], [6, 6, 0], [0, 6, 6]], [[0, 6, 0], [6, 6, 0], [6, 0, 0]], [[6, 6, 0], [0, 6, 6], [0, 0, 0]], [[0, 0, 6], [0, 6, 6], [0, 6, 0]]], n = [[[7, 7], [7, 7]]], s = new (function (e) { function s(t) { var r = e.call(this, t) || this; return r.matrix = [], r.playerShapes = [], r.playerShape = [], r.playerShapeIndex = 0, r.playerScore = 0, r.playerTop = 0, r.playerLeft = 0, r.playerColors = ["black", "red", "orange", "yellow", "green", "cyan", "blue", "purple"], r.canvas && (r.width = r.canvas.width = 10, r.height = r.canvas.height = 20, r.start()), r } return __extends(s, e), s.prototype.createMatrix = function () { this.matrix = []; for (var e = 0; e < this.height; e++) { this.matrix.push([]); for (var t = 0; t < this.width; t++)this.matrix[e].push(0) } }, s.prototype.drawMatrix = function () { for (var e = 0; e < this.height; e++)for (var t = 0; t < this.width; t++) { var r = this.matrix[e][t]; this.core.fillStyle = this.playerColors[r], this.core.fillRect(t, e, 1, 1) } }, s.prototype.createPlayerShapes = function () { var e = [t, r, a, i, o, h, n]; this.playerShapes = e[Math.floor(Math.random() * e.length)], this.createPlayerShape() }, s.prototype.createPlayerShape = function () { this.playerShapeIndex = Math.floor(Math.random() * this.playerShapes.length), this.playerShape = this.playerShapes[this.playerShapeIndex], this.playerLeft = Math.floor((this.width - this.playerShape[0].length) / 2), this.playerTop = 0, this.writePlayerShape() }, s.prototype.writePlayerShape = function () { for (var e = 0; e < this.playerShape.length; e++)for (var t = this.playerShape[e], r = 0; r < t.length; r++) { var a = t[r]; a > 0 && (this.matrix[e + this.playerTop][r + this.playerLeft] = a) } this.drawMatrix() }, s.prototype.clearPlayerShape = function () { for (var e = 0; e < this.playerShape.length; e++)for (var t = this.playerShape[e], r = 0; r < t.length; r++) { t[r] > 0 && (this.matrix[e + this.playerTop][r + this.playerLeft] = 0) } }, s.prototype.checkOffsetPlayerShape = function (e, t, r) { for (var a = 0; a < e.length; a++)for (var i = e[a], o = 0; o < i.length; o++) { if (i[o] > 0 && (void 0 === this.matrix[a + r] || 0 !== this.matrix[a + r][o + t])) return !1 } return !0 }, s.prototype.offsetPlayerShape = function (e) { for (var t = -1, r = 0, a = 0, i = 0; i < e.length; i++)e[i].every(function (e) { return 0 === e }) ? t > -1 ? a += 1 : r += 1 : t = i; this.checkOffsetPlayerShape(e, this.playerLeft - a, this.playerTop) && (this.playerLeft -= a, this.transformPlayerShape()), this.checkOffsetPlayerShape(e, this.playerLeft + r, this.playerTop) && (this.playerLeft += r, this.transformPlayerShape()) }, s.prototype.checkTranformPlayerShape = function (e) { for (var t = 0; t < e.length; t++)for (var r = e[t], a = 0; a < r.length; a++) { if (r[a] > 0 && (void 0 === this.matrix[t + this.playerTop] || 0 !== this.matrix[t + this.playerTop][a + this.playerLeft])) return !1 } return !0 }, s.prototype.transformPlayerShape = function () { this.clearPlayerShape(); var e = this.playerShapeIndex + 1 === this.playerShapes.length ? 0 : this.playerShapeIndex + 1, t = this.playerShapes[e]; this.checkTranformPlayerShape(t) ? (this.playerShape = t, this.playerShapeIndex = e, this.writePlayerShape()) : this.offsetPlayerShape(t) }, s.prototype.checkMovePlayerShape = function (e, t) { for (var r = this.playerLeft + e, a = this.playerTop + t, i = 0; i < this.playerShape.length; i++)for (var o = this.playerShape[i], h = 0; h < o.length; h++) { if (o[h] > 0 && (void 0 === this.matrix[i + a] || 0 !== this.matrix[i + a][h + r])) return !1 } return !0 }, s.prototype.movePlayerShape = function (e, t) { if (this.clearPlayerShape(), this.checkMovePlayerShape(e, t)) this.playerLeft += e, this.playerTop += t, this.writePlayerShape(); else if (t > 0) if (this.writePlayerShape(), this.matrix[0].some(function (e) { return e > 0 })) this.reset(); else { for (var r = 0; r < this.matrix.length; r++)if (this.matrix[r].every(function (e) { return e > 0 })) { this.playerScore += 1; var a = document.querySelector("h1"); a && (a.innerText = "".concat(this.playerScore)), this.matrix.splice(r, 1), this.matrix.unshift(new Array(this.width).fill(0)) } this.createPlayerShapes() } }, s.prototype.start = function () { this.createMatrix(), this.createPlayerShapes() }, s.prototype.reset = function () { this.playerScore = 0; var e = document.querySelector("h1"); e && (e.innerText = "".concat(this.playerScore)), this.start() }, s }(function () { return function (t) { this.device = "", this.canvas = null, this.core = null, this.width = 0, this.height = 0; var r = document.querySelector(t); r && r.constructor === HTMLCanvasElement ? (this.width = r.width = document.body.offsetWidth, this.height = r.height = document.body.offsetHeight, this.canvas = r, this.core = r.getContext("2d"), this.device = /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(navigator.userAgent || navigator.vendor || e.opera) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent || navigator.vendor || e.opera) ? "mobile" : "pc") : console.error(new Error("".concat(t, " is not a canvas element"))) } }()))("canvas"), p = 30, l = 0; function c() { (l += 1) > p && (l = 0, s.movePlayerShape(0, 1)), requestAnimationFrame(c) } var y = { x: 0, y: 0 }, f = { x: 0, y: 0 }; e.addEventListener("load", function () { s.canvas && c(), "pc" === s.device ? e.addEventListener("keydown", function (e) { switch (e.key) { case "ArrowUp": s.transformPlayerShape(); break; case "ArrowDown": s.movePlayerShape(0, 1); break; case "ArrowLeft": s.movePlayerShape(-1, 0); break; case "ArrowRight": s.movePlayerShape(1, 0) } }) : "mobile" === s.device && (e.addEventListener("touchstart", function (e) { y.x = e.touches[0].clientX, y.y = e.touches[0].clientY }), e.addEventListener("touchmove", function (e) { f.x = e.touches[0].clientX, f.y = e.touches[0].clientY }), e.addEventListener("touchend", function () { var e = Math.abs(f.x - y.x), t = Math.abs(f.y - y.y); e > t ? f.x > y.x ? s.movePlayerShape(1, 0) : f.x < y.x && s.movePlayerShape(-1, 0) : t > e && (f.y > y.y ? s.movePlayerShape(0, 1) : f.y < y.y && s.transformPlayerShape()) })) }) }(globalThis);