Skip to content

Commit

Permalink
Merge pull request #75 from DSCHUFS/WonYoung
Browse files Browse the repository at this point in the history 
Modify before test done
  • Loading branch information
@ThinkKat
ThinkKat authored Mar 22, 2021
2 parents 41f3f11 + d665aa2 commit 93d4c18
Show file tree
Hide file tree
Showing 3 changed files with 97 additions and 32 deletions.
28 changes: 22 additions & 6 deletions public/script/useCookies.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,15 +12,31 @@ function checkSubmitTest() {
}



function afterSubmitPageTransition() {
let cookies = Cookies.get();
if(cookies.curPage) {
gsap.to('#root', { duration: 0, scrollTo: { y: cookies.curPage, offsetY: 0 } } );
if (cookies.curPage) {
gsap.to('#root', { duration: 0, scrollTo: { y: cookies.curPage, offsetY: 0 } });
} else {
gsap.to('#root', { duration: 0, scrollTo: { y: '#main_top', offsetY: 0 } } );
gsap.to('#root', { duration: 0, scrollTo: { y: '#main_top', offsetY: 0 } });
}
}



function checkTestDone() {
let ownScore = document.querySelectorAll('.own-score.chart-comment');
let lastChartComment = document.querySelector('#last-score-comment');
let notYet = document.querySelector('.not-yet-test');
let cookies = Cookies.get();
if (cookies.test === 'done') {
ownScore.forEach(ownScore => {
$(ownScore).show();
})
$(lastChartComment).show();
$(notYet).hide();
} else {
ownScore.forEach(ownScore => {
$(ownScore).hide();
})
$(lastChartComment).hide();
$(notYet).show();
}
}
41 changes: 33 additions & 8 deletions public/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -376,7 +376,7 @@ body {
z-index: 10;
font-size: 5rem;
font-weight: 800;
margin: 0 0 8rem 5%;
margin: 3rem 0 8rem 5%;
}

#img-container {
Expand Down Expand Up @@ -508,7 +508,7 @@ body {
}

#hover_icon1 {
transform: translate(-40%, 0%);
transform: translate(-60%, 0%);
}

