TCP 서버 모드 추가

2025-01-21 13:19:21 +09:00
parent e23684d833
commit cb9201ddd2
106 changed files with 17710 additions and 0 deletions
@@ -0,0 +1,128 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
+      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout/default_layout}">
+<body>
+
+<section layout:fragment="contentFragment">
+  <script th:src="@{/plugins/vs/loader.js}"></script>
+  <script>
+    require.config({paths: {'vs': '[[@{/plugins/vs}]]'}});
+  </script>
+  <div class="container-fluid mt-2">
+    <div class="toast" role="alert" aria-live="assertive" aria-atomic="true" style="position: absolute; top: 0; left: 0;">
+      <div class="toast-header">
+        <strong class="mr-auto">Alert</strong>
+        <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
+      </div>
+      <div class="toast-body">
+      </div>
+    </div>
+    <form name="nettyServerForm" id="nettyServerForm"
+          th:action="${nettyServer.id == null}?@{/mgmt/socket/register.do}:@{/mgmt/socket/update.do}"
+          th:object='${nettyServer}' method="post">
+      <div class="card col-md">
+        <div class="card-header">
+          <h3 th:if="${nettyServer.id == null}">Create Netty Server</h3>
+          <h3 th:if="${nettyServer.id != null}">Edit Netty Server</h3>
+        </div>
+        <div class="card-body">
+          <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
+          <input type="hidden" name="id" th:value="${nettyServer.id}">
+
+          <!-- Server Name -->
+          <div class="form-floating mt-2">
+            <input type="text" class="form-control"
+                   th:classappend="${#fields.hasErrors('name')}? 'is-invalid'"
+                   th:field="*{name}" required/>
+            <label for="name" class="form-label must">Server Name</label>
+            <th:block th:each="err : ${#fields.errors('name')}">
+              <div th:text="${err}" class="invalid-feedback"></div>
+            </th:block>
+          </div>
+
+          <!-- Port Number -->
+          <div class="form-floating mt-2">
+            <input type="number" class="form-control"
+                   th:classappend="${#fields.hasErrors('port')}? 'is-invalid'"
+                   th:field="*{port}" required
+                   min="1024" max="65535"/>
+            <label for="port" class="form-label must">Port</label>
+            <th:block th:each="err : ${#fields.errors('port')}">
+              <div th:text="${err}" class="invalid-feedback"></div>
+            </th:block>
+          </div>
+
+          <!-- Active Status -->
+          <div class="form-check mt-3">
+            <input type="checkbox" class="form-check-input"
+                   th:field="*{active}" id="active"/>
+            <label class="form-check-label" for="active">Active</label>
+          </div>
+
+          <!-- Script Editor -->
+          <div class="card mt-3">
+            <div class="card-header">Server Script</div>
+            <div class="card-body">
+              <div id="script_editor" style="width:100%;height:400px;border:1px solid grey;"></div>
+              <textarea class="form-control" style="display: none;"
+                        name="script" th:field="*{script}"></textarea>
+            </div>
+          </div>
+        </div>
+        <div class="card-footer">
+          <button type="button" class="btn btn-primary btn_list">
+            <i class="fa-solid fa-list"></i> List
+          </button>
+          <button type="button" class="btn btn-primary btn_register">
+            <i class="fa-sharp fa-solid fa-floppy-disk"></i> Save
+          </button>
+        </div>
+      </div>
+    </form>
+  </div>
+</section>
+</body>
+
+<th:block layout:fragment="contentScript">
+  <script>
+    $(function () {
+      let scriptEditor;
+
+      require(['vs/editor/editor.main'], function () {
+        const defaultScript = `function processJson(message) {
+    //process message;
+
+    return "response_message";
+}`;
+        scriptEditor = monaco.editor.create(document.getElementById('script_editor'), {
+          value: $('textarea[name="script"]').val() || ($('input[name="id"]').val() ? '' : defaultScript),
+          theme: 'vs-light',
+          language: 'javascript',
+          automaticLayout: true
+        });
+
+        scriptEditor.onDidChangeModelContent(function (e) {
+          $('textarea[name="script"]').val(scriptEditor.getValue());
+        });
+      });
+
+      let fnRegister = document.querySelector(".btn_register");
+      fnRegister.addEventListener("click", function (event) {
+        let form = document.getElementById("nettyServerForm");
+        if (!form.checkValidity()) {
+          event.preventDefault();
+          event.stopPropagation();
+        } else {
+          form.submit();
+        }
+        form.classList.add('was-validated');
+      });
+
+      let fnList = document.querySelector(".btn_list");
+      fnList.addEventListener("click", function () {
+        location.href = "[[@{/mgmt/socket/list_view.do}]]";
+      });
+    });
+  </script>
+</th:block>
+</html>