Update Docs

README.md

@@ -1,65 +1,96 @@
-## URLATE-v3l-frontend
+![header](.github/images/urlate-v3l.webp)
+
+# Avoid & Get on the tempo, URLATE.
 
 ![GitHub last commit (branch)](https://img.shields.io/github/last-commit/HyeokjinKang/urlate-v3l-frontend/main?label=updated)
 ![GitHub Issues](https://badgen.net/github/issues/HyeokjinKang/URLATE-v3l-frontend)
-[![CC BY-NC-SA 4.0][cc-by-nc-sa-shield]][cc-by-nc-sa]
+![GitHub License](https://img.shields.io/github/license/HyeokjinKang/URLATE-v3l-frontend)
+
+URLATE is a open-source rhythm game built with web technologies.  
+It does not support Safari, but it is compatible with Firefox and Blink based browsers such as Chrome, Edge, and Opera.
+
+This repository is based on [URLATE-v3-frontend](https://github.com/Team-Croissant/URLATE-v3-frontend), and is a new version of URLATE with a new UI and new features.  
+If you need to refer to the past commit history, please refer to the repository above.
+
+## Table of Contents
+
+- [Try it out](#try-it-out)
+- [How to play](#how-to-play)
+- [Screenshots](#screenshots)
+- [To-do](#to-do)
+- [Documentation](#documentation)
+- [License](#license)
+- [Tumblbug supporters](#tumblbug-supporters)
+- [Support](#support)
+
+## Try it out
+
+You can play the latest version of URLATE at [urlate.coupy.dev](https://urlate.coupy.dev/).  
+There's an development version of URLATE at [urlate-dev.coupy.dev](https://urlate-dev.coupy.dev/), but it's not recommended to play it because it's not stable, and it may not be playable.
+
+## How to play
+
+[![Tutorial Video](https://img.youtube.com/vi/HD_wtfxZ3Q8/0.jpg)](https://www.youtube.com/watch?v=HD_wtfxZ3Q8)
+
+## Screenshots
+
+### Home
+
+![Home](.github/images/home.webp)
+
+### Profile
+
+![Profile](.github/images/profile.webp)
+
+### Song Select
+
+![Song Select](.github/images/select.webp)
+
+### Gameplay
+
+![Gameplay](.github/images/gameplay.webp)
+
+### Result
+
+![Result](.github/images/result.webp)
 
-[cc-by-nc-sa]: http://creativecommons.org/licenses/by-nc-sa/4.0/
-[cc-by-nc-sa-shield]: https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg
+### Settings
 
-![image](urlate-v3l.png)
+![Settings](.github/images/option.webp)
 
-> Avoid & Get on the tempo, URLATE.
+### Editor
 
-본 리포지토리는 [URLATE-v3-frontend](https://github.com/team-croissant/urlate-v3-frontend)의 복사본을 기반으로 개발되었습니다.  
-과거 커밋 기록들은 모두 삭제되었으며, 필요한 경우 원본 리포지토리를 참고하시길 바랍니다.
+![Editor](.github/images/editor.webp)
 
-## URLATE는 어떤 게임인가요?
+## To-do
 
-URLATE는 리듬탄막슈팅게임입니다.  
-마우스로 커서를 움직여 사방에서 날아오는 총알을 피하며 노트를 정확한 타이밍에 처리해야합니다.  
-2017년부터 MyRhy라는 이름으로 시작된 리듬게임 프로젝트가, 여러 버전의 실험 끝에 현재의 모습을 갖추게 되었습니다.
+The to-do list of URLATE is managed in [GitHub Projects](https://github.com/users/HyeokjinKang/projects/3).
 
-## URLATE-v3l(LITE)는 무엇인가요?
+## Documentation
 
-URLATE는 2019년부터 개발되어 2020년에 첫 데모버전을 공개, [텀블벅](https://tumblbug.com/urlate)에서 크라우드 펀딩을 진행했던 게임입니다.  
-[한국음악저작권협회](https://www.komca.or.kr/CTLJSP), [한국음악실연자협회](https://www.fkmp.kr)와 계약하고 음악 프로듀서 분들과 개인 계약을 맺는 등 체계적이고 합법적인 음악 이용권 준수를 위해 노력했습니다.  
-펀딩 이후 2번에 걸친 Closed Beta Test를 통해 유저들의 피드백을 반영하고 2021년 11월 11일에 정식 출시되었지만, BM의 개선과 운영의 고도화, 팀의 화합을 위해 노력했음에도 여러 가지 어려운 상황으로 인해 게임의 지속 가능성을 찾지 못하여 2022년 1월에 결국 서비스를 종료하게 되었습니다.
+If you want to know the internal structure of URLATE, or if you are interested in developing new features, creating external extensions, etc., you can refer to the [official document](https://urlate-docs.coupy.dev/).
 
-**URLATE-v3l**은 서비스 종료되었던 게임 URLATE를 기반으로 오픈소스 게임을 제작 및 배포하는 프로젝트입니다.  
-본 프로젝트는 URLATE-v3을 오픈소스화하여 꾸준히 개선하고 게임을 재출시하여 유지 가능한 범위에서 지속적으로 서비스 하는데에 본 목적이 있으며, URLATE-v3을 제대로 동작하는 아카이브로 남겨두는 것에 의미가 있습니다.
+## License
 
-## v3과 v3l의 차이
+URLATE-v3l is licensed under the AGPLv3 license.  
+Detailed information about the license can be found [here](https://choosealicense.com/licenses/agpl-3.0/).
 
-URLATE-v3l은 프로젝트로 수익을 창출할 의도가 없습니다.  
-따라서, 기존 v3에 존재하던 스토어, 멤버십 등 수익창출 요소를 모두 제거하여 오직 게임에만 집중하여 운영할 수 있도록 수정되었습니다.
+**If you want to use the source code of this repository for commercial purposes, please contact me via [email](mailto:urlate@coupy.dev).**
 
-또한, 운영 및 유지를 통해 게임을 지속적으로 개선하고, 제대로 **서비스**할 계획입니다.
+Note that the license only applies to the source code of this repository, and does not apply to the assets used in the game.  
+Brand "URLATE" and its logo are credited to Team Croissant.
 
-## QnA
+Copyright informations can be found [here](https://urlate.coupy.dev/info).
 
-### 이 프로젝트는 어디서 구동되고있나요?
+## Tumblbug supporters
 
-[여기](https://urlate.coupy.dev/)에서 URLATE를 직접 플레이 해볼 수 있습니다.
+[URLATE, 웹에서 즐기는 리듬게임](https://tumblbug.com/urlate)
 
-### URLATE를 수정/사용/배포해도 될까요?
+Thank you to everyone who sponsored through Tumblbug.  
+Tumblbug supporters will be rewarded with a special badge in the game.
 
-URLATE-v3l은 CC BY-NC-SA 4.0를 따르고 있습니다. CC BY-NC-SA 4.0의 내용은 다음과 같습니다.
+![Tumblbug supporters](.github/images/supporters.svg)
 
-- 가능
-  - 복제
-  - 전시
-  - 수정
-  - 배포
-  - 개인적 이용
-  - 공연 및 공중송신
-- 제약
-  - 상업적(영리적) 이용 금지
-  - 법적 책임 없음
-  - 보증하지 않음
-  - 추가제한금지
-- 조건
-  - 동일조건변경허락
-  - 저작자표시
+## Support
 
-게임의 모든 리소스는 CC BY-NC-ND 4.0를 따릅니다.
+[!["Buy Me A Coffee"](https://www.buymeacoffee.com/assets/img/custom_images/yellow_img.png)](https://www.buymeacoffee.com/coupy)

config/config_example.json

@@ -1,11 +1,9 @@
 {
-  "project" : {
+  "project": {
     "url": "https://example.com",
     "api": "https://api.example.com",
     "cdn": "https://cdn.example.com",
-    "game": "https://game.example.com",
-    "communityUrl": "https://community.example.com",
-    "miraiUrl": "https://mirai.example.com",
-    "port": 8080
+    "mode": "production",
+    "port": 3000
   }
 }

locales/en.json

@@ -228,5 +228,6 @@
   "alias": "Newbie,Geoplex Fan,Greenstar Fan,mkhito Fan,Neko Hacker Fan,fusq Fan,Yunomi Fan,Synthion Fan,Kunaru Fan,Sakuzyo Fan",
   "recent": "Recent Played",
   "nothing_here": "Nothing here I think ;-;",
-  "bestplay": "Best Play"
+  "bestplay": "Best Play",
+  "rangeCopyAlert": "Please select the element to copy."
 }

package.json

@@ -1,9 +1,9 @@
 {
   "repository": {
     "type": "git",
-    "url": "https://github.com/Team-Croissant/URLATE-frontend"
+    "url": "https://github.com/HyeokjinKang/URLATE-v3l-frontend"
   },
-  "name": "urlate-frontend",
+  "name": "urlate-v3l-frontend",
   "version": "1.0.0",
   "description": "Avoid & Get on the tempo, URLATE",
   "main": "src/",
@@ -14,7 +14,7 @@
     "obfuscate": "javascript-obfuscator public/js/ --output public/js/ --debug-protection false --disable-console-output true --domain-lock 'urlate.coupy.dev' --domain-lock-redirect-url 'urlate.coupy.dev' --numbers-to-expressions true --self-defending true"
   },
   "author": "Team Croissant",
-  "license": "MIT",
+  "license": "AGPL-3.0-or-later",
   "dependencies": {
     "cookie-parser": "^1.4.4",
     "ejs": "^3.1.7",

public/js/play.js

@@ -1392,7 +1392,8 @@ const compClicked = (isTyped, key, isWheel) => {
   let d = Date.now();
   if (!song.playing() && isPaused) {
     isPaused = false;
-    startDate = startDate + d - pauseDate;
+    if (startDate != 0) startDate = startDate + d - pauseDate;
+    else startDate = Date.now();
     floatingResumeContainer.style.opacity = 0;
     setTimeout(() => {
       floatingResumeContainer.style.display = "none";
@@ -1497,7 +1498,7 @@ const calculateScore = (judge, i, ignoreMs) => {
     if (localStorage.record < score) {
       newRecordTime = Date.now();
     }
-    destroyAll();
+    destroyAll(pattern.bullets[pattern.bullets.length - 1].ms);
     effectMs = Date.now();
     if (perfect != 0 && great == 0 && good == 0 && bad == 0 && miss == 0 && bullet == 0) {
       effectNum = 0;
@@ -1527,13 +1528,15 @@ const doneLoading = () => {
     setTimeout(() => {
       document.getElementById("loadingContainer").style.display = "none";
       document.getElementById("componentCanvas").style.transitionDuration = "0s";
+      menuAllowed = true;
     }, 1000);
     setTimeout(() => {
-      song.play();
-      lottieAnim.play();
-      menuAllowed = true;
-      startDate = Date.now();
-    }, 4000);
+      if (!isPaused && startDate == 0) {
+        song.play();
+        lottieAnim.play();
+        startDate = Date.now();
+      }
+    }, 2000);
   }, 1000);
 };
 

public/js/test.js

@@ -1304,7 +1304,8 @@ const compClicked = (isTyped, key, isWheel) => {
   let d = Date.now();
   if (!song.playing() && isPaused) {
     isPaused = false;
-    startDate = startDate + d - pauseDate;
+    if (startDate != 0) startDate = startDate + d - pauseDate;
+    else startDate = Date.now();
     floatingResumeContainer.style.opacity = 0;
     setTimeout(() => {
       floatingResumeContainer.style.display = "none";
@@ -1405,7 +1406,7 @@ const calculateScore = (judge, i, ignoreMs) => {
     comboAlertCount = combo;
   }
   if (i == patternLength - 1) {
-    destroyAll();
+    destroyAll(pattern.bullets[pattern.bullets.length - 1].ms);
     effectMs = Date.now();
     if (perfect != 0 && great == 0 && good == 0 && bad == 0 && miss == 0 && bullet == 0) {
       effectNum = 0;
@@ -1435,13 +1436,15 @@ const doneLoading = () => {
     setTimeout(() => {
       document.getElementById("loadingContainer").style.display = "none";
       document.getElementById("componentCanvas").style.transitionDuration = "0s";
+      menuAllowed = true;
     }, 1000);
     setTimeout(() => {
-      song.play();
-      lottieAnim.play();
-      menuAllowed = true;
-      startDate = Date.now();
-    }, 4000);
+      if (!isPaused && startDate == 0) {
+        song.play();
+        lottieAnim.play();
+        startDate = Date.now();
+      }
+    }, 2000);
   }, 1000);
 };
 

public/js/tutorial.js

@@ -1290,7 +1290,8 @@ const compClicked = (isTyped, key, isWheel) => {
   let d = Date.now();
   if (!song.playing() && isPaused) {
     isPaused = false;
-    startDate = startDate + d - pauseDate;
+    if (startDate != 0) startDate = startDate + d - pauseDate;
+    else startDate = Date.now();
     floatingResumeContainer.style.opacity = 0;
     setTimeout(() => {
       floatingResumeContainer.style.display = "none";
@@ -1421,13 +1422,15 @@ const doneLoading = () => {
     setTimeout(() => {
       document.getElementById("loadingContainer").style.display = "none";
       document.getElementById("componentCanvas").style.transitionDuration = "0s";
+      menuAllowed = true;
     }, 1000);
     setTimeout(() => {
-      song.play();
-      lottieAnim.play();
-      menuAllowed = true;
-      startDate = Date.now();
-    }, 4000);
+      if (!isPaused && startDate == 0) {
+        song.play();
+        lottieAnim.play();
+        startDate = Date.now();
+      }
+    }, 2000);
   }, 1000);
 };
 

src/index.ts

@@ -19,9 +19,7 @@ app.get("/", (req, res) => {
   res.render("index", {
     url: config.project.url,
     api: config.project.api,
-    ver: process.env.npm_package_version,
-    community: config.project.community,
-    mirai: config.project.mirai,
+    ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version,
   });
 });
 
@@ -36,15 +34,15 @@ app.get("/ko", function (req, res) {
 });
 
 app.get("/join", (req, res) => {
-  res.render("join", { api: config.project.api, ver: process.env.npm_package_version, url: config.project.url });
+  res.render("join", { api: config.project.api, ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version, url: config.project.url });
 });
 
 app.get("/game", async (req, res) => {
   res.render("game", {
     cdn: config.project.cdn,
     url: config.project.url,
     api: config.project.api,
-    ver: process.env.npm_package_version,
+    ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version,
   });
 });
 
@@ -53,7 +51,7 @@ app.get("/editor", async (req, res) => {
     cdn: config.project.cdn,
     url: config.project.url,
     api: config.project.api,
-    ver: process.env.npm_package_version,
+    ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version,
   });
 });
 
@@ -62,7 +60,7 @@ app.get("/test", async (req, res) => {
     cdn: config.project.cdn,
     url: config.project.url,
     api: config.project.api,
-    ver: process.env.npm_package_version,
+    ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version,
   });
 });
 
@@ -71,7 +69,7 @@ app.get("/play", async (req, res) => {
     cdn: config.project.cdn,
     url: config.project.url,
     api: config.project.api,
-    ver: process.env.npm_package_version,
+    ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version,
   });
 });
 
@@ -80,7 +78,7 @@ app.get("/tutorial", async (req, res) => {
     cdn: config.project.cdn,
     url: config.project.url,
     api: config.project.api,
-    ver: process.env.npm_package_version,
+    ver: config.project.mode == "test" ? Date.now() : process.env.npm_package_version,
   });
 });
 
@@ -97,6 +95,6 @@ app.get("/privacy", (req, res) => {
 });
 
 app.listen(config.project.port, () => {
-  signale.info(`URLATE-v3l-frontend is running on version ${process.env.npm_package_version}.`);
+  signale.info(`URLATE-v3l-frontend is running on version ${config.project.mode == "test" ? Date.now() : process.env.npm_package_version}.`);
   signale.success(`HTTP Server running at port ${config.project.port}.`);
 });

views/game.ejs

@@ -287,7 +287,7 @@
       <img src="/images/logos/URLATE_NO_CIRCLE.webp" id="infoLogo" />
       <br />
       <span id="license">
-        <span id="licenseMain">URLATE is under the CC-BY-NC-SA 4.0 license.</span>
+        <span id="licenseMain">URLATE is under the AGPLv3 License.</span>
         <br /><br />
         Copyright notices for resources included in the game are located at <a href="https://urlate.coupy.dev/info" target="_blank" class="link">urlate.coupy.dev/info</a>.
         <br />

views/info.ejs

@@ -115,7 +115,7 @@
       <a href="https://github.com/HyeokjinKang/URLATE-v3l-frontend" target="_blank" class="link">Front-end</a>
       <a href="https://github.com/HyeokjinKang/URLATE-v3l-backend" target="_blank" class="link">Back-end</a>
     </div>
-    <span class="content">URLATE source codes are licensed under a <strong>Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License</strong>.</span>
+    <span class="content">URLATE source codes are licensed under the <strong>AGPLv3 License</strong>.</span>
     <span class="copyright">© Team Croissant, 2023</span>
     <span class="copyright">© Coupy, 2023</span>
     <span class="title">UI/UX</span>