From ef8f7003ec4ea0a4c947b4976a90413e8b96af40 Mon Sep 17 00:00:00 2001 From: ybs1164 Date: Sun, 28 Jun 2020 14:05:41 +0900 Subject: [PATCH] Add scoreboard --- dist/js/core.js | 6 +++--- lib/util.go | 11 ++++++---- main.go | 2 +- src/js/data/object.js | 4 ++-- src/js/data/ui/ui.js | 18 ++++++++++++---- src/js/system.js | 49 ++++++++++++++++++++++++++++++++++++++----- 6 files changed, 71 insertions(+), 19 deletions(-) diff --git a/dist/js/core.js b/dist/js/core.js index 199ab58e..1ace2492 100644 --- a/dist/js/core.js +++ b/dist/js/core.js @@ -3620,7 +3620,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) * /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Obj\", function() { return Obj; });\n/* harmony import */ var _lib_util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../lib/util */ \"./src/js/lib/util.js\");\n/* harmony import */ var _console__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./console */ \"./src/js/data/console.js\");\n/* harmony import */ var _lib_draw__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../lib/draw */ \"./src/js/lib/draw.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n\n\n\n\nfunction deepClone(obj) {\n if (obj === null || _typeof(obj) !== 'object') {\n return obj;\n }\n\n var result = Array.isArray(obj) ? [] : {};\n\n for (var _i = 0, _Object$keys = Object.keys(obj); _i < _Object$keys.length; _i++) {\n var key = _Object$keys[_i];\n result[key] = deepClone(obj[key]);\n }\n\n return result;\n}\n\nvar Obj = function Obj(id) {\n 'use strict';\n /*\r\n 이 객체는 무조건 system 의 objectList 에 포함되어 있습니다.\r\n 게임 내에서 충돌감지가 적용되는 모든 것들은 이 객체에 포함됩니다.\r\n */\n\n this.id = id;\n this.name;\n this.type;\n this.guns = [];\n this.color;\n this.x;\n this.y;\n this.r; // radius\n\n this.dir;\n this.h; // health\n\n this.mh; // max health\n\n this.opacity;\n this.score;\n this.isDead;\n this.cv = document.createElement(\"canvas\");\n this.ctx = this.cv.getContext(\"2d\");\n /*\r\n 오브젝트에 총구가 존재할 때, 불투명하지 않다면 오브젝트를 이미지로 처리합니다.\r\n (이 방법이 아닌 것 같다면, 다이피오에서 확인해보세요. 이 방법이 맞다고 단언할 수 있습니다.)\r\n */\n\n this.hitTime = 0;\n\n this.Animate = function (tick) {\n if (this.isDead) {\n // death effect\n this.opacity = Math.max(this.opacity - 0.1 * tick * 0.05, 0);\n this.r += this.r * 0.03 * tick * 0.05;\n\n if (this.opacity == 0) {\n this.isDelete = true;\n return;\n }\n }\n\n this.guns.forEach(function (g) {\n return g.Animate(tick);\n }); // gun animation (when their shot bullet)\n };\n\n this.ObjSet = function (data) {\n // obj value setting\n this.x = data.x;\n this.y = data.y;\n\n if (system.playerSetting.id !== this.id) {\n /*\r\n 만약 자신이 직접 조종하는 탱크라면, 클라이언트에서 직접 방향값을 정해줍니다.\r\n 그렇지 않다면 방향값을 보다 부드럽게 만들어줍니다.\r\n 다이피오에서는 직접 조종하는 탱크의 위치도 클라이언트에서 약간 처리해주는 것 같은데,\r\n 아직 그 부분은 구현되지 못했습니다.\r\n */\n if (this.dir) {\n var ccw = Math.cos(data.dir) * Math.sin(this.dir) - Math.sin(data.dir) * Math.cos(this.dir);\n var a = -(Math.cos(data.dir) * Math.cos(this.dir) + Math.sin(data.dir) * Math.sin(this.dir) - 1) * Math.PI / 2;\n\n if (ccw > 0) {\n this.dir -= a * 0.8;\n } else if (ccw < 0) {\n this.dir += a * 0.8;\n }\n } else {\n this.dir = data.dir;\n }\n }\n\n if (!this.isDead) {\n this.r = data.r;\n this.h = data.h;\n this.mh = data.mh;\n this.opacity = data.opacity;\n this.score = data.score;\n }\n\n this.isDead = data.isDead;\n this.hitTime = data.hitTime;\n this.name = data.name;\n\n if (this.type !== data.type) {\n this.guns = [];\n\n if (_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"gunList\"][data.type] != undefined) {\n this.guns = deepClone(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"gunList\"][data.type]); // clone gun object\n }\n }\n\n for (var i = 0; i < this.guns.length && i < data.guns.length; i++) {\n if (data.guns[i]) {\n this.guns[i].Shot();\n }\n }\n\n this.type = data.type;\n this.color = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"colorType\"])(data.type, data.team);\n };\n\n this.DrawSet = function (camera) {\n // 그릴 때 중복되는 값들을 간결하게 보내줍니다.\n var c = _console__WEBPACK_IMPORTED_MODULE_1__[\"colorList\"][this.color]; // get color value\n\n if (this.hitTime > 60) {\n // hit effect\n c = c.getLightRGB((this.hitTime - 60) / 70);\n } else if (this.hitTime > 0) {\n c = c.getRedRGB(this.hitTime / 60);\n }\n\n return {\n x: this.x - camera.x,\n y: this.y - camera.y,\n z: camera.z,\n t: this.type,\n c: c,\n r: this.r,\n dir: this.dir,\n o: this.opacity\n };\n };\n\n this.SetCanvasSize = function (camera) {\n // 오브젝트를 이미지로 처리할 때의 중복되는 값들을 간결하게 보내줍니다.\n var _this$DrawSet = this.DrawSet(camera),\n z = _this$DrawSet.z,\n t = _this$DrawSet.t,\n c = _this$DrawSet.c,\n r = _this$DrawSet.r,\n dir = _this$DrawSet.dir,\n o = _this$DrawSet.o;\n\n var rr = r * Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getPolygonRadius\"])(Math.abs(Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getObjectPoint\"])(t)));\n var size = {\n x: rr * z * 2,\n y: rr * z * 2\n };\n var pos = {\n x: rr * z,\n y: rr * z\n };\n this.guns.forEach(function (g) {\n return g.SetCanvasSize(camera, size, pos, rr, dir);\n });\n this.cv.width = size.x + 4 * camera.z + 4;\n this.cv.height = size.y + 4 * camera.z + 4;\n pos.x += 2 * camera.z + 2;\n pos.y += 2 * camera.z + 2;\n this.ctx.lineWidth = 2 * camera.z;\n this.ctx.imageSmoothingEnabled = false;\n return {\n ctxx: this.ctx,\n x: pos.x,\n y: pos.y,\n z: z,\n t: t,\n c: c,\n r: r,\n dir: dir,\n o: o\n };\n };\n\n this.Draw = function (ctx, camera) {\n var _this = this;\n\n if (this.guns.length > 0 && this.opacity < 1) {\n var _this$SetCanvasSize = this.SetCanvasSize(camera),\n ctxx = _this$SetCanvasSize.ctxx,\n x = _this$SetCanvasSize.x,\n y = _this$SetCanvasSize.y,\n z = _this$SetCanvasSize.z,\n t = _this$SetCanvasSize.t,\n c = _this$SetCanvasSize.c,\n r = _this$SetCanvasSize.r,\n dir = _this$SetCanvasSize.dir,\n o = _this$SetCanvasSize.o;\n\n var s = this.DrawSet(camera);\n var lx = x / z + (s.x * z - x) - Math.floor(s.x * z - x);\n var ly = y / z + (s.y * z - y) - Math.floor(s.y * z - y);\n this.guns.forEach(function (g) {\n if (!g.isFront) {\n g.Draw(ctxx, camera, lx, ly, r, c, dir, _this.hitTime);\n }\n });\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawObj\"])(ctxx, lx, ly, z, r, dir, t, 1, c);\n this.guns.forEach(function (g) {\n if (g.isFront) {\n g.Draw(ctxx, camera, lx, ly, r, c, dir, _this.hitTime); // draw front gun\n }\n });\n ctx.save();\n ctx.globalAlpha = o;\n ctx.imageSmoothingEnabled = false;\n ctx.drawImage(this.cv, Math.floor(s.x * z - x), Math.floor(s.y * z - y));\n ctx.restore();\n } else if (this.opacity > 0) {\n var _this$DrawSet2 = this.DrawSet(camera),\n x = _this$DrawSet2.x,\n y = _this$DrawSet2.y,\n z = _this$DrawSet2.z,\n t = _this$DrawSet2.t,\n c = _this$DrawSet2.c,\n r = _this$DrawSet2.r,\n dir = _this$DrawSet2.dir,\n o = _this$DrawSet2.o;\n\n this.guns.forEach(function (g) {\n if (!g.isFront) {\n g.Draw(ctx, camera, x, y, r, c, dir, _this.hitTime);\n }\n });\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawObj\"])(ctx, x, y, z, r, dir, t, o, c);\n this.guns.forEach(function (g) {\n if (g.isFront) {\n g.Draw(ctx, camera, x, y, r, c, dir, _this.hitTime); // draw front gun\n }\n });\n }\n };\n\n this.DrawName = function (ctx, camera) {\n /*\r\n 오브젝트의 이름과 점수를 그려주는 함수입니다.\r\n 아직 이 함수는 완벽하지 않습니다.\r\n 총 3가지가 불완전한데요,\r\n 하나는 레이어,\r\n 하나는 그리는 방식,\r\n 나머지 하나는 샌드박스 모드에서 치트를 사용할 때 이름의 색이 노란색으로 바뀌는 것입니다.\r\n */\n ctx.save();\n\n var _this$DrawSet3 = this.DrawSet(camera),\n x = _this$DrawSet3.x,\n y = _this$DrawSet3.y,\n z = _this$DrawSet3.z,\n r = _this$DrawSet3.r,\n o = _this$DrawSet3.o;\n\n if (this.score) {\n if (this.name) {\n this.cv.width = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getTextWidth\"])(this.name, \"bold \" + 0.8 * r * z + \"px Ubuntu\") + 5 * z;\n this.cv.height = 5 * 0.8 * r * z;\n this.ctx.imageSmoothingEnabled = false;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawText\"])(this.ctx, this.cv.width / 2 / z, this.cv.height / 2 / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#FFFFFF\"), this.name, 0.8 * r);\n ctx.globalAlpha = o;\n ctx.drawImage(this.cv, x * z - this.cv.width / 2, (y - r * 1.8) * z - this.cv.height / 2);\n }\n\n this.cv.width = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getTextWidth\"])(this.score, \"bold \" + 0.6 * r * z + \"px Ubuntu\") + 5 * z;\n this.cv.height = 5 * 0.4 * r * z;\n this.ctx.imageSmoothingEnabled = false;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawText\"])(this.ctx, this.cv.width / 2 / z, this.cv.height / 2 / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#FFFFFF\"), this.score, 0.6 * r);\n ctx.globalAlpha = o;\n ctx.drawImage(this.cv, x * z - this.cv.width / 2, (y - r * 1.2) * z - this.cv.height / 2);\n } else {\n if (this.name) {\n this.cv.width = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getTextWidth\"])(this.name, \"bold \" + 0.8 * r * z + \"px Ubuntu\") + 5 * z;\n this.cv.height = 5 * 0.8 * r * z;\n this.ctx.imageSmoothingEnabled = false;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawText\"])(this.ctx, this.cv.width / 2 / z, this.cv.height / 2 / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#FFFFFF\"), this.name, 0.8 * r);\n ctx.globalAlpha = o;\n ctx.drawImage(this.cv, x * z - this.cv.width / 2, (y - r * 1.5) * z - this.cv.height / 2);\n }\n }\n\n ctx.restore();\n };\n\n this.hpBarP = 1; // hp bar Percent\n\n this.hpBarO = 0; // hp bar Opacity\n\n this.DrawHPBar = function (ctx, camera) {\n /*\r\n 오브젝트의 체력바를 그려주는 함수입니다.\r\n 아직 이 함수는 완벽하지 않습니다.\r\n 총 3가지가 불완전한데요,\r\n 하나는 레이어,\r\n 하나는 체력 바의 애니메이션,\r\n 나머지 하나는 오브젝트의 크기나 종류에 따른 체력 바의 길이입니다.\r\n */\n var healthPercent = this.h / this.mh;\n this.hpBarP -= (this.hpBarP - healthPercent) / 4;\n\n if (healthPercent < 1) {\n this.hpBarO = Math.min(this.hpBarO + 0.4, 1);\n } else {\n this.hpBarO = Math.max(this.hpBarO - 0.2, 0);\n }\n\n if (this.hpBarO > 0) {\n var _this$DrawSet4 = this.DrawSet(camera),\n x = _this$DrawSet4.x,\n y = _this$DrawSet4.y,\n z = _this$DrawSet4.z,\n r = _this$DrawSet4.r,\n o = _this$DrawSet4.o;\n\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawBar\"])(ctx, x - r, y + r * 5 / 3, 4.1, r * 2, z, o * this.hpBarO, this.hpBarP, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#86e27f\"));\n }\n };\n};\n\n//# sourceURL=webpack:///./src/js/data/object.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Obj\", function() { return Obj; });\n/* harmony import */ var _lib_util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../lib/util */ \"./src/js/lib/util.js\");\n/* harmony import */ var _console__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./console */ \"./src/js/data/console.js\");\n/* harmony import */ var _lib_draw__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../lib/draw */ \"./src/js/lib/draw.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n\n\n\n\nfunction deepClone(obj) {\n if (obj === null || _typeof(obj) !== 'object') {\n return obj;\n }\n\n var result = Array.isArray(obj) ? [] : {};\n\n for (var _i = 0, _Object$keys = Object.keys(obj); _i < _Object$keys.length; _i++) {\n var key = _Object$keys[_i];\n result[key] = deepClone(obj[key]);\n }\n\n return result;\n}\n\nvar Obj = function Obj(id) {\n 'use strict';\n /*\r\n 이 객체는 무조건 system 의 objectList 에 포함되어 있습니다.\r\n 게임 내에서 충돌감지가 적용되는 모든 것들은 이 객체에 포함됩니다.\r\n */\n\n this.id = id;\n this.name;\n this.type;\n this.guns = [];\n this.color;\n this.x;\n this.y;\n this.r; // radius\n\n this.dir;\n this.h; // health\n\n this.mh; // max health\n\n this.opacity;\n this.score;\n this.isDead;\n this.cv = document.createElement(\"canvas\");\n this.ctx = this.cv.getContext(\"2d\");\n /*\r\n 오브젝트에 총구가 존재할 때, 불투명하지 않다면 오브젝트를 이미지로 처리합니다.\r\n (이 방법이 아닌 것 같다면, 다이피오에서 확인해보세요. 이 방법이 맞다고 단언할 수 있습니다.)\r\n */\n\n this.hitTime = 0;\n\n this.Animate = function (tick) {\n if (this.isDead) {\n // death effect\n this.opacity = Math.max(this.opacity - 0.1 * tick * 0.05, 0);\n this.r += this.r * 0.03 * tick * 0.05;\n\n if (this.opacity == 0) {\n this.isDelete = true;\n return;\n }\n }\n\n this.guns.forEach(function (g) {\n return g.Animate(tick);\n }); // gun animation (when their shot bullet)\n };\n\n this.ObjSet = function (data) {\n // obj value setting\n this.x = data.x;\n this.y = data.y;\n\n if (system.playerSetting.id !== this.id) {\n /*\r\n 만약 자신이 직접 조종하는 탱크라면, 클라이언트에서 직접 방향값을 정해줍니다.\r\n 그렇지 않다면 방향값을 보다 부드럽게 만들어줍니다.\r\n 다이피오에서는 직접 조종하는 탱크의 위치도 클라이언트에서 약간 처리해주는 것 같은데,\r\n 아직 그 부분은 구현되지 못했습니다.\r\n */\n if (this.dir) {\n var ccw = Math.cos(data.dir) * Math.sin(this.dir) - Math.sin(data.dir) * Math.cos(this.dir);\n var a = -(Math.cos(data.dir) * Math.cos(this.dir) + Math.sin(data.dir) * Math.sin(this.dir) - 1) * Math.PI / 2;\n\n if (ccw > 0) {\n this.dir -= a * 0.5;\n } else if (ccw < 0) {\n this.dir += a * 0.5;\n }\n } else {\n this.dir = data.dir;\n }\n }\n\n if (!this.isDead) {\n this.r = data.r;\n this.h = data.h;\n this.mh = data.mh;\n this.opacity = data.opacity;\n this.score = data.score;\n }\n\n this.isDead = data.isDead;\n this.hitTime = data.hitTime;\n this.name = data.name;\n\n if (this.type !== data.type) {\n this.guns = [];\n\n if (_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"gunList\"][data.type] != undefined) {\n this.guns = deepClone(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"gunList\"][data.type]); // clone gun object\n }\n }\n\n for (var i = 0; i < this.guns.length && i < data.guns.length; i++) {\n if (data.guns[i]) {\n this.guns[i].Shot();\n }\n }\n\n this.type = data.type;\n this.color = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"colorType\"])(data.type, data.team);\n };\n\n this.DrawSet = function (camera) {\n // 그릴 때 중복되는 값들을 간결하게 보내줍니다.\n var c = _console__WEBPACK_IMPORTED_MODULE_1__[\"colorList\"][this.color]; // get color value\n\n if (this.hitTime > 60) {\n // hit effect\n c = c.getLightRGB((this.hitTime - 60) / 70);\n } else if (this.hitTime > 0) {\n c = c.getRedRGB(this.hitTime / 60);\n }\n\n return {\n x: this.x - camera.x,\n y: this.y - camera.y,\n z: camera.z,\n t: this.type,\n c: c,\n r: this.r,\n dir: this.dir,\n o: this.opacity\n };\n };\n\n this.SetCanvasSize = function (camera) {\n // 오브젝트를 이미지로 처리할 때의 중복되는 값들을 간결하게 보내줍니다.\n var _this$DrawSet = this.DrawSet(camera),\n z = _this$DrawSet.z,\n t = _this$DrawSet.t,\n c = _this$DrawSet.c,\n r = _this$DrawSet.r,\n dir = _this$DrawSet.dir,\n o = _this$DrawSet.o;\n\n var rr = r * Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getPolygonRadius\"])(Math.abs(Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getObjectPoint\"])(t)));\n var size = {\n x: rr * z * 2,\n y: rr * z * 2\n };\n var pos = {\n x: rr * z,\n y: rr * z\n };\n this.guns.forEach(function (g) {\n return g.SetCanvasSize(camera, size, pos, rr, dir);\n });\n this.cv.width = size.x + 4 * camera.z + 4;\n this.cv.height = size.y + 4 * camera.z + 4;\n pos.x += 2 * camera.z + 2;\n pos.y += 2 * camera.z + 2;\n this.ctx.lineWidth = 2 * camera.z;\n this.ctx.imageSmoothingEnabled = false;\n return {\n ctxx: this.ctx,\n x: pos.x,\n y: pos.y,\n z: z,\n t: t,\n c: c,\n r: r,\n dir: dir,\n o: o\n };\n };\n\n this.Draw = function (ctx, camera) {\n var _this = this;\n\n if (this.guns.length > 0 && this.opacity < 1) {\n var _this$SetCanvasSize = this.SetCanvasSize(camera),\n ctxx = _this$SetCanvasSize.ctxx,\n x = _this$SetCanvasSize.x,\n y = _this$SetCanvasSize.y,\n z = _this$SetCanvasSize.z,\n t = _this$SetCanvasSize.t,\n c = _this$SetCanvasSize.c,\n r = _this$SetCanvasSize.r,\n dir = _this$SetCanvasSize.dir,\n o = _this$SetCanvasSize.o;\n\n var s = this.DrawSet(camera);\n var lx = x / z + (s.x * z - x) - Math.floor(s.x * z - x);\n var ly = y / z + (s.y * z - y) - Math.floor(s.y * z - y);\n this.guns.forEach(function (g) {\n if (!g.isFront) {\n g.Draw(ctxx, camera, lx, ly, r, c, dir, _this.hitTime);\n }\n });\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawObj\"])(ctxx, lx, ly, z, r, dir, t, 1, c);\n this.guns.forEach(function (g) {\n if (g.isFront) {\n g.Draw(ctxx, camera, lx, ly, r, c, dir, _this.hitTime); // draw front gun\n }\n });\n ctx.save();\n ctx.globalAlpha = o;\n ctx.imageSmoothingEnabled = false;\n ctx.drawImage(this.cv, Math.floor(s.x * z - x), Math.floor(s.y * z - y));\n ctx.restore();\n } else if (this.opacity > 0) {\n var _this$DrawSet2 = this.DrawSet(camera),\n x = _this$DrawSet2.x,\n y = _this$DrawSet2.y,\n z = _this$DrawSet2.z,\n t = _this$DrawSet2.t,\n c = _this$DrawSet2.c,\n r = _this$DrawSet2.r,\n dir = _this$DrawSet2.dir,\n o = _this$DrawSet2.o;\n\n this.guns.forEach(function (g) {\n if (!g.isFront) {\n g.Draw(ctx, camera, x, y, r, c, dir, _this.hitTime);\n }\n });\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawObj\"])(ctx, x, y, z, r, dir, t, o, c);\n this.guns.forEach(function (g) {\n if (g.isFront) {\n g.Draw(ctx, camera, x, y, r, c, dir, _this.hitTime); // draw front gun\n }\n });\n }\n };\n\n this.DrawName = function (ctx, camera) {\n /*\r\n 오브젝트의 이름과 점수를 그려주는 함수입니다.\r\n 아직 이 함수는 완벽하지 않습니다.\r\n 총 3가지가 불완전한데요,\r\n 하나는 레이어,\r\n 하나는 그리는 방식,\r\n 나머지 하나는 샌드박스 모드에서 치트를 사용할 때 이름의 색이 노란색으로 바뀌는 것입니다.\r\n */\n ctx.save();\n\n var _this$DrawSet3 = this.DrawSet(camera),\n x = _this$DrawSet3.x,\n y = _this$DrawSet3.y,\n z = _this$DrawSet3.z,\n r = _this$DrawSet3.r,\n o = _this$DrawSet3.o;\n\n if (this.score) {\n if (this.name) {\n this.cv.width = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getTextWidth\"])(this.name, \"bold \" + 0.8 * r * z + \"px Ubuntu\") + 5 * z;\n this.cv.height = 5 * 0.8 * r * z;\n this.ctx.imageSmoothingEnabled = false;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawText\"])(this.ctx, this.cv.width / 2 / z, this.cv.height / 2 / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#FFFFFF\"), this.name, 0.8 * r);\n ctx.globalAlpha = o;\n ctx.drawImage(this.cv, x * z - this.cv.width / 2, (y - r * 1.8) * z - this.cv.height / 2);\n }\n\n this.cv.width = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getTextWidth\"])(this.score, \"bold \" + 0.6 * r * z + \"px Ubuntu\") + 5 * z;\n this.cv.height = 5 * 0.4 * r * z;\n this.ctx.imageSmoothingEnabled = false;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawText\"])(this.ctx, this.cv.width / 2 / z, this.cv.height / 2 / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#FFFFFF\"), this.score, 0.6 * r);\n ctx.globalAlpha = o;\n ctx.drawImage(this.cv, x * z - this.cv.width / 2, (y - r * 1.2) * z - this.cv.height / 2);\n } else {\n if (this.name) {\n this.cv.width = Object(_lib_util__WEBPACK_IMPORTED_MODULE_0__[\"getTextWidth\"])(this.name, \"bold \" + 0.8 * r * z + \"px Ubuntu\") + 5 * z;\n this.cv.height = 5 * 0.8 * r * z;\n this.ctx.imageSmoothingEnabled = false;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawText\"])(this.ctx, this.cv.width / 2 / z, this.cv.height / 2 / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#FFFFFF\"), this.name, 0.8 * r);\n ctx.globalAlpha = o;\n ctx.drawImage(this.cv, x * z - this.cv.width / 2, (y - r * 1.5) * z - this.cv.height / 2);\n }\n }\n\n ctx.restore();\n };\n\n this.hpBarP = 1; // hp bar Percent\n\n this.hpBarO = 0; // hp bar Opacity\n\n this.DrawHPBar = function (ctx, camera) {\n /*\r\n 오브젝트의 체력바를 그려주는 함수입니다.\r\n 아직 이 함수는 완벽하지 않습니다.\r\n 총 3가지가 불완전한데요,\r\n 하나는 레이어,\r\n 하나는 체력 바의 애니메이션,\r\n 나머지 하나는 오브젝트의 크기나 종류에 따른 체력 바의 길이입니다.\r\n */\n var healthPercent = this.h / this.mh;\n this.hpBarP -= (this.hpBarP - healthPercent) / 4;\n\n if (healthPercent < 1) {\n this.hpBarO = Math.min(this.hpBarO + 0.4, 1);\n } else {\n this.hpBarO = Math.max(this.hpBarO - 0.2, 0);\n }\n\n if (this.hpBarO > 0) {\n var _this$DrawSet4 = this.DrawSet(camera),\n x = _this$DrawSet4.x,\n y = _this$DrawSet4.y,\n z = _this$DrawSet4.z,\n r = _this$DrawSet4.r,\n o = _this$DrawSet4.o;\n\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_2__[\"drawBar\"])(ctx, x - r, y + r * 5 / 3, 4.1, r * 2, z, o * this.hpBarO, this.hpBarP, new _lib_util__WEBPACK_IMPORTED_MODULE_0__[\"RGB\"](\"#86e27f\"));\n }\n };\n};\n\n//# sourceURL=webpack:///./src/js/data/object.js?"); /***/ }), @@ -3632,7 +3632,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) * /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"default\", function() { return DefaultUI; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Bar\", function() { return Bar; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Text\", function() { return Text; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"List\", function() { return List; });\n/* harmony import */ var _lib_draw__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/draw */ \"./src/js/lib/draw.js\");\n/* harmony import */ var _lib_util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/util */ \"./src/js/lib/util.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\n\n\n\nvar DefaultUI = /*#__PURE__*/function () {\n function DefaultUI(x, y, w, h, mx, my, c) {\n _classCallCheck(this, DefaultUI);\n\n this.x = x; // 여기에서 의미하는 xy 값은 절대 좌표값이 아니라 상대 좌표값을 의미합니다.\n\n this.y = y;\n this.w = w || 0;\n this.h = h || 0;\n this.mx = mx || \"mid\"; // \"left\" \"mid\" \"right\" 상위 오브젝트에 대해 중심점을 잡아주는 역할을 해줍니다.\n\n this.my = my || \"mid\"; // \"up\" \"mid\" \"down\"\n\n this.color = c;\n this.childs = [];\n }\n\n _createClass(DefaultUI, [{\n key: \"addChild\",\n value: function addChild(obj) {\n this.childs.push(obj);\n return this;\n }\n }, {\n key: \"setPosition\",\n value: function setPosition(x, y, w, h, z) {\n var pos = {\n sx: 0,\n sy: 0\n };\n\n switch (this.mx) {\n case \"mid\":\n pos.sx = x + w / 2 - this.w / 2 * z;\n break;\n\n case \"right\":\n pos.sx = x + w - this.w * z;\n break;\n\n default:\n pos.sx = x;\n break;\n }\n\n pos.sx += this.x * z;\n\n switch (this.my) {\n case \"mid\":\n pos.sy = y + h / 2 - this.h / 2 * z;\n break;\n\n case \"down\":\n pos.sy = y + h - this.h * z;\n break;\n\n default:\n pos.sy = y;\n break;\n }\n\n pos.sy += this.y * z;\n return pos;\n }\n }, {\n key: \"draw\",\n value: function draw(ctx, x, y, w, h, z) {\n var _this = this;\n\n var _this$setPosition = this.setPosition(x, y, w, h, z),\n sx = _this$setPosition.sx,\n sy = _this$setPosition.sy;\n\n this.drawThis(ctx, sx, sy, z);\n this.childs.forEach(function (o) {\n o.draw(ctx, sx, sy, _this.w, _this.h, z);\n });\n }\n }]);\n\n return DefaultUI;\n}();\n\n\nvar Bar = /*#__PURE__*/function (_DefaultUI) {\n _inherits(Bar, _DefaultUI);\n\n function Bar() {\n _classCallCheck(this, Bar);\n\n return _possibleConstructorReturn(this, _getPrototypeOf(Bar).apply(this, arguments));\n }\n\n _createClass(Bar, [{\n key: \"setPer\",\n value: function setPer(p) {\n this.per = p;\n return this;\n }\n }, {\n key: \"drawThis\",\n value: function drawThis(ctx, sx, sy, z) {\n z *= 3;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_0__[\"drawBar\"])(ctx, sx / z, sy / z + this.h / 2, this.h / 6, this.w / 3, z, 1, this.per, this.color);\n }\n }]);\n\n return Bar;\n}(DefaultUI);\nvar Text = /*#__PURE__*/function (_DefaultUI2) {\n _inherits(Text, _DefaultUI2);\n\n function Text() {\n _classCallCheck(this, Text);\n\n return _possibleConstructorReturn(this, _getPrototypeOf(Text).apply(this, arguments));\n }\n\n _createClass(Text, [{\n key: \"setText\",\n value: function setText(t, s, d) {\n this.text = t;\n this.size = s;\n this.dir = d;\n return this;\n }\n }, {\n key: \"drawThis\",\n value: function drawThis(ctx, sx, sy, z) {\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_0__[\"drawText\"])(ctx, sx / z, sy / z, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_1__[\"RGB\"](\"#ffffff\"), this.text, this.size, this.dir);\n }\n }]);\n\n return Text;\n}(DefaultUI);\nvar List = /*#__PURE__*/function (_DefaultUI3) {\n _inherits(List, _DefaultUI3);\n\n function List() {\n _classCallCheck(this, List);\n\n return _possibleConstructorReturn(this, _getPrototypeOf(List).apply(this, arguments));\n }\n\n _createClass(List, [{\n key: \"setList\",\n value: function setList(list) {\n var _this2 = this;\n\n list.forEach(function (o) {\n _this2.addChild(o);\n });\n return this;\n }\n }, {\n key: \"setPadding\",\n value: function setPadding(p) {\n this.padding = p;\n return this;\n }\n }, {\n key: \"draw\",\n value: function draw(ctx, x, y, w, h, z) {\n var _this3 = this;\n\n var _this$setPosition2 = this.setPosition(x, y, w, h, z),\n sx = _this$setPosition2.sx,\n sy = _this$setPosition2.sy;\n\n this.childs.forEach(function (o) {\n o.draw(ctx, sx, sy, _this3.w, _this3.h, z);\n sy += (o.h + (_this3.padding || 0)) * z;\n });\n }\n }]);\n\n return List;\n}(DefaultUI);\n\n//# sourceURL=webpack:///./src/js/data/ui/ui.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"default\", function() { return DefaultUI; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Bar\", function() { return Bar; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Text\", function() { return Text; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"List\", function() { return List; });\n/* harmony import */ var _lib_draw__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/draw */ \"./src/js/lib/draw.js\");\n/* harmony import */ var _lib_util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/util */ \"./src/js/lib/util.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\n\n\n\nvar DefaultUI = /*#__PURE__*/function () {\n function DefaultUI(x, y, w, h, mx, my, c) {\n _classCallCheck(this, DefaultUI);\n\n this.x = x; // 여기에서 의미하는 xy 값은 절대 좌표값이 아니라 상대 좌표값을 의미합니다.\n\n this.y = y;\n this.w = w || 0;\n this.h = h || 0;\n this.mx = mx || \"mid\"; // \"left\" \"mid\" \"right\" 상위 오브젝트에 대해 중심점을 잡아주는 역할을 해줍니다.\n\n this.my = my || \"mid\"; // \"up\" \"mid\" \"down\"\n\n this.color = c;\n this.childs = [];\n this.isEnable = true;\n }\n\n _createClass(DefaultUI, [{\n key: \"addChild\",\n value: function addChild(obj) {\n this.childs.push(obj);\n return this;\n }\n }, {\n key: \"setEnable\",\n value: function setEnable(isEnable) {\n this.isEnable = isEnable;\n }\n }, {\n key: \"setPosition\",\n value: function setPosition(x, y, w, h, z) {\n var pos = {\n sx: 0,\n sy: 0\n };\n\n switch (this.mx) {\n case \"mid\":\n pos.sx = x + w / 2 - this.w / 2 * z;\n break;\n\n case \"right\":\n pos.sx = x + w - this.w * z;\n break;\n\n default:\n pos.sx = x;\n break;\n }\n\n pos.sx += this.x * z;\n\n switch (this.my) {\n case \"mid\":\n pos.sy = y + h / 2 - this.h / 2 * z;\n break;\n\n case \"down\":\n pos.sy = y + h - this.h * z;\n break;\n\n default:\n pos.sy = y;\n break;\n }\n\n pos.sy += this.y * z;\n return pos;\n }\n }, {\n key: \"draw\",\n value: function draw(ctx, x, y, w, h, z) {\n var _this = this;\n\n if (!this.isEnable) return;\n\n var _this$setPosition = this.setPosition(x, y, w, h, z),\n sx = _this$setPosition.sx,\n sy = _this$setPosition.sy;\n\n this.drawThis(ctx, sx, sy, z);\n this.childs.forEach(function (o) {\n o.draw(ctx, sx, sy, _this.w * z, _this.h * z, z);\n });\n }\n }]);\n\n return DefaultUI;\n}();\n\n\nvar Bar = /*#__PURE__*/function (_DefaultUI) {\n _inherits(Bar, _DefaultUI);\n\n function Bar() {\n _classCallCheck(this, Bar);\n\n return _possibleConstructorReturn(this, _getPrototypeOf(Bar).apply(this, arguments));\n }\n\n _createClass(Bar, [{\n key: \"setPer\",\n value: function setPer(p) {\n this.per = p;\n return this;\n }\n }, {\n key: \"drawThis\",\n value: function drawThis(ctx, sx, sy, z) {\n if (!this.isEnable) return;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_0__[\"drawBar\"])(ctx, sx / (z * 3), sy / (z * 3) + this.h / 6, this.h / 6, this.w / 3, z * 3, 1, this.per, this.color);\n }\n }]);\n\n return Bar;\n}(DefaultUI);\nvar Text = /*#__PURE__*/function (_DefaultUI2) {\n _inherits(Text, _DefaultUI2);\n\n function Text() {\n _classCallCheck(this, Text);\n\n return _possibleConstructorReturn(this, _getPrototypeOf(Text).apply(this, arguments));\n }\n\n _createClass(Text, [{\n key: \"setText\",\n value: function setText(t, s, d) {\n this.text = t;\n this.size = s;\n this.dir = d;\n return this;\n }\n }, {\n key: \"drawThis\",\n value: function drawThis(ctx, sx, sy, z) {\n if (!this.isEnable) return;\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_0__[\"drawText\"])(ctx, sx / z, sy / z + this.h / 2, z, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_1__[\"RGB\"](\"#ffffff\"), this.text, this.size, this.dir);\n }\n }]);\n\n return Text;\n}(DefaultUI);\nvar List = /*#__PURE__*/function (_DefaultUI3) {\n _inherits(List, _DefaultUI3);\n\n function List() {\n _classCallCheck(this, List);\n\n return _possibleConstructorReturn(this, _getPrototypeOf(List).apply(this, arguments));\n }\n\n _createClass(List, [{\n key: \"setList\",\n value: function setList(list) {\n var _this2 = this;\n\n list.forEach(function (o) {\n _this2.addChild(o);\n });\n return this;\n }\n }, {\n key: \"setPadding\",\n value: function setPadding(p) {\n this.padding = p;\n return this;\n }\n }, {\n key: \"draw\",\n value: function draw(ctx, x, y, w, h, z) {\n var _this3 = this;\n\n if (!this.isEnable) return;\n\n var _this$setPosition2 = this.setPosition(x, y, w, h, z),\n sx = _this$setPosition2.sx,\n sy = _this$setPosition2.sy;\n\n this.childs.forEach(function (o) {\n o.draw(ctx, sx, sy, _this3.w, _this3.h, z);\n sy += (o.h + (_this3.padding || 0)) * z;\n });\n }\n }]);\n\n return List;\n}(DefaultUI);\n\n//# sourceURL=webpack:///./src/js/data/ui/ui.js?"); /***/ }), @@ -3692,7 +3692,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) * /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"default\", function() { return System; });\n/* harmony import */ var _data_console__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./data/console */ \"./src/js/data/console.js\");\n/* harmony import */ var _data_object__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./data/object */ \"./src/js/data/object.js\");\n/* harmony import */ var _data_ui_uisystem__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./data/ui/uisystem */ \"./src/js/data/ui/uisystem.js\");\n/* harmony import */ var _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./data/ui/ui */ \"./src/js/data/ui/ui.js\");\n/* harmony import */ var _lib_draw__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/draw */ \"./src/js/lib/draw.js\");\n/* harmony import */ var _lib_util__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./lib/util */ \"./src/js/lib/util.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n\n\n\n\n\n\nvar socket;\n/*\r\n 전체 게임 시스템을 담당하고 있습니다.\r\n overall codes are like spaghetti.. 정돈이 필요한 파일입니다.\r\n*/\n\nvar System = /*#__PURE__*/function () {\n function System() {\n var _this = this;\n\n _classCallCheck(this, System);\n\n _defineProperty(this, \"insertComma\", function (number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n });\n\n this.connect(); // connect\n\n this.img = new Image(); // main background\n\n this.img.src = 'background.png';\n this.cv = document.getElementById(\"canvas\"); // canvas\n\n this.ctx = this.cv.getContext(\"2d\"); // ctx\n\n this.gameui = new _data_ui_uisystem__WEBPACK_IMPORTED_MODULE_2__[\"default\"](); // set gameUI\n\n var scoreboardui = [];\n\n for (var i = 0; i < 10; i++) {\n scoreboardui.push(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"Bar\"](0, 0, 166, 35, \"left\", \"up\", new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#00F46C\")).setPer(1));\n }\n\n this.gameui.addUI(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"Text\"](0, 0, 0, 50, \"mid\", \"down\", new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#000000\")).setText(\"Test\", 20));\n this.gameui.addUI(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"List\"](-25, 2, 166, 500, \"right\", \"up\").setList(scoreboardui).setPadding(-15));\n this.textinputcontainer = document.getElementById(\"textInputContainer\"); // name input\n\n this.textinput = document.getElementById(\"textInput\");\n this.textinputanime = 1; // name input animation (down)\n\n this.connectinga = 1;\n this.panela = 0.4;\n this.textinput.style.paddingLeft = \"5px\";\n this.textinput.style.paddingRight = \"5px\";\n this.objectList = []; // object List\n\n this.scoreboard = []; // scoreboard\n\n this.gameSetting = {\n // Game's data\n \"gamemode\": \"sandbox\",\n \"isConnecting\": true,\n \"isNaming\": false,\n \"isGaming\": false\n };\n this.playerSetting = {\n // my Tank's data\n \"obj\": null,\n // object\n \"id\": 0,\n // object's id\n \"team\": \"\",\n \"level\": 0,\n \"stat\": 0,\n \"stats\": [0, 0, 0, 0, 0, 0, 0, 0],\n \"maxstats\": [0, 0, 0, 0, 0, 0, 0, 0]\n };\n this.input = {\n // input data\n \"moveVector\": {\n x: 0,\n y: 0\n },\n \"mousePos\": {\n x: 0,\n y: 0\n },\n \"e\": 0,\n \"c\": 0\n };\n this.lastTime = Date.now();\n this.isControlRotate = true; // it is possible to control own tank's rotate?\n\n this.pingList = [];\n this.camera = {\n // camera data\n x: 0,\n y: 0,\n z: 2,\n uiz: 1 // ui scale (affected by screen size)\n\n };\n this.area = []; // area list\n\n this.keys = {}; // list of the keys currently pressed\n\n this.sameKeys = {\n // considered as the same key\n 65: 37,\n 87: 38,\n 68: 39,\n 83: 40\n };\n window.input = {\n blur: function blur() {},\n execute: function execute(v) {},\n flushInputHooks: function flushInputHooks() {},\n get_convar: function get_convar(key) {},\n keyDown: function () {\n if (this.gameSetting.isNaming) {\n if (arguments[0] === 13) {\n // At naming username, the name is sent as type of '0' if enter key is pressed (only 30byte)\n this.gameSetting.isGaming = true; // game start\n\n this.textinputcontainer.style.display = \"none\"; // hide name input\n\n this.textinputcontainer.style.top = \"-\" + this.textinputcontainer.style.top;\n var buffer = new ArrayBuffer(31);\n var view = new DataView(buffer);\n var string = unescape(encodeURIComponent(this.textinput.value));\n view.setUint8(0, 2);\n\n for (var _i = 0; _i < string.length; _i++) {\n view.setUint8(_i + 1, string[_i].charCodeAt(0));\n }\n\n socket.send(buffer);\n window['setTyping'](false); // \n\n localStorage['name'] = this.textinput.value; // save the name to localStorage\n\n this.gameSetting.isNaming = false;\n return;\n } else {\n return;\n }\n } else if (this.gameSetting.isConnecting) return; // When naming or connecting, ignore all key pressing\n\n\n if (this.sameKeys[arguments[0]]) arguments[0] = this.sameKeys[arguments[0]];\n if (this.keys[arguments[0]]) return;\n this.keys[arguments[0]] = true;\n\n switch (arguments[0]) {\n case 37:\n this.input.moveVector.x -= 1;\n break;\n\n case 38:\n this.input.moveVector.y -= 1;\n break;\n\n case 39:\n this.input.moveVector.x += 1;\n break;\n\n case 40:\n this.input.moveVector.y += 1;\n break;\n\n case 69:\n this.input.e = 1 - this.input.e;\n break;\n\n case 67:\n this.input.c = 1 - this.input.c;\n break;\n\n default:\n break;\n }\n }.bind(this),\n keyUp: function () {\n if (this.gameSetting.isNaming) {\n // When naming or connecting, ignore all key pressing\n return;\n } else if (this.gameSetting.isConnecting) return;\n\n if (this.sameKeys[arguments[0]]) arguments[0] = this.sameKeys[arguments[0]];\n if (!this.keys[arguments[0]]) return;\n this.keys[arguments[0]] = false;\n\n switch (arguments[0]) {\n case 37:\n this.input.moveVector.x += 1;\n break;\n\n case 38:\n this.input.moveVector.y += 1;\n break;\n\n case 39:\n this.input.moveVector.x -= 1;\n break;\n\n case 40:\n this.input.moveVector.y -= 1;\n break;\n\n default:\n break;\n }\n }.bind(this),\n mouse: function () {\n this.input.mousePos = {\n x: arguments[0],\n y: arguments[1]\n }; // mouse pos\n }.bind(this),\n prevent_right_click: function prevent_right_click() {\n return true;\n },\n print_convar_help: function print_convar_help() {},\n set_convar: function set_convar(key, value) {},\n should_prevent_unload: function should_prevent_unload() {\n return true;\n },\n wheel: function wheel() {\n return true;\n }\n };\n this.loop(); // start loop\n\n setInterval(function () {\n _this.pingList.push(Date.now()); // piong\n\n\n var buffer = new ArrayBuffer(1);\n var view = new DataView(buffer);\n view.setUint8(0, 3);\n socket.send(buffer);\n }, 100);\n }\n\n _createClass(System, [{\n key: \"connect\",\n value: function connect() {\n var _this2 = this;\n\n // connect to websocket\n socket = new WebSocket(\"\".concat(window.location.protocol === 'https:' ? 'wss' : 'ws', \"://\").concat(location.host, \"/ws\"));\n socket.binaryType = 'arraybuffer';\n\n socket.onopen = function () {\n console.log(\"Successfully Connected\");\n var buffer = new ArrayBuffer(1);\n var view = new DataView(buffer);\n view.setUint8(0, 0);\n socket.send(buffer);\n _this2.gameSetting.isNaming = true;\n window['setTyping'](true);\n _this2.textinput.value = localStorage['name'] || '';\n _this2.textinputcontainer.style.display = \"block\";\n _this2.gameSetting.isConnecting = false;\n };\n\n socket.onmessage = function (msg) {\n var view = new DataView(msg.data);\n\n switch (view.getUint8(0)) {\n case 0:\n {\n var _ret = function () {\n // get Camera value, objectList value\n if (!_this2.gameSetting.isGaming) {\n return {\n v: void 0\n };\n }\n\n _this2.camera.z = _this2.camera.uiz * view.getFloat64(17);\n _this2.camera.x = view.getFloat64(1) - _this2.cv.width / 2 / _this2.camera.z;\n _this2.camera.y = view.getFloat64(9) - _this2.cv.height / 2 / _this2.camera.z;\n var i = 32;\n\n if (view.getInt8(25)) {\n _this2.playerSetting.id = view.getUint32(26);\n _this2.playerSetting.level = view.getUint16(30);\n _this2.playerSetting.stat = view.getUint8(32);\n\n for (var j = 0; j < 8; j++) {\n _this2.playerSetting.stats[j] = view.getUint8(33 + j);\n }\n\n for (var _j = 0; _j < 8; _j++) {\n _this2.playerSetting.maxstats[_j] = view.getUint8(41 + _j);\n }\n\n i = 49;\n var len = view.getUint8(i);\n i++;\n var u = new Uint8Array(msg.data.slice(i, i + len));\n _this2.playerSetting.team = String.fromCharCode.apply(null, u);\n i += len;\n }\n\n var imObjList = [];\n\n var _loop = function _loop() {\n var isObjEnable = false;\n var obj = {};\n obj.id = view.getUint32(i);\n i += 4;\n obj.x = view.getFloat64(i);\n i += 8;\n obj.y = view.getFloat64(i);\n i += 8;\n obj.r = view.getFloat64(i);\n i += 8;\n obj.dir = view.getFloat64(i);\n i += 8;\n obj.mh = view.getFloat64(i);\n i += 8;\n obj.h = view.getFloat64(i);\n i += 8;\n obj.opacity = view.getFloat64(i);\n i += 8;\n obj.score = view.getUint32(i);\n i += 4;\n var gunLen = view.getUint8(i);\n i++;\n obj.guns = [];\n\n for (; gunLen > 0; i++, gunLen--) {\n obj.guns.push(view.getUint8(i));\n }\n\n obj.hitTime = view.getUint8(i);\n i++;\n obj.isDead = view.getUint8(i);\n i++;\n var len = view.getUint8(i);\n i++;\n var u = new Uint8Array(msg.data.slice(i, i + len));\n obj.team = String.fromCharCode.apply(null, u);\n i += len;\n len = view.getUint8(i);\n i++;\n u = new Uint8Array(msg.data.slice(i, i + len));\n obj.type = new TextDecoder().decode(u);\n i += len;\n len = view.getUint8(i);\n i++;\n u = new Uint8Array(msg.data.slice(i, i + len));\n obj.name = new TextDecoder().decode(u);\n i += len;\n\n _this2.objectList.forEach(function (obi) {\n if (obi.id === obj.id) {\n obi.ObjSet(obj);\n isObjEnable = true;\n imObjList.push(obi);\n }\n });\n\n if (!isObjEnable && !obj.isDead) {\n var obi = new _data_object__WEBPACK_IMPORTED_MODULE_1__[\"Obj\"](obj.id);\n\n if (obj.id === _this2.playerSetting.id) {\n _this2.playerSetting.obj = obi;\n }\n\n obi.ObjSet(obj);\n imObjList.push(obi);\n }\n };\n\n while (i < msg.data.byteLength) {\n _loop();\n }\n\n _this2.objectList = imObjList;\n return {\n v: void 0\n };\n }();\n\n if (_typeof(_ret) === \"object\") return _ret.v;\n }\n\n case 1:\n {\n // get Area list\n for (var i = 1, j = 0; i < msg.data.byteLength; i += 4) {\n _this2.area[j++] = view.getInt32(i);\n }\n\n return;\n }\n\n case 2:\n {\n // correct Connecting and start Naming\n _this2.gameSetting.isNaming = true;\n window['setTyping'](true);\n _this2.textinput.value = localStorage['name'] || '';\n _this2.textinputcontainer.style.display = \"block\";\n _this2.gameSetting.isConnecting = false;\n return;\n }\n\n case 3:\n {\n // scoreboard\n return;\n }\n\n case 4:\n {\n // ping\n //console.log(Date.now() - this.pingList[0]);\n _this2.pingList.shift();\n\n return;\n }\n\n default:\n {\n return;\n }\n }\n };\n\n socket.onclose = function (event) {\n // reconnecting\n _this2.gameSetting.isConnecting = true;\n _this2.gameSetting.isNaming = false;\n _this2.gameSetting.isGaming = false;\n _this2.textinputcontainer.style.display = \"none\";\n _this2.textinputcontainer.style.top = \"-\" + _this2.textinputcontainer.style.top;\n console.log(\"Socket Closed Connection: \", event);\n\n _this2.connect();\n };\n\n socket.onerror = function (error) {\n console.error(\"Socket Error: \", error);\n socket.close();\n };\n }\n }, {\n key: \"loop\",\n value: function loop() {\n var _this3 = this;\n\n var tick = Date.now() - this.lastTime; //console.log(Math.floor(1000 / tick)); // print fps value\n\n this.lastTime = Date.now();\n\n if (this.cv.width <= this.cv.height / 9 * 16) {\n //\n this.camera.uiz = this.cv.height / 900;\n } else {\n this.camera.uiz = this.cv.width / 1600;\n }\n\n this.ctx.clearRect(0, 0, this.cv.width, this.cv.height); // clear canvas\n\n if (this.gameSetting.isConnecting) {\n // connecting text\n this.textinputanime = 1;\n this.connectinga = Math.min(this.connectinga + 0.01 * tick, 1);\n }\n\n if (this.gameSetting.isGaming) {\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawBackground\"])(this.ctx, this.camera.x, this.camera.y, this.camera.z, this.cv.width, this.cv.height, this.area);\n var buffer = new ArrayBuffer(14); // send input data\n\n var view = new DataView(buffer);\n view.setUint8(0, 1);\n\n if (this.input.moveVector.x === 0 && this.input.moveVector.y === 0) {\n view.setFloat32(1, 9.);\n } else {\n view.setFloat32(1, Math.atan2(this.input.moveVector.y, this.input.moveVector.x)); // move rotate\n }\n\n var x, y;\n\n if (this.input.c && this.playerSetting.obj) {\n x = Math.cos(this.playerSetting.obj.dir + 0.001 * tick) * 200 + this.playerSetting.obj.x;\n y = Math.sin(this.playerSetting.obj.dir + 0.001 * tick) * 200 + this.playerSetting.obj.y;\n } else {\n x = this.input.mousePos.x / this.camera.z + this.camera.x;\n y = this.input.mousePos.y / this.camera.z + this.camera.y;\n }\n\n if (this.playerSetting.obj) {\n this.playerSetting.obj.dir = Math.atan2(y - this.playerSetting.obj.y, x - this.playerSetting.obj.x);\n }\n\n view.setFloat32(5, x); // mouse pos\n\n view.setFloat32(9, y);\n view.setUint8(13, (this.keys[1] || this.keys[32] || this.input.e || 0) + // is Shot?\n (this.keys[3] || this.keys[16] || 0) * 2 // is Right Click?\n + (this.keys[79] || 0) * 4 // is Suicide? (o key)\n );\n socket.send(buffer);\n this.objectList.forEach(function (o) {\n o.Animate(tick);\n });\n this.objectList.forEach(function (o) {\n o.Draw(_this3.ctx, _this3.camera);\n });\n this.objectList.forEach(function (o) {\n o.DrawName(_this3.ctx, _this3.camera);\n });\n this.objectList.forEach(function (o) {\n o.DrawHPBar(_this3.ctx, _this3.camera);\n });\n this.gameui.draw(this.ctx, this.cv.width, this.cv.height, this.camera.uiz);\n } else {\n this.ctx.drawImage(this.img, // draw Background image\n this.cv.width / 2 - this.img.width * this.camera.uiz / 2 / 2.4, this.cv.height / 2 - this.img.height * this.camera.uiz / 2 / 2.4, this.img.width * this.camera.uiz / 2.4, this.img.height * this.camera.uiz / 2.4);\n }\n\n if (this.gameSetting.isNaming || this.gameSetting.isConnecting) {\n // draw Black Alpha Panel\n this.panela = Math.min(this.panela + 0.05, 0.4);\n this.ctx.save();\n this.ctx.globalAlpha = this.panela;\n this.ctx.fillStyle = \"#000000\";\n this.ctx.fillRect(0, 0, this.cv.width, this.cv.height);\n this.ctx.restore();\n } else {\n this.panela = 0;\n }\n\n if (!this.gameSetting.isGaming) {\n // Connecting...\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawText\"])(this.ctx, this.cv.width / 2 / this.camera.uiz, this.cv.height / 2 / this.camera.uiz, this.camera.uiz, this.connectinga, new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#FFFFFF\"), \"Connecting...\", 60);\n }\n\n if (this.gameSetting.isNaming) {\n // draw Name input\n if (this.textinput.value) this.textinput.value = _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"calByte\"].cutByteLength(this.textinput.value, 15);\n\n var _x = Math.floor(this.cv.width / 2 - 167 * this.camera.uiz),\n _y = Math.floor((this.cv.height / 2 - 20 * this.camera.uiz) * (1 - this.textinputanime)),\n w = Math.floor(333 * this.camera.uiz),\n h = Math.floor(41 * this.camera.uiz);\n\n this.textinputanime *= 0.95;\n this.connectinga = Math.max(this.connectinga - 0.2, 0);\n this.textinputcontainer.style.left = window['unscale'](_x) + \"px\";\n this.textinputcontainer.style.top = window['unscale'](_y) + \"px\";\n this.textinput.style.width = window['unscale'](w) + \"px\";\n this.textinput.style.height = window['unscale'](h) + \"px\";\n this.textinput.style.fontSize = this.textinput.style.lineHeight = window['unscale'](h - 0.4) + \"px\";\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawText\"])(this.ctx, (_x + w / 2) / this.camera.uiz, _y / this.camera.uiz - 11, this.camera.uiz, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#FFFFFF\"), \"This is the tale of...\", 20);\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawText\"])(this.ctx, (_x + w / 2) / this.camera.uiz, _y / this.camera.uiz + 57, this.camera.uiz, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#FFFFFF\"), \"(press enter to spawn)\", 11.7);\n this.ctx.save();\n this.ctx.beginPath();\n this.ctx.lineCap = \"round\";\n this.ctx.lineJoin = \"round\";\n this.ctx.lineWidth = 4.5 * this.camera.uiz;\n this.ctx.fillStyle = \"#FFFFFF\";\n this.ctx.strokeStyle = \"#000000\";\n this.ctx.moveTo(_x, _y + 1);\n this.ctx.lineTo(_x + w, _y + 1);\n this.ctx.lineTo(_x + w, _y + h + 1);\n this.ctx.lineTo(_x, _y + h + 1);\n this.ctx.lineTo(_x, _y + 1);\n this.ctx.fill();\n this.ctx.stroke();\n this.ctx.closePath();\n this.ctx.restore();\n } else {\n this.textinputanime = 1;\n }\n\n requestAnimationFrame(this.loop.bind(this));\n }\n }]);\n\n return System;\n}();\n\n\n\n//# sourceURL=webpack:///./src/js/system.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"default\", function() { return System; });\n/* harmony import */ var _data_console__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./data/console */ \"./src/js/data/console.js\");\n/* harmony import */ var _data_object__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./data/object */ \"./src/js/data/object.js\");\n/* harmony import */ var _data_ui_uisystem__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./data/ui/uisystem */ \"./src/js/data/ui/uisystem.js\");\n/* harmony import */ var _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./data/ui/ui */ \"./src/js/data/ui/ui.js\");\n/* harmony import */ var _lib_draw__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/draw */ \"./src/js/lib/draw.js\");\n/* harmony import */ var _lib_util__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./lib/util */ \"./src/js/lib/util.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n\n\n\n\n\n\nvar socket;\n/*\r\n 전체 게임 시스템을 담당하고 있습니다.\r\n overall codes are like spaghetti.. 정돈이 필요한 파일입니다.\r\n*/\n\nvar System = /*#__PURE__*/function () {\n function System() {\n var _this = this;\n\n _classCallCheck(this, System);\n\n _defineProperty(this, \"insertComma\", function (number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n });\n\n this.connect(); // connect\n\n this.img = new Image(); // main background\n\n this.img.src = 'background.png';\n this.cv = document.getElementById(\"canvas\"); // canvas\n\n this.ctx = this.cv.getContext(\"2d\"); // ctx\n\n this.gameui = new _data_ui_uisystem__WEBPACK_IMPORTED_MODULE_2__[\"default\"](); // set gameUI\n\n this.scoreboardui = [];\n\n for (var i = 0; i < 10; i++) {\n this.scoreboardui.push(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"Bar\"](0, 0, 166, 35, \"left\", \"up\", new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#00F46C\")).setPer(1).addChild(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"Text\"](0, 0, 0, 28, \"mid\", \"down\", new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#000000\"))));\n }\n\n this.gameui.addUI(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"Text\"](0, 0, 0, 50, \"mid\", \"down\", new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#000000\")).setText(\"Test\", 20));\n this.gameui.addUI(new _data_ui_ui__WEBPACK_IMPORTED_MODULE_3__[\"List\"](-25, 2, 166, 500, \"right\", \"up\").setList(this.scoreboardui).setPadding(-15));\n this.textinputcontainer = document.getElementById(\"textInputContainer\"); // name input\n\n this.textinput = document.getElementById(\"textInput\");\n this.textinputanime = 1; // name input animation (down)\n\n this.connectinga = 1;\n this.panela = 0.4;\n this.textinput.style.paddingLeft = \"5px\";\n this.textinput.style.paddingRight = \"5px\";\n this.objectList = []; // object List\n\n this.scoreboard = []; // scoreboard\n\n this.gameSetting = {\n // Game's data\n \"gamemode\": \"sandbox\",\n \"isConnecting\": true,\n \"isNaming\": false,\n \"isGaming\": false\n };\n this.playerSetting = {\n // my Tank's data\n \"obj\": null,\n // object\n \"id\": 0,\n // object's id\n \"team\": \"\",\n \"level\": 0,\n \"stat\": 0,\n \"stats\": [0, 0, 0, 0, 0, 0, 0, 0],\n \"maxstats\": [0, 0, 0, 0, 0, 0, 0, 0]\n };\n this.input = {\n // input data\n \"moveVector\": {\n x: 0,\n y: 0\n },\n \"mousePos\": {\n x: 0,\n y: 0\n },\n \"e\": 0,\n \"c\": 0\n };\n this.lastTime = Date.now();\n this.isControlRotate = true; // it is possible to control own tank's rotate?\n\n this.pingList = [];\n this.camera = {\n // camera data\n x: 0,\n y: 0,\n z: 2,\n uiz: 1 // ui scale (affected by screen size)\n\n };\n this.area = []; // area list\n\n this.keys = {}; // list of the keys currently pressed\n\n this.sameKeys = {\n // considered as the same key\n 65: 37,\n 87: 38,\n 68: 39,\n 83: 40\n };\n window.input = {\n blur: function blur() {},\n execute: function execute(v) {},\n flushInputHooks: function flushInputHooks() {},\n get_convar: function get_convar(key) {},\n keyDown: function () {\n if (this.gameSetting.isNaming) {\n if (arguments[0] === 13) {\n // At naming username, the name is sent as type of '0' if enter key is pressed (only 30byte)\n this.gameSetting.isGaming = true; // game start\n\n this.textinputcontainer.style.display = \"none\"; // hide name input\n\n this.textinputcontainer.style.top = \"-\" + this.textinputcontainer.style.top;\n var buffer = new ArrayBuffer(31);\n var view = new DataView(buffer);\n var string = unescape(encodeURIComponent(this.textinput.value));\n view.setUint8(0, 2);\n\n for (var _i = 0; _i < string.length; _i++) {\n view.setUint8(_i + 1, string[_i].charCodeAt(0));\n }\n\n socket.send(buffer);\n window['setTyping'](false); // \n\n localStorage['name'] = this.textinput.value; // save the name to localStorage\n\n this.gameSetting.isNaming = false;\n return;\n } else {\n return;\n }\n } else if (this.gameSetting.isConnecting) return; // When naming or connecting, ignore all key pressing\n\n\n if (this.sameKeys[arguments[0]]) arguments[0] = this.sameKeys[arguments[0]];\n if (this.keys[arguments[0]]) return;\n this.keys[arguments[0]] = true;\n\n switch (arguments[0]) {\n case 37:\n this.input.moveVector.x -= 1;\n break;\n\n case 38:\n this.input.moveVector.y -= 1;\n break;\n\n case 39:\n this.input.moveVector.x += 1;\n break;\n\n case 40:\n this.input.moveVector.y += 1;\n break;\n\n case 69:\n this.input.e = 1 - this.input.e;\n break;\n\n case 67:\n this.input.c = 1 - this.input.c;\n break;\n\n default:\n break;\n }\n }.bind(this),\n keyUp: function () {\n if (this.gameSetting.isNaming) {\n // When naming or connecting, ignore all key pressing\n return;\n } else if (this.gameSetting.isConnecting) return;\n\n if (this.sameKeys[arguments[0]]) arguments[0] = this.sameKeys[arguments[0]];\n if (!this.keys[arguments[0]]) return;\n this.keys[arguments[0]] = false;\n\n switch (arguments[0]) {\n case 37:\n this.input.moveVector.x += 1;\n break;\n\n case 38:\n this.input.moveVector.y += 1;\n break;\n\n case 39:\n this.input.moveVector.x -= 1;\n break;\n\n case 40:\n this.input.moveVector.y -= 1;\n break;\n\n default:\n break;\n }\n }.bind(this),\n mouse: function () {\n this.input.mousePos = {\n x: arguments[0],\n y: arguments[1]\n }; // mouse pos\n }.bind(this),\n prevent_right_click: function prevent_right_click() {\n return true;\n },\n print_convar_help: function print_convar_help() {},\n set_convar: function set_convar(key, value) {},\n should_prevent_unload: function should_prevent_unload() {\n return true;\n },\n wheel: function wheel() {\n return true;\n }\n };\n this.loop(); // start loop\n\n setInterval(function () {\n _this.pingList.push(Date.now()); // piong\n\n\n var buffer = new ArrayBuffer(1);\n var view = new DataView(buffer);\n view.setUint8(0, 3);\n socket.send(buffer);\n }, 100);\n }\n\n _createClass(System, [{\n key: \"connect\",\n value: function connect() {\n var _this2 = this;\n\n // connect to websocket\n socket = new WebSocket(\"\".concat(window.location.protocol === 'https:' ? 'wss' : 'ws', \"://\").concat(location.host, \"/ws\"));\n socket.binaryType = 'arraybuffer';\n\n socket.onopen = function () {\n console.log(\"Successfully Connected\");\n var buffer = new ArrayBuffer(1);\n var view = new DataView(buffer);\n view.setUint8(0, 0);\n socket.send(buffer);\n _this2.gameSetting.isNaming = true;\n window['setTyping'](true);\n _this2.textinput.value = localStorage['name'] || '';\n _this2.textinputcontainer.style.display = \"block\";\n _this2.gameSetting.isConnecting = false;\n };\n\n socket.onmessage = function (msg) {\n var view = new DataView(msg.data);\n\n switch (view.getUint8(0)) {\n case 0:\n {\n var _ret = function () {\n // get Camera value, objectList value\n if (!_this2.gameSetting.isGaming) {\n return {\n v: void 0\n };\n }\n\n _this2.camera.z = _this2.camera.uiz * view.getFloat64(17);\n _this2.camera.x = view.getFloat64(1) - _this2.cv.width / 2 / _this2.camera.z;\n _this2.camera.y = view.getFloat64(9) - _this2.cv.height / 2 / _this2.camera.z;\n var i = 32;\n\n if (view.getInt8(25)) {\n _this2.playerSetting.id = view.getUint32(26);\n _this2.playerSetting.level = view.getUint16(30);\n _this2.playerSetting.stat = view.getUint8(32);\n\n for (var j = 0; j < 8; j++) {\n _this2.playerSetting.stats[j] = view.getUint8(33 + j);\n }\n\n for (var _j = 0; _j < 8; _j++) {\n _this2.playerSetting.maxstats[_j] = view.getUint8(41 + _j);\n }\n\n i = 49;\n var len = view.getUint8(i);\n i++;\n var u = new Uint8Array(msg.data.slice(i, i + len));\n _this2.playerSetting.team = String.fromCharCode.apply(null, u);\n i += len;\n }\n\n var imObjList = [];\n\n var _loop = function _loop() {\n var isObjEnable = false;\n var obj = {};\n obj.id = view.getUint32(i);\n i += 4;\n obj.x = view.getFloat64(i);\n i += 8;\n obj.y = view.getFloat64(i);\n i += 8;\n obj.r = view.getFloat64(i);\n i += 8;\n obj.dir = view.getFloat64(i);\n i += 8;\n obj.mh = view.getFloat64(i);\n i += 8;\n obj.h = view.getFloat64(i);\n i += 8;\n obj.opacity = view.getFloat64(i);\n i += 8;\n obj.score = view.getUint32(i);\n i += 4;\n var gunLen = view.getUint8(i);\n i++;\n obj.guns = [];\n\n for (; gunLen > 0; i++, gunLen--) {\n obj.guns.push(view.getUint8(i));\n }\n\n obj.hitTime = view.getUint8(i);\n i++;\n obj.isDead = view.getUint8(i);\n i++;\n var len = view.getUint8(i);\n i++;\n var u = new Uint8Array(msg.data.slice(i, i + len));\n obj.team = String.fromCharCode.apply(null, u);\n i += len;\n len = view.getUint8(i);\n i++;\n u = new Uint8Array(msg.data.slice(i, i + len));\n obj.type = new TextDecoder().decode(u);\n i += len;\n len = view.getUint8(i);\n i++;\n u = new Uint8Array(msg.data.slice(i, i + len));\n obj.name = new TextDecoder().decode(u);\n i += len;\n\n _this2.objectList.forEach(function (obi) {\n if (obi.id === obj.id) {\n obi.ObjSet(obj);\n isObjEnable = true;\n imObjList.push(obi);\n }\n });\n\n if (!isObjEnable && !obj.isDead) {\n var obi = new _data_object__WEBPACK_IMPORTED_MODULE_1__[\"Obj\"](obj.id);\n\n if (obj.id === _this2.playerSetting.id) {\n _this2.playerSetting.obj = obi;\n }\n\n obi.ObjSet(obj);\n imObjList.push(obi);\n }\n };\n\n while (i < msg.data.byteLength) {\n _loop();\n }\n\n _this2.objectList = imObjList;\n return {\n v: void 0\n };\n }();\n\n if (_typeof(_ret) === \"object\") return _ret.v;\n }\n\n case 1:\n {\n // get Area list\n for (var i = 1, j = 0; i < msg.data.byteLength; i += 4) {\n _this2.area[j++] = view.getInt32(i);\n }\n\n return;\n }\n\n case 2:\n {\n // correct Connecting and start Naming\n _this2.gameSetting.isNaming = true;\n window['setTyping'](true);\n _this2.textinput.value = localStorage['name'] || '';\n _this2.textinputcontainer.style.display = \"block\";\n _this2.gameSetting.isConnecting = false;\n return;\n }\n\n case 3:\n {\n // scoreboard\n var _i2 = 1;\n var _j2 = 0;\n var maxScore = view.getUint32(_i2);\n\n while (_i2 < msg.data.byteLength) {\n var score = view.getUint32(_i2);\n\n _this2.scoreboardui[_j2].setEnable(true);\n\n _this2.scoreboardui[_j2].setPer(score / maxScore);\n\n _i2 += 4;\n var len = view.getUint8(_i2);\n _i2++;\n var u = new Uint8Array(msg.data.slice(_i2, _i2 + len)); //let team = String.fromCharCode.apply(null, u);\n\n _i2 += len;\n len = view.getUint8(_i2);\n _i2++;\n u = new Uint8Array(msg.data.slice(_i2, _i2 + len));\n var type = new TextDecoder().decode(u);\n if (!type) _this2.scoreboardui[_j2].setEnable(false);\n _i2 += len;\n len = view.getUint8(_i2);\n _i2++;\n u = new Uint8Array(msg.data.slice(_i2, _i2 + len));\n var name = new TextDecoder().decode(u);\n _i2 += len;\n\n _this2.scoreboardui[_j2].childs[0].setText(name + \"-\" + score, 13);\n\n _j2++;\n }\n\n return;\n }\n\n case 4:\n {\n // ping\n //console.log(Date.now() - this.pingList[0]);\n _this2.pingList.shift();\n\n return;\n }\n\n default:\n {\n return;\n }\n }\n };\n\n socket.onclose = function (event) {\n // reconnecting\n _this2.gameSetting.isConnecting = true;\n _this2.gameSetting.isNaming = false;\n _this2.gameSetting.isGaming = false;\n _this2.textinputcontainer.style.display = \"none\";\n _this2.textinputcontainer.style.top = \"-\" + _this2.textinputcontainer.style.top;\n console.log(\"Socket Closed Connection: \", event);\n\n _this2.connect();\n };\n\n socket.onerror = function (error) {\n console.error(\"Socket Error: \", error);\n socket.close();\n };\n }\n }, {\n key: \"loop\",\n value: function loop() {\n var _this3 = this;\n\n var tick = Date.now() - this.lastTime; //console.log(Math.floor(1000 / tick)); // print fps value\n\n this.lastTime = Date.now();\n\n if (this.cv.width <= this.cv.height / 9 * 16) {\n //\n this.camera.uiz = this.cv.height / 900;\n } else {\n this.camera.uiz = this.cv.width / 1600;\n }\n\n this.ctx.clearRect(0, 0, this.cv.width, this.cv.height); // clear canvas\n\n if (this.gameSetting.isConnecting) {\n // connecting text\n this.textinputanime = 1;\n this.connectinga = Math.min(this.connectinga + 0.01 * tick, 1);\n }\n\n if (this.gameSetting.isGaming) {\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawBackground\"])(this.ctx, this.camera.x, this.camera.y, this.camera.z, this.cv.width, this.cv.height, this.area);\n var buffer = new ArrayBuffer(14); // send input data\n\n var view = new DataView(buffer);\n view.setUint8(0, 1);\n\n if (this.input.moveVector.x === 0 && this.input.moveVector.y === 0) {\n view.setFloat32(1, 9.);\n } else {\n view.setFloat32(1, Math.atan2(this.input.moveVector.y, this.input.moveVector.x)); // move rotate\n }\n\n var x, y;\n\n if (this.input.c && this.playerSetting.obj) {\n x = Math.cos(this.playerSetting.obj.dir + 0.001 * tick) * 200 + this.playerSetting.obj.x;\n y = Math.sin(this.playerSetting.obj.dir + 0.001 * tick) * 200 + this.playerSetting.obj.y;\n } else {\n x = this.input.mousePos.x / this.camera.z + this.camera.x;\n y = this.input.mousePos.y / this.camera.z + this.camera.y;\n }\n\n if (this.playerSetting.obj) {\n this.playerSetting.obj.dir = Math.atan2(y - this.playerSetting.obj.y, x - this.playerSetting.obj.x);\n }\n\n view.setFloat32(5, x); // mouse pos\n\n view.setFloat32(9, y);\n view.setUint8(13, (this.keys[1] || this.keys[32] || this.input.e || 0) + // is Shot?\n (this.keys[3] || this.keys[16] || 0) * 2 // is Right Click?\n + (this.keys[79] || 0) * 4 // is Suicide? (o key)\n );\n socket.send(buffer);\n this.objectList.forEach(function (o) {\n o.Animate(tick);\n });\n this.objectList.forEach(function (o) {\n o.Draw(_this3.ctx, _this3.camera);\n });\n this.objectList.forEach(function (o) {\n o.DrawName(_this3.ctx, _this3.camera);\n });\n this.objectList.forEach(function (o) {\n o.DrawHPBar(_this3.ctx, _this3.camera);\n });\n this.gameui.draw(this.ctx, this.cv.width, this.cv.height, this.camera.uiz);\n } else {\n this.ctx.drawImage(this.img, // draw Background image\n this.cv.width / 2 - this.img.width * this.camera.uiz / 2 / 2.4, this.cv.height / 2 - this.img.height * this.camera.uiz / 2 / 2.4, this.img.width * this.camera.uiz / 2.4, this.img.height * this.camera.uiz / 2.4);\n }\n\n if (this.gameSetting.isNaming || this.gameSetting.isConnecting) {\n // draw Black Alpha Panel\n this.panela = Math.min(this.panela + 0.05, 0.4);\n this.ctx.save();\n this.ctx.globalAlpha = this.panela;\n this.ctx.fillStyle = \"#000000\";\n this.ctx.fillRect(0, 0, this.cv.width, this.cv.height);\n this.ctx.restore();\n } else {\n this.panela = 0;\n }\n\n if (!this.gameSetting.isGaming) {\n // Connecting...\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawText\"])(this.ctx, this.cv.width / 2 / this.camera.uiz, this.cv.height / 2 / this.camera.uiz, this.camera.uiz, this.connectinga, new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#FFFFFF\"), \"Connecting...\", 60);\n }\n\n if (this.gameSetting.isNaming) {\n // draw Name input\n if (this.textinput.value) this.textinput.value = _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"calByte\"].cutByteLength(this.textinput.value, 15);\n\n var _x = Math.floor(this.cv.width / 2 - 167 * this.camera.uiz),\n _y = Math.floor((this.cv.height / 2 - 20 * this.camera.uiz) * (1 - this.textinputanime)),\n w = Math.floor(333 * this.camera.uiz),\n h = Math.floor(41 * this.camera.uiz);\n\n this.textinputanime *= 0.95;\n this.connectinga = Math.max(this.connectinga - 0.2, 0);\n this.textinputcontainer.style.left = window['unscale'](_x) + \"px\";\n this.textinputcontainer.style.top = window['unscale'](_y) + \"px\";\n this.textinput.style.width = window['unscale'](w) + \"px\";\n this.textinput.style.height = window['unscale'](h) + \"px\";\n this.textinput.style.fontSize = this.textinput.style.lineHeight = window['unscale'](h - 0.4) + \"px\";\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawText\"])(this.ctx, (_x + w / 2) / this.camera.uiz, _y / this.camera.uiz - 11, this.camera.uiz, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#FFFFFF\"), \"This is the tale of...\", 20);\n Object(_lib_draw__WEBPACK_IMPORTED_MODULE_4__[\"drawText\"])(this.ctx, (_x + w / 2) / this.camera.uiz, _y / this.camera.uiz + 57, this.camera.uiz, 1, new _lib_util__WEBPACK_IMPORTED_MODULE_5__[\"RGB\"](\"#FFFFFF\"), \"(press enter to spawn)\", 11.7);\n this.ctx.save();\n this.ctx.beginPath();\n this.ctx.lineCap = \"round\";\n this.ctx.lineJoin = \"round\";\n this.ctx.lineWidth = 4.5 * this.camera.uiz;\n this.ctx.fillStyle = \"#FFFFFF\";\n this.ctx.strokeStyle = \"#000000\";\n this.ctx.moveTo(_x, _y + 1);\n this.ctx.lineTo(_x + w, _y + 1);\n this.ctx.lineTo(_x + w, _y + h + 1);\n this.ctx.lineTo(_x, _y + h + 1);\n this.ctx.lineTo(_x, _y + 1);\n this.ctx.fill();\n this.ctx.stroke();\n this.ctx.closePath();\n this.ctx.restore();\n } else {\n this.textinputanime = 1;\n }\n\n requestAnimationFrame(this.loop.bind(this));\n }\n }]);\n\n return System;\n}();\n\n\n\n//# sourceURL=webpack:///./src/js/system.js?"); /***/ }), diff --git a/lib/util.go b/lib/util.go index b3a32fd6..3201ed55 100644 --- a/lib/util.go +++ b/lib/util.go @@ -23,14 +23,17 @@ type Score struct { } // Scoreboard is -type Scoreboard [11]Score +type Scoreboard [10]Score // Scoreboard Push func (sc *Scoreboard) Push(value Score) { - var index = 0 - for ; value.Score < sc[index+1].Score && index < 9; index++ { + var index int = 0 + for ; value.Score < sc[index].Score && index < 9; index++ { } - for j := 9; j >= index; j-- { + if index == 9 { + return + } + for j := 8; j >= index; j-- { sc[j+1] = sc[j] } sc[index] = value diff --git a/main.go b/main.go index 9a2cbd19..18919c5b 100644 --- a/main.go +++ b/main.go @@ -220,7 +220,7 @@ func scoreBoard(ticker time.Ticker) { } } - var sendData []byte = make([]byte, 5) + var sendData []byte = make([]byte, 1) sendData[0] = 3 diff --git a/src/js/data/object.js b/src/js/data/object.js index 2e60bbf9..97d74afd 100644 --- a/src/js/data/object.js +++ b/src/js/data/object.js @@ -80,9 +80,9 @@ export const Obj = function(id) { let a = -((Math.cos(data.dir)*Math.cos(this.dir)) + (Math.sin(data.dir)*Math.sin(this.dir))-1) * Math.PI / 2; if (ccw > 0) { - this.dir -= a * 0.8; + this.dir -= a * 0.5; } else if (ccw < 0) { - this.dir += a * 0.8; + this.dir += a * 0.5; } } else { this.dir = data.dir; diff --git a/src/js/data/ui/ui.js b/src/js/data/ui/ui.js index 779b8dec..bcee80b4 100644 --- a/src/js/data/ui/ui.js +++ b/src/js/data/ui/ui.js @@ -11,6 +11,7 @@ export default class DefaultUI { this.my = my || "mid"; // "up" "mid" "down" this.color = c; this.childs = []; + this.isEnable = true; } addChild(obj) { @@ -18,6 +19,10 @@ export default class DefaultUI { return this; } + setEnable(isEnable) { + this.isEnable = isEnable; + } + setPosition(x, y, w, h, z) { let pos = { sx: 0, @@ -54,12 +59,14 @@ export default class DefaultUI { } draw(ctx, x, y, w, h, z) { + if (!this.isEnable) return; + let {sx, sy} = this.setPosition(x, y, w, h, z); this.drawThis(ctx, sx, sy, z); this.childs.forEach((o) => { - o.draw(ctx, sx, sy, this.w, this.h, z); + o.draw(ctx, sx, sy, this.w * z, this.h * z, z); }); } } @@ -71,8 +78,8 @@ export class Bar extends DefaultUI { } drawThis(ctx, sx, sy, z) { - z *= 3; - drawBar(ctx, sx / z, sy / z + this.h / 2, this.h / 6, this.w / 3, z, 1, this.per, this.color); + if (!this.isEnable) return; + drawBar(ctx, sx / (z * 3), sy / (z * 3) + this.h / 6, this.h / 6, this.w / 3, z * 3, 1, this.per, this.color); } } @@ -85,7 +92,8 @@ export class Text extends DefaultUI { } drawThis(ctx, sx, sy, z) { - drawText(ctx, sx / z, sy / z, z, 1, new RGB("#ffffff"), this.text, this.size, this.dir); + if (!this.isEnable) return; + drawText(ctx, sx / z, sy / z + this.h / 2, z, 1, new RGB("#ffffff"), this.text, this.size, this.dir); } } @@ -103,6 +111,8 @@ export class List extends DefaultUI { } draw(ctx, x, y, w, h, z) { + if (!this.isEnable) return; + let {sx, sy} = this.setPosition(x, y, w, h, z); this.childs.forEach((o) => { diff --git a/src/js/system.js b/src/js/system.js index ba76464a..637f443b 100644 --- a/src/js/system.js +++ b/src/js/system.js @@ -24,13 +24,14 @@ export default class System { this.gameui = new UISystem(); // set gameUI - let scoreboardui = []; + + this.scoreboardui = []; for (let i = 0; i < 10; i ++) { - scoreboardui.push(new ui.Bar(0, 0, 166, 35, "left", "up", new RGB("#00F46C")).setPer(1)); + this.scoreboardui.push(new ui.Bar(0, 0, 166, 35, "left", "up", new RGB("#00F46C")).setPer(1).addChild(new ui.Text(0, 0, 0, 28, "mid", "down", new RGB("#000000")))); } - this.gameui.addUI(new ui.Text(0, 0, 0, 50, "mid", "down", new RGB("#000000")).setText("Test",20)); - this.gameui.addUI(new ui.List(-25, 2, 166, 500, "right", "up").setList(scoreboardui).setPadding(-15)); + this.gameui.addUI(new ui.Text(0, 0, 0, 50, "mid", "down", new RGB("#000000")).setText("Test", 20)); + this.gameui.addUI(new ui.List(-25, 2, 166, 500, "right", "up").setList(this.scoreboardui).setPadding(-15)); this.textinputcontainer = document.getElementById("textInputContainer"); // name input this.textinput = document.getElementById("textInput"); @@ -307,7 +308,6 @@ export default class System { i++; let u = new Uint8Array(msg.data.slice(i,i+len)) - obj.team = String.fromCharCode.apply(null, u); i+=len; @@ -317,6 +317,7 @@ export default class System { u = new Uint8Array(msg.data.slice(i,i+len)); obj.type = new TextDecoder().decode(u); i += len; + len = view.getUint8(i); i++; @@ -360,6 +361,44 @@ export default class System { return; } case 3: { // scoreboard + let i = 1; + let j = 0; + + let maxScore = view.getUint32(i); + + while (i < msg.data.byteLength) { + + let score = view.getUint32(i); + this.scoreboardui[j].setEnable(true); + this.scoreboardui[j].setPer(score / maxScore); + i+=4; + + let len = view.getUint8(i); + i++; + + let u = new Uint8Array(msg.data.slice(i,i+len)) + //let team = String.fromCharCode.apply(null, u); + i+=len; + + len = view.getUint8(i); + i++; + + u = new Uint8Array(msg.data.slice(i,i+len)); + let type = new TextDecoder().decode(u); + if (!type) this.scoreboardui[j].setEnable(false); + i += len; + + len = view.getUint8(i); + i++; + + u = new Uint8Array(msg.data.slice(i,i+len)); + let name = new TextDecoder().decode(u); + i += len; + + this.scoreboardui[j].childs[0].setText(name + "-" + score, 13); + + j++; + } return; }