From 9a99ffcdc78dc1f834fb2552f1e49b314f2e5eac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=84=9C?= <mskim@dragonflygame.com>
Date: Mon, 29 Jan 2024 17:41:36 +0900
Subject: [PATCH] =?UTF-8?q?=EC=9E=84=EC=8B=9C=20=EC=97=85=EB=8D=B0?=
 =?UTF-8?q?=EC=9D=B4=ED=8A=B8=20=EB=82=98=EC=A4=91=EC=97=90=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95=ED=95=A0=EA=B2=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Server/HTML/Spin.cs | 121 ++++++++++++++++++++++++++++++++++++++++++++
 Server/Program.cs   | 116 +-----------------------------------------
 2 files changed, 123 insertions(+), 114 deletions(-)
 create mode 100644 Server/HTML/Spin.cs
diff --git a/Server/HTML/Spin.cs b/Server/HTML/Spin.cs
new file mode 100644
index 0000000..fefa184
--- /dev/null
+++ b/Server/HTML/Spin.cs
@@ -0,0 +1,121 @@
+﻿
+namespace Server.HTML
+{
+    public class Spin
+    {
+        private static string html = @"
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Roulette</title>
+    <style>
+        #container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            height: 100vh;
+        }
+        .input-area {
+            margin-bottom: 10px;
+        }
+        #roulette {
+            width: 200px;
+            height: 200px;
+            border-radius: 50%;
+            background-color: red;
+            color: white;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-size: 24px;
+            margin-top: 20px;
+            transition: opacity 0.5s ease-in-out;
+            cursor: pointer;
+        }
+    </style>
+</head>
+<body>
+    <div id='container'>
+        <h1>Spin the Roulette!</h1>
+        <form id='configForm'>
+            <label for='inputNumber'>Enter the number of texts:</label>
+            <input type='number' id='inputNumber' name='inputNumber' min='1'>
+            <button type='button' onclick='configureRoulette()'>Configure</button>
+        </form>
+        <div id='inputAreas' style='display: none;'></div>
+        <div id='roulette' style='display: none;' onclick='spinRoulette()'>Click to Spin!</div>
+        <form id='spinForm' method='post' action='/spin/random' style='display: none;'>
+            <input type='hidden' name='selectedText' id='selectedTextInput'>
+        </form>
+    </div>
+    <script>
+        function configureRoulette() {
+            const inputNumber = document.getElementById('inputNumber').value;
+            const inputAreas = document.getElementById('inputAreas');
+            inputAreas.innerHTML = '';
+            
+            for (let i = 0; i < inputNumber; i++) {
+                const inputArea = document.createElement('div');
+                inputArea.classList.add('input-area');
+                inputArea.innerHTML = `
+                    <label for='text${i}'>Enter text ${i + 1}:</label>
+                    <input type='text' id='text${i}' name='text${i}'>
+                `;
+                inputAreas.appendChild(inputArea);
+            }
+            
+            document.getElementById('configForm').style.display = 'none';
+            document.getElementById('inputAreas').style.display = 'block';
+            document.getElementById('roulette').style.display = 'flex';
+            document.getElementById('spinForm').style.display = 'flex';
+        }
+        
+        let spinning = false;
+        function spinRoulette() {
+            if (!spinning) {
+                spinning = true;
+                const texts = document.querySelectorAll('input[type=text]');
+                const candidates = [];
+                texts.forEach(text => {
+                    if (text.value.trim() !== '') {
+                        candidates.push(text.value.trim());
+                    }
+                });
+                if (candidates.length > 0) {
+                    let counter = 0;
+                    const intervals = [10, 50, 100, 300, 750];
+                    let timeout = 0;
+                    intervals.forEach((interval, index) => {
+                        setTimeout(() => {
+                            const intervalId = setInterval(() => {
+                                document.getElementById('roulette').innerText = candidates[counter % candidates.length];
+                                counter++;
+                            }, interval);
+                            setTimeout(() => {
+                                clearInterval(intervalId);
+                                if (index === intervals.length - 1) {
+                                    const selectedText = candidates[Math.floor(Math.random() * candidates.length)];
+                                    document.getElementById('roulette').innerText = selectedText;
+                                    document.getElementById('selectedTextInput').value = selectedText;
+                                    spinning = false;
+                                }
+                            }, 2000); // 2 seconds
+                        }, timeout);
+                        timeout += 2000; // 2 seconds
+                    });
+                } else {
+                    alert('Please enter at least one text.');
+                }
+            }
+        }
+    </script>
+</body>
+</html>
+";
+        public static async Task Main(HttpContext context)
+        {
+            await context.Response.WriteAsync(html);
+        }
+    }
+}
diff --git a/Server/Program.cs b/Server/Program.cs
index a9f8123..7d82e5e 100644
--- a/Server/Program.cs
+++ b/Server/Program.cs
@@ -1,3 +1,4 @@
+using Server.HTML;
 using Server.System;
 
 var builder = WebApplication.CreateBuilder(args);
