Undid storing categories in strings.js, instead using the localization method...

Undid storing categories in strings.js, instead using the localization method in songselect.js. category info gets passed down to view.js.

public/src/js/loader.js

@@ -106,16 +106,11 @@ class Loader{
 		})
 
 		this.addPromise(this.ajax("/api/categories").then(cats => {
-			let jsonCategories = JSON.parse(cats)
-			
-			for (var i in jsonCategories) { //rename the song_skin property and add category title to categories array
-				let cat = jsonCategories[i]
-				cat.songSkin = cat.song_Skin
+			assets.categories = JSON.parse(cats)
+			assets.categories.forEach(cat => {
+				cat.songSkin = cat.song_Skin //rename the song_skin property and add category title to categories array
 				delete cat.song_Skin
-				assets.categories.push(cat)
-				let title = cat.title
-				categories[title] = cat.title_lang	
-			}
+			});
 
 			assets.categories.push({
 				title: "default",
@@ -150,8 +145,7 @@ class Loader{
 			if(this.error){
 				return
 			}
-			separateStrings() //iterate over strings and apply translations where required
-			
+
 			assets.categories //load category backgrounds to DOM
 				.filter(cat=>cat.songSkin && cat.songSkin.bg_img)
 				.forEach(cat=>{

public/src/js/settings.js

@@ -145,8 +145,13 @@ class Settings{
 		}
 		return this.allLanguages[0]
 	}
-	setLang(lang, noEvent, stringRepo){
-		stringRepo = lang
+	setLang(lang, noEvent){
+		strings = lang
+
+		var boldFonts = strings.font === "Microsoft YaHei, sans-serif"
+        loader.screen.style.fontFamily = strings.font
+        loader.screen.style.fontWeight = boldFonts ? "bold" : ""
+		loader.screen.classList[boldFonts ? "add" : "remove"]("bold-fonts")
 		
 		if(!noEvent){
 			pageEvents.send("language-change", lang.id)

public/src/js/songselect.js

@@ -80,6 +80,8 @@ class SongSelect{
 		for(let song of assets.songs){
 			var title = this.getLocalTitle(song.title, song.title_lang)
 			var subtitle = this.getLocalTitle(title === song.title ? song.subtitle : "", song.subtitle_lang)
+			let category = assets.categories.find(cat=>cat.id == song.category_id)
+			var categoryName = this.getLocalTitle(category.title, category.title_lang)
 			this.songs.push({
 				id: song.id,
 				title: title,
@@ -87,7 +89,8 @@ class SongSelect{
 				subtitle: subtitle,
 				skin: song.category in this.songSkin ? this.songSkin[song.category] : this.songSkin.default,
 				courses: song.courses,
-				category: song.category,
+				originalCategory: song.category,
+				category: categoryName,
 				category_id: song.category_id,
 				preview: song.preview || 0,
 				type: song.type,
@@ -103,8 +106,8 @@ class SongSelect{
 			})
 		}
 		this.songs.sort((a, b) => {
-			var catA = a.category in this.songSkin ? this.songSkin[a.category] : this.songSkin.default
-			var catB = b.category in this.songSkin ? this.songSkin[b.category] : this.songSkin.default
+			var catA = a.originalCategory in this.songSkin ? this.songSkin[a.originalCategory] : this.songSkin.default
+			var catB = b.originalCategory in this.songSkin ? this.songSkin[b.originalCategory] : this.songSkin.default
 			if(catA.sort === catB.sort){
 				if(a.order === b.order){
 					return a.id > b.id ? 1 : -1
@@ -261,7 +264,7 @@ class SongSelect{
 		}
 		
 		this.songSelect = document.getElementById("song-select")
-		var cat = this.songs[this.selectedSong].category
+		var cat = this.songs[this.selectedSong].originalCategory
 		this.drawBackground(cat)
 		
 		this.previewId = 0
@@ -769,6 +772,7 @@ class SongSelect{
 			"folder": selectedSong.id,
 			"difficulty": diff,
 			"category": selectedSong.category,
+			"category_id":selectedSong.category_id,
 			"type": selectedSong.type,
 			"offset": selectedSong.offset,
 			"songSkin": selectedSong.songSkin,
@@ -1043,8 +1047,8 @@ class SongSelect{
 				])
 			})
 			
-			var category = this.songs[this.selectedSong].category
 			var selectedSong = this.songs[this.selectedSong]
+			var category = selectedSong.category
 			this.draw.category({
 				ctx: ctx,
 				x: winW / 2 - 280 / 2 - 30,
@@ -1069,8 +1073,9 @@ class SongSelect{
 				id: category + selectedSong.skin.outline
 			}, ctx => {
 				if(category){
-					if(category in strings.categories){
-						var categoryName = strings.categories[category]
+					let cat = assets.categories.find(cat=>cat.title === category)
+					if(cat){
+						var categoryName = this.getLocalTitle(cat.title, cat.title_lang)
 					}else{
 						var categoryName = category
 					}
@@ -1167,7 +1172,7 @@ class SongSelect{
 				}
 				
 				if(this.songs[this.selectedSong].action !== "back"){
-					var cat = this.songs[this.selectedSong].category
+					var cat = this.songs[this.selectedSong].originalCategory
 					this.drawBackground(cat)				
 				}
 			}

public/src/js/strings.js

@@ -1073,13 +1073,10 @@ var translations = {
 		ko: "가사가있는"
 	}
 }
-var categories = {}
 
 var allStrings = {}
-var categoryStrings = {}
 
 function separateStrings(){
-
 	for(var j in languageList){
 		var lang = languageList[j]
 		allStrings[lang] = {
@@ -1097,20 +1094,13 @@ function separateStrings(){
 				for(var i in obj){
 					translateObj(obj[i], i, str[name])
 				}
-			}else{ //key appears in string obj but has no language values, so just apply the key name to each language for consistency and as fallback
-				str[name] = name
 			}
 		}
 
 		for(var i in translations){
 			translateObj(translations[i], i, str)
 		}
-
-		categoryStrings[lang] = {}
-		var str = categoryStrings[lang]
-
-		for(var i in categories){
-			translateObj(categories[i], i, str)
-		}
 	}
 }
+
+separateStrings()

public/src/js/titlescreen.js

@@ -11,7 +11,7 @@ class Titlescreen{
 			this.disclaimerCopyright = document.getElementById("title-disclaimer-copyright")
 			this.logo = new Logo()
 		}
-		this.setLang()
+		this.setLang(allStrings[settings.getItem("language")])
 		
 		if(songId){
 			if(localStorage.getItem("tutorial") === "true"){
@@ -76,20 +76,8 @@ class Titlescreen{
 			}, 500)
 		}
 	}
-	setLang(){
-		let stringLang = allStrings[settings.getItem("language")]
-		let categoryLang = categoryStrings[settings.getItem("language")]
-
-		strings = stringLang
-		strings.categories = categoryLang
-
-		settings.setLang(stringLang, true, allStrings)
-		settings.setLang(categoryLang, true, categoryStrings)
-
-		let boldFonts = strings.font === "Microsoft YaHei, sans-serif"
-		loader.screen.style.fontFamily = strings.font
-		loader.screen.style.fontWeight = boldFonts ? "bold" : ""
-		loader.screen.classList[boldFonts ? "add" : "remove"]("bold-fonts")
+	setLang(lang, noEvent){
+        settings.setLang(lang, true)
 
 		if(this.songId){
 			return

public/src/js/view.js

@@ -296,9 +296,9 @@
 					var _x = 628 - _w
 					var _y = 88 - _h
 
-					let category = assets.categories.find(cat=>cat.title == selectedSong.category)
+					let category = assets.categories.find(cat=>cat.id == selectedSong.category_id)
 					if(category != null && category.songSkin != null && category.songSkin.infoFill != null){
-						ctx.fillStyle = assets.categories.find(cat=>cat.title == selectedSong.category).songSkin.infoFill
+						ctx.fillStyle = category.songSkin.infoFill
 					}else{
 						ctx.fillStyle = assets.categories.find(cat=>cat.title == 'default').songSkin.infoFill
 					}
@@ -308,16 +308,11 @@
 						w: _w, h: _h,
 						radius: 11
 					})
-					ctx.fill()
-					
-					if(selectedSong.category in strings.categories){
-						var categoryName = strings.categories[selectedSong.category]
-					}else{
-						var categoryName = selectedSong.category
-					}
+					ctx.fill()					
+
 					this.draw.layeredText({
 						ctx: ctx,
-						text: categoryName,
+						text: selectedSong.category,
 						fontSize: 15,
 						fontFamily: this.font,
 						align: "center",