Socket Client UI 기본 골격 작성

2024-04-17 22:03:02 +09:00
parent 95924af31a
commit 7d97628d38
27 changed files with 2244 additions and 570 deletions
@@ -0,0 +1,44 @@
+class ServerManager {
+  constructor(servers) {
+    this.servers = servers ||[];
+  }
+
+  basePath(serverId) {
+    if (serverId === undefined || serverId === null || serverId === '') {
+      return '';
+    }
+    return this.servers.filter(server => server.id == serverId)[0].basePath; // == : 타입 비교 없이 값만 비교
+  }
+
+  getServer(serverId) {
+    return this.servers.filter(server => server.id == serverId)[0];
+  }
+
+  renderServers(selectedServer) {
+    const optionsHtml = this.servers.map(server => `<option value="${server.id}" ${selectedServer === server.id ? 'selected' : ''}  data-path="${server.basePath}">${server.name}</option>`).join('');
+
+    return `<select class="form-select server" name="server" style="width: 180px; border-radius: 0;" required>
+                <option value="">서버 선택</option>
+                ${optionsHtml}</select>`;
+  }
+
+  renderTcpServers(selectedServer) {
+    const optionsHtml = this.servers.filter( server => server.scheme === 'tcp')
+    .map(server => `<option value="${server.id}" ${selectedServer == server.id ? 'selected' : ''}>${server.name}</option>`).join('');
+
+    return `<select class="form-select server" name="server" style="width: 180px; border-radius: 0;" required>
+                <option value="">서버 선택</option>
+                ${optionsHtml}</select>`;
+  }
+
+  renderHttpServers(selectedServer) {
+    const optionsHtml = this.servers.filter( server => server.scheme !== 'tcp')
+    .map(server => `<option value="${server.id}" ${selectedServer === server.id ? 'selected' : ''}  data-path="${server.basePath}">${server.name}</option>`).join('');
+
+    return `<select class="form-select server" name="server" style="width: 180px; border-radius: 0;" required>
+                <option value="">서버 선택</option>
+                ${optionsHtml}</select>`;
+  }
+}
+
+export default ServerManager;