parent
c02a51a4dd
commit
6e6f86323e
19 changed files with 238 additions and 156 deletions
@ -1,64 +1,78 @@ |
||||
import './bootstrap'; |
||||
|
||||
function addEvent(btn, func) { |
||||
if(btn) func(btn); |
||||
} |
||||
|
||||
window.addEventListener("DOMContentLoaded", () => { |
||||
let modal = document.querySelector('#modal-update'); |
||||
let openModalBtn = document.querySelector("#open-modal"); |
||||
let closeModalBtn = document.querySelector(".close-modal"); |
||||
let deleteUserBtn = document.querySelector(".btn-user-delete"); |
||||
let updateUserBtn = document.querySelector(".btn-user-update"); |
||||
let followBtn = document.querySelector(".btn-follow"); |
||||
let closeModalBtn = document.querySelector("#close-modal"); |
||||
let deleteUserBtn = document.querySelector("#btn-user-delete"); |
||||
let updateUserBtn = document.querySelector("#btn-user-update"); |
||||
let followBtn = document.querySelector("#btn-follow"); |
||||
|
||||
followBtn.addEventListener("click", (e) => { |
||||
e.preventDefault(); |
||||
let id = e.target.getAttribute("data-id"); |
||||
let token = document.querySelector('input[name=_token]').value; |
||||
fetch(`/follow/${id}`, { |
||||
method: "POST", |
||||
headers: { |
||||
"X-CSRF-Token": token |
||||
} |
||||
}).then((res) => { |
||||
if (res.status === 400) alert("Couldn't follow this user"); |
||||
//else if (res.status === 200) window.location.href = "/profile/" + id;
|
||||
addEvent(followBtn, (btn) => { |
||||
btn.addEventListener("click", (e) => { |
||||
e.preventDefault(); |
||||
let id = e.target.getAttribute("data-id"); |
||||
let token = document.querySelector('input[name=_token]').value; |
||||
fetch(`/follow/${id}`, { |
||||
method: "POST", |
||||
headers: { |
||||
"X-CSRF-Token": token |
||||
} |
||||
}).then((res) => { |
||||
if (res.status === 400) alert("Couldn't follow this user"); |
||||
//else if (res.status === 200) window.location.href = "/profile/" + id;
|
||||
}); |
||||
}); |
||||
}); |
||||
|
||||
openModalBtn.addEventListener("click", (e) => { |
||||
modal.showModal(); |
||||
addEvent(openModalBtn, (btn) => { |
||||
btn.addEventListener("click", (e) => { |
||||
modal.showModal(); |
||||
}); |
||||
}); |
||||
|
||||
closeModalBtn.addEventListener("click", (e) => { |
||||
modal.close(); |
||||
addEvent(closeModalBtn, (btn) => { |
||||
btn.addEventListener("click", (e) => { |
||||
modal.close(); |
||||
}); |
||||
}); |
||||
|
||||
updateUserBtn.addEventListener("click", (e) => { |
||||
e.preventDefault(); |
||||
let id = e.target.getAttribute("data-id"); |
||||
let token = document.querySelector('input[name=_token]').value; |
||||
let form = document.querySelector('.update-form'); |
||||
let formData = new FormData(form); |
||||
fetch(`/user/${id}`, { |
||||
method: "POST", |
||||
headers: { |
||||
"X-CSRF-Token": token |
||||
}, |
||||
body: formData |
||||
}).then((res) => { |
||||
window.location.href = "/profile/" + id; |
||||
addEvent(updateUserBtn, (btn) => { |
||||
btn.addEventListener("click", (e) => { |
||||
e.preventDefault(); |
||||
let id = e.target.getAttribute("data-id"); |
||||
let token = document.querySelector('input[name=_token]').value; |
||||
let form = document.querySelector('#update-form'); |
||||
let formData = new FormData(form); |
||||
fetch(`/user/${id}`, { |
||||
method: "POST", |
||||
headers: { |
||||
"X-CSRF-Token": token |
||||
}, |
||||
body: formData |
||||
}).then((res) => { |
||||
window.location.href = "/profile/" + id; |
||||
}); |
||||
}); |
||||
}); |
||||
|
||||
deleteUserBtn.addEventListener("click", (e) => { |
||||
e.preventDefault(); |
||||
let id = e.target.getAttribute("data-id"); |
||||
let token = document.querySelector('input[name=_token]').value; |
||||
fetch(`/user/${id}`, { |
||||
method: "DELETE", |
||||
headers: { |
||||
"X-CSRF-Token": token |
||||
} |
||||
}).then((res) => { |
||||
window.location.href = "/" |
||||
addEvent(deleteUserBtn, (btn) => {
|
||||
btn.addEventListener("click", (e) => { |
||||
e.preventDefault(); |
||||
let id = e.target.getAttribute("data-id"); |
||||
let token = document.querySelector('input[name=_token]').value; |
||||
fetch(`/user/${id}`, { |
||||
method: "DELETE", |
||||
headers: { |
||||
"X-CSRF-Token": token |
||||
} |
||||
}).then((res) => { |
||||
window.location.href = "/" |
||||
}); |
||||
}); |
||||
}); |
||||
}) |
||||
}); |
||||
@ -1,11 +1,19 @@ |
||||
@extends('base.layout') |
||||
|
||||
@section('content') |
||||
<h1>Login</h1> |
||||
<form action="/login" method="post"> |
||||
@csrf |
||||
<p>Email</p><input name="email" type="email" value="{{ old('email') }}"> |
||||
<p>Password</p><input name="password" type="password"> |
||||
<input type="submit"> |
||||
</form> |
||||
<div class="w-full flex justify-center items-center"> |
||||
<div class="w-2/3 p-10 border border-black dark:border-white rounded-lg"> |
||||
<h1 class="text-6xl font-bold pb-3 mb-5 border-b border-black dark:border-white">Login</h1> |
||||
<form action="/login" method="post" class="flex flex-col items-center"> |
||||
<div class="grid grid-cols-4 w-full"> |
||||
<p>Email :</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="email" type="email" value="{{ old('email') }}"> |
||||
<p>Password :</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="password" type="password"> |
||||
</div> |
||||
@csrf |
||||
<button type="submit" class="rounded-lg bg-blue-500 text-white p-2 w-fit">Send</button> |
||||
</form> |
||||
</div> |
||||
</div> |
||||
@endsection |
||||
@ -1,15 +1,25 @@ |
||||
@extends('base.layout') |
||||
|
||||
@section('content') |
||||
<h1>Register</h1> |
||||
<form action="/register" method="post"> |
||||
@csrf |
||||
<p>Username</p><input name="username" type="text" value="{{ old('username') }}"> |
||||
<p>Name</p><input name="name" type="text" value="{{ old('name') }}"> |
||||
<p>Email</p><input name="email" type="email" value="{{ old('email') }}"> |
||||
<p>Description</p><textarea name="description" type="text">{{ old('description') }}</textarea> |
||||
<p>Password</p><input name="password" type="password" > |
||||
<br> |
||||
<input type="submit"> |
||||
</form> |
||||
<div class="w-full flex justify-center items-center"> |
||||
<div class="w-2/3 p-10 border border-black dark:border-white rounded-lg"> |
||||
<h1 class="text-6xl font-bold pb-3 mb-5 border-b border-black dark:border-white">Register</h1> |
||||
<form action="/register" method="post" class="flex flex-col items-center"> |
||||
<div class="grid grid-cols-4 w-full"> |
||||
<p>Username :</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="username" type="text" value="{{ old('username') }}"> |
||||
<p>Name (Optional):</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="name" type="text" value="{{ old('name') }}"> |
||||
<p>Email :</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="email" type="email" value="{{ old('email') }}"> |
||||
<p>Description (Optional):</p><textarea class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="description" type="text">{{ old('description') }}</textarea> |
||||
<p>Password :</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="password" type="password" > |
||||
</div> |
||||
@csrf |
||||
<button type="submit" class="rounded-lg bg-blue-500 text-white p-2 w-fit">Send</button> |
||||
</form> |
||||
</div> |
||||
</div> |
||||
@endsection |
||||
@ -1,23 +1,17 @@ |
||||
@extends('base.layout') |
||||
|
||||
@section('content') |
||||
<div> |
||||
<h1>Email verification</h1> |
||||
|
||||
@if(session('resent')) |
||||
<div> |
||||
A fresh verification link has been sent to your email address. |
||||
<div class="w-full flex justify-center items-center"> |
||||
<div class="w-2/3 p-10 border border-black dark:border-white rounded-lg"> |
||||
<h1 class="text-6xl font-bold pb-3 mb-5 border-b border-black dark:border-white">Email verification</h1> |
||||
<div class="flex flex-col"> |
||||
<p class="mr-5">Before proceeding, please check your email for a verification link. If you did not receive the email,<p> |
||||
<form action="/email/verification-notification" method="post" class="mr-5"> |
||||
@csrf |
||||
<button type="submit" class="rounded-lg bg-blue-500 text-white p-2 w-fit">click here</button> |
||||
</form> |
||||
<p>to request another.</p> |
||||
</div> |
||||
@endif |
||||
|
||||
<div> |
||||
Before proceeding, please check your email for a verification link. If you did not receive the email, |
||||
<form action="/email/verification-notification" method="POST"> |
||||
@csrf |
||||
<button type="submit"> |
||||
click here to request another |
||||
</button>. |
||||
</form> |
||||
</div> |
||||
</div> |
||||
@endsection |
||||
@ -1,5 +1,5 @@ |
||||
<li class="flex justify-center mb-5"> |
||||
<a href="{{ $link }}"> |
||||
<img class="size-12" src="/img/{{ $icon }}"> |
||||
<img class="size-12 text-black dark:brightness-0 dark:invert" src="/img/{{ $icon }}"> |
||||
</a> |
||||
</li> |
||||
@ -1,13 +1,23 @@ |
||||
<dialog id="modal-update" modal-disable> |
||||
<button class="close-modal">Cancel</button> |
||||
<form class="update-form"> |
||||
<dialog id="modal-update" modal-disable |
||||
class="modal w-2/3 p-10 border rounded-lg border-black dark:border-white dark:bg-black dark:text-white"> |
||||
<div class="flex flex-row-reverse"> |
||||
<button id="close-modal" class="rounded-lg bg-red-500 text-white p-2 w-fit">Cancel</button> |
||||
</div> |
||||
<h1 class="text-6xl font-bold pb-3 mb-5 border-b border-black dark:border-white">Update blog</h1> |
||||
<form id="update-form" class="flex flex-col items-center"> |
||||
<div class="grid grid-cols-4 w-full"> |
||||
<p>Title</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="title" type="text" value="{{ old('title') ? old('title') : $blog->title }}"> |
||||
<p>Image</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="image" type="file" value="{{ old('image') ? old('image') : $blog->image }}"> |
||||
<p>Epilog</p><textarea class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="epilog" type="text">{{ old('epilog') ? old('epilog') : $blog->epilog }}</textarea> |
||||
<p>Content</p><textarea class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="containt" type="text">{{ old('containt') ? old('containt') : $blog->containt }}</textarea> |
||||
</div> |
||||
<button id="btn-blog-update" data-id="{{$blog->id}}" |
||||
class="rounded-lg bg-blue-500 text-white p-2 w-fit">Update</button> |
||||
@csrf |
||||
<p>Title</p><input name="title" type="text" value="{{ old('title') ? old('title') : $blog->title }}"> |
||||
<p>Image</p><input name="image" type="file" value="{{ old('image') ? old('image') : $blog->image }}"> |
||||
<p>Epilog</p><textarea name="epilog" type="text">{{ old('epilog') ? old('epilog') : $blog->epilog }}</textarea> |
||||
<p>Content</p><textarea name="containt" type="text">{{ old('containt') ? old('containt') : $blog->containt }}</textarea> |
||||
<br> |
||||
<button class="btn btn-blog-update" data-id="{{$blog->id}}">Update</button> |
||||
</form> |
||||
|
||||
</dialog> |
||||
@ -1,9 +1,19 @@ |
||||
<dialog id="modal-update" modal-disable> |
||||
<button class="close-modal">Cancel</button> |
||||
<form class="update-form"> |
||||
<dialog class="modal w-2/3 p-10 border rounded-lg border-black dark:border-white dark:bg-black dark:text-white" |
||||
id="modal-update" modal-disable> |
||||
<div class="flex flex-row-reverse"> |
||||
<button id="close-modal" class="rounded-lg bg-red-500 text-white p-2 w-fit">Cancel</button> |
||||
</div> |
||||
<h1 class="text-6xl font-bold pb-3 mb-5 border-b border-black dark:border-white">Update user info</h1> |
||||
<form id="update-form" class="flex flex-col items-center" > |
||||
<div class="grid grid-cols-4 w-full"> |
||||
<p>Username :</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="username" type="text" value="{{ old('username') ? old('username') : $user->username }}"> |
||||
<p>Name (Optional):</p><input class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="name" type="text" value="{{ old('name') ? old('name') : $user->name }}"> |
||||
<p>Description (Optional):</p><textarea class="border border-gray-300 rounded-lg col-span-3 mb-5 p-2 dark:bg-black" |
||||
name="description" type="text">{{ old('description') ? old('description') : $user->description }}</textarea> |
||||
</div> |
||||
@csrf |
||||
<input name="name" type="text" required value="{{ $user->name }}"> |
||||
<button class="btn btn-user-update" data-id="{{$user->id}}">Update</button> |
||||
<button id="btn-user-update" data-id="{{$user->id}}" class="rounded-lg bg-blue-500 text-white p-2 w-fit">Send</button> |
||||
</form> |
||||
|
||||
</dialog> |
||||
Loading…
Reference in New Issue