camill/uno-game-js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added title

Browse Source
This commit is contained in:
Eunchong Kim 2021-07-25 18:57:31 +09:00
parent ccc7d62016
commit cf88c3d6a8
3 changed files with 46 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
js/uno_game.js
View File

@ -16,7 +16,7 @@
\***************************************************************************************************************/
/***/ ((module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/getUrl.js */ \"./node_modules/css-loader/dist/runtime/getUrl.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_URL_IMPORT_0___ = new URL(/* asset import */ __webpack_require__(/*! ../images/green_table.jpg */ \"./src/images/green_table.jpg\"), __webpack_require__.b);\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default()(function(i){return i[1]});\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1___default()(___CSS_LOADER_URL_IMPORT_0___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \".uno-game-div {\\n width: 100%;\\n height: 100%;\\n margin: 0;\\n}\\n\\n.uno-game-canv-default {\\n position: absolute;\\n display: block;\\n}\\n\\n.uno-game-canv-bkg {\\n background-image: url(\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \");\\n}\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://uno-game/./src/styles/uno-game.scss?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/getUrl.js */ \"./node_modules/css-loader/dist/runtime/getUrl.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_URL_IMPORT_0___ = new URL(/* asset import */ __webpack_require__(/*! ../images/green_table.jpg */ \"./src/images/green_table.jpg\"), __webpack_require__.b);\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default()(function(i){return i[1]});\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_1___default()(___CSS_LOADER_URL_IMPORT_0___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \".uno-game-div {\\n width: 100%;\\n height: 100%;\\n margin: 0;\\n}\\n\\n.uno-game-canv-default {\\n position: absolute;\\n display: block;\\n}\\n\\n.uno-game-canv-bkg {\\n background-image: url(\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \");\\n}\\n\\n.uno-game-typewriter {\\n position: absolute;\\n left: 0;\\n right: 0;\\n font-family: \\\"Waiting for the Sunrise\\\", cursive;\\n font-weight: bold;\\n text-align: center;\\n overflow: hidden;\\n /* Ensures the content is not revealed until the animation */\\n border-right: 0.15em solid orange;\\n /* The typwriter cursor */\\n white-space: nowrap;\\n /* Keeps the content on a single line */\\n margin: 0 auto;\\n /* Gives that scrolling effect as the typing happens */\\n letter-spacing: 0.15em;\\n /* Adjust as needed */\\n animation: typing 3.5s steps(20, end), blink-caret 0.75s step-end infinite;\\n}\\n\\n/* The typing effect */\\n@keyframes typing {\\n from {\\n width: 0;\\n }\\n to {\\n width: 100%;\\n }\\n}\\n/* The typewriter cursor effect */\\n@keyframes blink-caret {\\n from, to {\\n border-color: transparent;\\n }\\n 50% {\\n border-color: orange;\\n }\\n}\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://uno-game/./src/styles/uno-game.scss?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js");
/***/ }),
@ -146,7 +146,7 @@ eval("module.exports = __webpack_require__.p + \"494a6b831f5837e010b9.jpg\";\n\n
\**********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _js_basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./js/basic_canvas.js */ \"./src/js/basic_canvas.js\");\n/* harmony import */ var _js_room_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./js/room.js */ \"./src/js/room.js\");\n/* harmony import */ var _js_box_text_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./js/box_text.js */ \"./src/js/box_text.js\");\n/* harmony import */ var _styles_uno_game_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./styles/uno-game.scss */ \"./src/styles/uno-game.scss\");\n/* Class */\n\n\n\n/* SCSS */\n\n\n// Global variables\n__webpack_require__.g.canvas_count = 0; // increment number to avoid the same canvas id\n\n// uno-game-div must be found\n__webpack_require__.g.uno_game_div;\n__webpack_require__.g.uno_game_w = window.innerWidth;\n__webpack_require__.g.uno_game_h = window.innerHeight;\n\n/* Main view */\ndocument.addEventListener('DOMContentLoaded', () => {\n // Get uno-game-div\n __webpack_require__.g.uno_game_div = document.getElementById('uno-game');\n __webpack_require__.g.uno_game_div.classList.add('uno-game-div');\n\n // Create background canv\n const bkg = new _js_basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default(0, 0, __webpack_require__.g.uno_game_w, __webpack_require__.g.uno_game_h);\n bkg.canvas.classList.add('uno-game-canv-bkg');\n\n // Create room button\n const create_room_box_text = new _js_box_text_js__WEBPACK_IMPORTED_MODULE_2__.default(__webpack_require__.g.uno_game_w*5/12, __webpack_require__.g.uno_game_h*3/4,\n __webpack_require__.g.uno_game_w/6, __webpack_require__.g.uno_game_w/12, 'Create Game');\n\n /* Canvas click */\n create_room_box_text.canvas.addEventListener(\"click\", e => {\n create_room_box_text.remove();\n createRoom();\n });\n});\n\n\n/* Game start */\nasync function createRoom() {\n console.info('Game start');\n\n const room = new _js_room_js__WEBPACK_IMPORTED_MODULE_1__.default('room1');\n\n room.addHuman('newini');\n room.addBot();\n room.addBot();\n room.addBot();\n\n await( room.initCards() );\n\n await new Promise(resolve => setTimeout(resolve, 1000));\n\n await( room.dealCards() );\n\n await new Promise(resolve => setTimeout(resolve, 500));\n\n await( room.startGame() );\n}\n\n\n\nconsole.log('Uno End')\n\n\n//# sourceURL=webpack://uno-game/./src/index.js?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _js_basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./js/basic_canvas.js */ \"./src/js/basic_canvas.js\");\n/* harmony import */ var _js_room_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./js/room.js */ \"./src/js/room.js\");\n/* harmony import */ var _js_box_text_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./js/box_text.js */ \"./src/js/box_text.js\");\n/* harmony import */ var _styles_uno_game_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./styles/uno-game.scss */ \"./src/styles/uno-game.scss\");\n/* Class */\n\n\n\n/* SCSS */\n\n\n// Global variables\n__webpack_require__.g.canvas_count = 0; // increment number to avoid the same canvas id\n\n// uno-game-div must be found\n__webpack_require__.g.uno_game_div;\n__webpack_require__.g.uno_game_w = window.innerWidth;\n__webpack_require__.g.uno_game_h = window.innerHeight;\n\n/* Main view */\ndocument.addEventListener('DOMContentLoaded', () => {\n // Get uno-game-div\n __webpack_require__.g.uno_game_div = document.getElementById('uno-game');\n __webpack_require__.g.uno_game_div.classList.add('uno-game-div');\n\n // Create background canv\n const bkg = new _js_basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default(0, 0, __webpack_require__.g.uno_game_w, __webpack_require__.g.uno_game_h);\n bkg.canvas.classList.add('uno-game-canv-bkg');\n\n // Create UNO title\n const title = document.createElement('h1');\n title.innerHTML = 'UNO Game'\n title.classList.add('uno-game-typewriter')\n title.style.fontSize = __webpack_require__.g.uno_game_h/6 + 'px';\n title.style.top = __webpack_require__.g.uno_game_h/3 + 'px';\n title.style.zIndex = __webpack_require__.g.canvas_count;\n __webpack_require__.g.canvas_count++;\n __webpack_require__.g.uno_game_div.appendChild( title );\n\n // Create room button\n const create_room_box_text = new _js_box_text_js__WEBPACK_IMPORTED_MODULE_2__.default(__webpack_require__.g.uno_game_w*5/12, __webpack_require__.g.uno_game_h*3/4,\n __webpack_require__.g.uno_game_w/6, __webpack_require__.g.uno_game_w/12, 'Create Game');\n create_room_box_text.canvas.addEventListener(\"click\", e => {\n // Remove elements\n title.remove();\n create_room_box_text.remove();\n createRoom();\n });\n});\n\n\n/* Game start */\nasync function createRoom() {\n console.info('Game start');\n\n const room = new _js_room_js__WEBPACK_IMPORTED_MODULE_1__.default('room1');\n\n room.addHuman('newini');\n room.addBot();\n room.addBot();\n room.addBot();\n\n await( room.initCards() );\n\n await new Promise(resolve => setTimeout(resolve, 1000));\n\n await( room.dealCards() );\n\n await new Promise(resolve => setTimeout(resolve, 500));\n\n await( room.startGame() );\n}\n\n\n\nconsole.log('Uno End')\n\n\n//# sourceURL=webpack://uno-game/./src/index.js?");
/***/ }),

