Skip to content

Commit

Permalink
Merge pull request #8 from leezu2020/29-Writing-Java
Browse files Browse the repository at this point in the history 
Update 9-Home-JS/초기화 보완, 페이지 개수 세팅, 인기순&최신순
  • Loading branch information
@leezu2020
leezu2020 authored May 10, 2021
2 parents 9e725ab + 8efbefa commit b9e2bdc
Show file tree
Hide file tree
Showing 12 changed files with 305 additions and 312 deletions.
2 changes: 1 addition & 1 deletion src/main/java/com/bookpot/web/search/PageDto.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ public class PageDto {
// 현재 페이지
private int page;
// 한번에 보여줄 페이지 수
private int pageCnt = 5;
private int pageCnt = 10;

public PageDto() {
// TODO Auto-generated constructor stub
Expand Down
12 changes: 6 additions & 6 deletions src/main/webapp/WEB-INF/views/index.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@
<!-- 첫 화면 글 가져오기 -->
(function(){
$.ajax({
url: "/writings/search?keyword=&division=&categories=&sort=date&page=9",
url: "/writings/search?keyword=&division=&categories=&sort=date&page=1",
type: "get",
dataType: "json",
success: function(data){
Expand Down Expand Up @@ -230,7 +230,7 @@
alt="book image">
</div>
<div class="grid-view-content-like">
<img src="/resources/icon/like_white.svg">
<img src="/resources/icon/like_white.svg" class="like-icon">
<span class="like-number" onclick="gooddown()">256</span> <!--좋아요 버튼.(하트 이모티콘 넣어야함)-->
</div>
<div class="grid-book-info">
Expand All @@ -255,7 +255,7 @@
alt="book image">
</div>
<div class="grid-view-content-like">
<img src="/resources/icon/like_white.svg">
<img src="/resources/icon/like_white.svg" class="like-icon">
<span class="like-number" onclick="goodup()">256</span> <!--좋아요 버튼.(하트 이모티콘 넣어야함)-->
</div>
<!-- xpppppppppppppppppppppppppppppppppppp스트 -->
Expand All @@ -281,7 +281,7 @@
alt="book image">
</div>
<div class="grid-view-content-like">
<img src="/resources/icon/like_white.svg">
<img src="/resources/icon/like_white.svg" class="like-icon">
<span class="like-number">256</span> <!--좋아요 버튼.(하트 이모티콘 넣어야함)-->
</div>
<div class="grid-book-info">
Expand All @@ -306,7 +306,7 @@
alt="book image">
</div>
<div class="grid-view-content-like">
<img src="/resources/icon/like_white.svg">
<img src="/resources/icon/like_white.svg" class="like-icon">
<span class="like-number">256</span> <!--좋아요 버튼.(하트 이모티콘 넣어야함)-->
</div>
<div class="grid-book-info">
Expand Down Expand Up @@ -368,7 +368,7 @@
<div class="list-view-content"></div>
</div>
</section>
<div class="page">
<div id="page">
<div class="page-number">1</div>
<div class="page-number">2</div>
<div class="page-number">3</div>
Expand Down
148 changes: 24 additions & 124 deletions src/main/webapp/WEB-INF/views/join/signup.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,137 +16,22 @@

<title>책단지</title>
<link rel="stylesheet" href="<c:url value="/resources/css/Sign-up CSS.css" />">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="<c:url value="/resources/js/jquery-3.6.0.min.js" />"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> -->
<script defer src="/resources/js/Sign-up JS.js"></script>
</head>

<!-- 중복확인 처리를 위한 script -->
<script type="text/javascript">
var code = '';
var setting = '';
function fn_checkNickname(){
$.ajax({
url : "/join/nickname/" + $('#nickname').val(),
type : "get",
success : function(result){
if(result == 'exist'){
alert('사용중인 닉네임입니다.');
$('#nickname').focus();
$('#nickname').val('');
} else if(result == 'notmatch'){
alert('닉네임을 확인해주세요.');
$('#nickname').focus();
$('#nickname').val('');
} else {
alert('사용가능한 닉네임입니다.');
}
},
error: function(e){
alert("닉네임 값을 가져오지 못했습니다.");
}
});
};
function fn_sendEmail(){
$.ajax({
url : "/email/" + $('#email').val(),
type : "get",
success : function(result){
if(result == 'exist'){
alert('사용중인 이메일입니다.');
$('#inputCode').attr("disabled",true);
$('#code-button').attr("disabled",true);
$('#email').focus();
$('#email').val('');
} else {
alert('이메일이 전송되었습니다.');
$('#inputCode').attr("disabled",false);
$('#code-button').attr("disabled",false);
code = result;
}
}
});
};
function fn_checkCode(){
var inputCode = $('#inputCode').val();
if(inputCode == code){
alert('인증되었습니다.');
setting = 'finished';
} else {
$('#inputCode').focus();
$('#inputCode').val('');
alert('인증번호를 다시 확인해주세요.');
}
}
$(document).ready(function(){
$('#submit-button').click(function (){
var params = $('#signup-form').serialize();
console.log(params);
event.preventDefault();
$.ajax({
url : "/join",
type : "post",
dataType : "json",
data : params,
success : function(result){
console.log(result);
window.location.href = result.returnUrl;
},
// 수정필요
error : function(request, status, error){
$.each(request.responseJSON, function(i, error){
console.log("에러 : " + error);
switch(error){
case "wrongpassword":
$('#password').val('');
$('#passwordCheck').val('');
break;
case "notmatchpassword":
$('#password').val('');
$('#passwordCheck').val('');
break;
case "existnickname":
$('#password').val('');
$('#passwordCheck').val('');
$("#nickname").val('');
break;
case "existemail":
$('#password').val('');
$('#passwordCheck').val('');
$("#email").val('');
break;
case "emptynickname":
$('#password').val('');
$('#passwordCheck').val('');
break;
case "emptypassword":
$('#password').val('');
$('#passwordCheck').val('');
break;
case "emptyemail":
$('#password').val('');
$('#passwordCheck').val('');
break;
}
})
}
})
})
})
</script>
<body>
<div class="container">
<div class="header">
<div id="logo">
<!-- 클릭시 메인페이지 -->
<!-- 책 아이콘 -->
<img src="<c:url value="/resources/icon/logo.svg" />" alt="logo-icon"> <!--로고 이미지 작업 필요-->
<img src="/resources/icon/logo.svg" alt="logo-icon"> <!--로고 이미지 작업 필요-->

<a href="/">
<!--책단지 아이콘-->
<img class="site-name" src="<c:url value="/resources/icon/책단지.svg" />" alt="책단지-icon">
<img class="site-name" src="/resources/icon/책단지.svg" alt="책단지-icon">
</a>
</div>
<nav><!--write버튼, 회원가입버튼, login버튼 묶음-->
Expand Down Expand Up @@ -203,35 +88,50 @@ $(document).ready(function(){
<label for="nickname">닉네임</label><br>
<input id="nickname" name="nickname" type="text" placeholder="한글과 영문 대 소문자를 사용하세요(특수기호, 공백 사용 불가)" />
<input type="button" id="nickname-button" value="중복확인" onClick="fn_checkNickname()">
<div class="alert-nickname" id="nickname-check"></div>
<!-- class는 css용, id는 js용 -->
</p>

<!--이메일 입력-->
<p>
<label for="email">이메일</label><br>
<input id="email" type="email" name="email" placeholder="인증번호를 받을 이메일을 입력해주세요." />
<input type="button" id="email-button" onClick="fn_sendEmail()" value="인증번호 발송">
<div class="alert-email" id="email-check"></div>

<!--인증번호 입력-->
<div class="email-code-set">
<input id="code-check" type="text" placeholder="인증번호를 입력해주세요.">
<button type="button" id="email-check-button" onClick="fn_checkCode()">인증번호 확인</button>
<div class="alert-code" id="code-check"></div>

</div></p>

<!-- 테스트용
<input type="text" id="inputCode" disabled="disabled" placeholder="인증번호 입력해주세요."/>
<input type="button" id="code-button" disabled="disabled" onClick="fn_checkCode()" value="인증번호 확인">
</p>
-->

<!--비밀번호 입력-->
<p>
<label for="password" >비밀번호</label><br>
<input type="password" id="password" name="password" placeholder="8~16자 영문 대 소문자, 숫자를 사용하세요." />
<div class="alert-pwd" id="pwd-check"></div>
</p>

<!--비밀번호 확인 입력-->
<p>
<label for="password">비밀번호 확인</label><br>
<input type="password" id="passwordCheck" name="passwordCheck" placeholder="비밀번호가 일치하지 않습니다." />
<label for="password-2">비밀번호 확인</label><br>
<input type="password" id="password-2" name="passwordCheck" placeholder="비밀번호가 일치하지 않습니다." />
<div class="alert-pwd2" id="pwd2-check"></div>
</p>
<!--개인정보 동의 내용박스-->
<label for="agreebox">개인정보 수집, 이용에 대한 동의</label>
<br>
<p id="agreebox">
- 회원가입, 사이트 이용을 위해서는 아래와 같이 개인정보를 수집, 이용 합니다.<br><br>
1. 개인정보 수집 목적: 회원가입, 사이트 이용<br>
2. 회원정보 수집 항목: 아이디, 닉네임, 비밀번호<br>
2. 회원정보 수집 항목: 이메일, 닉네임, 비밀번호<br>
3. 보유 및 이용기간: 회원 탈퇴 시까지<br>
</p>

Expand Down
9 changes: 4 additions & 5 deletions src/main/webapp/WEB-INF/views/user/Mypage.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,14 +110,13 @@
<div id="green-box"></div>

<!--닉네임-->
<p>
<div id="nickname-set">
<label for="nickname">닉네임</label><br>
<!--회원정보 수정시 input 활성화-->
<input id="nickname-info" type="text" value="${userName}" >
<input type="button" id="nickname-button" value="중복확인" onClick="fn_checkNickname()">
</p><div class="alert-nickname" id="nickname-check"></div>
<p>
</p>
<div class="alert-nickname" id="nickname-check"></div>
</div>

<!--이메일-->
<p>
Expand Down Expand Up @@ -176,7 +175,7 @@

<!--회원탈퇴-->
<p>
<button type="button" id="withdrawal-button" onclick="deleteInfo()">회원탈퇴</button>
<button type="button" id="withdrawal-button" onclick="alertWithdrawl()">회원탈퇴</button>
</p>


Expand Down
4 changes: 2 additions & 2 deletions src/main/webapp/resources/css/Home CSS.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -579,14 +579,14 @@ header nav #write-button {
padding-right: var(--padding_lsit-view-content-right);
}

.page {
#page {
grid-column: 2 / 3;
grid-row: 4 / 5;
display: flex;
flex-direction: row;
margin: auto;
}

.page .page-number {
#page .page-number {
width: 20px;
}
16 changes: 11 additions & 5 deletions src/main/webapp/resources/css/Mypage CSS.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -273,7 +273,6 @@ p {
#nickname,
#email-info {
width: 400px;
margin-right: 15px;
}

.main #green-box {
Expand Down Expand Up @@ -309,9 +308,14 @@ input {
border-width: 1px;
}

#nickname-set {
margin-top: 10px;
}

#password-set,
#password-2-set {
display: none;
margin-top: 10px;
}

#password,
Expand Down Expand Up @@ -361,7 +365,7 @@ input {
font-size: 12px;
width: 255px;
height: 35px;
background-color: #9dbbab;
background-color: var(--color_highlight);
border-style: none;
color: var(--color_white);
margin-right: 5px;
Expand All @@ -372,8 +376,9 @@ input {
font-size: 12px;
width: 255px;
height: 35px;
background-color: var(--color_highlight);
border-style: none;
background-color: #9dbbab;
/*border-style: none;*/

color: var(--color_white);
}

Expand Down Expand Up @@ -407,6 +412,7 @@ input {
.alertpwd-forchange {
color: red;
margin-top: 0px;
margin-bottom: 10px;
}

/*내정보 input*/
Expand All @@ -430,4 +436,4 @@ input {
color: #000000;
outline: none;
margin-right: 15px;
}
}
Loading

0 comments on commit b9e2bdc

Please sign in to comment.