diff --git a/web/admin.html b/web/admin.html
index 000916a56207c239a5a0e33a3670ce1158f56ecb..bde126812c68b21a2b56038b78bd0ca8ae64496f 100644
--- a/web/admin.html
+++ b/web/admin.html
@@ -23,7 +23,7 @@
     <script src="js/custom.js"></script>
     <script src="js/jquery.metisMenu.js"></script>
     <script src="js/jquery-confirm.js"></script>
-
+    <script src="js/login_registerScripts.js"></script>
 
     <!--editor js-->
 
@@ -48,7 +48,7 @@
                         <ul class="dropdown-menu">
                             <li><a class="nav-link" href="person.html">View Profile</a ></li>
                             <li><a class="nav-link" href="admin.html">My Admin</a ></li>
-                            <li><a class="nav-link" href="#" style="border-top: 1px solid #b1b8bb"><i class="fa fa-power-off"></i> Log Out</a ></li>
+                            <li><a class="nav-link" href="#" onclick="adminLogout()" style="border-top: 1px solid #b1b8bb"><i class="fa fa-power-off"></i> Log Out</a ></li>
                         </ul>
                     </li>
                     <li class="nav-item active"><a class="nav-link" href="index.html"><i class="fa fa-home"></i></a ></li>
diff --git a/web/css/person-topbar.css b/web/css/person-topbar.css
index 5ba616ad2dbe844e18c3a810c7c11f133968a4be..7308211121779c51eee079e2413c653a207bea07 100644
--- a/web/css/person-topbar.css
+++ b/web/css/person-topbar.css
@@ -43,7 +43,7 @@
 /*}*/
 .nav-link i{
     margin:5px;
-    font-size:25px;
+    font-size:32px;
 }
 .topbar ul .dropdown-menu li i{
     font-size:18px;
diff --git a/web/css/topbar.css b/web/css/topbar.css
index f7122c3615b824df9341d8ea7b413f7e7bb01c11..8b329c8a4b184dc3b4f9bcce05af87b768025eba 100644
--- a/web/css/topbar.css
+++ b/web/css/topbar.css
@@ -42,7 +42,7 @@
 }
 .nav-link i{
     margin:5px;
-    font-size:25px;
+    font-size:32px;
 }
 .topbar ul .dropdown-menu li i{
     font-size:18px;
diff --git a/web/index.html b/web/index.html
index ceedb4f16a0b52da6ba4fa9e40af66c92177fa82..34a0abddefdef8149a2685423e8d9a1be861d998 100644
--- a/web/index.html
+++ b/web/index.html
@@ -26,9 +26,10 @@
     <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>
-
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.0/jquery-confirm.min.css">
 
+    <script href="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
+    <script type="text/javascript" src="js/login_registerScripts.js"></script>
 </head>
 
 <body class="relative">
@@ -49,17 +50,17 @@
 
         <div class="nav-right">
             <div class="collapse navbar-collapse nav-list">
-                <ul class="navbar-nav ml-auto" style="list-style:none;">
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
-                           aria-expanded="false" href=""><i class="fa fa-user"></i></a >
-                        <ul class="dropdown-menu">
-                            <li><a class="nav-link" href="person.html">View Profile</a ></li>
-                            <li><a class="nav-link" href="admin.html">My Admin</a ></li>
-                            <li><a class="nav-link" href="#" style="border-top: 1px solid #b1b8bb"><i class="fa fa-power-off"></i> Log Out</a ></li>
-                        </ul>
-                    </li>
-                    <li class="nav-item active"><a class="nav-link" href="index.html"><i class="fa fa-home"></i></a ></li>
+                <ul id="userIcon" class="navbar-nav ml-auto" style="list-style:none;">
+<!--                    <li class="nav-item dropdown">-->
+<!--                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"-->
+<!--                           aria-expanded="false" href=""><i class="fa fa-user"></i></a >-->
+<!--                        <ul class="dropdown-menu">-->
+<!--                            <li><a class="nav-link" href="person.html">View Profile</a ></li>-->
+<!--                            <li><a class="nav-link" href="admin.html">My Admin</a ></li>-->
+<!--                            <li><a class="nav-link" href="#" style="border-top: 1px solid #b1b8bb"><i class="fa fa-power-off"></i> Log Out</a ></li>-->
+<!--                        </ul>-->
+<!--                    </li>-->
+<!--                    <li class="nav-item active"><a class="nav-link" href="index.html"><i class="fa fa-home"></i></a ></li>-->
                 </ul>
             </div>
         </div>
@@ -69,42 +70,42 @@
 
 <div class="main-wrapper oh">
 
-    <!--<header class="nav-type-1 dark-nav">-->
+<!--    <header class="nav-type-1 dark-nav">-->
 
-        <!--<nav class="navbar navbar-fixed-top">-->
-            <!--<div class="navigation">-->
-                <!--<div class="container relative">-->
+<!--        <nav class="navbar navbar-fixed-top">-->
+<!--            <div class="navigation">-->
+<!--                <div class="container relative">-->
 
-                    <!--<div class="row">-->
+<!--                    <div class="row">-->
 
-                        <!--<div class="navbar-header">-->
-                            <!--<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">-->
-                                <!--<span class="sr-only">Toggle navigation</span>-->
-                                <!--<span class="icon-bar"></span>-->
-                                <!--<span class="icon-bar"></span>-->
-                                <!--<span class="icon-bar"></span>-->
-                            <!--</button>-->
-                        <!--</div> &lt;!&ndash; end navbar-header &ndash;&gt;-->
+<!--                        <div class="navbar-header">-->
+<!--                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">-->
+<!--                                <span class="sr-only">Toggle navigation</span>-->
+<!--                                <span class="icon-bar"></span>-->
+<!--                                <span class="icon-bar"></span>-->
+<!--                                <span class="icon-bar"></span>-->
+<!--                            </button>-->
+<!--                        </div> &lt;!&ndash; end navbar-header &ndash;&gt;-->
 
 
-                        <!--&lt;!&ndash; side menu &ndash;&gt;-->
-                        <!--<div class="side-menu right mobile-left-align">-->
-                            <!--<div class="nav-inner menu-socials social-icons">-->
-                                <!--<div class="right">-->
-                                    <!--<button id="loginbtn" class="launch-modal" data-modal-id="modal-login" onclick="clearTips()"><i class="fa fa-user fa-2x"></i></button>-->
+<!--                        &lt;!&ndash; side menu &ndash;&gt;-->
+<!--                        <div class="side-menu right mobile-left-align">-->
+<!--                            <div class="nav-inner menu-socials social-icons">-->
+<!--                                <div class="right">-->
+<!--                                    <button id="loginbtn" class="launch-modal" data-modal-id="modal-login" onclick="clearTips()"><i class="fa fa-user fa-2x"></i></button>-->
 <!--&lt;!&ndash;                                    <a href="#" id="toHomepage" onclick="openHomepage()" style="color: #2b669a">HomePageeeeeeeee</a>&ndash;&gt;-->
-                                    <!--<button id="toHomepage" onclick="openHomepage()" ><img id="myPhoto" src="" style="height: 30px;width: 30px"></img></button>-->
-                                    <!--<a href="#" id="logout" onclick="logout()" style="color: #2b669a">Logout</a>-->
-                                <!--</div>-->
-                            <!--</div>-->
+<!--                                    <button id="toHomepage" onclick="openHomepage()" ><img id="myPhoto" src="" style="height: 30px;width: 30px"></img></button>-->
+<!--                                    <a href="#" id="logout" onclick="logout()" style="color: #2b669a">Logout</a>-->
+<!--                                </div>-->
+<!--                            </div>-->
 
-                        <!--</div>-->
+<!--                        </div>-->
 
-                    <!--</div>-->
-                <!--</div>-->
-            <!--</div>-->
-        <!--</nav>-->
-    <!--</header>-->
+<!--                    </div>-->
+<!--                </div>-->
+<!--            </div>-->
+<!--        </nav>-->
+<!--    </header>-->
 
     <section class="header-wrap hero-section bg-light">
         <div class="container">
@@ -306,15 +307,11 @@
 <!--<script type="text/javascript" src="js/twitterFetcher_min.js"></script>-->
 <script type="text/javascript" src="js/scripts.js"></script>
 <script type="text/javascript" src="js/ToolBar/searchbar.js"></script>
-
+<script src="js/jquery-confirm.js"></script>
 <!-- Instafeed -->
 <script type="text/javascript">
-
-    $(window).load(function() {
-        //这里判断登录状态还需要进一步处理
-        checkLoginState();
-
-
+    $(document).ready(function() {
+        loadIndexLoginState();
 
     });
 </script>
@@ -333,7 +330,6 @@
 
 <script src="js/jquery.backstretch.min.js"></script>
 <script type="text/javascript" src="js/scripts2.js"></script>
-<script type="text/javascript" src="js/login_registerScripts.js"></script>
 <script src="js/Index/load_recommend_user.js"></script>
 
 
diff --git a/web/js/Privacy/request.js b/web/js/Privacy/request.js
index c6703dad095ce1ea9929d17fc09e1f99df90ca45..83bab1483b86f72c5e59455814c3cb97854cbd2b 100644
--- a/web/js/Privacy/request.js
+++ b/web/js/Privacy/request.js
@@ -20,42 +20,11 @@ function getReqeustedProjects(){
         dataType: 'json',
         success: function(data){
             console.log(data);
-            // for(x in data){
-            //     var projectId = data[x].projectid;  //project id留作备用
-            //     $("#requestProjectList").append(' <li>\n' +
-            //         '                      <div class="req-in">\n' +
-            //         '                      <div class="proj-des">\n' +
-            //         '                      <h3><a href="person-project.html?id='+data[x].projectid+'">' + data[x].projectname + '</a></h3>\n' +
-            //         '                      <h5>' + data[x].projectdescription + '</h5>\n' +
-            //         '                      </div>\n' +
-            //         '                      <div class="req-des">\n' +
-            //         '                      <span>Total number of Applicants: ' + data[x].countrequest + '</span>\n' +
-            //         '                      <div class="req-button">\n' +
-            //         '                      <a href="#project=' + data[x].projectname + '"><button class="candidate" onclick="loadCandidates('+data[x].projectid+')">See applicants</button></a>\n' +
-            //         '                      <button class="agree" onclick="agreeAll('+projectId+')">Agree all</button>\n' +
-            //         '                      </div>\n' +
-            //         '                      </div>\n' +
-            //         '                      </div>\n' +
-            //         '                      </li>');
-            // }
-            var idStr = "requestProjectList";
-            var htmlStr = "' <li>\\n' +\n" +
-                "                    '                      <div class=\"req-in\">\\n' +\n" +
-                "                    '                      <div class=\"proj-des\">\\n' +\n" +
-                "                    '                      <h3><a href=\"webpage/project-related/project-show.html\">' + data[x].projectname + '</a></h3>\\n' +\n" +
-                "                    '                      <h5>' + data[x].projectdescription + '</h5>\\n' +\n" +
-                "                    '                      </div>\\n' +\n" +
-                "                    '                      <div class=\"req-des\">\\n' +\n" +
-                "                    '                      <span>Total number of Applicants: ' + data[x].countrequest + '</span>\\n' +\n" +
-                "                    '                      <div class=\"req-button\">\\n' +\n" +
-                "                    '                      <a href=\"#project=' + data[x].projectname + '\"><button class=\"candidate\" onclick=\"loadCandidates('+data[x].projectid+')\">See applicants</button></a>\\n' +\n" +
-                "                    '                      <button class=\"agree\" onclick=\"agreeAll('+projectId+')\">Agree all</button>\\n' +\n" +
-                "                    '                      </div>\\n' +\n" +
-                "                    '                      </div>\\n' +\n" +
-                "                    '                      </div>\\n' +\n" +
-                "                    '                      </li>'";
-
-            loadSubPage(data);
+            if(data==null || data.length==0){
+                $("#requestProjectList").append('<h4>No request.</h4>');
+            } else{
+                loadSubPage(data, 1);
+            }
         },
         error : function(msg) {
             alert("get projects failed");
@@ -277,20 +246,52 @@ function submitSelections(){
         if(v == "yes")  acceptUsers += userId+",";
         else    refuseUsers += userId+",";
     }
-    if(confirm("Sure to submit?")){
-        if(acceptUsers.length != 0){
-            //alert("accepter user: "+acceptUsers);
-            processRequest(projectId, acceptUsers, 2);
-            setVisibleTo(projectId, acceptUsers);
-        }
-        if(refuseUsers.length != 0){
-            //alert("refuse user: "+refuseUsers);
-            processRequest(projectId, refuseUsers, 1);
-        }
-        if(projectId != -1){
-            loadCandidates(projectId);
+    $.confirm({
+        title: 'Sure to submit?',
+        content: '',
+        icon: 'fa fa-warning',
+        theme: 'white',
+        buttons: {
+            ok: {
+                text: "ok",
+                btnClass: 'btn-primary',
+                keys: ['enter'],
+                action: function() {
+                    if(acceptUsers.length != 0){
+                        //alert("accepter user: "+acceptUsers);
+                        processRequest(projectId, acceptUsers, 2);
+                        setVisibleTo(projectId, acceptUsers);
+                    }
+                    if(refuseUsers.length != 0){
+                        //alert("refuse user: "+refuseUsers);
+                        processRequest(projectId, refuseUsers, 1);
+                    }
+                    if(projectId != -1){
+                        loadCandidates(projectId);
+                    }
+                }
+            },
+            cancel: function(){
+                console.log('the user clicked cancel');
+            }
         }
-    }
+    });
+
+
+    // if(confirm("Sure to submit?")){
+    //     if(acceptUsers.length != 0){
+    //         //alert("accepter user: "+acceptUsers);
+    //         processRequest(projectId, acceptUsers, 2);
+    //         setVisibleTo(projectId, acceptUsers);
+    //     }
+    //     if(refuseUsers.length != 0){
+    //         //alert("refuse user: "+refuseUsers);
+    //         processRequest(projectId, refuseUsers, 1);
+    //     }
+    //     if(projectId != -1){
+    //         loadCandidates(projectId);
+    //     }
+    // }
 }
 
 //Requests sent by myself
@@ -309,24 +310,10 @@ function getMyRequests(){
         dataType: 'json',
         success: function(data){
             console.log(data);
-            for(x in data){
-                var statusNum = data[x].requeststatus;
-                var status = "Unhandled";
-                if(statusNum == '1')    status = "Refused";
-                else if(statusNum == '2')   status = "Approved";
-                $("#myRequestsList").append(' <li>\n' +
-                    '                                <div class="req-in">\n' +
-                    '                                    <div class="req-detail">\n' +
-                    '                                        <span style="font-size: x-large; ">'+data[x].projectname+'</span>\n' +
-                    '                                        <h4>Project Owner: <a href="other-person.html?id='+data[x].userid+'">'+data[x].name+'</a>  Apply date: '+data[x].str_requesttime+'</h4>\n' +
-                    '                                    </div>\n' +
-                    '                                    <div class="req-status">\n' +
-                    '                                        <span>Status:</span>\n' +
-                    '                                        <span class="status">'+status+'</span>\n' +
-                    '                                    </div>\n' +
-                    '                                    <div class="req-btn"><input type="button" onclick="deleteRequest('+data[x].requestid+')" value="DELETE"/></div>' +
-                    '                                </div>\n' +
-                    '                            </li>');
+            if(data==null || data.length==0){
+                $("#myRequestsList").append('<h4>No request.</h4>');
+            } else{
+                loadSubPage(data, 2);
             }
         },
         error : function(msg) {
diff --git a/web/js/ToolBar/pagebar.js b/web/js/ToolBar/pagebar.js
index 768f575fae08ea327b64a9862bf5c71c4bf118d4..2a1ead0307a67832dd8a45d01b7c7d5b42ba658d 100644
--- a/web/js/ToolBar/pagebar.js
+++ b/web/js/ToolBar/pagebar.js
@@ -11,7 +11,7 @@ loadSubPage = function(data, type){
     var dataStr = JSON.stringify(data);
 
     if(pageNum == 0){
-        $("#page-bar").append('<h4>No data here</h4>');
+        //$("#page-bar").append('<h4>No data here</h4>');
     } else{
         $("#page-bar").append('<div id="currentPage" style="display: none"></div>');    //用来存放当前页面编号
         $("#page-bar").append("<li id='previousBtn' class='page-item disabled'>\n" +
diff --git a/web/js/login_registerScripts.js b/web/js/login_registerScripts.js
index f14f957ecda6f7cb9fc232440fe3cf53b0f7f891..ca387053ddc74e9359115d56df23d7da65616879 100644
--- a/web/js/login_registerScripts.js
+++ b/web/js/login_registerScripts.js
@@ -1,3 +1,8 @@
+function openLogin(){
+    clearTips();
+    $("#modal-login").modal();
+}
+
 function login(){
     var email=$("#email").val();
     var password=$("#password").val();
@@ -119,51 +124,154 @@ function register(){
     });
 }
 
-function checkLoginState(){
+function loadLoginState(){
+    var strcookie = document.cookie;
+    if(strcookie==null || strcookie.length==0){
+        //alert("aab");
+        $("#userIcon").append('<a class="nav-link dropdown-toggle" data-toggle="" onclick="confirmToLogin()" role="button" aria-haspopup="true"\n' +
+            '                   aria-expanded="false" href="#"><i class="fa fa-user"></i></a >');
+    } else{
+        $("#userIcon").append('<a class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"\n' +
+            '                   aria-expanded="false" href=""><i class="fa fa-user"></i></a >\n' +
+            '                <ul class="dropdown-menu">\n' +
+            '                    <li><a class="nav-link" href="person.html">View Profile</a ></li>\n' +
+            '                    <li><a class="nav-link" href="admin.html">My Admin</a ></li>\n' +
+            '                    <li><a class="nav-link" href="#" onclick="logout()"><i class="fa fa-power-off"></i> Log Out</a ></li>\n' +
+            '                </ul>');
+    }
+}
+
+function loadIndexLoginState(){
     var strcookie = document.cookie;
     if(strcookie==null || strcookie.length==0){
-        //alert("no login");
-        $("#loginbtn").show();
-        $("#logout").hide();
-        //$("#toHomepage").hide();
-        document.getElementById("toHomepage").style.display="none";
+        $("#userIcon").append('<li class="nav-item dropdown">\n' +
+            '                        <a class="nav-link dropdown-toggle" data-modal-id="modal-login" onclick="openLogin()" href="#"><i class="fa fa-user"></i></a >\n' +
+            '                    </li>\n' +
+            '                    <li class="nav-item active"><a class="nav-link" href="index.html"><i class="fa fa-home"></i></a ></li>');
     } else{
-        var userPhotoStr = strcookie.split(";")[1];
-        var userPhoto = userPhotoStr.split("=")[1];
-        if(userPhoto=="null")   userPhoto="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3439779931,834673929&fm=26&gp=0.jpg";
-        $("#loginbtn").hide();
-        $("#logout").show();
-        //$("#toHomepage").show();
-        document.getElementById("myPhoto").src = userPhoto;
-        document.getElementById("toHomepage").style.display="inline";
+        $("#userIcon").append('<li class="nav-item dropdown">\n' +
+            '                        <a class="nav-link dropdown-toggle" data-toggle="" role="button" aria-haspopup="true"\n' +
+            '                           aria-expanded="false" href="#"><i class="fa fa-user"></i></a >\n' +
+            '                        <ul class="dropdown-menu">\n' +
+            '                            <li><a class="nav-link" href="person.html">View Profile</a ></li>\n' +
+            '                            <li><a class="nav-link" href="admin.html">My Admin</a ></li>\n' +
+            '                            <li><a class="nav-link" href="#" onclick="adminLogout()" style="border-top: 1px solid #b1b8bb"><i class="fa fa-power-off"></i> Log Out</a ></li>\n' +
+            '                        </ul>\n' +
+            '                    </li>\n' +
+            '                    <li class="nav-item active"><a class="nav-link" href="index.html"><i class="fa fa-home"></i></a ></li>');
     }
 }
 
+function confirmToLogin(){
+    $.confirm({
+        title: 'You need login to see further pages',
+        content: 'Are You Sure Going Back And Login?\n',
+        icon: 'fa fa-warning',
+        theme: 'white',
+        buttons: {
+            ok: {
+                text: "ok",
+                btnClass: 'btn-primary',
+                keys: ['enter'],
+                action: function() {
+                    window.location.href="index.html";
+                }
+            },
+            cancel: function(){
+                console.log('the user clicked cancel');
+            }
+        }
+    });
+}
+
+// function checkLoginState(){
+//     var strcookie = document.cookie;
+//     if(strcookie==null || strcookie.length==0){
+//         //alert("no login");
+//         $("#loginbtn").show();
+//         $("#logout").hide();
+//         //$("#toHomepage").hide();
+//         document.getElementById("toHomepage").style.display="none";
+//     } else{
+//         var userPhotoStr = strcookie.split(";")[1];
+//         var userPhoto = userPhotoStr.split("=")[1];
+//         if(userPhoto=="null")   userPhoto="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3439779931,834673929&fm=26&gp=0.jpg";
+//         $("#loginbtn").hide();
+//         $("#logout").show();
+//         //$("#toHomepage").show();
+//         document.getElementById("myPhoto").src = userPhoto;
+//         document.getElementById("toHomepage").style.display="inline";
+//     }
+// }
+
 function openHomepage(){
     window.location.href="person.html";
 }
 
 function logout(){
-    if(confirm("Sure to logout?")){
-        $.ajax({
-            type: 'post',
-            url: 'LoginServlet',
-            data: {
-                "type": "logout"
-            },
-            dataType: 'text',
-            success: function(data){
-                if(data == "logout"){
-                    //window.location.href="register.jsp";
-                    window.location.href="index.html";
-                } else{
-                    alert("no user now");
+    $.confirm({
+        title: 'Sure to logout?',
+        content: '',
+        icon: 'fa fa-warning',
+        theme: 'white',
+        buttons: {
+            ok: {
+                text: "ok",
+                btnClass: 'btn-primary',
+                keys: ['enter'],
+                action: function() {
+                    adminLogout();
                 }
             },
-            error : function(msg) {
-                alert("logout failed");
-                console.log(msg)
+            cancel: function(){
+                console.log('the user clicked cancel');
             }
-        });
-    }
+        }
+    });
+
+    // if(confirm("Sure to logout?")){
+    //     $.ajax({
+    //         type: 'post',
+    //         url: 'LoginServlet',
+    //         data: {
+    //             "type": "logout"
+    //         },
+    //         dataType: 'text',
+    //         success: function(data){
+    //             if(data == "logout"){
+    //                 //window.location.href="register.jsp";
+    //                 window.location.href="index.html";
+    //             } else{
+    //                 alert("no user now");
+    //             }
+    //         },
+    //         error : function(msg) {
+    //             alert("logout failed");
+    //             console.log(msg)
+    //         }
+    //     });
+    // }
+}
+
+//Logout without confirm
+function adminLogout(){
+    $.ajax({
+        type: 'post',
+        url: 'LoginServlet',
+        data: {
+            "type": "logout"
+        },
+        dataType: 'text',
+        success: function(data){
+            if(data == "logout"){
+                window.location.href="index.html";
+            } else{
+                alert("no user now");
+            }
+        },
+        error : function(msg) {
+            alert("logout failed");
+            console.log(msg)
+        }
+    });
 }
\ No newline at end of file
diff --git a/web/other-person-project.html b/web/other-person-project.html
index 4f82414ccbe88bb41e7cb59201e1cc54290ea0c8..e38e4b45171a2c663d2903e41e5eca66252fe151 100644
--- a/web/other-person-project.html
+++ b/web/other-person-project.html
@@ -13,7 +13,7 @@
     <script src="js/bootstrap.bundle.min.js"></script>
     <link rel="stylesheet" href="css/ckin.css">
     <link rel="stylesheet" href="css/person-topbar.css">
-
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.0/jquery-confirm.min.css">
 
 </head>
 
@@ -32,7 +32,7 @@
                 <ul class="dropdown-menu">
                     <li><a class="nav-link" href="person.html">View Profile</a ></li>
                     <li><a class="nav-link" href="admin.html">My Admin</a ></li>
-                    <li><a class="nav-link" href="#"><i class="fa fa-power-off"></i> Log Out</a ></li>
+                    <li><a class="nav-link" href="#" onclick="logout()"><i class="fa fa-power-off"></i> Log Out</a ></li>
                 </ul>
             </div>
             <div class="home-icon">
@@ -199,6 +199,8 @@
 <script src="js/video-boot.js"></script>
 <script src="js/ckin.js"></script>
 <script src="js/ProjectPage/load_project_to_otherpeople_projectpage.js"></script>
+<script src="js/jquery-confirm.js"></script>
+<script src="js/login_registerScripts.js"></script>
 
 </body>
 </html>
\ No newline at end of file
diff --git a/web/other-person.html b/web/other-person.html
index d9a81f958fa4a39e79702f136186f77a5993d5c6..e2389a17f1d8228b3b1d330fab96e8e191d93337 100644
--- a/web/other-person.html
+++ b/web/other-person.html
@@ -24,14 +24,14 @@
         </div>
 
         <div class="nav-right">
-            <div class="user-icon">
-                <a class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
-                   aria-expanded="false" href=""><i class="fa fa-user"></i></a >
-                <ul class="dropdown-menu">
-                    <li><a class="nav-link" href="person.html">View Profile</a ></li>
-                    <li><a class="nav-link" href="admin.html">My Admin</a ></li>
-                    <li><a class="nav-link" href="#"><i class="fa fa-power-off"></i> Log Out</a ></li>
-                </ul>
+            <div class="user-icon" id="userIcon">
+<!--                <a class="nav-link dropdown-toggle" data-toggle="" role="button" aria-haspopup="true"-->
+<!--                   aria-expanded="false" href=""><i class="fa fa-user"></i></a >-->
+<!--                <ul class="dropdown-menu">-->
+<!--                    <li><a class="nav-link" href="person.html">View Profile</a ></li>-->
+<!--                    <li><a class="nav-link" href="admin.html">My Admin</a ></li>-->
+<!--                    <li><a class="nav-link" href="#"><i class="fa fa-power-off"></i> Log Out</a ></li>-->
+<!--                </ul>-->
             </div>
             <div class="home-icon">
                 <a class="nav-link" href="index.html"><i class="fa fa-home"></i></a >
@@ -313,13 +313,15 @@
 <script src="js/Award/awards.js"></script>
 <script src="js/Project/project_display.js"></script>
 <script src="js/Privacy/request.js"></script>
-
+<script src="js/login_registerScripts.js"></script>
 
 
 <script>
     $(document).ready(function(){
         getOthersAwards();
         getOthersProjectList();  //get projects information
+        loadLoginState();
+
 
         $(".filter-b").click(function(){
             var value = $(this).attr('data-filter');
diff --git a/web/person-project.html b/web/person-project.html
index da9cf4de1c0094571d9e485b5bfad2a39719c6cf..5877865cc12b9711d869be6e25038159eecea88b 100644
--- a/web/person-project.html
+++ b/web/person-project.html
@@ -13,6 +13,7 @@
     <script src="js/bootstrap.bundle.min.js"></script>
     <link rel="stylesheet" href="css/ckin.css">
     <link rel="stylesheet" href="css/person-topbar.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.0/jquery-confirm.min.css">
 
 
 </head>
@@ -32,7 +33,7 @@
                 <ul class="dropdown-menu">
                     <li><a class="nav-link" href="person.html">View Profile</a ></li>
                     <li><a class="nav-link" href="admin.html">My Admin</a ></li>
-                    <li><a class="nav-link" href="#"><i class="fa fa-power-off"></i> Log Out</a ></li>
+                    <li><a class="nav-link" href="#" onclick="logout()"><i class="fa fa-power-off"></i> Log Out</a ></li>
                 </ul>
             </div>
             <div class="home-icon">
@@ -226,6 +227,8 @@
 <script src="js/video-boot.js"></script>
 <script src="js/ckin.js"></script>
 <script src="js/ProjectPage/load_project_to_projectpage.js"></script>
+<script src="js/jquery-confirm.js"></script>
+<script src="js/login_registerScripts.js"></script>
 
 </body>
 </html>
\ No newline at end of file
diff --git a/web/person.html b/web/person.html
index 0f915a493d715fbf0f07ec1047be954e854a32e3..c055bf0064ac553e06affe852b6c7974e14de90f 100644
--- a/web/person.html
+++ b/web/person.html
@@ -9,6 +9,8 @@
     <link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'>
     <link href="css/person-style.css" rel="stylesheet">
     <link href="css/person-topbar.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.0/jquery-confirm.min.css">
+
 </head>
 
 <body id="page-top">
@@ -26,7 +28,7 @@
                 <ul class="dropdown-menu">
                     <li><a class="nav-link" href="person.html">View Profile</a ></li>
                     <li><a class="nav-link" href="admin.html">My Admin</a ></li>
-                    <li><a class="nav-link" href="#"><i class="fa fa-power-off"></i> Log Out</a ></li>
+                    <li><a class="nav-link" href="#" onclick="logout()"><i class="fa fa-power-off"></i> Log Out</a ></li>
                 </ul>
             </div>
             <div class="home-icon">
@@ -315,6 +317,8 @@
 <script src="js/Experience/load_edu_to_person.js"></script>
 <script src="js/Award/awards.js"></script>
 <script src="js/Project/project_display.js"></script>
+<script src="js/jquery-confirm.js"></script>
+<script src="js/login_registerScripts.js"></script>
 
 
 <script>
diff --git a/web/webpage/privacy/privacy-candidate.html b/web/webpage/privacy/privacy-candidate.html
index 47adf3f3fd34a61841bc76f5dc8f59936079fc06..3f3c0259810b003bd0502c405da1bf5be6bedc19 100644
--- a/web/webpage/privacy/privacy-candidate.html
+++ b/web/webpage/privacy/privacy-candidate.html
@@ -14,6 +14,7 @@
 
     <script src="../../js/jquery.min.js"> </script>
     <script src="../../js/bootstrap.min.js"> </script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.0/jquery-confirm.min.css">
 
     <!-- Custom and plugin javascript -->
     <link href="../../css/custom.css" rel="stylesheet">
@@ -24,6 +25,7 @@
 
     <script src="/js/Privacy/privacy_set.js"></script>
     <script src="/js/Privacy/request.js"></script>
+    <script src="js/jquery-confirm.js"></script>
 
     <script>
         $(function(){
@@ -68,15 +70,7 @@
 
                                 <nav aria-label="Page navigation example" class="m-t-40">
                                     <ul class="pagination" id="page-bar">
-                                        <!--                                        <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>-->
+                                    <!-- Page bar tools -->
                                     </ul>
                                 </nav>
 
diff --git a/web/webpage/privacy/privacy-my.html b/web/webpage/privacy/privacy-my.html
index 8989bb275cd369636333222e17d4dc20a2f2018d..cdfebb2ad8493567f12d22b5ab3b9613607a60d9 100644
--- a/web/webpage/privacy/privacy-my.html
+++ b/web/webpage/privacy/privacy-my.html
@@ -19,6 +19,7 @@
     <!--<script src="../../js/custom.js"></script>-->
     <!--<script src="../../js/jquery.metisMenu.js"></script>-->
 
+    <script src="/js/ToolBar/pagebar.js"></script>
     <script src="/js/Privacy/request.js"></script>
     <script>
         $(function(){
@@ -51,6 +52,19 @@
                                     <!--动态加载请求列表-->
                                 </ul>
 
+                                <nav aria-label="Page navigation example" class="m-t-40">
+                                    <ul class="pagination" id="page-bar">
+<!--                                        <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>