14
src/index.js
View File

@ -23,12 +23,22 @@ document.addEventListener('DOMContentLoaded', () => {
const bkg = new BasicCanvas(0, 0, global.uno_game_w, global.uno_game_h);
bkg.canvas.classList.add('uno-game-canv-bkg');
// Create UNO title
const title = document.createElement('h1');
title.innerHTML = 'UNO Game'
title.classList.add('uno-game-typewriter')
title.style.fontSize = global.uno_game_h/6 + 'px';
title.style.top = global.uno_game_h/3 + 'px';
title.style.zIndex = global.canvas_count;
global.canvas_count++;
global.uno_game_div.appendChild( title );
// Create room button
const create_room_box_text = new BoxText(global.uno_game_w*5/12, global.uno_game_h*3/4,
global.uno_game_w/6, global.uno_game_w/12, 'Create Game');
/* Canvas click */
create_room_box_text.canvas.addEventListener("click", e => {
// Remove elements
title.remove();
create_room_box_text.remove();
createRoom();
});

32
src/styles/uno-game.scss
View File

@ -12,3 +12,35 @@
.uno-game-canv-bkg {
background-image: url('../images/green_table.jpg');
}
// Title
.uno-game-typewriter {
position: absolute;
left: 0;
right: 0;
font-family: 'Waiting for the Sunrise', cursive;
font-weight: bold;
text-align: center;
overflow: hidden; /* Ensures the content is not revealed until the animation */
border-right: .15em solid orange; /* The typwriter cursor */
white-space: nowrap; /* Keeps the content on a single line */
margin: 0 auto; /* Gives that scrolling effect as the typing happens */
letter-spacing: .15em; /* Adjust as needed */
animation:
typing 3.5s steps(20, end),
blink-caret .75s step-end infinite;
}
/* The typing effect */
@keyframes typing {
from { width: 0 }
to { width: 100% }
}
/* The typewriter cursor effect */
@keyframes blink-caret {
from, to { border-color: transparent }
50% { border-color: orange; }
}