first commit
This commit is contained in:
1
frontend/public/favicon.svg
Normal file
1
frontend/public/favicon.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 9.3 KiB |
24
frontend/public/icons.svg
Normal file
24
frontend/public/icons.svg
Normal file
@@ -0,0 +1,24 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<symbol id="bluesky-icon" viewBox="0 0 16 17">
|
||||
<g clip-path="url(#bluesky-clip)"><path fill="#08060d" d="M7.75 7.735c-.693-1.348-2.58-3.86-4.334-5.097-1.68-1.187-2.32-.981-2.74-.79C.188 2.065.1 2.812.1 3.251s.241 3.602.398 4.13c.52 1.744 2.367 2.333 4.07 2.145-2.495.37-4.71 1.278-1.805 4.512 3.196 3.309 4.38-.71 4.987-2.746.608 2.036 1.307 5.91 4.93 2.746 2.72-2.746.747-4.143-1.747-4.512 1.702.189 3.55-.4 4.07-2.145.156-.528.397-3.691.397-4.13s-.088-1.186-.575-1.406c-.42-.19-1.06-.395-2.741.79-1.755 1.24-3.64 3.752-4.334 5.099"/></g>
|
||||
<defs><clipPath id="bluesky-clip"><path fill="#fff" d="M.1.85h15.3v15.3H.1z"/></clipPath></defs>
|
||||
</symbol>
|
||||
<symbol id="discord-icon" viewBox="0 0 20 19">
|
||||
<path fill="#08060d" d="M16.224 3.768a14.5 14.5 0 0 0-3.67-1.153c-.158.286-.343.67-.47.976a13.5 13.5 0 0 0-4.067 0c-.128-.306-.317-.69-.476-.976A14.4 14.4 0 0 0 3.868 3.77C1.546 7.28.916 10.703 1.231 14.077a14.7 14.7 0 0 0 4.5 2.306q.545-.748.965-1.587a9.5 9.5 0 0 1-1.518-.74q.191-.14.372-.293c2.927 1.369 6.107 1.369 8.999 0q.183.152.372.294-.723.437-1.52.74.418.838.963 1.588a14.6 14.6 0 0 0 4.504-2.308c.37-3.911-.63-7.302-2.644-10.309m-9.13 8.234c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.894 0 1.614.82 1.599 1.82.001 1-.705 1.82-1.6 1.82m5.91 0c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.893 0 1.614.82 1.599 1.82 0 1-.706 1.82-1.6 1.82"/>
|
||||
</symbol>
|
||||
<symbol id="documentation-icon" viewBox="0 0 21 20">
|
||||
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="m15.5 13.333 1.533 1.322c.645.555.967.833.967 1.178s-.322.623-.967 1.179L15.5 18.333m-3.333-5-1.534 1.322c-.644.555-.966.833-.966 1.178s.322.623.966 1.179l1.534 1.321"/>
|
||||
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M17.167 10.836v-4.32c0-1.41 0-2.117-.224-2.68-.359-.906-1.118-1.621-2.08-1.96-.599-.21-1.349-.21-2.848-.21-2.623 0-3.935 0-4.983.369-1.684.591-3.013 1.842-3.641 3.428C3 6.449 3 7.684 3 10.154v2.122c0 2.558 0 3.838.706 4.726q.306.383.713.671c.76.536 1.79.64 3.581.66"/>
|
||||
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M3 10a2.78 2.78 0 0 1 2.778-2.778c.555 0 1.209.097 1.748-.047.48-.129.854-.503.982-.982.145-.54.048-1.194.048-1.749a2.78 2.78 0 0 1 2.777-2.777"/>
|
||||
</symbol>
|
||||
<symbol id="github-icon" viewBox="0 0 19 19">
|
||||
<path fill="#08060d" fill-rule="evenodd" d="M9.356 1.85C5.05 1.85 1.57 5.356 1.57 9.694a7.84 7.84 0 0 0 5.324 7.44c.387.079.528-.168.528-.376 0-.182-.013-.805-.013-1.454-2.165.467-2.616-.935-2.616-.935-.349-.91-.864-1.143-.864-1.143-.71-.48.051-.48.051-.48.787.051 1.2.805 1.2.805.695 1.194 1.817.857 2.268.649.064-.507.27-.857.49-1.052-1.728-.182-3.545-.857-3.545-3.87 0-.857.31-1.558.8-2.104-.078-.195-.349-1 .077-2.078 0 0 .657-.208 2.14.805a7.5 7.5 0 0 1 1.946-.26c.657 0 1.328.092 1.946.26 1.483-1.013 2.14-.805 2.14-.805.426 1.078.155 1.883.078 2.078.502.546.799 1.247.799 2.104 0 3.013-1.818 3.675-3.558 3.87.284.247.528.714.528 1.454 0 1.052-.012 1.896-.012 2.156 0 .208.142.455.528.377a7.84 7.84 0 0 0 5.324-7.441c.013-4.338-3.48-7.844-7.773-7.844" clip-rule="evenodd"/>
|
||||
</symbol>
|
||||
<symbol id="social-icon" viewBox="0 0 20 20">
|
||||
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M12.5 6.667a4.167 4.167 0 1 0-8.334 0 4.167 4.167 0 0 0 8.334 0"/>
|
||||
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M2.5 16.667a5.833 5.833 0 0 1 8.75-5.053m3.837.474.513 1.035c.07.144.257.282.414.309l.93.155c.596.1.736.536.307.965l-.723.73a.64.64 0 0 0-.152.531l.207.903c.164.715-.213.991-.84.618l-.872-.52a.63.63 0 0 0-.577 0l-.872.52c-.624.373-1.003.094-.84-.618l.207-.903a.64.64 0 0 0-.152-.532l-.723-.729c-.426-.43-.289-.864.306-.964l.93-.156a.64.64 0 0 0 .412-.31l.513-1.034c.28-.562.735-.562 1.012 0"/>
|
||||
</symbol>
|
||||
<symbol id="x-icon" viewBox="0 0 19 19">
|
||||
<path fill="#08060d" fill-rule="evenodd" d="M1.893 1.98c.052.072 1.245 1.769 2.653 3.77l2.892 4.114c.183.261.333.48.333.486s-.068.089-.152.183l-.522.593-.765.867-3.597 4.087c-.375.426-.734.834-.798.905a1 1 0 0 0-.118.148c0 .01.236.017.664.017h.663l.729-.83c.4-.457.796-.906.879-.999a692 692 0 0 0 1.794-2.038c.034-.037.301-.34.594-.675l.551-.624.345-.392a7 7 0 0 1 .34-.374c.006 0 .93 1.306 2.052 2.903l2.084 2.965.045.063h2.275c1.87 0 2.273-.003 2.266-.021-.008-.02-1.098-1.572-3.894-5.547-2.013-2.862-2.28-3.246-2.273-3.266.008-.019.282-.332 2.085-2.38l2-2.274 1.567-1.782c.022-.028-.016-.03-.65-.03h-.674l-.3.342a871 871 0 0 1-1.782 2.025c-.067.075-.405.458-.75.852a100 100 0 0 1-.803.91c-.148.172-.299.344-.99 1.127-.304.343-.32.358-.345.327-.015-.019-.904-1.282-1.976-2.808L6.365 1.85H1.8zm1.782.91 8.078 11.294c.772 1.08 1.413 1.973 1.425 1.984.016.017.241.02 1.05.017l1.03-.004-2.694-3.766L7.796 5.75 5.722 2.852l-1.039-.004-1.039-.004z" clip-rule="evenodd"/>
|
||||
</symbol>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.9 KiB |
81
frontend/public/login.css
Normal file
81
frontend/public/login.css
Normal file
@@ -0,0 +1,81 @@
|
||||
/* General Styling */
|
||||
.body-style {
|
||||
background: linear-gradient(104.96deg, #131a29 0%, #1d2634 56.6%, #2f2e78 100.68%);
|
||||
color: #fff;
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
/* Left Section */
|
||||
.left-section {
|
||||
/* background: #0b1120; */
|
||||
color: #fff;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.left-ikon-logo {
|
||||
width: 15%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.quote {
|
||||
font-size: 2rem;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* Right Section */
|
||||
.right-section {
|
||||
/* background: #1a1c3d; */
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.right-ikon-logo {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1rem;
|
||||
/* margin-bottom: 20px; */
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background: #252a48;
|
||||
color: white;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
box-shadow: none;
|
||||
border: 1px solid #8a86ff;
|
||||
}
|
||||
|
||||
.forgot-password, .sign-up {
|
||||
color: #8a86ff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #635bff;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: #5249db;
|
||||
}
|
||||
|
||||
.support-text {
|
||||
font-size: 0.9rem;
|
||||
color: #888;
|
||||
}
|
||||
.terminal-video {
|
||||
mix-blend-mode: lighten;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
footer a {
|
||||
color: #888;
|
||||
text-decoration: none;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
127
frontend/public/login.html
Normal file
127
frontend/public/login.html
Normal file
@@ -0,0 +1,127 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="h-full">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<title>IKON Login</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="stylesheet" href="login.css" />
|
||||
</head>
|
||||
|
||||
<body class="h-full text-white w-full body-style">
|
||||
<div class="flex h-full w-full">
|
||||
<div
|
||||
class="flex flex-col md:flex-row overflow-hidden rounded-lg shadow-lg w-full"
|
||||
>
|
||||
<!-- Left Section -->
|
||||
<div class="flex flex-col h-full justify-center md:w-1/3 p-10 w-full">
|
||||
<img
|
||||
src="assets/images/dark/keross-logo.png"
|
||||
alt="Keross Logo"
|
||||
class="p-3 mb-6 left-ikon-logo"
|
||||
/>
|
||||
<blockquote class="quote">
|
||||
"Step into the future of<br />
|
||||
<strong>Collaboration with our AI-Agent</strong><br />
|
||||
<strong>Domain Experts.</strong>"
|
||||
</blockquote>
|
||||
</div>
|
||||
<div
|
||||
class="terminal-video flex flex-col items-center justify-center md:w-1/3 p-10 w-full"
|
||||
>
|
||||
<video width="500" class="terminal-video" autoplay muted>
|
||||
<source src="assets/terminal.mp4" type="video/mp4" />
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
</div>
|
||||
<!-- Right Section (Login Form) -->
|
||||
<div
|
||||
class="flex flex-col items-center justify-center md:w-1/3 p-10 w-full"
|
||||
>
|
||||
<img
|
||||
src="assets/images/dark/ikon-logo.png"
|
||||
alt="IKON Logo"
|
||||
class="right-ikon-logo mb-4"
|
||||
/>
|
||||
<p class="text-gray-300 mb-6">Harness the Power of Data</p>
|
||||
|
||||
<form class="p-10 pt-0 w-3/4">
|
||||
<div class="mb-4">
|
||||
<input
|
||||
id="userName"
|
||||
type="text"
|
||||
class="w-full p-3 bg-[#111827] text-white border-none rounded-md focus:ring-2 focus:ring-[#8a86ff]"
|
||||
placeholder="Username"
|
||||
value="K2303106"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<input
|
||||
type="password"
|
||||
id="userPassword"
|
||||
class="w-full p-3 bg-[#111827] text-white border-none rounded-md focus:ring-2 focus:ring-[#8a86ff]"
|
||||
placeholder="Password"
|
||||
value="**********"
|
||||
/>
|
||||
</div>
|
||||
<div class="text-right mb-4">
|
||||
<a href="#" class="text-[#8a86ff] text-sm">Forgot Password?</a>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
type="reset"
|
||||
id="resetLoginBtn"
|
||||
class="w-1/2 p-3 bg-gray-600 rounded-md hover:bg-gray-500"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
id="submitLoginBtn"
|
||||
class="w-1/2 p-3 bg-[#635bff] rounded-md hover:bg-[#5249db]"
|
||||
>
|
||||
Login
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<p class="text-gray-400 text-sm mt-4">
|
||||
Looking for Support?<br />Version 8.0.0
|
||||
</p>
|
||||
|
||||
<footer class="mt-4 text-sm text-gray-400">
|
||||
<a
|
||||
href="http://keross.com/about"
|
||||
target="_blank"
|
||||
class="hover:underline"
|
||||
>About Us</a
|
||||
>
|
||||
|
|
||||
<a
|
||||
href="http://keross.com/contact"
|
||||
target="_blank"
|
||||
class="hover:underline"
|
||||
>Get in Touch</a
|
||||
>
|
||||
|
|
||||
<a
|
||||
href="http://keross.com/privacy-policy"
|
||||
target="_blank"
|
||||
class="hover:underline"
|
||||
>Privacy Policy</a
|
||||
>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Alert Container -->
|
||||
<div
|
||||
id="alertContainer"
|
||||
class="bottom-5 fixed right-5 space-y-2 z-50"
|
||||
></div>
|
||||
|
||||
<script src="login.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
140
frontend/public/login.js
Normal file
140
frontend/public/login.js
Normal file
@@ -0,0 +1,140 @@
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const usernameInput = document.getElementById("userName");
|
||||
const passwordInput = document.getElementById("userPassword");
|
||||
const resetButton = document.getElementById("resetLoginBtn");
|
||||
const loginButton = document.getElementById("submitLoginBtn");
|
||||
|
||||
usernameInput.setAttribute("autocomplete", "off");
|
||||
passwordInput.setAttribute("autocomplete", "off");
|
||||
|
||||
resetButton.addEventListener("click", function (e) {
|
||||
e.preventDefault();
|
||||
usernameInput.value = "";
|
||||
passwordInput.value = "";
|
||||
});
|
||||
|
||||
// Function to show custom alerts
|
||||
function showAlert(message, type = "error") {
|
||||
const alertContainer = document.getElementById("alertContainer");
|
||||
|
||||
const alertDiv = document.createElement("div");
|
||||
alertDiv.className = `flex items-center justify-between p-3 text-white rounded-md shadow-lg ${
|
||||
type === "success" ? "bg-green-600" : "bg-red-600"
|
||||
} transition-transform transform translate-x-5 opacity-0`;
|
||||
|
||||
alertDiv.innerHTML = `
|
||||
<span>${message}</span>
|
||||
<button class="ml-3 text-white font-bold px-2 py-1 rounded hover:bg-gray-700 transition" onclick="this.parentElement.remove()">✖</button>
|
||||
`;
|
||||
|
||||
alertContainer.appendChild(alertDiv);
|
||||
|
||||
// Animate alert (slide in effect)
|
||||
setTimeout(() => {
|
||||
alertDiv.classList.remove("translate-x-5", "opacity-0");
|
||||
alertDiv.classList.add("opacity-100");
|
||||
}, 100);
|
||||
|
||||
// Remove alert after 3 seconds
|
||||
setTimeout(() => {
|
||||
alertDiv.classList.add("opacity-0");
|
||||
setTimeout(() => alertDiv.remove(), 500);
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
function setCookie(name,value,seconds) {
|
||||
const cookiePrefix = "ikoncloud_next_";
|
||||
var expires = "";
|
||||
if (seconds) {
|
||||
var date = new Date();
|
||||
date.setTime(date.getTime() + (seconds * 1000));
|
||||
expires = "; expires=" + date.toUTCString();
|
||||
}
|
||||
document.cookie =cookiePrefix+ name + "=" + (value || "") + expires + "; path=/";
|
||||
}
|
||||
|
||||
loginButton.addEventListener("click", async function (event) {
|
||||
event.preventDefault();
|
||||
|
||||
const username = usernameInput.value.trim();
|
||||
const password = passwordInput.value.trim();
|
||||
|
||||
console.log("Username:", username);
|
||||
console.log("Password:", password);
|
||||
try {
|
||||
const response = await fetch(`https://holocron.keross.com/api/platform/auth/login`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
userlogin: username,
|
||||
password,
|
||||
credentialType: "PASSWORD",
|
||||
}),
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (response.ok) {
|
||||
showAlert("Login successful!", "success");
|
||||
console.log(result)
|
||||
setCookie("accessToken", result.accessToken, result.expiresIn );
|
||||
setCookie("refreshToken", result.refreshToken, result.refreshExpiresIn );
|
||||
|
||||
setTimeout(() => {
|
||||
//window.location.href = `auth?accessToken=${result.accessToken}&refreshToken=${result.refreshToken}&expiresIn=${result.expiresIn}&refreshExpiresIn=${result.refreshExpiresIn}`;
|
||||
window.location.href = "/";
|
||||
}, 1500);
|
||||
} else {
|
||||
showAlert(result.error || "Login failed.");
|
||||
}
|
||||
} catch (error) {
|
||||
showAlert("Error connecting to the server.");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
////////////// ---------------- backup code ----------------------------//
|
||||
|
||||
// document.addEventListener("DOMContentLoaded", function () {
|
||||
// const usernameInput = document.getElementById("userName");
|
||||
// const passwordInput = document.getElementById("userPassword");
|
||||
// const resetButton = document.getElementById("resetLoginBtn");
|
||||
// const loginButton = document.getElementById("submitLoginBtn");
|
||||
|
||||
// usernameInput.setAttribute("autocomplete", "off");
|
||||
// passwordInput.setAttribute("autocomplete", "off");
|
||||
|
||||
// resetButton.addEventListener("click", function (e) {
|
||||
// e.preventDefault();
|
||||
// usernameInput.value = "";
|
||||
// passwordInput.value = "";
|
||||
// });
|
||||
|
||||
// loginButton.addEventListener("click", async function (event) {
|
||||
// event.preventDefault();
|
||||
|
||||
// const username = usernameInput.value.trim();
|
||||
// const password = passwordInput.value.trim();
|
||||
|
||||
// console.log("Username:", username);
|
||||
// console.log("Password:", password);
|
||||
// try {
|
||||
// const response = await fetch("/api/auth/login", {
|
||||
// method: "POST",
|
||||
// headers: { "Content-Type": "application/json" },
|
||||
// body: JSON.stringify({ userName: username, password }),
|
||||
// });
|
||||
|
||||
// const result = await response.json();
|
||||
|
||||
// if (response.ok) {
|
||||
// alert("Login successful!");
|
||||
// window.location.href = "/";
|
||||
// } else {
|
||||
// alert(result.error || "Login failed.");
|
||||
// }
|
||||
// } catch (error) {
|
||||
// alert("Error connecting to the server.");
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
Reference in New Issue
Block a user