Merge branch 'songselect-translatable-song-titles' of LoveEevee/taiko-web into master

app.py

@@ -166,7 +166,7 @@ def route_api_songs():
     categories = {}
     def_category = {'title': None, 'title_en': None}
     for cat in raw_categories:
-        categories[cat[0]] = {'title': cat[1], 'title_en': cat[2]}
+        categories[cat[0]] = cat[1]
     
     raw_song_skins = query_db('select * from song_skins')
     song_skins = {}
@@ -185,15 +185,14 @@ def route_api_songs():
         songs_out.append({
             'id': song_id,
             'title': song[1],
-            'title_en': song[2],
+            'title_lang': song[2],
             'subtitle': song[3],
-            'subtitle_en': song[4],
+            'subtitle_lang': song[4],
             'stars': [
                 song[5], song[6], song[7], song[8], song[9]
             ],
             'preview': preview,
-            'category': category_out['title'],
+            'category': category_out,
-            'category_en': category_out['title_en'],
             'type': song_type,
             'offset': song[13],
             'song_skin': song_skin_out

public/src/css/songbg.css

@@ -33,7 +33,8 @@
 	max-height: calc(50% + 24vw);
 }
 .touchp2 #songbg{
-	height: calc(50% - 5.5vw);
+	height: calc(50% - 5.9vw);
+	min-height: 39.5%;
 }
 .multiplayer.portrait #songbg{
 	height: calc(50% - 37vw);
@@ -89,6 +90,9 @@
 	height: calc(50% - 13.7vw);
 	min-height: 25.6%;
 }
+.multiplayer .donbg{
+	min-height: 27.2%;
+}
 .portrait .donbg{
 	height: calc(50% - 48.9vw);
 	min-height: 22.5%;

public/src/js/about.js

@@ -11,7 +11,7 @@
 		if(touchEnabled){
 			this.tutorialOuter.classList.add("touch-enabled")
 		}
-		this.linkGithub = document.getElementById("link-github")
+		this.linkIssues = document.getElementById("link-issues")
 		this.linkEmail = document.getElementById("link-email")
 		
 		var tutorialTitle = document.getElementById("tutorial-title")
@@ -29,7 +29,13 @@
 		this.endButton.innerText = strings.tutorial.ok
 		this.endButton.setAttribute("alt", strings.tutorial.ok)
 		
-		pageEvents.add(this.linkGithub, ["click", "touchend"], this.linkButton.bind(this))
+		var versionUrl = "https://github.com/bui/taiko-web/"
+		if(gameConfig._version){
+			versionUrl = gameConfig._version.url
+		}
+		this.getLink(this.linkIssues).href = versionUrl + "issues"
+		
+		pageEvents.add(this.linkIssues, ["click", "touchend"], this.linkButton.bind(this))
 		pageEvents.add(this.linkEmail, ["click", "touchend"], this.linkButton.bind(this))
 		pageEvents.once(this.endButton, ["mousedown", "touchstart"]).then(this.onEnd.bind(this))
 		pageEvents.keyOnce(this, 13, "down").then(this.onEnd.bind(this))
@@ -141,7 +147,6 @@
 		}
 		
 		var issueBody = strings.issueTemplate + "\n\n\n\n" + diag
