Compare commits
7 Commits
cee188145d
...
jspong
Author | SHA1 | Date | |
---|---|---|---|
63e1520e6a | |||
754e5867f2 | |||
ca6dba2763 | |||
aa35514c44 | |||
12056554fc | |||
c2317d5404 | |||
25f315c24f |
@ -1,4 +1,5 @@
|
|||||||
from .register import *
|
from .register import *
|
||||||
from .login import *
|
from .login import *
|
||||||
|
from .logout import *
|
||||||
from .edit import *
|
from .edit import *
|
||||||
from .delete import *
|
from .delete import *
|
@ -21,12 +21,17 @@ class DeleteTest(TestCase):
|
|||||||
|
|
||||||
|
|
||||||
def test_normal_delete(self):
|
def test_normal_delete(self):
|
||||||
response: HttpResponse = self.client.delete(self.url)
|
response: HttpResponse = self.client.delete(self.url, {"password": self.password}, content_type='application/json')
|
||||||
response_text: str = response.content.decode("utf-8")
|
response_text: str = response.content.decode("utf-8")
|
||||||
self.assertEqual(response_text, '"user deleted"')
|
self.assertEqual(response_text, '"user deleted"')
|
||||||
|
|
||||||
|
def test_wrong_pass(self):
|
||||||
|
response: HttpResponse = self.client.delete(self.url, {"password": "cacaman a frapper"}, content_type='application/json')
|
||||||
|
errors: dict = eval(response.content)
|
||||||
|
self.assertDictEqual(errors, {"password": ["Password wrong."]})
|
||||||
|
|
||||||
def test_no_logged(self):
|
def test_no_logged(self):
|
||||||
self.client.logout()
|
self.client.logout()
|
||||||
response: HttpResponse = self.client.post(self.url)
|
response: HttpResponse = self.client.delete(self.url, {"password": self.password}, content_type='application/json')
|
||||||
errors: dict = eval(response.content)
|
errors: dict = eval(response.content)
|
||||||
self.assertDictEqual(errors, {"detail":"Authentication credentials were not provided."})
|
self.assertDictEqual(errors, {"detail":"Authentication credentials were not provided."})
|
@ -8,5 +8,12 @@ class DeleteView(APIView):
|
|||||||
permission_classes = (permissions.IsAuthenticated,)
|
permission_classes = (permissions.IsAuthenticated,)
|
||||||
authentication_classes = (SessionAuthentication,)
|
authentication_classes = (SessionAuthentication,)
|
||||||
def delete(self, request: HttpRequest):
|
def delete(self, request: HttpRequest):
|
||||||
|
data: dict = request.data
|
||||||
|
|
||||||
|
password: str = data["password"]
|
||||||
|
if (password is None):
|
||||||
|
return Response({"password": ["This field may not be blank."]})
|
||||||
|
if (request.user.check_password(password) == False):
|
||||||
|
return Response({"password": ["Password wrong."]})
|
||||||
request.user.delete()
|
request.user.delete()
|
||||||
return Response("user deleted", status=status.HTTP_200_OK)
|
return Response("user deleted", status=status.HTTP_200_OK)
|
@ -12,6 +12,9 @@ class EditView(APIView):
|
|||||||
permission_classes = (permissions.IsAuthenticated,)
|
permission_classes = (permissions.IsAuthenticated,)
|
||||||
authentication_classes = (SessionAuthentication,)
|
authentication_classes = (SessionAuthentication,)
|
||||||
|
|
||||||
|
def get(self, request: HttpRequest):
|
||||||
|
return Response({"username": request.user.username})
|
||||||
|
|
||||||
def patch(self, request: HttpRequest):
|
def patch(self, request: HttpRequest):
|
||||||
data: dict = request.data
|
data: dict = request.data
|
||||||
|
|
||||||
|
59
frontend/static/js/api/account.js
Normal file
59
frontend/static/js/api/account.js
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
class Account
|
||||||
|
{
|
||||||
|
constructor (client)
|
||||||
|
{
|
||||||
|
this.client = client;
|
||||||
|
}
|
||||||
|
|
||||||
|
async create(username, password)
|
||||||
|
{
|
||||||
|
let response = await this.client._post("/api/accounts/register", {username: username, password: password});
|
||||||
|
let response_data = await response.json()
|
||||||
|
|
||||||
|
if (response_data == "user created")
|
||||||
|
{
|
||||||
|
this._logged = true;
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return response_data
|
||||||
|
}
|
||||||
|
|
||||||
|
async delete(password)
|
||||||
|
{
|
||||||
|
let response = await this.client._delete("/api/accounts/delete", {password: password});
|
||||||
|
let response_data = await response.json();
|
||||||
|
|
||||||
|
if (response_data === "user deleted")
|
||||||
|
this.client._logged = false;
|
||||||
|
return response_data;
|
||||||
|
}
|
||||||
|
|
||||||
|
async get()
|
||||||
|
{
|
||||||
|
let response = await this.client._get("/api/accounts/edit");
|
||||||
|
let response_data = await response.json();
|
||||||
|
|
||||||
|
if (JSON.stringify(response_data) == JSON.stringify({'detail': 'Authentication credentials were not provided.'}))
|
||||||
|
{
|
||||||
|
console.log("error, client is not logged");
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return response_data;
|
||||||
|
}
|
||||||
|
|
||||||
|
async update(data, password)
|
||||||
|
{
|
||||||
|
data.password = password;
|
||||||
|
let response = await this.client._patch_json("/api/accounts/edit", data);
|
||||||
|
let response_data = await response.json();
|
||||||
|
|
||||||
|
if (JSON.stringify(response_data) == JSON.stringify({'detail': 'Authentication credentials were not provided.'}))
|
||||||
|
{
|
||||||
|
console.log("error, client is not logged");
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return response_data;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Account }
|
@ -1,15 +0,0 @@
|
|||||||
class Accounts
|
|
||||||
{
|
|
||||||
constructor (client)
|
|
||||||
{
|
|
||||||
this.client = client;
|
|
||||||
}
|
|
||||||
|
|
||||||
async create(username, password)
|
|
||||||
{
|
|
||||||
let response = await this.client._post("/api/accounts/register", {username: username, password: password});
|
|
||||||
return response
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export { Accounts }
|
|
@ -1,11 +1,21 @@
|
|||||||
import { Accounts } from "./accounts.js";
|
import { Account } from "./account.js";
|
||||||
|
|
||||||
|
function getCookie(name)
|
||||||
|
{
|
||||||
|
let cookie = {};
|
||||||
|
document.cookie.split(';').forEach(function(el) {
|
||||||
|
let split = el.split('=');
|
||||||
|
cookie[split[0].trim()] = split.slice(1).join("=");
|
||||||
|
})
|
||||||
|
return cookie[name];
|
||||||
|
}
|
||||||
|
|
||||||
class Client
|
class Client
|
||||||
{
|
{
|
||||||
constructor(url)
|
constructor(url)
|
||||||
{
|
{
|
||||||
this._url = url;
|
this._url = url;
|
||||||
this.accounts = new Accounts(this);
|
this.account = new Account(this);
|
||||||
this._logged = undefined;
|
this._logged = undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -30,6 +40,33 @@ class Client
|
|||||||
method: "POST",
|
method: "POST",
|
||||||
headers: {
|
headers: {
|
||||||
"Content-Type": "application/json",
|
"Content-Type": "application/json",
|
||||||
|
"X-CSRFToken": getCookie("csrftoken"),
|
||||||
|
},
|
||||||
|
body: JSON.stringify(data),
|
||||||
|
});
|
||||||
|
return response;
|
||||||
|
}
|
||||||
|
|
||||||
|
async _delete(uri, data)
|
||||||
|
{
|
||||||
|
let response = await fetch(this._url + uri, {
|
||||||
|
method: "DELETE",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
"X-CSRFToken": getCookie("csrftoken"),
|
||||||
|
},
|
||||||
|
body: JSON.stringify(data),
|
||||||
|
});
|
||||||
|
return response;
|
||||||
|
}
|
||||||
|
|
||||||
|
async _patch_json(uri, data)
|
||||||
|
{
|
||||||
|
let response = await fetch(this._url + uri, {
|
||||||
|
method: "PATCH",
|
||||||
|
headers: {
|
||||||
|
"X-CSRFToken": getCookie("csrftoken"),
|
||||||
|
"Content-Type": "application/json",
|
||||||
},
|
},
|
||||||
body: JSON.stringify(data),
|
body: JSON.stringify(data),
|
||||||
});
|
});
|
||||||
|
@ -3,14 +3,16 @@ 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 Search from "./views/Search.js";
|
|
||||||
import Chat from "./views/Chat.js";
|
import Chat from "./views/Chat.js";
|
||||||
import HomeView from "./views/HomeView.js";
|
import HomeView from "./views/HomeView.js";
|
||||||
import RegisterView from "./views/accounts/RegisterView.js";
|
import RegisterView from "./views/accounts/RegisterView.js";
|
||||||
import LogoutView from "./views/accounts/LogoutView.js";
|
import LogoutView from "./views/accounts/LogoutView.js";
|
||||||
|
|
||||||
|
import GameView from "./views/Game.js"
|
||||||
|
|
||||||
import { Client } from "./api/client.js";
|
import { Client } from "./api/client.js";
|
||||||
import AbstractRedirectView from "./views/AbstractRedirectView.js";
|
import AbstractRedirectView from "./views/AbstractRedirectView.js";
|
||||||
|
import MeView from "./views/MeView.js";
|
||||||
|
|
||||||
let client = new Client(location.protocol + "//" + location.host)
|
let client = new Client(location.protocol + "//" + location.host)
|
||||||
|
|
||||||
@ -41,9 +43,10 @@ const router = async (uri = "") => {
|
|||||||
{ path: "/login", view: LoginView },
|
{ path: "/login", view: LoginView },
|
||||||
{ path: "/logout", view: LogoutView },
|
{ path: "/logout", view: LogoutView },
|
||||||
{ path: "/register", view: RegisterView },
|
{ path: "/register", view: RegisterView },
|
||||||
{ path: "/search", view: Search },
|
|
||||||
{ path: "/chat", view: Chat },
|
{ path: "/chat", view: Chat },
|
||||||
{ path: "/home", view: HomeView },
|
{ path: "/home", view: HomeView },
|
||||||
|
{ path: "/me", view: MeView },
|
||||||
|
{ path: "/game", view: GameView },
|
||||||
];
|
];
|
||||||
|
|
||||||
// Test each route for potential match
|
// Test each route for potential match
|
||||||
|
@ -4,7 +4,7 @@ export default class extends AbstractAuthentifiedView {
|
|||||||
constructor(params) {
|
constructor(params) {
|
||||||
super(params, "Chat");
|
super(params, "Chat");
|
||||||
|
|
||||||
let url = `ws://${window.location.host}/ws/socket-server/`
|
let url = `wss://${window.location.host}/ws/socket-server/`
|
||||||
|
|
||||||
this.chatSocket = new WebSocket(url)
|
this.chatSocket = new WebSocket(url)
|
||||||
this.chatSocket.onmessage = function(e){
|
this.chatSocket.onmessage = function(e){
|
||||||
@ -44,7 +44,7 @@ export default class extends AbstractAuthentifiedView {
|
|||||||
<h1>Chat</h1>
|
<h1>Chat</h1>
|
||||||
|
|
||||||
<form id="form">
|
<form id="form">
|
||||||
<input type="text" name="message" placeholder="message"/>
|
<input type="text" name="message" />
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<div id="messages">
|
<div id="messages">
|
||||||
|
250
frontend/static/js/views/Game.js
Normal file
250
frontend/static/js/views/Game.js
Normal file
@ -0,0 +1,250 @@
|
|||||||
|
import AbstractView from './AbstractView.js'
|
||||||
|
|
||||||
|
export default class extends AbstractView {
|
||||||
|
constructor(params) {
|
||||||
|
super(params, 'Game');
|
||||||
|
this.game = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
async getHtml() {
|
||||||
|
return `
|
||||||
|
<h1>Game</h1>
|
||||||
|
<button id='startGameButton'>Start Game</button>
|
||||||
|
<button id='stopGameButton'>Stop Game</button>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
async postInit() {
|
||||||
|
document.getElementById('startGameButton').onclick = this.startGame.bind(this);
|
||||||
|
document.getElementById('stopGameButton').onclick = this.stopGame.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
startGame() {
|
||||||
|
if (this.game == null) {
|
||||||
|
document.getElementById('startGameButton').innerHTML = 'Reset Game';
|
||||||
|
this.game = new Game;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
document.getElementById('app').removeChild(this.game.canvas);
|
||||||
|
this.game.cleanup();
|
||||||
|
this.game = new Game;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
stopGame() {
|
||||||
|
if (!this.game)
|
||||||
|
return;
|
||||||
|
document.getElementById('app').removeChild(this.game.canvas);
|
||||||
|
document.getElementById('app').removeChild(this.game.scoresDisplay);
|
||||||
|
this.game.cleanup();
|
||||||
|
this.game = null;
|
||||||
|
document.getElementById('startGameButton').innerHTML = 'Start Game';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class Game {
|
||||||
|
constructor() {
|
||||||
|
//Global variables
|
||||||
|
this.def = {
|
||||||
|
CANVASHEIGHT: 270,
|
||||||
|
CANVASWIDTH: 480,
|
||||||
|
PADDLEHEIGHT: 70,
|
||||||
|
PADDLEWIDTH: 10,
|
||||||
|
PADDLEMARGIN: 5,
|
||||||
|
PADDLESPEED: 3,
|
||||||
|
BALLRADIUS: 5,
|
||||||
|
BALLSPEED: 2,
|
||||||
|
BALLSPEEDINCR: 0.15,
|
||||||
|
MAXBOUNCEANGLE: 10 * (Math.PI / 12),
|
||||||
|
MAXSCORE: 6
|
||||||
|
};
|
||||||
|
|
||||||
|
this.canvas = document.createElement('canvas');
|
||||||
|
this.canvas.id = 'gameCanvas';
|
||||||
|
this.canvas.width = this.def.CANVASWIDTH;
|
||||||
|
this.canvas.height = this.def.CANVASHEIGHT;
|
||||||
|
this.canvas.style.border = '1px solid #d3d3d3';
|
||||||
|
this.canvas.style.backgroundColor = '#f1f1f1';
|
||||||
|
this.context = this.canvas.getContext('2d');
|
||||||
|
document.getElementById('app').appendChild(this.canvas);
|
||||||
|
this.scoresDisplay = document.createElement('p');
|
||||||
|
this.scoresDisplay.innerHTML = 'Scores: 0 - 0';
|
||||||
|
document.getElementById('app').appendChild(this.scoresDisplay);
|
||||||
|
|
||||||
|
this.players = [
|
||||||
|
{
|
||||||
|
paddle: new Paddle(this.context,
|
||||||
|
this.def.PADDLEMARGIN,
|
||||||
|
this.def),
|
||||||
|
score: 0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
paddle: new Paddle(this.context,
|
||||||
|
this.def.CANVASWIDTH - this.def.PADDLEMARGIN - this.def.PADDLEWIDTH,
|
||||||
|
this.def),
|
||||||
|
score: 0
|
||||||
|
}
|
||||||
|
];
|
||||||
|
this.ballStartSide = 0;
|
||||||
|
this.ballRespawned = false;
|
||||||
|
this.ball = new Ball(this.context, this.def, this.ballStartSide);
|
||||||
|
|
||||||
|
this.interval = setInterval(this.updateGame.bind(this), 10);
|
||||||
|
|
||||||
|
this.keys = [];
|
||||||
|
this.keyUpHandler = this.keyUpHandler.bind(this);
|
||||||
|
this.keyDownHandler = this.keyDownHandler.bind(this);
|
||||||
|
document.addEventListener('keydown', this.keyDownHandler);
|
||||||
|
document.addEventListener('keyup', this.keyUpHandler);
|
||||||
|
}
|
||||||
|
|
||||||
|
cleanup() {
|
||||||
|
clearInterval(this.interval);
|
||||||
|
document.removeEventListener('keydown', this.keyDownHandler);
|
||||||
|
document.removeEventListener('keyup', this.keyUpHandler);
|
||||||
|
this.canvas.style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
clear() {
|
||||||
|
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||||
|
}
|
||||||
|
|
||||||
|
updateGame() {
|
||||||
|
//Paddle movement
|
||||||
|
if (this.keys.includes('s') &&
|
||||||
|
this.players[0].paddle.y + this.def.PADDLEHEIGHT < this.def.CANVASHEIGHT - this.def.PADDLEMARGIN)
|
||||||
|
this.players[0].paddle.y += this.def.PADDLESPEED;
|
||||||
|
if (this.keys.includes('w') &&
|
||||||
|
this.players[0].paddle.y > 0 + this.def.PADDLEMARGIN)
|
||||||
|
this.players[0].paddle.y -= this.def.PADDLESPEED;
|
||||||
|
|
||||||
|
if (this.keys.includes('ArrowDown') &&
|
||||||
|
this.players[1].paddle.y + this.def.PADDLEHEIGHT < this.def.CANVASHEIGHT - this.def.PADDLEMARGIN)
|
||||||
|
this.players[1].paddle.y += this.def.PADDLESPEED;
|
||||||
|
if (this.keys.includes('ArrowUp') &&
|
||||||
|
this.players[1].paddle.y > 0 + this.def.PADDLEMARGIN)
|
||||||
|
this.players[1].paddle.y -= this.def.PADDLESPEED;
|
||||||
|
|
||||||
|
//GOOAAAAL
|
||||||
|
if (this.ball.x <= 0)
|
||||||
|
this.updateScore(this.players[0].score, ++this.players[1].score);
|
||||||
|
else if (this.ball.x >= this.def.CANVASWIDTH)
|
||||||
|
this.updateScore(++this.players[0].score, this.players[1].score);
|
||||||
|
|
||||||
|
//Ball collisions
|
||||||
|
if (this.detectCollision(this.players[0].paddle, this.ball))
|
||||||
|
this.calculateBallVelocity(this.players[0].paddle.getCenter().y, this.ball);
|
||||||
|
else if (this.detectCollision(this.players[1].paddle, this.ball))
|
||||||
|
this.calculateBallVelocity(this.players[1].paddle.getCenter().y, this.ball, -1);
|
||||||
|
|
||||||
|
if (this.ball.y - this.ball.radius <= 0)
|
||||||
|
this.ball.vy *= -1;
|
||||||
|
else if (this.ball.y + this.ball.radius >= this.canvas.height)
|
||||||
|
this.ball.vy *= -1;
|
||||||
|
|
||||||
|
if (!this.ballRespawned) {
|
||||||
|
this.ball.x += this.ball.vx;
|
||||||
|
this.ball.y += this.ball.vy;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.clear();
|
||||||
|
this.players[0].paddle.update();
|
||||||
|
this.players[1].paddle.update();
|
||||||
|
this.ball.update();
|
||||||
|
}
|
||||||
|
|
||||||
|
updateScore(p1Score, p2Score) {
|
||||||
|
if (p1Score > this.def.MAXSCORE) {
|
||||||
|
this.scoresDisplay.innerHTML = 'Player 1 wins!! GGS';
|
||||||
|
this.cleanup();
|
||||||
|
}
|
||||||
|
else if (p2Score > this.def.MAXSCORE) {
|
||||||
|
this.scoresDisplay.innerHTML = 'Player 2 wins!! GGS';
|
||||||
|
this.cleanup();
|
||||||
|
} else {
|
||||||
|
this.scoresDisplay.innerHTML = `Scores: ${p1Score} - ${p2Score}`;
|
||||||
|
this.ballStartSide = 1 - this.ballStartSide;
|
||||||
|
this.ball = new Ball(this.context, this.def, this.ballStartSide);
|
||||||
|
this.ballRespawned = true;
|
||||||
|
new Promise(r => setTimeout(r, 300))
|
||||||
|
.then(_ => this.ballRespawned = false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
detectCollision(paddle, ball) {
|
||||||
|
let paddleCenter = paddle.getCenter();
|
||||||
|
let dx = Math.abs(ball.x - paddleCenter.x);
|
||||||
|
let dy = Math.abs(ball.y - paddleCenter.y);
|
||||||
|
if (dx <= ball.radius + paddle.width / 2 &&
|
||||||
|
dy <= ball.radius + paddle.height / 2)
|
||||||
|
return true;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
calculateBallVelocity(paddleCenterY, ball, side = 1) {
|
||||||
|
let relativeIntersectY = paddleCenterY - ball.y;
|
||||||
|
let normRelIntersectY = relativeIntersectY / this.def.PADDLEHEIGHT / 2;
|
||||||
|
let bounceAngle = normRelIntersectY * this.def.MAXBOUNCEANGLE;
|
||||||
|
|
||||||
|
ball.speed += this.def.BALLSPEEDINCR;
|
||||||
|
ball.vx = ball.speed * side * Math.cos(bounceAngle);
|
||||||
|
ball.vy = ball.speed * -Math.sin(bounceAngle);
|
||||||
|
}
|
||||||
|
|
||||||
|
keyUpHandler(ev) {
|
||||||
|
const idx = this.keys.indexOf(ev.key);
|
||||||
|
if (idx != -1)
|
||||||
|
this.keys.splice(idx, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
keyDownHandler(ev) {
|
||||||
|
if (!this.keys.includes(ev.key))
|
||||||
|
this.keys.push(ev.key);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class Paddle {
|
||||||
|
constructor(context, paddleSide, def) {
|
||||||
|
this.width = def.PADDLEWIDTH;
|
||||||
|
this.height = def.PADDLEHEIGHT;
|
||||||
|
this.x = paddleSide;
|
||||||
|
this.y = def.CANVASHEIGHT / 2 - this.height / 2;
|
||||||
|
this.ctx = context;
|
||||||
|
this.update();
|
||||||
|
}
|
||||||
|
|
||||||
|
update() {
|
||||||
|
this.ctx.fillStyle = 'black';
|
||||||
|
this.ctx.fillRect(this.x, this.y, this.width, this.height);
|
||||||
|
}
|
||||||
|
|
||||||
|
getCenter() {
|
||||||
|
return {
|
||||||
|
x: this.x + this.width / 2,
|
||||||
|
y: this.y + this.height / 2
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class Ball {
|
||||||
|
constructor(context, def, startSide) {
|
||||||
|
this.radius = def.BALLRADIUS;
|
||||||
|
this.speed = def.BALLSPEED;
|
||||||
|
this.x = def.CANVASWIDTH / 2;
|
||||||
|
this.y = def.CANVASHEIGHT / 2;
|
||||||
|
this.vy = 0;
|
||||||
|
if (startSide === 0)
|
||||||
|
this.vx = -this.speed;
|
||||||
|
else
|
||||||
|
this.vx = this.speed;
|
||||||
|
this.ctx = context;
|
||||||
|
this.update();
|
||||||
|
}
|
||||||
|
|
||||||
|
update() {
|
||||||
|
this.ctx.fillStyle = 'black';
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI);
|
||||||
|
this.ctx.fill();
|
||||||
|
}
|
||||||
|
}
|
@ -9,6 +9,7 @@ export default class extends AbstractAuthentificateView {
|
|||||||
async getHtml() {
|
async getHtml() {
|
||||||
return `
|
return `
|
||||||
<h1>HOME</h1>
|
<h1>HOME</h1>
|
||||||
|
<a href="/me" class="nav__link" data-link>Me</a>
|
||||||
<a href="/logout" class="nav__link" data-link>Logout</a>
|
<a href="/logout" class="nav__link" data-link>Logout</a>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
103
frontend/static/js/views/MeView.js
Normal file
103
frontend/static/js/views/MeView.js
Normal file
@ -0,0 +1,103 @@
|
|||||||
|
import { client, navigateTo } from "../index.js";
|
||||||
|
import AbstractAuthentificateView from "./AbstractAuthentifiedView.js";
|
||||||
|
|
||||||
|
export default class extends AbstractAuthentificateView
|
||||||
|
{
|
||||||
|
constructor(params)
|
||||||
|
{
|
||||||
|
super(params, "Me");
|
||||||
|
}
|
||||||
|
|
||||||
|
async postInit()
|
||||||
|
{
|
||||||
|
if (this.fill() === null)
|
||||||
|
return;
|
||||||
|
document.getElementById("save-button").onclick = this.save;
|
||||||
|
document.getElementById("delete-button").onclick = this.delete_accounts;
|
||||||
|
}
|
||||||
|
|
||||||
|
async fill()
|
||||||
|
{
|
||||||
|
let data = await client.account.get();
|
||||||
|
|
||||||
|
document.getElementById("username").value = data.username;
|
||||||
|
}
|
||||||
|
|
||||||
|
async delete_accounts()
|
||||||
|
{
|
||||||
|
let current_password = document.getElementById("current_password").value;
|
||||||
|
|
||||||
|
let response_data = await client.account.delete(current_password);
|
||||||
|
|
||||||
|
if (response_data === null)
|
||||||
|
{
|
||||||
|
navigateTo("/login");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
["delete", "current_password"].forEach(error_field => {
|
||||||
|
let error_display = document.getElementById(`error_${error_field}`);
|
||||||
|
if (error_display != null)
|
||||||
|
error_display.innerHTML = "";
|
||||||
|
});
|
||||||
|
|
||||||
|
if (response_data === "user deleted")
|
||||||
|
{
|
||||||
|
document.getElementById(`error_delete`).innerHTML = "OK";
|
||||||
|
navigateTo("/login")
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById("error_current_password").innerHTML = response_data["password"]
|
||||||
|
}
|
||||||
|
|
||||||
|
async save()
|
||||||
|
{
|
||||||
|
let username = document.getElementById("username").value;
|
||||||
|
let new_password = document.getElementById("new_password").value;
|
||||||
|
let current_password = document.getElementById("current_password").value;
|
||||||
|
|
||||||
|
let data = {};
|
||||||
|
|
||||||
|
data.username = username;
|
||||||
|
if (new_password.length != 0)
|
||||||
|
data.new_password = new_password;
|
||||||
|
let response_data = await client.account.update(data, current_password);
|
||||||
|
|
||||||
|
if (response_data === null)
|
||||||
|
{
|
||||||
|
navigateTo(super.redirect_url);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
["username", "new_password", "current_password"].forEach(error_field => {
|
||||||
|
let error_display = document.getElementById(`error_${error_field}`);
|
||||||
|
if (error_display != null)
|
||||||
|
error_display.innerHTML = "";
|
||||||
|
});
|
||||||
|
|
||||||
|
Object.keys(response_data).forEach(error_field => {
|
||||||
|
let error_display = document.getElementById(`error_${error_field}`);
|
||||||
|
if (error_display != null)
|
||||||
|
error_display.innerHTML = response_data[error_field];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async getHtml()
|
||||||
|
{
|
||||||
|
return `
|
||||||
|
<h1>ME</h1>
|
||||||
|
<input type=text placeholder="username" id="username">
|
||||||
|
<span id="error_username"></span>
|
||||||
|
<input type=password placeholder="new password" id="new_password">
|
||||||
|
<span id="error_new_password"></span>
|
||||||
|
<input type=password placeholder="current password" id="current_password">
|
||||||
|
<span id="error_current_password"></span>
|
||||||
|
<input type="button" value="Save" id="save-button">
|
||||||
|
<span id="error_save"></span>
|
||||||
|
<input type="button" value="Delete" id="delete-button">
|
||||||
|
<span id="error_delete"></span>
|
||||||
|
<a href="/logout" class="nav__link" data-link>Logout</a>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
@ -1,38 +0,0 @@
|
|||||||
import AbstractAuthentifiedView from "./AbstractAuthentifiedView.js";
|
|
||||||
|
|
||||||
export default class extends AbstractAuthentifiedView {
|
|
||||||
constructor(params) {
|
|
||||||
super(params, "Search");
|
|
||||||
}
|
|
||||||
|
|
||||||
async postInit() {
|
|
||||||
let users = ["cramptéMan", "cacaMan", "chatteWomen"]
|
|
||||||
|
|
||||||
let list_users = document.getElementById('list_users');
|
|
||||||
for (const user of users) {
|
|
||||||
var new_user = document.createElement("li");
|
|
||||||
new_user.appendChild(document.createTextNode(user));
|
|
||||||
list_users.appendChild(new_user);
|
|
||||||
}
|
|
||||||
console.log(list_users);
|
|
||||||
}
|
|
||||||
|
|
||||||
async leavePage() {
|
|
||||||
}
|
|
||||||
|
|
||||||
async getHtml() {
|
|
||||||
return `
|
|
||||||
<h1>Search</h1>
|
|
||||||
|
|
||||||
<form id="form">
|
|
||||||
<input type="text" name="message" placeholder="user name to crampte"/>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<div id="users">
|
|
||||||
<ul id="list_users">
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
}
|
|
@ -6,8 +6,14 @@ async function register()
|
|||||||
let username = document.getElementById("username").value;
|
let username = document.getElementById("username").value;
|
||||||
let password = document.getElementById("password").value;
|
let password = document.getElementById("password").value;
|
||||||
|
|
||||||
let response = await client.accounts.create(username, password);
|
let response_data = await client.account.create(username, password);
|
||||||
let response_data = await response.json();
|
|
||||||
|
if (response_data == null)
|
||||||
|
{
|
||||||
|
navigateTo("/home");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
["username", "user", "password"].forEach(error_field => {
|
["username", "user", "password"].forEach(error_field => {
|
||||||
let error_display = document.getElementById(`error_${error_field}`);
|
let error_display = document.getElementById(`error_${error_field}`);
|
||||||
|
@ -14,7 +14,7 @@
|
|||||||
<a href="/settings" class="nav__link" data-link>Settings</a>
|
<a href="/settings" class="nav__link" data-link>Settings</a>
|
||||||
<a href="/login" class="nav__link" data-link>Login</a>
|
<a href="/login" class="nav__link" data-link>Login</a>
|
||||||
<a href="/register" class="nav__link" data-link>Register</a>
|
<a href="/register" class="nav__link" data-link>Register</a>
|
||||||
<a href="/search" class="nav__link" data-link>Search</a>
|
<a href="/chat" class="nav__link" data-link>Chat</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>
|
||||||
|
6
package-lock.json
generated
6
package-lock.json
generated
@ -1,6 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "ft_transcendence",
|
|
||||||
"lockfileVersion": 3,
|
|
||||||
"requires": true,
|
|
||||||
"packages": {}
|
|
||||||
}
|
|
@ -25,12 +25,12 @@ SECRET_KEY = 'django-insecure-18!@88-wm-!skec9^n-85n(f$my^#mh3!#@f=_e@=*arh_yyjj
|
|||||||
# SECURITY WARNING: don't run with debug turned on in production!
|
# SECURITY WARNING: don't run with debug turned on in production!
|
||||||
DEBUG = True
|
DEBUG = True
|
||||||
|
|
||||||
CSRF_TRUSTED_ORIGINS = ['https://code.chauvet.pro', 'https://django.chauvet.pro']
|
|
||||||
|
|
||||||
ALLOWED_HOSTS = ["*"]
|
ALLOWED_HOSTS = ["*"]
|
||||||
|
|
||||||
CORS_ORIGIN_ALLOW_ALL = False
|
CORS_ORIGIN_ALLOW_ALL = False
|
||||||
|
|
||||||
|
CSRF_TRUSTED_ORIGINS = ["https://django.chauvet.pro"]
|
||||||
|
|
||||||
CORS_ORIGIN_WHITELIST = (
|
CORS_ORIGIN_WHITELIST = (
|
||||||
'http://localhost:8000',
|
'http://localhost:8000',
|
||||||
)
|
)
|
||||||
|
Reference in New Issue
Block a user