Login
jblu

jblu / Teramind Launcher

Last active 6 months ago

Like 0

Opens a support page

jblu revised this gist 7 months ago · df1fc19

1 file changed

teramind-launcher.html renamed to index.html

File renamed without changes

jblu revised this gist 10 months ago · 860e8fb

1 file changed, 179 insertions

teramind-launcher.html (file created)
@@ -0,0 +1,179 @@
1 + <!DOCTYPE html>
2 + <html lang="en">
3 + <head>
4 + <meta charset="UTF-8" />
5 + <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6 + <title>Teramind Support Page Launcher</title>
7 + <link rel="icon" href="data:image/svg+xml,
8 + <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'>
9 + <text y='0.9em' font-size='90'>🇹</text>
10 + </svg>">
11 + <style>
12 + :root {
13 + --bg: #ffffff;
14 + --text: #000000;
15 + --box-bg: #f5f5f5;
16 + --input-bg: #ffffff;
17 + --input-border: #cccccc;
18 + --button-bg: #007bff;
19 + --button-text: #ffffff;
20 + }
21 +
22 + body.dark {
23 + --bg: #1a1a1a;
24 + --text: #f0f0f0;
25 + --box-bg: #2a2a2a;
26 + --input-bg: #2b2b2b;
27 + --input-border: #555;
28 + --button-bg: #0a84ff;
29 + --button-text: #ffffff;
30 + }
31 +
32 + body {
33 + font-family: Arial, sans-serif;
34 + margin: 40px;
35 + background: var(--bg);
36 + color: var(--text);
37 + transition: background 0.3s, color 0.3s;
38 + }
39 +
40 + .container {
41 + max-width: 400px;
42 + }
43 +
44 + select, button, input[type="text"] {
45 + width: 100%;
46 + padding: 10px;
47 + margin-top: 10px;
48 + font-size: 16px;
49 + background: var(--input-bg);
50 + color: var(--text);
51 + border: 1px solid var(--input-border);
52 + border-radius: 4px;
53 + transition: background 0.3s, color 0.3s, border 0.3s;
54 + }
55 +
56 + button {
57 + background: var(--button-bg);
58 + color: var(--button-text);
59 + border: none;
60 + border-radius: 6px;
61 + cursor: pointer;
62 + }
63 +
64 + .checkbox-row {
65 + margin-top: 12px;
66 + display: flex;
67 + align-items: center;
68 + gap: 8px;
69 + }
70 +
71 + .preview-box {
72 + margin-top: 15px;
73 + padding: 10px;
74 + background: var(--box-bg);
75 + border-radius: 5px;
76 + font-size: 14px;
77 + word-break: break-all;
78 + transition: background 0.3s;
79 + }
80 +
81 + .toggle-dark {
82 + display: flex;
83 + align-items: center;
84 + gap: 8px;
85 + margin-bottom: 20px;
86 + cursor: pointer;
87 + user-select: none;
88 + }
89 + </style>
90 + </head>
91 + <body>
92 + <div class="container">
93 +
94 + <div class="toggle-dark">
95 + <input type="checkbox" id="darkModeToggle" onchange="toggleDarkMode()">
96 + <label for="darkModeToggle">Dark Mode</label>
97 + </div>
98 +
99 + <h2>Instance</h2>
100 +
101 + <label for="subInput">Enter Instance:</label>
102 + <input id="subInput" type="text" placeholder="e.g. teramind465" oninput="updatePreview()" />
103 +
104 + <label for="urlSelect">Choose a dashboard version:</label>
105 + <select id="urlSelect" onchange="updatePreview()">
106 + <option value="https://{sub}.teramind.co/slogin">Legacy(v1)</option>
107 + <option value="https://{sub}.teramind.co/v2/support-login">Next-Gen(v2)</option>
108 + </select>
109 +
110 + <div class="checkbox-row">
111 + <input type="checkbox" id="useUs" onchange="updatePreview()" />
112 + <label for="useUs">Use .us domain</label>
113 + </div>
114 +
115 + <div class="preview-box">
116 + <strong>URL Preview:</strong>
117 + <div id="urlPreview">(waiting for input...)</div>
118 + </div>
119 +
120 + <button onclick="go()">Go</button>
121 + </div>
122 +
123 + <script>
124 + function buildUrl() {
125 + let base = document.getElementById('urlSelect').value;
126 + let sub = document.getElementById('subInput').value.trim();
127 + const useUs = document.getElementById('useUs').checked;
128 +
129 + if (!sub) return "(please enter an instance)";
130 + if (useUs) sub = sub + ".us";
131 +
132 + return base.replace('{sub}', sub);
133 + }
134 +
135 + function updatePreview() {
136 + document.getElementById('urlPreview').textContent = buildUrl();
137 + }
138 +
139 + function go() {
140 + const url = buildUrl();
141 + if (url.includes("please enter")) {
142 + alert("Please enter an instance");
143 + return;
144 + }
145 + window.location.href = url;
146 + }
147 +
148 + function applyTheme(theme) {
149 + if (theme === "dark") {
150 + document.body.classList.add("dark");
151 + document.getElementById("darkModeToggle").checked = true;
152 + } else {
153 + document.body.classList.remove("dark");
154 + document.getElementById("darkModeToggle").checked = false;
155 + }
156 + }
157 +
158 + function toggleDarkMode() {
159 + const isDark = document.getElementById("darkModeToggle").checked;
160 + const theme = isDark ? "dark" : "light";
161 + applyTheme(theme);
162 + localStorage.setItem("theme", theme);
163 + }
164 +
165 + function loadTheme() {
166 + const savedTheme = localStorage.getItem("theme");
167 + if (savedTheme) {
168 + applyTheme(savedTheme);
169 + } else {
170 + const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
171 + applyTheme(prefersDark ? "dark" : "light");
172 + }
173 + }
174 +
175 + loadTheme();
176 + updatePreview();
177 + </script>
178 + </body>
179 + </html>