-		this.getLink(this.linkGithub).href += "?body=" + encodeURIComponent(issueBody)
 		this.getLink(this.linkEmail).href += "?body=" + encodeURIComponent(issueBody.replace(/\n/g, "<br>\r\n"))
 	}
 	getLink(target){
@@ -153,7 +158,7 @@
 	clean(){
 		cancelTouch = true
 		this.gamepad.clean()
-		pageEvents.remove(this.linkGithub, ["click", "touchend"])
+		pageEvents.remove(this.linkIssues, ["click", "touchend"])
 		pageEvents.remove(this.linkEmail, ["click", "touchend"])
 		pageEvents.remove(this.endButton, ["mousedown", "touchstart"])
 		if(this.textarea){
@@ -164,7 +169,7 @@
 		delete this.diagTxt
 		delete this.version
 		delete this.tutorialOuter
-		delete this.linkGithub
+		delete this.linkIssues
 		delete this.linkEmail
 		delete this.textarea
 	}

public/src/js/controller.js

@@ -32,13 +32,15 @@ class Controller{
 		this.playedSounds = {}
 	}
 	run(syncWith){
+		if(syncWith){
+			this.syncWith = syncWith
+		}
 		this.game.run()
 		this.view.run()
-		if(syncWith){
+		if(this.multiplayer === 1){
-			syncWith.run()
+			syncWith.run(this)
 			syncWith.game.elapsedTime = this.game.elapsedTime
 			syncWith.game.startDate = this.game.startDate
-			this.syncWith = syncWith
 		}
 		requestAnimationFrame(() => {
 			this.startMainLoop()
@@ -54,16 +56,20 @@ class Controller{
 		this.mainLoopRunning = true
 		this.gameLoop()
 		this.viewLoop()
-		this.gameInterval = setInterval(this.gameLoop.bind(this), 1000 / 60)
+		if(this.multiplayer !== 2){
+			this.gameInterval = setInterval(this.gameLoop.bind(this), 1000 / 60)
+		}
 	}
 	stopMainLoop(){
 		this.mainLoopRunning = false
 		this.mainAsset.stop()
-		clearInterval(this.gameInterval)
+		if(this.multiplayer !== 2){
+			clearInterval(this.gameInterval)
+		}
 	}
 	gameLoop(){
 		if(this.mainLoopRunning){
-			if(this.syncWith){
+			if(this.multiplayer === 1){
 				this.syncWith.game.elapsedTime = this.game.elapsedTime
 				this.syncWith.game.startDate = this.game.startDate
 			}
@@ -83,6 +89,9 @@ class Controller{
 					this.game.playMainMusic()
 				}
 			}
+			if(this.multiplayer === 1){
+				this.syncWith.gameLoop()
+			}
 		}
 	}
 	viewLoop(){
@@ -90,7 +99,7 @@ class Controller{
 			if(this.multiplayer !== 2){
 				requestAnimationFrame(() => {
 					this.viewLoop()
-					if(this.syncWith){
+					if(this.multiplayer === 1){
 						this.syncWith.viewLoop()
 					}
 					if(this.scoresheet){
@@ -161,7 +170,7 @@ class Controller{
 		this.playSound(soundID + meka, time)
 	}
 	togglePause(){
-		if(this.syncWith){
+		if(this.multiplayer === 1){
 			this.syncWith.game.togglePause()
 		}
 		this.game.togglePause()
@@ -207,7 +216,7 @@ class Controller{
 		}
 	}
 	clean(){
-		if(this.syncWith){
+		if(this.multiplayer === 1){
 			this.syncWith.clean()
 		}
 		this.stopMainLoop()

public/src/js/game.js

@@ -43,6 +43,12 @@ class Game{
 	initTiming(){
 		// Date when the chrono is started (before the game begins)
 		var offsetTime = Math.max(0, this.timeForDistanceCircle - this.songData.circles[0].ms) |0
+		if(this.controller.multiplayer){
+			var syncWith = this.controller.syncWith
+			var syncCircles = syncWith.game.songData.circles
+			var syncOffsetTime = Math.max(0, this.timeForDistanceCircle - syncCircles[0].ms) |0
+			offsetTime = Math.max(offsetTime, syncOffsetTime)
+		}
 		this.elapsedTime = -offsetTime
 		// The real start for the game will start when chrono will reach 0
 		this.startDate = Date.now() + offsetTime
@@ -320,7 +326,7 @@ class Game{
 				this.musicFadeOut++
 			}else if(this.musicFadeOut === 1 && ms >= started + 1600){
 				this.controller.gameEnded()
-				if(!p2.session){
+				if(!p2.session && this.controller.multiplayer === 1){
 					p2.send("gameend")
 				}
 				this.musicFadeOut++

public/src/js/importsongs.js

@@ -35,33 +35,23 @@
 			"ura": 4
 		}
 		this.categories = {
-			"j-pop": "J-POP",
-			"pop": "J-POP",
-			"アニメ": "アニメ",
-			"anime": "アニメ",
-			"アニメ": "アニメ",
-			"ボーカロイド™曲": "ボーカロイド™曲",
 			"ボーカロイド曲": "ボーカロイド™曲",
 			"ボーカロイド": "ボーカロイド™曲",
-			"vocaloid™ music": "ボーカロイド™曲",
 			"vocaloid music": "ボーカロイド™曲",
 			"vocaloid": "ボーカロイド™曲",
-			"バラエティ": "バラエティ",
 			"バラエティー": "バラエティ",
 			"どうよう": "バラエティ",
 			"童謡・民謡": "バラエティ",
-			"variety": "バラエティ",
 			"children": "バラエティ",
 			"children/folk": "バラエティ",
 			"children-folk": "バラエティ",
-			"クラシック": "クラシック",
 			"クラッシック": "クラシック",
-			"classical": "クラシック",
+			"classic": "クラシック"
-			"classic": "クラシック",
+		}
-			"ゲームミュージック": "ゲームミュージック",
+		for(var i in allStrings){
-			"game music": "ゲームミュージック",
+			for(var ja in allStrings[i].categories){
-			"ナムコオリジナル": "ナムコオリジナル",
+				this.categories[allStrings[i].categories[ja].toLowerCase()] = ja
-			"namco original": "ナムコオリジナル"
+			}
 		}
 		
 		for(var i = 0; i < files.length; i++){

public/src/js/songselect.js

@@ -94,11 +94,12 @@ class SongSelect{
 		
 		this.songs = []
 		for(let song of assets.songs){
-			var en = strings.id === "en" && song.title_en
+			var title = this.getLocalTitle(song.title, song.title_lang)
+			var subtitle = this.getLocalTitle(title === song.title ? song.subtitle : "", song.subtitle_lang)
 			this.songs.push({
 				id: song.id,
-				title: en ? song.title_en : song.title,
+				title: title,
-				subtitle: en ? song.subtitle_en : song.subtitle,
+				subtitle: subtitle,
 				skin: song.category in this.songSkin ? this.songSkin[song.category] : this.songSkin.default,
 				stars: song.stars,
 				category: song.category,
@@ -1325,7 +1326,7 @@ class SongSelect{
 						if(this.selectedDiff === 4 + this.diffOptions.length){
 							currentDiff = 3
 						}
-						if(i === currentSong.p2Cursor){
+						if(i === currentSong.p2Cursor && p2.socket.readyState === 1){
 							this.draw.diffCursor({
 								ctx: ctx,
 								font: this.font,
@@ -1349,7 +1350,7 @@ class SongSelect{
 									font: this.font,
 									x: _x,
 									y: _y - 65,
-									side: currentSong.p2Cursor === currentDiff
+									side: currentSong.p2Cursor === currentDiff && p2.socket.readyState === 1
 								})
 							}
 							if(highlight){
@@ -1664,7 +1665,7 @@ class SongSelect{
 			})
 		}
 		this.draw.songFrame(config)
-		if(config.song.p2Cursor){
+		if(config.song.p2Cursor && p2.socket.readyState === 1){
 			this.draw.diffCursor({
 				ctx: ctx,
 				font: this.font,
@@ -1853,6 +1854,22 @@ class SongSelect{
 		return ((index % length) + length) % length
 	}
 	
+	getLocalTitle(title, titleLang){
+		if(titleLang){
+			titleLang = titleLang.split("\n")
+			titleLang.forEach(line => {
+				var space = line.indexOf(" ")
+				var id = line.slice(0, space)
+				if(id === strings.id){
+					title = line.slice(space + 1)
+				}else if(titleLang.length === 1 && strings.id === "en" && !(id in allStrings)){
+					title = line
+				}
+			})
+		}
+		return title
+	}
+	
 	getMS(){
 		return Date.now()
 	}

public/src/js/strings.js

@@ -78,7 +78,7 @@
 		bugReporting: [
 			"このシミュレータは現在開発中です。",
 			"バグが発生した場合は、報告してください。",
-			"GitHubかメールでバグを報告してください。"
+			"Gitリポジトリかメールでバグを報告してください。"
 		],
 		diagnosticWarning: "以下の端末診断情報も併せて報告してください！",
 		issueTemplate: "###### 下記の問題を説明してください。 スクリーンショットと診断情報を含めてください。"
@@ -169,7 +169,7 @@ function StringsEn(){
 		bugReporting: [
 			"This simulator is still in development.",
 			"Please report any bugs you find.",
-			"You can report bugs either via GitHub or email."
+			"You can report bugs either via our Git repository or email."
 		],
 		diagnosticWarning: "Be sure to include the following diagnostic data!",
 		issueTemplate: "###### Describe the problem you are having below. Please include a screenshot and the diagnostic information."
@@ -260,7 +260,7 @@ function StringsCn(){
 		bugReporting: [
 			"This simulator is still in development.",
 			"Please report any bugs you find.",
-			"You can report bugs either via GitHub or email."
+			"You can report bugs either via our Git repository or email."
 		],
 		diagnosticWarning: "Be sure to include the following diagnostic data!",
 		issueTemplate: "###### Describe the problem you are having below. Please include a screenshot and the diagnostic information."
@@ -351,7 +351,7 @@ function StringsTw(){
 		bugReporting: [
 			"This simulator is still in development.",
 			"Please report any bugs you find.",
-			"You can report bugs either via GitHub or email."
+			"You can report bugs either via our Git repository or email."
 		],
 		diagnosticWarning: "Be sure to include the following diagnostic data!",
 		issueTemplate: "###### Describe the problem you are having below. Please include a screenshot and the diagnostic information."
@@ -442,7 +442,7 @@ function StringsKo(){
 		bugReporting: [
 			"This simulator is still in development.",
 			"Please report any bugs you find.",
-			"You can report bugs either via GitHub or email."
+			"You can report bugs either via our Git repository or email."
 		],
 		diagnosticWarning: "Be sure to include the following diagnostic data!",
 		issueTemplate: "###### Describe the problem you are having below. Please include a screenshot and the diagnostic information."

public/src/js/view.js

@@ -220,7 +220,7 @@
 		
 		this.drawGogoTime()
 		
-		if(!touchMultiplayer){
+		if(!touchMultiplayer || this.multiplayer === 1 && frameTop >= 0){
 			this.assets.drawAssets("background")
 		}
 		

public/src/views/about.html

@@ -4,8 +4,8 @@
 		<div id="tutorial-content"></div>
 		<div id="diag-txt"></div>
 		<div id="about-link-btns">
-			<div id="link-github" class="taibtn stroke-sub link-btn" alt="GitHub">
+			<div id="link-issues" class="taibtn stroke-sub link-btn" alt="Issues">
-				<a href="https://github.com/bui/taiko-web/issues/new" target="_blank">GitHub</a>
+				<a target="_blank">Issues</a>
 			</div>
 			<div id="link-email" class="taibtn stroke-sub link-btn" alt="taiko@bui.pm">
 				<a href="mailto:taiko@bui.pm">taiko@bui.pm</a>

templates/index.html

@@ -23,7 +23,7 @@
 	<div id="screen" class="pattern-bg"></div>
 	<div id="version">
 		{% if version %}
-			<a href="https://github.com/bui/taiko-web/commit/{{version.commit}}" target="_blank" id="version-link" class="stroke-sub" alt="taiko-web ver.{{version.version}} ({{version.commit_short}})">taiko-web ver.{{version.version}} ({{version.commit_short}})</a>
+			<a href="{{version.url}}commit/{{version.commit}}" target="_blank" id="version-link" class="stroke-sub" alt="taiko-web ver.{{version.version}} ({{version.commit_short}})">taiko-web ver.{{version.version}} ({{version.commit_short}})</a>
 		{% else %}
 			<a href="https://github.com/bui/taiko-web" target="_blank" id="version-link" class="stroke-sub" alt="taiko-web (unknown version)">taiko-web (unknown version)</a>
 		{% endif %}