diff --git a/website/public/API/getPosts.php b/website/public/API/getPosts.php index 3f07c7d..4d2d452 100644 --- a/website/public/API/getPosts.php +++ b/website/public/API/getPosts.php @@ -1,7 +1,10 @@ fetchAll(PDO::FETCH_ASSOC); + + for($i = 0; $i < sizeof($results); $i++) { + $results[$i]["nicetime"] = nicetime($results[$i]["creationdate"]); + } + + echo json_encode($results); } - - $results = $posts->fetchAll(PDO::FETCH_ASSOC); - - for ($i = 0; $i < sizeof($results); $i++) { - $results[$i]["nicetime"] = nicetime($results[$i]["creationdate"]); - } - - echo json_encode($results); } else { header('HTTP/1.0 403 Forbidden'); -} \ No newline at end of file +} diff --git a/website/public/js/header.js b/website/public/js/header.js index 4feea40..e4408cc 100644 --- a/website/public/js/header.js +++ b/website/public/js/header.js @@ -11,7 +11,8 @@ $(document).ready(function() { // Add cookie so the menu stays open on other pages if (window.innerWidth > 1080) { - $("#chat-history").width("calc(100% - 587px)"); + $("#chat-history").css("margin-right", "266px"); + $("#chat-history").css("width", "calc(100% - 512px - 75px)"); document.cookie = "menu=open; path=/"; } else { document.cookie = "menu=closed; path=/"; @@ -22,7 +23,8 @@ $(document).ready(function() { $("#notification-center").css("display", "none"); if (window.innerWidth > 1080) { - $("#chat-history").width("calc(100% - 331px)"); + $("#chat-history").css("margin-right", "10px"); + $("#chat-history").css("width", "calc(100% - 256px - 85px)"); } else { // Make the menu invisible and move the content to the right. $("#contact-menu").css("display", "none"); @@ -43,6 +45,7 @@ $(document).ready(function() { // Add cookie so the menu stays open on other pages if (window.innerWidth > 1080) { + $("#chat-history").css("margin-right", "266px"); $("#chat-history").width("calc(100% - 587px)"); document.cookie = "menu=open; path=/"; } else { diff --git a/website/public/js/main.js b/website/public/js/main.js index a5f17de..7741406 100644 --- a/website/public/js/main.js +++ b/website/public/js/main.js @@ -94,14 +94,4 @@ function showGroups(groups, list) { } else { return false; } -} - -$(document).ready(function() { - $("body").delegate("textarea[maxlength]", "keydown", function() { - if ($(this).val().length / .9 >= $(this).attr("maxlength")) { - $(this).next().text($(this).val().length + "/" + $(this).attr("maxlength")); - } else { - $(this).next().text(""); - } - }); -}); \ No newline at end of file +} \ No newline at end of file diff --git a/website/public/js/masonry.js b/website/public/js/masonry.js index cfccdfa..4f638c2 100644 --- a/website/public/js/masonry.js +++ b/website/public/js/masonry.js @@ -45,8 +45,30 @@ function postPost() { } +var masonryMode = 0; +var windowWidth; +var columnCount; +var columns; +var postLimit; +var postAmount = 0; +var noposts = false; + +$(document).ready(function () { + windowWidth = $(window).width(); + columnCount = Math.floor($(".posts").width() / 250); + columns = new Array(columnCount); + postLimit = columnCount * 7; +}); + $(window).on("load", function() { $(".modal-close").click(function (){closeModal()}); + + // http://stackoverflow.com/questions/9439725/javascript-how-to-detect-if-browser-window-is-scrolled-to-bottom + window.onscroll = function(ev) { + if($(window).scrollTop() + $(window).height() == $(document).height() ) { + loadMorePosts(userID, groupID, postAmount, postLimit); + } + }; }); function closeModal() { @@ -56,15 +78,16 @@ function closeModal() { $('.modal-default').show(); } -var masonryMode = 0; -var windowWidth = $(window).width(); - $(window).resize(function() { clearTimeout(window.resizedFinished); window.resizeFinished = setTimeout(function() { if ($(window).width() != windowWidth) { windowWidth = $(window).width(); - masonry(masonryMode); + + if (columnCount != Math.floor($(".posts").width() / 250)) { + columnCount = Math.floor($(".posts").width() / 250); + masonry(masonryMode); + } } }, 250); }); @@ -74,12 +97,10 @@ var $container = $(".posts"); function masonry(mode) { masonryMode = mode; $container.children().remove(); - columnCount = Math.floor($(".posts").width() / 250); /* * Initialise columns. */ - var columns = new Array(columnCount); for (i = 0; i < columnCount; i++) { $column = $("
"); @@ -108,38 +129,61 @@ function masonry(mode) { /* * Function will find the column with the shortest height. */ - function getShortestColumn(columns) { - column = columns[0]; - for (i = 1; i < columnCount; i++) { - if (column[0] > columns[i][0]) { - column = columns[i]; - } - } - return column; - } /* * Get the posts from the server. */ - $.post("API/getPosts.php", { usr : userID, grp : groupID }) - .done(function(data) { - posts = JSON.parse(data); - - /* - * Rearange the objects. - */ - $.each(posts, function() { - $post = $("
"); - $post.append($("

").html(this["title"])); - $post.append($("

").html(fancyText(this["content"]))); - $post.append($("

").text(this["nicetime"])); - $post.append($("

").text("comments: " + this["comments"] + ", niet slechts: " + this["niet_slechts"])); - - shortestColumn = getShortestColumn(columns); - shortestColumn[1].append($post); - shortestColumn[0] = shortestColumn[0] + $post.height() + margin; - }); - }); + loadMorePosts(userID, groupID, 0, postLimit); } +function getShortestColumn(columns) { + column = columns[0]; + + for (i = 1; i < columnCount; i++) { + if (column[0] > columns[i][0]) { + column = columns[i]; + } + } + return column; +} + +function loadMorePosts(uID, gID, offset, limit) { + if (noposts) { + return; + } + + console.log(uID, gID, offset, limit); + + + $.post("API/getPosts.php", { usr : uID, + grp : gID, + offset : offset, + limit : limit}) + .done(function(data) { + if (!data) { + $('.noposts').show(); + noposts = true; + return; + } + + posts = JSON.parse(data); + + /* + * Rearange the objects. + */ + $.each(posts, function() { + $post = $("

"); + $post.append($("

").html(this["title"])); + $post.append($("

").html(fancyText(this["content"]))); + $post.append($("

").text(this["nicetime"])); + $post.append($("

").text("comments: " + this["comments"] + ", niet slechts: " + this["niet_slechts"])); + + shortestColumn = getShortestColumn(columns); + shortestColumn[1].append($post); + shortestColumn[0] = shortestColumn[0] + $post.height() + margin; + }); + }); + + postAmount += limit; +} \ No newline at end of file diff --git a/website/public/js/menu.js b/website/public/js/menu.js index 5ca9c97..c575ecd 100644 --- a/website/public/js/menu.js +++ b/website/public/js/menu.js @@ -6,11 +6,7 @@ var updatingMenus = 0; // On document load, load menus and loops loading menus every 10 seconds. $(document).ready(function() { - updatingMenus = 4; - loadMenuFriends(5); - loadNotificationFriends(); - loadUnreadMessages(); - loadMenuGroups(); + updateMenus(); setInterval(updateMenus, 10000); }); @@ -18,7 +14,6 @@ $(document).ready(function() { // Update the menu and notification items. function updateMenus() { if (updatingMenus <= 0) { - updatingMenus = 4; loadMenuFriends(5); loadNotificationFriends(); loadUnreadMessages(); @@ -27,76 +22,105 @@ function updateMenus() { } -// Get, every 3 seconds, the friends and insert them in the menu. +// Get the friends and insert them in the menu. function loadMenuFriends(limit) { + updatingMenus ++; $.post( "API/loadFriends.php", { limit: 5 } ).done(function(data) { + if (data == "" || data == "[]") { + $("#friends-menu-section").hide(); + } else { + $("#friends-menu-section").show(); + } if (menuFriendsData != data) { menuFriendsData = data; - if (showFriends(data, "#menu-friends-list", 5, "profile.php", "GET", limit)) { - $("#friends-menu-section").show(); - } else { + if (!showFriends(data, "#menu-friends-list", 5, "profile.php", "GET", limit)) { $("#friends-menu-section").hide(); } } + }).fail(function() { + $("#friends-menu-section").hide(); + }).always(function() { updatingMenus --; }); } -// Get, every 3 seconds, the groups and insert them in the menu. +// Get the groups and insert them in the menu. function loadMenuGroups() { + updatingMenus ++; $.post( "API/loadGroups.php", { limit: 5 } ).done(function(data) { + + if (data == "" || data == "[]") { + $("#groups-menu-section").hide(); + } else { + $("#groups-menu-section").show(); + } if (menuGroupsData != data) { menuGroupsData = data; - if (showGroups(data, "#menu-groups-list")) { - $("#groups-menu-section").show(); - } else { + if (!showGroups(data, "#menu-groups-list")) { $("#groups-menu-section").hide(); } } + }).fail(function() { + $("#groups-menu-section").hide(); + }).always(function() { updatingMenus --; }); } -// Get, every 3 seconds, the friends requests and insert them in the notification center. +// Get the friends requests and insert them in the notification center. function loadNotificationFriends() { + updatingMenus ++; $.post( "API/loadFriendRequest.php" ).done(function(data) { + if (data == "" || data == "[]") { + $("#friend-request-section").hide(); + } else { + $("#friend-request-section").show(); + } if (notificationRequestsData != data) { notificationRequestsData = data; - if (showFriendsPlus(data, "#friend-requests-list", 5, "profile.php", "GET")) { - $("#friend-request-section").show(); - } else { + if (!showFriendsPlus(data, "#friend-requests-list", 5, "profile.php", "GET")) { $("#friend-request-section").hide(); } } + }).fail(function() { + $("#friend-request-section").hide(); + }).always(function() { updatingMenus --; }); } -// Get, every 3 seconds, the unread messages and insert them in the notification center. +// Get the unread messages and insert them in the notification center. function loadUnreadMessages() { + updatingMenus ++; $.post( "API/loadChatNotifications.php" ).done(function(data) { + if (data == "" || data == "[]") { + $("#unread-messages-section").hide(); + } else { + $("#unread-messages-section").show(); + } if (notificationMessagesData != data) { notificationMessagesData = data; - if (showFriendsPlus(data, "#unread-chat-list", 5, "chat.php", "GET")) { - $("#unread-messages-section").show(); - } else { + if (!showFriendsPlus(data, "#unread-chat-list", 5, "chat.php", "GET")) { $("#unread-messages-section").hide(); } } + }).fail(function() { + $("#unread-messages-section").hide(); + }).always(function() { updatingMenus --; }); } \ No newline at end of file diff --git a/website/public/styles/post-popup.css b/website/public/styles/post-popup.css index 4b913ed..3f37ffd 100644 --- a/website/public/styles/post-popup.css +++ b/website/public/styles/post-popup.css @@ -14,7 +14,7 @@ /* Modal Content/Box */ .modal-content { - margin: 5% auto; + margin: 50px auto; width: 70%; /* Could be more or less, depending on screen size */ overflow-y: auto; } diff --git a/website/public/styles/profile.css b/website/public/styles/profile.css index d2bdab4..1bacafa 100644 --- a/website/public/styles/profile.css +++ b/website/public/styles/profile.css @@ -123,6 +123,11 @@ div.posts .post form textarea.newpost { font-size: 0.8em; } +.noposts { + display: none; + text-align: center; +} + @media only screen and (max-width: 1500px) { .post-box { width: calc(50% - 68px); diff --git a/website/queries/post.php b/website/queries/post.php index 37a5127..ecc5c48 100644 --- a/website/queries/post.php +++ b/website/queries/post.php @@ -46,6 +46,57 @@ function selectAllPosts($userID, $groupID) { } +function selectSomePosts($userID, $groupID, $offset, $limit) { + $stmt = prepareQuery(" + SELECT + `post`.`postID`, + `post`.`author`, + `title`, + CASE LENGTH(`post`.`content`) >= 150 AND `post`.`content` NOT LIKE 'bindParam(':userID', $userID, PDO::PARAM_INT); + $stmt->bindParam(':groupID', $groupID , PDO::PARAM_INT); + $stmt->bindParam(':offset', intval($offset), PDO::PARAM_INT); + $stmt->bindParam(':limit', intval($limit), PDO::PARAM_INT); + if(!$stmt->execute()) { + return False; + } + if($stmt->rowCount() == 0) { + return False; + } + return $stmt; + +} + function selectPostById($postID) { $stmt = prepareQuery(" SELECT diff --git a/website/views/profile.php b/website/views/profile.php index c72c01b..2bb117f 100644 --- a/website/views/profile.php +++ b/website/views/profile.php @@ -71,6 +71,10 @@

+
+

Geen posts meer!

+
+