削除機能を追加する

public/src/js/canvasdraw.js

@@ -1059,11 +1059,14 @@
 		var ctx = config.ctx
 		ctx.save()
 		
-		if(config.iconName === "download" ||config.iconName === "back"){
+		if(config.iconName === "download" ||config.iconName === "back" ||config.iconName === "trash"){
 			ctx.translate(config.x - 21, config.y - 21)
 			if(config.iconName === "download"){
 				ctx.rotate(Math.PI)
 				ctx.translate(-42, -42)
+			} else if(config.iconName === "trash") {
+				ctx.rotate(Math.PI / 2 * 3)
+				ctx.translate(-42, 0)
 			}
 			
 			var drawLine = y => {
@@ -1095,8 +1098,8 @@
 			drawLine(11)
 			drawTriangle()
 			ctx.translate(-1.5, -0.5)
-			ctx.fillStyle = config.iconName === "download" ? "#a08eea" : "#23a6e1"
-			ctx.strokeStyle = config.iconName === "download" ? "#a08eea" : "#23a6e1"
+			ctx.fillStyle = config.iconName === "download" ? "#a08eea" : config.iconName == "trash" ? "#ff0000" : "#23a6e1"
+			ctx.strokeStyle = config.iconName === "download" ? "#a08eea" :  config.iconName == "trash" ? "#ff0000" : "#23a6e1"
 			ctx.globalCompositeOperation = "darken"
 			drawLine(11)
 			drawTriangle()

public/src/js/main.js

@@ -1,4 +1,9 @@
-addEventListener("error", function(err){
+addEventListener("load", () => {
+  document.querySelector("#version-link").textContent += ("taiko-web vRAINBOW-BETA4"+ "\n\n" + "《ウェブの航海者たちへの手紙》\n\n高潔なるウェブの航海者諸君へ、\n\n風を感じたことがあるかい？ウェブの風。それは時に優雅にして、時に荒々しく吹きすさんでいる。さて、今日はそんな風が再び吹き荒れる日だ。ウェブの航海は決して穏やかではない。時には波に呑まれ、時には星に導かれる。今日、私たちはひとつの航海を終える。だが、その終わりは新たな航路の始まりでもある。さあ、私の友よ、今宵はこの物語に耳を傾けよ。\n\nそれは遠い2024年、四月の初め。夜明けの色が空を染める頃、我々は一つの船出を告げる。ウェブの岸辺に立ち、喜びと哀しみを胸に、我々の旅路の終焉を知らせる。\"taikoapp.uk\"や\"yuuk1.tk\"、そしてその他の名高きサイトたちが、この日をもって船を降りるというのだ。\n\nその理由はさまざまだ。法の嵐に晒され、船員の数も減り、品質の維持も難しくなった。未知の海原を渡る船は、時に流れに飲み込まれ、時には頼りなき星を見失う。そして、かつての楽しみも、やがて影となり、心に暗雲を差す。だが、我々はそこに立ち止まることはない。この船が見たもの、得たものを忘れることはない。\n\n2023年、冬の深き日。我々は航海を開始した。多くの出会いがあった。多くの挑戦が待ち受けていた。そして、多くの喜びと悲しみが交錯した。しかし、それが我々の旅路だった。数えきれぬ航海の記憶が、今も私たちの心に残っている。\n\n我々は感謝に満ちている。ウェブの航海者たちよ、我々の旅を共にしてくれてありがとう。波に揉まれ、星に導かれ、互いの手を取り合って歩んだ日々を忘れない。新たな航路が見えるまで、私たちはここで一息つく。そして、次なる冒険への準備を整えるのだ。\n\nさあ、船出の時が来た。ウェブの海をさまよう船が、新たなる冒険へと進む。時には波に飲まれ、時には星に導かれながら、我々の旅は続く。ウェブの航海者たちよ、未知の海原へと旅立とう。新たなる冒険が待ち受けている。\n");
+  document.querySelector("#version-link").setAttribute("alt", document.querySelector("#version-link").textContent);
+});
+
+addEventListener("error", function(err){
 	var stack
 	if("error" in err && err.error){
 		stack = err.error.stack

public/src/js/songselect.js

@@ -208,13 +208,13 @@ class SongSelect{
                 //     skin: this.songSkin.sourceCode,
                 //     action: "sourceCode",
                 // });
-				for (let i = 0; i < 10; i++) {
+				// for (let i = 0; i < 10; i++) {
 				    this.songs.push({
                         title: "曲を投稿！",
                         skin: this.songSkin.upload,
                         action: "upload",
                     });
-                }
+                // }
 		
 		this.songs.push({
 			title: strings.back,
@@ -253,6 +253,12 @@ class SongSelect{
 			iconName: "download",
 			iconFill: "#e7cbe1",
 			letterSpacing: 4
+		}, {
+			text: "削除",
+			fill: "silver",
+			iconName: "trash",
+			iconFill: "#111111",
+			letterSpacing: 4
 		}]
 		this.optionsList = [strings.none, strings.auto, strings.netplay, "ばいそく", "さんばい", "よんばい", "ばいそく＋オート", "さんばい＋オート", "よんばい＋オート"]
 		
@@ -421,6 +427,10 @@ class SongSelect{
 	}
 
 	setSelectedSong(songIdx, drawBg=true){
+		if (songIdx < 0) {
+			return;
+		}
+
 		if(drawBg){
 			var cat = this.songs[songIdx].originalCategory
 			if(cat){
@@ -588,6 +598,22 @@ class SongSelect{
 				this.toSongSelect()
 			}else if(moveBy === 2){
 				this.toDownload()
+			}else if(moveBy === 3){
+				// ここに削除処理を書く
+				alert("準備はいいですか？ (成功しても反映まで1分ほどかかる場合があります)");
+				fetch("/api/delete", {
+					method: "POST",
+					headers: {
+						"Content-Type": "application/json",
+					},
+					body: JSON.stringify({
+						id: this.songs[this.selectedSong].id,
+					})
+				})
+					.then((res) => res.text())
+					.then((text) => {
+						alert(text);
+					});
 			}else if(moveBy === 1){
 				this.toOptions(1)
 			}else if(moveBy === "maker"){