新增注册(页面跳转)及登录(弹窗)功能

This commit is contained in:
ChloeChen0423
2025-05-13 17:14:19 +09:00
parent 7c63f2f07b
commit 68cb20c2d5
5 changed files with 409 additions and 22 deletions

View File

@ -1,13 +1,13 @@
$(function () {
$.ajax({
url: "http://192.168.1.192:8085/dogs/pet",
url: "http://localhost:8080/inuhouse",
type: "GET",
success: function (dogs) {
const $slider = $('#sliderContainer');
const slideWidth = 270;
const centerOffset = 1;
preloadImages(dogs.map(d => d.image), () => {
// $('#sliderContainer').html(dogs.map(createSlideHTML).join(''));
const slidesHTML = generateCarouselHTML(dogs);
@ -24,10 +24,10 @@ $(function () {
$('.right-btn').on('click', function () {
if ($slider.is(':animated')) return;
currentIndex++;
animateTo(currentIndex);
if (currentIndex === totalSlides - 1) {
// animateTo(currentIndex);
requestAnimationFrame(() => {
@ -37,16 +37,16 @@ $(function () {
});
});
}
});
$('.left-btn').on('click', function () {
if ($slider.is(':animated')) return;
currentIndex--;
animateTo(currentIndex);
if (currentIndex === 0) {
@ -58,12 +58,12 @@ $(function () {
});
});
}
});
});
$('#uploadBtn').on('click', function () {
const fileInput = $('#fileInput')[0];
const file = fileInput.files[0];
@ -99,12 +99,104 @@ $(function () {
a.click();
document.body.removeChild(a);
});
$(function () {
$('#goToLogin').on('click', function () {
$('#loginModal').fadeIn();
});
// $('#goToRegister').on('click', function () {
// $('#registerModal').fadeIn();
// });
$('#closeLoginModal, #cancelLogin').on('click', function () {
$('#loginModal').fadeOut();
});
// $('#closeRegisterModal, #cancelRegister').on('click', function () {
// $('#registerModal').fadeOut();
// });
// $('#submitRegister').on('click', function () {
// const username = $('#registerUsername').val().trim();
// const email = $('#registerEmail').val().trim();
// const password = $('#registerPassword').val().trim();
// const confirmPassword = $('#registerConfirmPassword').val().trim();
// if (!email || !password || !confirmPassword) {
// alert('必須項目をすべて入力してください');
// return;
// }
// if (password !== confirmPassword) {
// alert('パスワードが一致しません');
// return;
// }
// const requestData = {
// username: username || null,
// email: email,
// password: password
// };
// $.ajax({
// url: 'http://192.168.1.192:8085/api/user/register',
// type: 'POST',
// contentType: 'application/json',
// data: JSON.stringify(requestData),
// success: function () {
// alert('登録成功!');
// window.location.href = 'index.html';
// $('#registerModal').fadeOut();
// },
// error: function () {
// alert('登録に失敗しました: ');
// }
// });
// });
$('#submitLogin').on('click', function () {
const email = $('#loginEmail').val().trim();
const password = $('#loginPassword').val().trim();
if (!email || !password) {
alert('メールアドレスとパスワードを入力してください');
return;
}
const requestData = {
email: email,
password: password
};
$.ajax({
url: 'http://192.168.1.192:8085/api/user/login',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(requestData),
success: function (response) {
const token = response.token;
localStorage.setItem('authToken', token);
alert('ログイン成功!');
window.location.href = 'index.html';
$('#loginModal').fadeOut();
},
error: function () {
alert('ログインに失敗しました');
}
});
});
});
function preloadImages(urls, callback) {
let loaded = 0;
urls.forEach(src => {
@ -136,7 +228,7 @@ $(function () {
}
function generateCarouselHTML(dogList) {
if (!dogList || dogList.length === 0) return '';
const redundantList = [

38
js/register.js Normal file
View File

@ -0,0 +1,38 @@
$('#submitRegister').on('click', function () {
console.log('クリックされました')
const username = $('#registerUsername').val().trim();
const email = $('#registerEmail').val().trim();
const password = $('#registerPassword').val().trim();
const confirmPassword = $('#registerConfirmPassword').val().trim();
if (!email || !password || !confirmPassword) {
alert('必須項目をすべて入力してください');
return;
}
if (password !== confirmPassword) {
alert('パスワードが一致しません');
return;
}
const requestData = {
username: username || null,
email: email,
password: password
};
$.ajax({
url: 'http://192.168.1.192:8085/api/user/register',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(requestData),
success: function () {
// alert('登録成功!');
window.location.href = 'index.html';
},
error: function () {
alert('登録に失敗しました');
}
});
});