From b9d990a64350caddac81573b1eaf62912fb77b9e Mon Sep 17 00:00:00 2001
From: KatieFrogs <23621460+KatieFrogs@users.noreply.github.com>
Date: Wed, 16 Mar 2022 19:04:51 +0300
Subject: [PATCH] Plugins: Fix browse button on iOS

---
 public/src/css/view.css   | 17 +++++++++++++++++
 public/src/js/main.js     |  2 +-
 public/src/js/settings.js | 17 ++++++++---------
 3 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/public/src/css/view.css b/public/src/css/view.css
index 709009f..0a296c8 100644
--- a/public/src/css/view.css
+++ b/public/src/css/view.css
@@ -452,3 +452,20 @@ kbd{
 #dropzone.dragover{
 	opacity: 1;
 }
+.plugin-browse-button{
+	position: relative;
+}
+#plugin-browse{
+	position: absolute;
+	font-size: inherit;
+	top: -0.1em;
+	left: -0.1em;
+	right: -0.1em;
+	bottom: -0.1em;
+	border-radius: 0.5em;
+	opacity: 0;
+	cursor: pointer;
+}
+#plugin-browse::-webkit-file-upload-button{
+	cursor: pointer;
+}
diff --git a/public/src/js/main.js b/public/src/js/main.js
index 702d29c..f12196b 100644
--- a/public/src/js/main.js
+++ b/public/src/js/main.js
@@ -97,7 +97,7 @@ var plugins
 var noResizeRoot = false
 
 pageEvents.add(root, ["touchstart", "touchmove", "touchend"], event => {
-	if(event.cancelable && cancelTouch && event.target.tagName !== "SELECT"){
+	if(event.cancelable && cancelTouch && event.target.tagName !== "SELECT" && (event.target.tagName !== "INPUT" || event.target.type !== "file")){
 		event.preventDefault()
 	}
 })
diff --git a/public/src/js/settings.js b/public/src/js/settings.js
index f52e817..b171920 100644
--- a/public/src/js/settings.js
+++ b/public/src/js/settings.js
@@ -384,24 +384,22 @@ class SettingsView{
 		if(this.customSettings){
 			var form = document.createElement("form")
 			this.browse = document.createElement("input")
-			this.browse.id = "browse"
+			this.browse.id = "plugin-browse"
 			this.browse.type = "file"
 			this.browse.multiple = true
 			this.browse.accept = ".taikoweb.js"
 			pageEvents.add(this.browse, "change", this.browseChange.bind(this))
 			form.appendChild(this.browse)
-			loader.screen.appendChild(form)
 			this.browseButton = document.createElement("div")
-			this.browseButton.classList.add("taibtn", "stroke-sub")
+			this.browseButton.classList.add("taibtn", "stroke-sub", "plugin-browse-button")
+			this.browseText = document.createTextNode("")
+			this.browseButton.appendChild(this.browseText)
+			this.browseButton.appendChild(form)
 			this.defaultButton.parentNode.insertBefore(this.browseButton, this.defaultButton)
 			this.items.push({
 				id: "browse",
 				settingBox: this.browseButton
 			})
-			this.addTouch(this.browseButton, () => {
-				this.playSound("se_don")
-				this.browse.click()
-			})
 		}
 		this.showDefault = !this.customSettings || plugins.allPlugins.filter(obj => obj.plugin.imported).length
 		if(this.showDefault){
@@ -1189,7 +1187,8 @@ class SettingsView{
 		this.setAltText(this.viewTitle, this.customSettings ? strings.plugins.title : strings.gameSettings)
 		this.setAltText(this.endButton, strings.settings.ok)
 		if(this.customSettings){
-			this.setAltText(this.browseButton, strings.plugins.browse)
+			this.browseText.data = strings.plugins.browse
+			this.browseButton.setAttribute("alt", strings.plugins.browse)
 		}else{
 			this.setAltText(this.gamepadTitle, strings.settings.gamepadLayout.name)
 			this.setAltText(this.gamepadEndButton, strings.settings.ok)
@@ -1263,9 +1262,9 @@ class SettingsView{
 		}
 		if(this.customSettings){
 			pageEvents.remove(this.browse, "change")
-			this.removeTouch(this.browseButton)
 			delete this.browse
 			delete this.browseButton
+			delete this.browseText
 		}else{
 			this.removeTouch(this.gamepadSettings)
 			this.removeTouch(this.gamepadEndButton)