diff --git a/website/public/API/loadPost.php b/website/public/API/loadPost.php index a9e9851..f73fe42 100644 --- a/website/public/API/loadPost.php +++ b/website/public/API/loadPost.php @@ -6,56 +6,7 @@ require_once("../../queries/checkInput.php"); require_once("../../queries/nicetime.php"); if(isset($_GET['postID'])) { - $postID = $_GET['postID']; - $post = selectPostById($postID)->fetch(PDO::FETCH_ASSOC); - $fullname = $post['fname'] . " " . $post['lname'] . " (" . $post['username'] . ")"; - -echo " -
-

" . $post['title'] . "

- - gepost door $fullname, - - " . nicetime($post['creationdate']) . " - - -
- -
-

" . $post['content'] . "

-
- -
-
-
-
- -
-
"; - - $q = selectCommentsByPostId($postID); - while($comment = $q->fetch(PDO::FETCH_ASSOC)) { - $commentauthor = $comment['fname'] . " " . $comment['lname'] . " (" . $comment['username'] . ")"; - $commentdate = $comment['creationdate']; - $commentnicetime = nicetime($commentdate); - $commentcontent = $comment['content']; - - echo(" -
-
- $commentauthor - - $commentnicetime - -
-
- $commentcontent -
-
- "); - } -echo "
"; - + include("../../views/post-view.php"); } else { echo "Failed to load"; } \ No newline at end of file diff --git a/website/public/js/masonry.js b/website/public/js/masonry.js index bbc97c0..3b872ba 100644 --- a/website/public/js/masonry.js +++ b/website/public/js/masonry.js @@ -1,19 +1,28 @@ margin = 20; -function loadPost(postForm) { - $.get( - "API/loadPost.php", - $(postForm).serialize() - ).done(function (data) { - console.log(data); - $('#modal-response').html(data); +// scrolling modal taken from http://stackoverflow.com/questions/10476632/how-to-scroll-the-page-when-a-modal-dialog-is-longer-than-the-screen +function scrollbarMargin(width, overflow) { + $('body').css({ + marginRight: width, + overflow: overflow + }); + $('.profile-menu').css({ + marginRight: width }); } function requestPost(post) { $(".modal").show(); - console.log($(post).children("form")); - loadPost($(post).children("form")); + $.get( + "API/loadPost.php", + $(post).children("form").serialize() + ).done(function (data) { + $('.modal-default').hide(); + var scrollBarWidth = window.innerWidth - document.body.offsetWidth; + scrollbarMargin(scrollBarWidth, 'hidden'); + $('#modal-response').show(); + $('#modal-response').html(data); + }); } $(window).on("load", function() { @@ -85,18 +94,14 @@ function mansonry() { column = $('
').append(columns[i][1]); console.log(column); container.append(column); - } $("div.posts div.column").width(100/columnCount + "%"); - // $(".post").click(function () { - // $(".modal").show(); - // console.log("testerino"); - // loadPost($(this).children("form.first")); - // }); - $(".modal-close").click(function () { $(".modal").hide(); + scrollbarMargin(0, 'auto'); + $('#modal-response').hide(); + $('.modal-default').show(); }); } \ No newline at end of file diff --git a/website/public/styles/post-popup.css b/website/public/styles/post-popup.css index 3b16255..11fe03b 100644 --- a/website/public/styles/post-popup.css +++ b/website/public/styles/post-popup.css @@ -1,25 +1,22 @@ /* modal based on: http://www.w3schools.com/howto/howto_css_modals.asp */ .modal { - display: none; /* Hidden by default */ - position: fixed; /* Stay in place */ - z-index: 1; /* Sit on top */ - left: 0; - top: 0; + display: none; + position: fixed; + top: 80px; + left: 256px; width: calc(100% - 256px); /* Full width */ height: calc(100% - 80px); /* Full height */ - overflow: visible; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + overflow-y: auto; } /* Modal Content/Box */ .modal-content { - background-color: #fefefe; - margin: 15% auto; /* 15% from the top and centered */ - padding: 20px; - border: 1px solid #888; - width: 80%; /* Could be more or less, depending on screen size */ + margin: 5% auto; + width: 70%; /* Could be more or less, depending on screen size */ + overflow-y: auto; } .modal-close { @@ -35,4 +32,41 @@ color: black; text-decoration: none; cursor: pointer; +} + +.modal-content img { + max-height: 100%; + max-width: 100%; +} + +.post-header h4 { + font-size: 20pt; +} + +.post-content { + margin: 30px auto; + width: 90%; +} + +.commentfield { + margin-bottom: 20px; +} + +.commentfield textarea { + width: 100%; +} + +.comment { + padding-top: 10px; + padding-bottom: 10px; + border-top: 1px solid #4CAF50; +} + +.commentinfo { + font-size: 10pt; +} + +.commentcontent { + margin: 5px auto; + width: 95%; } \ No newline at end of file diff --git a/website/views/post-view.php b/website/views/post-view.php index af6afbd..044c23e 100644 --- a/website/views/post-view.php +++ b/website/views/post-view.php @@ -1,11 +1,10 @@ fetch(PDO::FETCH_ASSOC); - $fullname = $post['fname'] . " " . $post['lname'] . " (" . $post['username'] . ")"; +$postID = $_GET['postID']; +$post = selectPostById($postID)->fetch(PDO::FETCH_ASSOC); +$fullname = $post['fname'] . " " . $post['lname'] . " (" . $post['username'] . ")"; -echo " -
+echo(" +

" . $post['title'] . "

gepost door $fullname, @@ -13,42 +12,41 @@ echo " " . nicetime($post['creationdate']) . " -
" -?> - -
-

-
+
+

" . $post['content'] . "

+
+"); ?> + +
-
- +
+
fetch(PDO::FETCH_ASSOC)) { - $commentauthor = $comment['fname'] . " " . $comment['lname'] . " (" . $comment['username'] . ")"; - $commentdate = $comment['creationdate']; - $commentnicetime = nicetime($commentdate); - $commentcontent = $comment['content']; + $q = selectCommentsByPostId($postID); + while($comment = $q->fetch(PDO::FETCH_ASSOC)) { + $commentauthor = $comment['fname'] . " " . $comment['lname'] . " (" . $comment['username'] . ")"; + $commentdate = $comment['creationdate']; + $commentnicetime = nicetime($commentdate); + $commentcontent = $comment['content']; - echo(" -
-
- $commentauthor - - $commentnicetime - -
-
- $commentcontent -
-
- "); - } - ?> -
+ echo(" +
+
+ $commentauthor + + $commentnicetime + +
+
+ $commentcontent +
+
+ "); + } ?> +
\ No newline at end of file diff --git a/website/views/profile.php b/website/views/profile.php index 46be001..49238f6 100644 --- a/website/views/profile.php +++ b/website/views/profile.php @@ -74,13 +74,13 @@ ?>
-
-
+
+
×