@@ -17,120 +18,7 @@ var app = builder.Build();
 
 //app.MapPost("/update", GItWebhook.Process);
 
-app.MapGet("/spin", async context =>
-{
-    await context.Response.WriteAsync(@"
-<!DOCTYPE html>
-<html>
-<head>
-    <title>Roulette</title>
-    <style>
-        #container {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            justify-content: center;
-            height: 100vh;
-        }
-        .input-area {
-            margin-bottom: 10px;
-        }
-        #roulette {
-            width: 200px;
-            height: 200px;
-            border-radius: 50%;
-            background-color: red;
-            color: white;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 24px;
-            margin-top: 20px;
-            transition: opacity 0.5s ease-in-out;
-            cursor: pointer;
-        }
-    </style>
-</head>
-<body>
-    <div id='container'>
-        <h1>Spin the Roulette!</h1>
-        <form id='configForm'>
-            <label for='inputNumber'>Enter the number of texts:</label>
-            <input type='number' id='inputNumber' name='inputNumber' min='1'>
-            <button type='button' onclick='configureRoulette()'>Configure</button>
-        </form>
-        <div id='inputAreas' style='display: none;'></div>
-        <div id='roulette' style='display: none;' onclick='spinRoulette()'>Click to Spin!</div>
-        <form id='spinForm' method='post' action='/spin/random' style='display: none;'>
-            <input type='hidden' name='selectedText' id='selectedTextInput'>
-        </form>
-    </div>
-    <script>
-        function configureRoulette() {
-            const inputNumber = document.getElementById('inputNumber').value;
-            const inputAreas = document.getElementById('inputAreas');
-            inputAreas.innerHTML = '';
-            
-            for (let i = 0; i < inputNumber; i++) {
-                const inputArea = document.createElement('div');
-                inputArea.classList.add('input-area');
-                inputArea.innerHTML = `
-                    <label for='text${i}'>Enter text ${i + 1}:</label>
-                    <input type='text' id='text${i}' name='text${i}'>
-                `;
-                inputAreas.appendChild(inputArea);
-            }
-            
-            document.getElementById('configForm').style.display = 'none';
-            document.getElementById('inputAreas').style.display = 'block';
-            document.getElementById('roulette').style.display = 'flex';
-            document.getElementById('spinForm').style.display = 'flex';
-        }
-        
-        let spinning = false;
-        function spinRoulette() {
-            if (!spinning) {
-                spinning = true;
-                const texts = document.querySelectorAll('input[type=text]');
-                const candidates = [];
-                texts.forEach(text => {
-                    if (text.value.trim() !== '') {
-                        candidates.push(text.value.trim());
-                    }
-                });
-                if (candidates.length > 0) {
-                    let counter = 0;
-                    const intervals = [10, 50, 100, 300, 750];
-                    let timeout = 0;
-                    intervals.forEach((interval, index) => {
-                        setTimeout(() => {
-                            const intervalId = setInterval(() => {
-                                document.getElementById('roulette').innerText = candidates[counter % candidates.length];
-                                counter++;
-                            }, interval);
-                            setTimeout(() => {
-                                clearInterval(intervalId);
-                                if (index === intervals.length - 1) {
-                                    const selectedText = candidates[Math.floor(Math.random() * candidates.length)];
-                                    document.getElementById('roulette').innerText = selectedText;
-                                    document.getElementById('selectedTextInput').value = selectedText;
-                                    spinning = false;
-                                }
-                            }, 2000); // 2 seconds
-                        }, timeout);
-                        timeout += 2000; // 2 seconds
-                    });
-                } else {
-                    alert('Please enter at least one text.');
-                }
-            }
-        }
-    </script>
-</body>
-</html>
-
-    ");
-});
+app.MapGet("/spin", Spin.Main);
 
 app.MapPost("/spin/random", async context =>
 {