#hover_icon2 {
Expand Down Expand Up @@ -549,6 +549,8 @@ body {

.label_hover {
color: white;
margin: 0.3rem;
font-size: 15px;
}

.background[data-index="1"] .color_box_hover {
Expand All @@ -559,11 +561,6 @@ body {
background-color: #787878;
}

.label_hover {
margin: 0.3rem;
font-size: 1vw;
}

.img_people {
width: 100%;
display: flex;
Expand Down Expand Up @@ -756,6 +753,24 @@ body {
margin-bottom: 3rem;
}

.not-yet-test {
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
}

.not-yet-test-comment {
font-size: 35px;
font-weight: 700;
}

#menu-desc-comment {
margin-top: 20px;
font-size: 20px;
font-weight: 700;
}


/* feedback chart css */

Expand Down Expand Up @@ -804,6 +819,7 @@ body {
display: flex;
justify-content: center;
align-items: center;
padding-top: 5%;
}

.chart-desc-comment {
Expand All @@ -813,10 +829,11 @@ body {
flex-flow: column;
justify-content: center;
align-items: center;
margin: 0 10%;
}

.chart-desc-div {
margin: 5% 0;
margin: 0 0 5% 0;
}

@media (max-width: 1200px) {
Expand Down Expand Up @@ -1095,6 +1112,14 @@ body {
margin: 1rem 0;
font-size: 25px;
}
.not-yet-test-comment {
font-size: 25px;
text-align: center;
}
#menu-desc-comment {
font-size: 20px;
text-align: center;
}
#propose-passover {
width: 250px;
margin: 0 7% 5rem auto;
Expand Down
60 changes: 42 additions & 18 deletions views/index.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@
</div>
</div>
<div class="img_comment"><span id="hide-comment" style="display: none; color: #008B9F">누구에게나
</span>평범한 일상입니다.</div>
</span>평범한 일상입니다.</div>
<!-- <div id="propose-passover">사진을 옆으로 넘겨보세요!👉</div> -->

<script>
Expand Down Expand Up @@ -242,7 +242,7 @@

</div>
<div class="label_hover">
장애를 가진 사람: 5.39%
장애를 가진 사람: 5.1%
</div>
</div>
</div>
Expand All @@ -252,7 +252,7 @@
<div class="color_box_hover">
</div>
<div class="label_hover">
장애를 가지지 않은 사람: 94.61%
장애를 가지지 않은 사람: 94.9%
</div>
</div>
</div>
Expand Down Expand Up @@ -549,11 +549,15 @@
<ul>
<li>photos <a target="_blank" href="https://www.freepik.com/photos/business">carousel-1 | </a>
<a target="_blank" href="https://www.freepik.com/photos/health">carousel-2 | </a>
<a target="_blank" href="https://unsplash.com/@elevatebeer?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">carousel-3 | </a>
<a target="_blank" href="https://www.freepik.com/photos/love">carousel-4 </a></li>
<a target="_blank" href="https://unsplash.com/@elevatebeer?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">carousel-3
| </a>
<a target="_blank" href="https://www.freepik.com/photos/love">carousel-4 </a>
</li>
<li>about <a target="_blank" href="https://www.facebook.com/dschufs/">DSC | </a>
<a target="_blank" href="https://github.com/DSCHUFS/Solution_Challenge_WSC"> github </a></li>
<li>Copyright 2021 <a href="https://b-freeproject.df.r.appspot.com/"> B-Free. </a> All rights reserved</li>
<a target="_blank" href="https://github.com/DSCHUFS/Solution_Challenge_WSC"> github </a>
</li>
<li>Copyright 2021 <a href="https://b-freeproject.df.r.appspot.com/"> B-Free. </a> All rights reserved
</li>
</li>
</ul>
<hr>
Expand Down Expand Up @@ -613,8 +617,20 @@
<div class="main main_bottom" id="main_bottom">
<div class="chart-comment-container" id="score-comment-container">
<div class="chart-comment" id="first-score-comment">🙌사용자님은</div>
<div class="not-yet-test">
<div class="not-yet-test-comment">
아직 인식개선 테스트를 보지 않으셨습니다.😢
</div>
<div class="not-yet-test-comment">
테스트를 보고 다시 돌아와 주세요.
</div>
<div id="menu-desc-comment">
오른쪽 위의 바로가기 탭을 통해 테스트 페이지로 가실 수 있습니다.
</div>
</div>

<div class="own-score chart-comment" id="before-own-score">
<div class="test-first-score-comment" id="before-first-score-comment">첫 번째 테스트에서</div>
<div class="test-first-score-comment" id="before-first-score-comment">인식개선 전 테스트에서</div>
<div class="test-second-score-comment" id="before-second-score-comment">
<span class="total-count">7</span>개 중
<span class="correct-count" style="color: rgba(255, 206, 86, 1)">
Expand All @@ -624,8 +640,9 @@
</span>개를
</div>
</div>

<div class="own-score chart-comment" id="after-own-score">
<div class="test-first-score-comment" id="after-first-score-comment">두 번째 테스트에서</div>
<div class="test-first-score-comment" id="after-first-score-comment">인식개선 후 테스트에서</div>
<div class="test-second-score-comment" id="after-second-score-comment">
<span class="total-count">7</span>개 중
<span class="correct-count" style="color: rgba(54, 162, 235, 1)">
Expand All @@ -637,6 +654,9 @@
</div>
<div class="chart-comment" id="last-score-comment">맞히셨습니다!</div>
</div>
<script>
checkTestDone()
</script>

<div class="chart-comment-container" id="propose-comment">
다른 사용자분들의 결과도 확인해보세요!
Expand All @@ -656,18 +676,18 @@
<div class="chart-desc" id="first-chart-desc">
<div class="chart-desc-comment">
<div class="chart-desc-div first-chart-desc">
파란 색 선이 오른쪽으로 더 치우쳐져 있을 수록 <br> 두번째 테스트에서 더 좋은 결과가 많이 나온 것을 의미해요!
파란 색 선이 오른쪽으로 더 치우쳐져 있을 수록 저희 서비스를 통해 사용자들의 인식이 개선되었음을 의미해요!
</div>
<div class="chart-desc-div first-chart-desc">
점수 분포 그래프를 통해 다른 사용자 분들의 <br> 인식 개선 서비스 이용 전 후, 테스트 결과를 비교해보세요!
점수 분포 그래프를 통해 다른 사용자 분들의 인식개선 서비스 이용 전 후, 인식개선 결과를 비교해보세요!
</div>
</div>
</div>
</div>
<div class="score-chart" id="second-chart">
<div class="inside-container">
<div class="chart-title">
인식 개선 서비스를 이용한 뒤의 점수 변화 비율
인식개선 서비스를 이용한 뒤의 점수 변화 비율
</div>
<div class="compareChart" id="increaseCompareChart">
<canvas id="increaseChart">
Expand All @@ -678,10 +698,10 @@
<div class="chart-desc" id="second-chart-desc">
<div class="chart-desc-comment">
<div class="chart-desc-div second-chart-desc">
초록색 부분이 더 클수록 두번째 테스트에서 <br> 점수가 상승한 사람이 많다는 것을 의미해요!
초록색 부분이 더 클수록 두번째 테스트에서 인식개선 점수가 상승한 사람이 많다는 것을 의미해요!
</div>
<div class="chart-desc-div second-chart-desc">
점수 변화 비율 그래프를 통해 점수가 상승한 <br> 사용자분들을 확인해 보세요!
점수 변화 비율 그래프를 통해 인식개선 점수가 상승한 사용자분들을 확인해 보세요!
</div>
</div>
</div>
Expand All @@ -693,11 +713,15 @@
<ul>
<li>photos <a target="_blank" href="https://www.freepik.com/photos/business">carousel-1 | </a>
<a target="_blank" href="https://www.freepik.com/photos/health">carousel-2 | </a>
<a target="_blank" href="https://unsplash.com/@elevatebeer?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">carousel-3 | </a>
<a target="_blank" href="https://www.freepik.com/photos/love">carousel-4 </a></li>
<a target="_blank" href="https://unsplash.com/@elevatebeer?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">carousel-3
| </a>
<a target="_blank" href="https://www.freepik.com/photos/love">carousel-4 </a>
</li>
<li>about <a target="_blank" href="https://www.facebook.com/dschufs/">DSC | </a>
<a target="_blank" href="https://github.com/DSCHUFS/Solution_Challenge_WSC"> github </a></li>
<li>Copyright 2021 <a href="https://b-freeproject.df.r.appspot.com/"> B-Free. </a> All rights reserved</li>
<a target="_blank" href="https://github.com/DSCHUFS/Solution_Challenge_WSC"> github </a>
</li>
<li>Copyright 2021 <a href="https://b-freeproject.df.r.appspot.com/"> B-Free. </a> All rights reserved
</li>
</li>
</ul>
<hr>
Expand Down

0 comments on commit 93d4c18

Please sign in to comment.