hacktx24/index.html at main · DylanMMyers/hacktx24 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Nihon-go!</title>
  <link rel="stylesheet" href="styles.css">
  <link rel="icon" href="icons\face.png" type="image/x-icon" sizes="86x86">
  <link rel="stylesheet" href="https://js.arcgis.com/4.27/esri/themes/light/main.css">
  <script src="https://js.arcgis.com/4.27/"></script>
</head>
<body>
  <div id="navBar">
    <div class="logo">
        Nihon-go!
    <img class="japan-icon" src="icons\pngwing.com.png" alt="Profile Icon">
    </div>
    <img class="profile-icon" src="icons/face.png" alt="Profile Icon">
    <div class="dropdown-menu" id="profileDropdown">
        <div id="sign-in-button" class="dropdown-item">Sign In</div>
        <div id="register-button" class="dropdown-item">Register</div>
    </div>
    <div id="loginPopup" class="popup">
        <div class="popup-content">
          <span class="close" onclick="closePopup('loginPopup')">&times;</span>
          <h2>Login</h2>
          <form>
            <label for="loginUsername">Username:</label>
            <input type="text" id="loginUsername" name="username" required>
            <label for="loginPassword">Password:</label>
            <input type="password" id="loginPassword" name="password" required>
            <button type="submit" class="popup-submit-login">Submit</button>
          </form>
        </div>
      </div>

      <div id="registerPopup" class="popup">
        <div class="popup-content">
          <span class="close" onclick="closePopup('registerPopup')">&times;</span>
          <h2>Register</h2>
          <form>
            <label for="registerUsername">Username:</label>
            <input type="text" id="registerUsername" name="username" required>
            <label for="registerPassword">Password:</label>
            <input type="password" id="registerPassword" name="password" required>
            <button type="submit" class="popup-submit-register">Submit</button>
          </form>
        </div>
      </div>


  </div>
  <div id="contentGrid">
    <div id="mapContainer">
      <div id="viewDiv" style="height: 100%; width: 100%;"></div>
    </div>
<div id="history">
  <div id="historyTitle">History</div>
  <button id="newChatButton">New Chat</button>
  <div id="chatEntriesContainer"></div> <!-- Container for chat entries -->
</div>
    <div id="preferences">
      <div id="preferencesTitle">Preferences</div>
      <!-- Content for preferences -->
      <div class="button-container">
        <button class="button" id="button1" onclick="handleClick(this)">$</button>
        <button class="button" id="button2" onclick="handleClick(this)">$$</button>
        <button class="button" id="button3" onclick="handleClick(this)">$$$</button>
      </div>
      <div id="visitLengthContainer">
        <label for="numberGrid">Length of Visit ( Days ):</label>
        <div id="numberGrid">
        </div>
      </div>
      <div id="submitButtonContainer">
        <button id="submitButton" class="button">SUBMIT</button>
        <p id="warningMessage" class="warning-message" style="display: none;">Please select your preferences above</p>
      </div>
    </div>
    <div id="chat">
      <div id="resizeHandle" class="resize-handle"></div>
      <div class="chat-header">
        <div id="chatTitle">Chat</div>
      </div>
      <div id="chatContent">
        <!-- Chat content -->
        <div class="chat-bubble responder-bubble">Hello! How can I help you today?</div>
        <div class="chat-bubble user-bubble">I would like to know more about Japan's geography.</div>
        <div class="chat-bubble responder-bubble">Sure thing! Japan has a lotta mountains and koi fish and stuff!</div>
        <div class="chat-bubble user-bubble">Uh... thanks?</div>
      </div>
      <div id="chatInputBar">
        <input id="chatInput" type="text" placeholder="Type a message...">
        <button id="sendButton">Send</button>
      </div>
    </div>
  </div>
  <script src="script.js" type="module"></script>
</body>
</html>