First view web-client

badcast · Nov 13, 2023 · df1b9d6 · df1b9d6
1 parent 2ad02df
commit df1b9d6
Show file tree

Hide file tree

Showing 4 changed files with 166 additions and 47 deletions.
diff --git a/webclient/index.html b/webclient/index.html
@@ -1,9 +1,26 @@
+<!DOCTYPE html>
 <html>
-    <head>
-        <title>Dragon Tea - Web Client</title>
-        <script src="tea_api.js"></script>
-    </head>
-    <body>
-        Hello, world!
-    </body>
+
+<head>
+    <title>Dragon Tea - Web Client</title>
+    <script src="./tea_api.js"></script>
+    <script src="./tea_ui.js"></script>
+    <link rel="stylesheet" type="text/css" href="./style.css">
+</head>
+
+<body>
+    <div class="form_sigin">
+        <p>Добро пожалаловать на сервер Драконего чая!</p>
+        <input id="inputSignin" type="text" placeholder="User ID" value="">
+        <button onclick="tea_ui_signin()">Вход</button>
+        <p>
+            <button>RU</button>
+            <button disabled>EN</button>
+        </p>
+
+        <p>Данная Веб странница под лицензией <a target="_blank" href="https://wikipedia.org/wiki/GNU_General_Public_License#GPL_v3">GPLv3</a></p>
+        <p><a target="_blank" href="https://github.com/badcast/dragon-tea">Исходный код</a> <a target="_blank" href="https://github.com/badcast/dragon-tea/tree/main/server-php">сервера</a> и <a target="_blank" href="https://github.com/badcast/dragon-tea/tree/main/webclient">web-клиента</a> </p>
+    </div>
+</body>
+
 </html>
diff --git a/webclient/style.css b/webclient/style.css
@@ -0,0 +1,78 @@
+body {
+    background: lightgray;
+    font-family: Arial, Helvetica, sans-serif;
+}
+
+/* Стиль input в стиле Windows XP */
+input {
+    padding: 8px;
+    font-size: 12px;
+    border: 1px solid #939393;
+    color: #000;
+    background-color: #d8d8d8;
+    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
+}
+
+input:hover,
+input:focus {
+    background-color: #c0c0c0;
+    color: #000;
+    box-shadow: 1px 1px 1px #a0a0a0;
+}
+
+/* Стиль кнопки в стиле Windows XP */
+button {
+    display: inline-block;
+    padding: 8px 15px;
+    font-size: 12px;
+    font-weight: bold;
+    text-align: center;
+    text-decoration: none;
+    cursor: pointer;
+    border: 1px solid #939393;
+    color: #000;
+    background-color: #d8d8d8;
+    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
+}
+
+button:hover {
+    background-color: #c0c0c0;
+    color: #000;
+}
+
+button:active {
+    background-color: #a0a0a0;
+    color: #000;
+}
+
+button[disabled] {
+    background-color: darkgray;
+    cursor: not-allowed;
+}
+
+.form_sigin {
+    margin: auto;
+    width: 400px;
+    height: 250px;
+    background: #dbdbdb;
+    padding: 10px;
+    position: absolute;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    text-align: center;
+}
+
+/* Стиль ссылок в стиле Windows XP */
+a {
+    color: #000;
+    text-decoration: none;
+    border-bottom: 1px solid #000;
+    transition: color 0.3s ease, border-bottom 0.3s ease;
+}
+
+a:hover {
+    color: #0066cc;
+    border-bottom: 1px solid #0066cc;
+}
diff --git a/webclient/tea_api.js b/webclient/tea_api.js
@@ -1,49 +1,66 @@
-const _netapi = {
-   signin: "/api/auth.php",
-   signup: "/api/signup.php",
-   pipeMsg: "/api/messagedb.php",
-   userInfo: "/api/user.php"
-};
+function tea_str_error(errcode) {
+  const STATUS_OK = 0;
+  const STATUS_ID_NO_EXIST = 1;
+  const STATUS_INVALID_REQUEST_DATA = 2;
+  const STATUS_INVALID_AUTH_METHOD = 3;
+  const STATUS_INVALID_NICKNAME = 4;
+  const STATUS_INVALID_REGISTER = 5;
+  const STATUS_ADMIN_ACCOUNT_REACHABLE = 6;
 
-async function request(){
-   // JSON-данные для отправки
-const requestData = {
-  user_id: 1913913913913
-};
+  const STATUS_PRIVATE_MESSAGE_NOT_SUPPORTED = 128;
 
-// URL, к которому будет выполнен GET-запрос
-const url = "https://dragontea.lightmister.repl.co/api/auth.php";
+  const STATUS_INTERNAL_SERVER_ERROR = 500;
 
-// Опции для запроса
-const requestOptions = {
-  method: 'GET',
-  headers: {
-    'Content-Type': 'application/json'
-  },
-  body: JSON.stringify(requestData) // Преобразуем JSON-данные в строку
-};
-
-// Выполняем запрос
-  await fetch(url, requestOptions)
-  .then(response => response.json()) // Распарсить ответ как JSON
-  .then(data => {
-    // Обработка данных, полученных в ответе
-    console.log(data);
-  })
-  .catch(error => {
-    // Обработка ошибок
-    console.error('Произошла ошибка:', error);
-  });
+  switch (errcode) {
+    case STATUS_OK:
+      return "ok";
+    case STATUS_ID_NO_EXIST:
+      return "user not exists";
+    case STATUS_INVALID_REQUEST_DATA:
+      return "invalid request data";
+    case STATUS_INVALID_AUTH_METHOD:
+      return "invalid auth method";
+    case STATUS_INVALID_NICKNAME:
+      return "invalid nickname";
+    case STATUS_INVALID_REGISTER:
+      return "invalid register";
+    case STATUS_ADMIN_ACCOUNT_REACHABLE:
+      return "admin account reachable";
+    case STATUS_PRIVATE_MESSAGE_NOT_SUPPORTED:
+      return "private message not supported";
+    case STATUS_INTERNAL_SERVER_ERROR:
+      return "internal server error";
+  }
+  return "";
 }
 
-function teaSigIn(userid, userNickname){
+async function tea_request(requestData) {
+  const _netapi = {
+    signin: "/api/auth.php",
+    signup: "/api/signup.php",
+    pipeMsg: "/api/messagedb.php",
+    userInfo: "/api/user.php"
+  };
 
-}
+  var host = "http://localhost:8000";//"https://dragontea.lightmister.repl.co";//
+  let url = host + _netapi.signin;
 
-function teaSignUp(userNickname){
-
-}
-
-function teaUser(userNickname){
+  // Опции для запроса
+  const requestOptions = {
+    method: 'POST',
+    mode: 'cors',
+    body: JSON.stringify(requestData)
+  };
 
+  // Выполняем запрос
+  await fetch(url, requestOptions)
+    .then(response => response.text()) // Распарсить ответ как JSON
+    .then(data => {
+      // Обработка данных, полученных в ответе
+      alert(data)
+    })
+    .catch(error => {
+      // Обработка ошибок
+      alert(error)
+    });
 }
diff --git a/webclient/tea_ui.js b/webclient/tea_ui.js
@@ -0,0 +1,7 @@
+
+async function tea_ui_signin() {
+    let userId = document.getElementById("inputSignin").value;
+
+    let req = { user_id: userId };
+    await tea_request(req);
+}