Compare commits
2 Commits
2a468bcb82
...
9c59401cf2
Author | SHA1 | Date | |
---|---|---|---|
|
9c59401cf2 | ||
ea42d10ddf |
32
frontend/static/js/api/client.js
Normal file
32
frontend/static/js/api/client.js
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
class Client
|
||||||
|
{
|
||||||
|
constructor(url)
|
||||||
|
{
|
||||||
|
this._url = url;
|
||||||
|
this._token = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
get isAuthentificate()
|
||||||
|
{
|
||||||
|
return this.token != undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
async _post(uri, data)
|
||||||
|
{
|
||||||
|
let response = await fetch(this._url + uri, {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify(data),
|
||||||
|
});
|
||||||
|
return response;
|
||||||
|
}
|
||||||
|
|
||||||
|
async login(username, password)
|
||||||
|
{
|
||||||
|
return this._post("/api/accounts/login", {username: username, password: password})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export {Client}
|
@ -1,9 +1,14 @@
|
|||||||
|
import LoginView from "./views/accounts/LoginView.js";
|
||||||
import Dashboard from "./views/Dashboard.js";
|
import Dashboard from "./views/Dashboard.js";
|
||||||
import Posts from "./views/Posts.js";
|
import Posts from "./views/Posts.js";
|
||||||
import PostView from "./views/PostView.js";
|
import PostView from "./views/PostView.js";
|
||||||
import Settings from "./views/Settings.js";
|
import Settings from "./views/Settings.js";
|
||||||
import Chat from "./views/Chat.js";
|
import Chat from "./views/Chat.js";
|
||||||
|
|
||||||
|
import { Client } from "./api/client.js";
|
||||||
|
|
||||||
|
let client = new Client(location.protocol + "//" + location.host)
|
||||||
|
|
||||||
const pathToRegex = path => new RegExp("^" + path.replace(/\//g, "\\/").replace(/:\w+/g, "(.+)") + "$");
|
const pathToRegex = path => new RegExp("^" + path.replace(/\//g, "\\/").replace(/:\w+/g, "(.+)") + "$");
|
||||||
|
|
||||||
const getParams = match => {
|
const getParams = match => {
|
||||||
@ -27,6 +32,7 @@ const router = async () => {
|
|||||||
{ path: "/posts/:id", view: PostView },
|
{ path: "/posts/:id", view: PostView },
|
||||||
{ path: "/settings", view: Settings },
|
{ path: "/settings", view: Settings },
|
||||||
{ path: "/chat", view: Chat },
|
{ path: "/chat", view: Chat },
|
||||||
|
{ path: "/login", view: LoginView },
|
||||||
];
|
];
|
||||||
|
|
||||||
// Test each route for potential match
|
// Test each route for potential match
|
||||||
@ -65,3 +71,5 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||||||
|
|
||||||
router();
|
router();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
export { client }
|
||||||
|
38
frontend/static/js/views/accounts/LoginView.js
Normal file
38
frontend/static/js/views/accounts/LoginView.js
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
import AbstractView from "../AbstractView.js";
|
||||||
|
import { client } from "../../index.js";
|
||||||
|
|
||||||
|
async function login()
|
||||||
|
{
|
||||||
|
let username = document.getElementById("username").value;
|
||||||
|
let password = document.getElementById("password").value;
|
||||||
|
|
||||||
|
let response = await client.login(username, password);
|
||||||
|
let errors = await response.json();
|
||||||
|
|
||||||
|
errors.user.forEach(error => {
|
||||||
|
console.log(error)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class extends AbstractView {
|
||||||
|
constructor(params) {
|
||||||
|
super(params);
|
||||||
|
this.setTitle("Login");
|
||||||
|
document.body.addEventListener("click", e => {
|
||||||
|
e.preventDefault();
|
||||||
|
if (e.target.type == "button")
|
||||||
|
{
|
||||||
|
login();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async getHtml() {
|
||||||
|
return `
|
||||||
|
<input type="text" id="username" placeholder="username">
|
||||||
|
<input type="password" id="password" placeholder="password">
|
||||||
|
<input type="button" value="login">
|
||||||
|
<span id="login_failed"></span>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
@ -13,6 +13,7 @@
|
|||||||
<a href="/posts" class="nav__link" data-link>Posts</a>
|
<a href="/posts" class="nav__link" data-link>Posts</a>
|
||||||
<a href="/settings" class="nav__link" data-link>Settings</a>
|
<a href="/settings" class="nav__link" data-link>Settings</a>
|
||||||
<a href="/chat" class="nav__link" data-link>Chat</a>
|
<a href="/chat" class="nav__link" data-link>Chat</a>
|
||||||
|
<a href="/login" class="nav__link" data-link>Login</a>
|
||||||
</nav>
|
</nav>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<script type="module" src="{% static 'js/index.js' %}"></script>
|
<script type="module" src="{% static 'js/index.js' %}"></script>
|
||||||
|
Loading…
Reference in New Issue
Block a user