Hugging Face's logo

Spaces:
OzoneAsai
/
TextLogger
Sleeping

App Files Community
OzoneAsai commited on
Commit
415c6ee
•
1 Parent(s): 12581a3

Upload 4 files

Browse files
Files changed (4) hide show
  1. templates/ctrl.html +17 -0
  2. templates/index.html +35 -0
  3. templates/log.html +42 -0
  4. templates/viewport.html +62 -0
templates/ctrl.html ADDED
@@ -0,0 +1,17 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Ctrl</title>
6
+ <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
7
+ </head>
8
+ <body>
9
+ <textarea id="text_input" rows="10" cols="30"></textarea>
10
+ <script>
11
+ function sendText() {
12
+ $.post('/Ctrl', { text: $('#text_input').val() });
13
+ }
14
+ setInterval(sendText, 100); // 10Hz = 100ms
15
+ </script>
16
+ </body>
17
+ </html>
templates/index.html ADDED
@@ -0,0 +1,35 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Portal</title>
6
+ <style>
7
+ body, html {
8
+ height: 100%;
9
+ margin: 0;
10
+ display: flex;
11
+ justify-content: center;
12
+ align-items: center;
13
+ flex-direction: column;
14
+ }
15
+ .button {
16
+ padding: 20px;
17
+ margin: 10px;
18
+ font-size: 1.5em;
19
+ text-decoration: none;
20
+ color: white;
21
+ background-color: #007BFF;
22
+ border: none;
23
+ border-radius: 5px;
24
+ cursor: pointer;
25
+ }
26
+ .button:hover {
27
+ background-color: #0056b3;
28
+ }
29
+ </style>
30
+ </head>
31
+ <body>
32
+ <a href="/ViewPort" class="button">ViewPort</a>
33
+ <a href="/Ctrl" class="button">Ctrl</a>
34
+ </body>
35
+ </html>
templates/log.html ADDED
@@ -0,0 +1,42 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Text Log</title>
6
+ <style>
7
+ table {
8
+ width: 100%;
9
+ border-collapse: collapse;
10
+ }
11
+ th, td {
12
+ border: 1px solid black;
13
+ padding: 8px;
14
+ text-align: left;
15
+ }
16
+ th {
17
+ background-color: #f2f2f2;
18
+ }
19
+ </style>
20
+ </head>
21
+ <body>
22
+ <h1>Text Log</h1>
23
+ <table>
24
+ <thead>
25
+ <tr>
26
+ <th>Timestamp</th>
27
+ <th>IP Hash</th>
28
+ <th>Text</th>
29
+ </tr>
30
+ </thead>
31
+ <tbody>
32
+ {% for row in log_data %}
33
+ <tr>
34
+ <td>{{ row[0] }}</td>
35
+ <td>{{ row[1] }}</td>
36
+ <td>{{ row[2] }}</td>
37
+ </tr>
38
+ {% endfor %}
39
+ </tbody>
40
+ </table>
41
+ </body>
42
+ </html>
templates/viewport.html ADDED
@@ -0,0 +1,62 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>ViewPort</title>
6
+ <style>
7
+ body, html {
8
+ height: 100%;
9
+ margin: 0;
10
+ display: flex;
11
+ justify-content: center;
12
+ align-items: center;
13
+ }
14
+ #text_display {
15
+ text-align: center;
16
+ white-space: pre-wrap;
17
+ }
18
+ </style>
19
+ <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
20
+ </head>
21
+ <body>
22
+ <div id="text_display">Loading...</div>
23
+ <script>
24
+ function countCharacters(line) {
25
+ let fullWidthCount = 0;
26
+ let halfWidthCount = 0;
27
+ for (let i = 0; i < line.length; i++) {
28
+ if (line.charCodeAt(i) > 255) {
29
+ fullWidthCount++;
30
+ } else {
31
+ halfWidthCount++;
32
+ }
33
+ }
34
+ return (fullWidthCount * 2) + halfWidthCount;
35
+ }
36
+
37
+ function calculateMaxLength(text) {
38
+ const lines = text.split('\n');
39
+ let maxLength = 0;
40
+ lines.forEach(line => {
41
+ const length = countCharacters(line);
42
+ if (length > maxLength) {
43
+ maxLength = length;
44
+ }
45
+ });
46
+ return maxLength;
47
+ }
48
+
49
+ function fetchText() {
50
+ $.getJSON('/get_text', function(data) {
51
+ const text = data.text;
52
+ const maxLength = calculateMaxLength(text);
53
+ const textSize = 70 / maxLength + 'em';
54
+ $('#text_display').text(text).css('font-size', textSize);
55
+ });
56
+ }
57
+
58
+ setInterval(fetchText, 100); // 10Hz = 100ms
59
+ fetchText(); // Initial call
60
+ </script>
61
+ </body>
62
+ </html>