From a357099a861949fb3bb150f3fe15568e12bd7838 Mon Sep 17 00:00:00 2001
From: Alex Xin <Xin_boyan@126.com>
Date: Mon, 1 Jun 2020 00:45:06 +0800
Subject: [PATCH] Ui Edit
By Boyan and Lixin
---
src/servlet/project/DisplayServlet.java | 8 ++--
web/css/project-list.css | 4 ++
web/css/style.css | 9 ++--
web/index.html | 47 +++++++++----------
web/js/Experience/load_edu_to_otherp.js | 2 +-
.../show_experience_to_otherperson.js | 2 +-
web/js/Index/load_recommend_user.js | 30 +++++++-----
.../loading_personal_info_to_other.js | 2 +-
web/js/Project/load_project_list.js | 7 +--
web/js/ToolBar/pagebar.js | 16 ++++++-
.../project-related/project-list-tag.html | 26 +++++-----
web/webpage/project-related/project-list.html | 27 ++++++-----
12 files changed, 103 insertions(+), 77 deletions(-)
diff --git a/src/servlet/project/DisplayServlet.java b/src/servlet/project/DisplayServlet.java
index f60ab7c..86c187f 100644
--- a/src/servlet/project/DisplayServlet.java
+++ b/src/servlet/project/DisplayServlet.java
@@ -59,10 +59,10 @@ public class DisplayServlet extends HttpServlet {
ArrayList<Tag> taglist = pro.getProjectByTag(userId, tag);
ArrayList<Project> projects = new ArrayList<>();
for (Tag t : taglist){
- Project result = pro.getOneProject(t.getProjectid());
- result.setStr_starttime(StringUtils.dateToString(result.getStarttime()));
- result.setStr_endtime(StringUtils.dateToString(result.getEndtime()));
- projects.add(result);
+ Project p = pro.getOneProject(t.getProjectid());
+ p.setStr_starttime(StringUtils.dateToString(p.getStarttime()));
+ p.setStr_endtime(StringUtils.dateToString(p.getEndtime()));
+ projects.add(p);
}
String json = JSONArray.fromObject(projects).toString();
response.getWriter().print(json);
diff --git a/web/css/project-list.css b/web/css/project-list.css
index 3cdabef..bb306c6 100644
--- a/web/css/project-list.css
+++ b/web/css/project-list.css
@@ -53,6 +53,10 @@
color:#26dad2
}
+.search-listing li p{
+ width: 75%;
+}
+
.card-title{
font-size:25px;
font-weight: bold;
diff --git a/web/css/style.css b/web/css/style.css
index ff93a0a..9ab3b9b 100644
--- a/web/css/style.css
+++ b/web/css/style.css
@@ -34,7 +34,7 @@
}
.section-wrap {
- padding: 70px 0;
+ padding: 45px 0;
overflow: hidden;
background-attachment: fixed;
-webkit-background-size: cover;
@@ -610,7 +610,7 @@ p {
.heading {
position: relative;
- margin-bottom: 7px;
+ margin-top: 7px;
}
.heading.large {
@@ -624,7 +624,7 @@ p {
}
.heading-row {
- margin-bottom: 90px;
+ margin-bottom: 40px;
}
.heading-row.style-2 {
@@ -1031,7 +1031,7 @@ blockquote > span {
#main-slider .gallery-cell {
width: 20%;
- padding: 0 2px;
+ padding: 0 5px;
}
#main-slider .entry-category {
@@ -1441,6 +1441,7 @@ blockquote > span {
.entry-img img {
width: 100%;
+ height: 270px;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
diff --git a/web/index.html b/web/index.html
index c6ea360..ceedb4f 100644
--- a/web/index.html
+++ b/web/index.html
@@ -16,7 +16,7 @@
<link rel="stylesheet" href="css/sliders.css" />
<link rel="stylesheet" href="css/style.css" />
<!-- <link rel="stylesheet" href="css/responsive.css" />-->
-<!-- <link rel="stylesheet" href="css/spacings.css" />-->
+ <link rel="stylesheet" href="css/spacings.css" />
<link rel="stylesheet" href="css/animate.min.css" />
<!-- CSS -->
@@ -25,6 +25,8 @@
<link rel="stylesheet" href="css/form-elements.css">
<link rel="stylesheet" href="css/style2.css">
<link rel="stylesheet" href="css/topbar.css">
+ <link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css" media="screen">
+ <script href="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
</head>
@@ -159,7 +161,7 @@
<section class="section-wrap latest-stories pb-0">
<div class="container-fluid nopadding">
- <div class="heading-row text-center mb-40">
+ <div class="heading-row text-center mt-20">
<h2 class="heading uppercase small">Recommended Users</h2>
</div>
@@ -167,29 +169,16 @@
<!--<div class="gallery-cell">-->
- <!--<article>-->
- <!--<a href="#" class="entry-img">-->
- <!--<img src="img/main_slide_5.jpg" alt="">-->
- <!--<span class="entry-category">IT</span>-->
- <!--</a>-->
- <!--<div class="entry text-center">-->
- <!--<h4 class="entry-title uppercase">Mary Ann</h4>-->
- <!--<span class="entry-date">Student</span>-->
- <!--</div>-->
- <!--</article>-->
+ <!--<article>-->
+ <!--<a href="#" class="entry-img">-->
+ <!--<img src="img/main_slide_5.jpg" alt="">-->
+ <!--<span class="entry-category">IT</span>-->
+ <!--</a>-->
+ <!--<div class="entry text-center">-->
+ <!--<h4 class="entry-title uppercase">Mary Ann</h4>-->
+ <!--<span class="entry-date">Student</span>-->
<!--</div>-->
-
- <!--<div class="gallery-cell">-->
- <!--<article>-->
- <!--<a href="#" class="entry-img">-->
- <!--<img src="img/main_slide_6.jpg" alt="">-->
- <!--<span class="entry-category">Biology</span>-->
- <!--</a>-->
- <!--<div class="entry text-center">-->
- <!--<h4 class="entry-title uppercase">Paris Wang</h4>-->
- <!--<span class="entry-date">Professor</span>-->
- <!--</div>-->
- <!--</article>-->
+ <!--</article>-->
<!--</div>-->
</div>
@@ -330,6 +319,16 @@
});
</script>
+<script type="text/javascript">
+ $('.carousel').flickity({
+ // options
+ cellAlign: 'left',
+ contain: true,
+ wrapAround: true
+ });
+</script>
+
+
<!-- Javascript -->
<script src="js/jquery.backstretch.min.js"></script>
diff --git a/web/js/Experience/load_edu_to_otherp.js b/web/js/Experience/load_edu_to_otherp.js
index 036f35f..a82c3d8 100644
--- a/web/js/Experience/load_edu_to_otherp.js
+++ b/web/js/Experience/load_edu_to_otherp.js
@@ -14,7 +14,7 @@ $.extend({
});
function fillEducationToOPerson(){
- var userId = $.getEduIdParam();
+ var userId = $.getEduIdParam().split("#")[0];
$.ajax({
type: 'post',
url: '/edu.servlet',
diff --git a/web/js/Experience/show_experience_to_otherperson.js b/web/js/Experience/show_experience_to_otherperson.js
index f67f46f..23adc56 100644
--- a/web/js/Experience/show_experience_to_otherperson.js
+++ b/web/js/Experience/show_experience_to_otherperson.js
@@ -18,7 +18,7 @@ $(function() {
});
function getOExperience(){
- var userId = $.getUidParam();
+ var userId = $.getUidParam().split("#")[0];
$.ajax({
type: 'post',
url: '/ExperienceServlet',
diff --git a/web/js/Index/load_recommend_user.js b/web/js/Index/load_recommend_user.js
index f791f2c..ca35b21 100644
--- a/web/js/Index/load_recommend_user.js
+++ b/web/js/Index/load_recommend_user.js
@@ -5,6 +5,7 @@
*/
+var $carousel = $('.flickity-slider-wrap').flickity();
$(function(){
var strcookie = document.cookie;
var userIdStr = strcookie.split(";")[0];
@@ -37,7 +38,8 @@ function loadPeople(userId){
for (x in response){
loadRecommend(response[x])
}
- // loadToPage()
+ $carousel.flickity('playPlayer');
+
},
error: function (XMLHttpRequest, textStatus) {
$.confirm({
@@ -59,18 +61,20 @@ function loadPeople(userId){
function loadRecommend(people_data) {
jQuery(document).ready(function(){
- $('#main-slider').append('<div class="gallery-cell">\n' +
- ' <article>\n' +
- ' <a href="/other-person.html?id='+ people_data.userid +'" class="entry-img">\n' +
- ' <img src="'+people_data.photo+'" alt="">\n' +
- ' <span class="entry-category">'+people_data.major+'</span>\n' +
- ' </a>\n' +
- ' <div class="entry text-center">\n' +
- ' <h4 class="entry-title uppercase">'+people_data.name+'</h4>\n' +
- ' <span class="entry-date">'+people_data.job+'</span>\n' +
- ' </div>\n' +
- ' </article>\n' +
- ' </div>');
+ var $cellElems = $('<div class="gallery-cell">\n' +
+ ' <article>\n' +
+ ' <a href="/other-person.html?id='+ people_data.userid +'" class="entry-img">\n' +
+ ' <img src="'+people_data.photo+'" alt="">\n' +
+ ' <span class="entry-category">'+people_data.major+'</span>\n' +
+ ' </a>\n' +
+ ' <div class="entry text-center">\n' +
+ ' <h4 class="entry-title uppercase">'+people_data.name+'</h4>\n' +
+ ' <span class="entry-date">'+people_data.job+'</span>\n' +
+ ' </div>\n' +
+ ' </article>\n' +
+ ' </div>');
+ $carousel.flickity('append', $cellElems);
+
});
}
diff --git a/web/js/Personal-Page/loading_personal_info_to_other.js b/web/js/Personal-Page/loading_personal_info_to_other.js
index 15a5bcc..c0151f9 100644
--- a/web/js/Personal-Page/loading_personal_info_to_other.js
+++ b/web/js/Personal-Page/loading_personal_info_to_other.js
@@ -17,7 +17,7 @@ $(function() {
});
function fillOUserInfo() {
- var userId = $.getUserIdParam();
+ var userId = $.getUserIdParam().split("#")[0];
console.log(userId);
// 加载用户信息
$.ajax({
diff --git a/web/js/Project/load_project_list.js b/web/js/Project/load_project_list.js
index 572a232..a6e7c91 100644
--- a/web/js/Project/load_project_list.js
+++ b/web/js/Project/load_project_list.js
@@ -41,9 +41,10 @@ function getInfo(){
success: function(data){
console.log(data);
$('#projectAll').html("");
- for(x in data){
- loadProjectList(data[x]);
- }
+ loadSubPage(data, 4);
+ // for(x in data){
+ // loadProjectList(data[x]);
+ // }
clickevent();
},
error : function(msg) {
diff --git a/web/js/ToolBar/pagebar.js b/web/js/ToolBar/pagebar.js
index fe5f110..768f575 100644
--- a/web/js/ToolBar/pagebar.js
+++ b/web/js/ToolBar/pagebar.js
@@ -7,6 +7,7 @@
loadSubPage = function(data, type){
var pageSize = 3;
var pageNum = Math.ceil(data.length/pageSize);
+ // alert(pageNum);
var dataStr = JSON.stringify(data);
if(pageNum == 0){
@@ -119,8 +120,19 @@ function loadParticularPage(dataStr, p, pageSize, pageNum, type) {
'<p>'+ project.projectdescription +'</p>\n' +
'</li>');
}
-
-
+ } else if (type == 4){
+ $('#projectAll').html("");
+ for (var x=start; x<start+pageSize;x++){
+ var project = data[x];
+ $('#projectAll').append('<li><span class="proj-title"><a href="#keywords='+project.projectid+'">'+ project.projectname +'</a></span>\n' +
+ '<a href="/webpage/project-related/editor.html?keywords='+ project.projectid +'">' +
+ ' <input class="edit" type="button" value="EDIT"/>' +
+ '</a>\n' +
+ '<input id="'+ project.projectid +'" class="delete-list" type="button" value="DELETE"/>\n' +
+ '<h5>Project Period: '+project.str_starttime + ' - ' + project.str_endtime +'</h5>\n' +
+ '<p>'+ project.projectdescription +'</p>\n' +
+ '</li>');
+ }
}
}
\ No newline at end of file
diff --git a/web/webpage/project-related/project-list-tag.html b/web/webpage/project-related/project-list-tag.html
index c62f6c8..bde56ff 100644
--- a/web/webpage/project-related/project-list-tag.html
+++ b/web/webpage/project-related/project-list-tag.html
@@ -57,19 +57,19 @@
<!--page bar-->
</ul>
</nav>
- <nav aria-label="Page navigation example" class="m-t-40">
- <ul class="pagination">
- <li class="page-item disabled">
- <a class="page-link" href="#" tabindex="-1">Previous</a>
- </li>
- <li class="page-item"><a class="page-link" href="#">1</a></li>
- <li class="page-item"><a class="page-link" href="#">2</a></li>
- <li class="page-item"><a class="page-link" href="#">3</a></li>
- <li class="page-item">
- <a class="page-link" href="#">Next</a>
- </li>
- </ul>
- </nav>
+ <!--<nav aria-label="Page navigation example" class="m-t-40">-->
+ <!--<ul class="pagination">-->
+ <!--<li class="page-item disabled">-->
+ <!--<a class="page-link" href="#" tabindex="-1">Previous</a>-->
+ <!--</li>-->
+ <!--<li class="page-item"><a class="page-link" href="#">1</a></li>-->
+ <!--<li class="page-item"><a class="page-link" href="#">2</a></li>-->
+ <!--<li class="page-item"><a class="page-link" href="#">3</a></li>-->
+ <!--<li class="page-item">-->
+ <!--<a class="page-link" href="#">Next</a>-->
+ <!--</li>-->
+ <!--</ul>-->
+ <!--</nav>-->
</div>
</div>
</div>
diff --git a/web/webpage/project-related/project-list.html b/web/webpage/project-related/project-list.html
index e2d0361..fcdfb4f 100644
--- a/web/webpage/project-related/project-list.html
+++ b/web/webpage/project-related/project-list.html
@@ -46,24 +46,29 @@
<div class="col-12">
<div class="card">
<div class="card-body">
- <span class="card-title">All Projects</span>
+ <span class="card-title">Project for "All Project"</span>
<a href="webpage/project-related/add.html"><input class="add-new" type="button" value=" + Add New Project"></a>
<ul id="projectAll" class="search-listing">
<!--dynamic load project list-->
</ul>
<nav aria-label="Page navigation example" class="m-t-40">
- <ul class="pagination">
- <li class="page-item disabled">
- <a class="page-link" href="#" tabindex="-1">Previous</a>
- </li>
- <li class="page-item"><a class="page-link" href="#">1</a></li>
- <li class="page-item"><a class="page-link" href="#">2</a></li>
- <li class="page-item"><a class="page-link" href="#">3</a></li>
- <li class="page-item">
- <a class="page-link" href="#">Next</a>
- </li>
+ <ul class="pagination" id="page-bar">
+ <!--page bar-->
</ul>
</nav>
+ <!--<nav aria-label="Page navigation example" class="m-t-40">-->
+ <!--<ul class="pagination">-->
+ <!--<li class="page-item disabled">-->
+ <!--<a class="page-link" href="#" tabindex="-1">Previous</a>-->
+ <!--</li>-->
+ <!--<li class="page-item"><a class="page-link" href="#">1</a></li>-->
+ <!--<li class="page-item"><a class="page-link" href="#">2</a></li>-->
+ <!--<li class="page-item"><a class="page-link" href="#">3</a></li>-->
+ <!--<li class="page-item">-->
+ <!--<a class="page-link" href="#">Next</a>-->
+ <!--</li>-->
+ <!--</ul>-->
+ <!--</nav>-->
</div>
</div>
</div>
--
GitLab