diff --git a/docker-compose.yml b/docker-compose.yml
index 5b5ded32b6d76dbdbb956b197345a5ffc3e3d19a..85350a9a139c684fc2a0284bbd4b07f1b367dac2 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -15,7 +15,6 @@ services:
php-postgres:
image: postgres:16-alpine
container_name: ${MONOLITHIC_POSTGRES_HOST}
- restart: always
environment:
POSTGRES_USER: ${MONOLITHIC_POSTGRES_USER}
POSTGRES_PASSWORD: ${MONOLITHIC_POSTGRES_PASSWORD}
diff --git a/src/app/controllers/Home/GetPostController.php b/src/app/controllers/Home/GetPostController.php
index bdc856a11990069b759b29089b70cbd44435d5a0..f45cf1ac577d2b99b19ad3193ffeae7e1ee7917d 100644
--- a/src/app/controllers/Home/GetPostController.php
+++ b/src/app/controllers/Home/GetPostController.php
@@ -12,7 +12,13 @@ class GetPostController extends BaseController{
}
public function get($urlParams){
$page = $urlParams[0];
- $data = $this->srv->getPostPage($page);
+ if(array_key_exists('owner_id', $_GET)) {
+ $ownerId = $_GET['owner_id'];
+ }
+ else {
+ $ownerId = null;
+ }
+ $data = $this->srv->getPostPage($page, $ownerId);
if($data!=null){
$hasiljson = array(
'status' => 'sukses',
diff --git a/src/app/controllers/Page/ProfilePage.php b/src/app/controllers/Page/ProfilePage.php
index 8ce3ca7ac2c04986af3eae789f7090c8d9113a5c..7c9539b63643febb90215211ad76bd5091351406 100644
--- a/src/app/controllers/Page/ProfilePage.php
+++ b/src/app/controllers/Page/ProfilePage.php
@@ -13,6 +13,9 @@ class ProfilePage extends BaseController{
return self::$instance;
}
public function get($urlParams){
+ if(!isset($_SESSION['user_id'])) {
+ header("Location: /login");
+ }
require PAGE_PATH . "/profile.php";
exit();
}
diff --git a/src/app/models/HomeModel.php b/src/app/models/HomeModel.php
index 2ba3ec71636ffd3dd808a7460a8e71ee8f6d41ea..e342130127538e8f5c0c5faa08da2c59afe78c59 100644
--- a/src/app/models/HomeModel.php
+++ b/src/app/models/HomeModel.php
@@ -15,12 +15,19 @@ class HomeModel
}
return self::$instance;
}
- public function getPostPage($page){
+ public function getPostPage($page, $ownerId=null){
try{
+ if(!is_null($ownerId)){
+ $and_owner_id = " AND p.owner_id=$ownerId ";
+ }
+ else {
+ $and_owner_id = "";
+ }
+
$db = PDOHandler::getInstance()->getPDO();
$page = $page * 10;
- $sql = "SELECT p.post_id,u.id,u.username,u.profile_name,u.profile_picture_path,p.body,pr.path FROM posts as p LEFT JOIN post_resources as pr ON p.post_id=pr.post_id AND p.owner_id=pr.post_owner_id JOIN users as u ON p.owner_id=u.id WHERE p.refer_type IS NULL ORDER BY p.created_at DESC LIMIT 10 OFFSET $page";
- $count = "SELECT COUNT(*) as count FROM posts as p LEFT JOIN post_resources as pr ON p.post_id=pr.post_id AND p.owner_id=pr.post_owner_id JOIN users as u ON p.owner_id=u.id WHERE p.refer_type IS NULL";
+ $sql = "SELECT p.post_id,u.id,u.username,u.profile_name,u.profile_picture_path,p.body,pr.path FROM posts as p LEFT JOIN post_resources as pr ON p.post_id=pr.post_id AND p.owner_id=pr.post_owner_id JOIN users as u ON p.owner_id=u.id WHERE p.refer_type IS NULL $and_owner_id ORDER BY p.created_at DESC LIMIT 10 OFFSET $page";
+ $count = "SELECT COUNT(*) as count FROM posts as p LEFT JOIN post_resources as pr ON p.post_id=pr.post_id AND p.owner_id=pr.post_owner_id JOIN users as u ON p.owner_id=u.id WHERE p.refer_type IS NULL $and_owner_id";
$result = $db->query($sql);
$result2 = $db->query($count);
if($result){
diff --git a/src/app/view/home.php b/src/app/view/home.php
index 158fa87f8f3e0e8112190f9ef04f6928df6156bc..5ffc825cf2536b6d0477b199e9356ee76d91fac3 100644
--- a/src/app/view/home.php
+++ b/src/app/view/home.php
@@ -21,6 +21,7 @@ require_once PAGE_PATH . "/templates/navbar.php";
<div id="list-post">
</div>
</div>
+ <script src="/public/js/post.js"></script>
<script src="/public/js/home.js"></script>
</body>
</html>
\ No newline at end of file
diff --git a/src/app/view/post.php b/src/app/view/post.php
index 868d6513ee8d30f9bf02fcb6d0172c7b37b5f044..45b28fb925ccbb24094b01f8c8850761442b2b1a 100644
--- a/src/app/view/post.php
+++ b/src/app/view/post.php
@@ -27,6 +27,6 @@ require_once PAGE_PATH . "/templates/navbar.php";
</div>
</div>
</div>
- <script src="/public/js/post.js"></script>
+ <script src="/public/js/reply.js"></script>
</body>
</html>
\ No newline at end of file
diff --git a/src/app/view/profile.php b/src/app/view/profile.php
index de89ddbc436a72965bf8eda50ec28a376eb11def..2fd5017786a5e43032a599e2b30ea7b4a8095d51 100644
--- a/src/app/view/profile.php
+++ b/src/app/view/profile.php
@@ -8,6 +8,7 @@ require_once PAGE_PATH . "/templates/navbar.php";
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Profile</title>
+ <link rel="stylesheet" href="/public/css/home.css" />
<link rel="stylesheet" href="/public/css/shared.css" />
<link rel="stylesheet" href="/public/css/profile.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css">
@@ -18,16 +19,21 @@ require_once PAGE_PATH . "/templates/navbar.php";
<?php
echo Navbar();
?>
- <div class="box" id="box">
- <div class="iden">
- <img src="/public/assets/kajuha.jpg" alt="" class="fotoprofil">
- <div class="kolom">
- <p id="namaprofile"></p>
- <p id="username"></p>
- </div>
- </div>
- </div>
+ <div>
+ <div class="box" id="box">
+ <div class="iden">
+ <img src="/public/assets/kajuha.jpg" alt="" class="fotoprofil">
+ <div class="kolom">
+ <p id="namaprofile"></p>
+ <p id="username"></p>
+ </div>
+ </div>
+ </div>
+ <div id="list-post">
+ </div>
</div>
+ </div>
+ <script src="/public/js/post.js"></script>
<script src="/public/js/profile.js"></script>
</body>
</html>
\ No newline at end of file
diff --git a/src/public/js/home.js b/src/public/js/home.js
index 6a56902cc4f7e7888b86d9374aadb38bee5432d8..cd78013410266cfdf77c509628df88182908a902 100644
--- a/src/public/js/home.js
+++ b/src/public/js/home.js
@@ -1,254 +1 @@
-
-function createPost(data,totalsemuapage,pagenow){
- const post = document.getElementById('list-post');
- data.forEach(element => {
- const username = document.createElement('p');
- username.textContent = "@"+element.username;
- const nama = document.createElement('p');
- nama.textContent = element.profile_name;
-
- const simpanidentitas = document.createElement('div');
- simpanidentitas.classList.add('kolom');
- simpanidentitas.appendChild(nama);
- simpanidentitas.appendChild(username);
-
- const fotoprofile = document.createElement('img');
- fotoprofile.classList.add('fotoprofil');
- if(element.profile_picture_path==null){
- fotoprofile.src = '/public/assets/kajuha.jpg';
- }
- else{
- path = element.profile_picture_path;
- path = path.replace("/var/www/html", '');
- fotoprofile.src = path;
- }
-
- const identitas = document.createElement('div');
- identitas.classList.add('iden');
- identitas.appendChild(fotoprofile);
- identitas.appendChild(simpanidentitas);
- identitas.addEventListener('click',function(){gotoProfile(element.id)});
-
- const box = document.createElement('div');
- box.classList.add('box');
- box.appendChild(identitas);
-
- const isitext = document.createElement('p');
- isitext.textContent = element.body;
- isitext.classList.add('isitext');
- isitext.addEventListener('click',function(){gotoPost(element.post_id,element.id)});
- box.appendChild(isitext);
- var pathToRemove = "/var/www/html";
- var path = element.path;
- if(path!=null){
- let gettype = element.path
- let type = gettype.split('.').pop();
- path = path.replace(pathToRemove, '');
- console.log(path);
- if(type=='jpg' || type=='jpeg' || type=='png'){
- const isifoto = document.createElement('img');
- isifoto.src = path;
- isifoto.classList.add('foto');
- box.appendChild(isifoto);
- }
- else if(type=='mp4'){
- const isivideo = document.createElement('video');
- isivideo.src = path;
- isivideo.classList.add('video');
- isivideo.controls = true;
- box.appendChild(isivideo);
- }
- else if(type=='mp3'){
- const isiaudio = document.createElement('audio');
- isiaudio.src = path;
- isiaudio.classList.add('audio');
- isiaudio.controls = true;
- box.appendChild(isiaudio);
- }
- }
- const logolike = document.createElement('i');
- logolike.classList.add('fas','fa-thumbs-up');
- const like = document.createElement('button');
- like.classList.add('like-button');
- like.addEventListener('click',function(){likeId(element.post_id,element.id)});
- like.appendChild(logolike);
- const buatbutton = document.createElement('div');
- buatbutton.classList.add('button-container');
- buatbutton.appendChild(like);
- box.appendChild(buatbutton);
- post.appendChild(box);
- });
- const list = document.createElement('ul');
- const pagination = document.createElement('div');
- pagination.classList.add('pagination');
- pagination.appendChild(list);
- post.appendChild(pagination);
- makePagination(totalsemuapage,pagenow);
-}
-function gotoPost(postid,ownerid){
- console.log(postid,"post");
- const xhr = new XMLHttpRequest();
- const url = '/api/clickpost';
- xhr.open('PUT', url, true);
- xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
- xhr.onreadystatechange = function () {
- if (xhr.readyState === 4) {
- if (xhr.status === 200) {
- const response = JSON.parse(xhr.responseText);
- if(response.status==="error"){
- alert("Failed to go to post");
- }
- else if(response.status==="success"){
- console.log(response);
- }
- } else {
- console.error('Gagal melakukan permintaan');
- }
- }
- };
- xhr.send(`post_id=${encodeURIComponent(postid)}&owner_id=${encodeURIComponent(ownerid)}`);
- window.location.href = "/post/"+ownerid+"/"+postid;
-}
-function gotoProfile(userid){
- console.log(userid,"user");
- window.location.href = "/profiles/"+userid;
-}
-function likeId(postid,userid){
- console.log("like",postid);
- const xhr = new XMLHttpRequest();
- const url = '/api/like';
- xhr.open('POST', url, true);
- xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
- xhr.onreadystatechange = function () {
- if (xhr.readyState === 4) {
- if (xhr.status === 200) {
- const response = JSON.parse(xhr.responseText);
- if(response.status==="failed"){
- alert("Already like post");
- }
- else if(response.status==="success"){
- console.log(response);
- alert("Like post success");
- }
- } else {
- console.error('Gagal melakukan permintaan');
- }
- }
- };
- xhr.send(`post_id=${encodeURIComponent(postid)}&owner=${encodeURIComponent(userid)}`);
-}
-const xhr = new XMLHttpRequest();
-const url = '/api/getpost/0';
-
-xhr.open('GET', url, true);
-xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
-
-xhr.onreadystatechange = function () {
- if (xhr.readyState === 4) {
- if (xhr.status === 200) {
- const response = JSON.parse(xhr.responseText);
- if(response.status==="error"){
- alert(response.message);
- }
- else if(response.status==="sukses"){
- console.log(response);
- var totalpost = response.data.count;
- var totalPage = Math.ceil(totalpost/10);
- createPost(response.data.data,totalPage,1);
- }
- } else {
- console.error('Gagal melakukan permintaan');
- }
- }
-};
-xhr.send();
-function makePagination(totalPages,page){
- console.log(page);
- const ulTag = document.querySelector('ul');
- let liTag = '';
- if(totalPages===0){
- liTag+=`<p class="kosong">Belum ada post</p>`
- }
- else{
- let activeLi;
- let beforePage = page - 1;
- let afterPage = page + 1;
- if(page>1){
- liTag += `<li class="btn prev" onclick="klikPagination(${totalPages},${page-1})"><span><i class="fas fa-angle-left"></i>< Prev</span></li>`;
- }
- if(page>2){
- liTag+=`<li class="numb" onclick="klikPagination(${totalPages},1)"><span>1</span></li>`
- if(page>3){
- liTag+=`<li class="dots"><span>...</span></li>`
- }
- }
- for (let i=beforePage;i<=afterPage;i++){
- if(i>totalPages){
- continue;
- }
- if(i==0){
- i=1
- }
-
- if(page==i){
- activeLi = "active";
- }
- else{
- activeLi = "";
- }
- liTag+=`<li class="numb ${activeLi}" onclick="klikPagination(${totalPages},${i})"><span>${i}</span></li>`
- }
- if(page<totalPages-1){
- if(page<totalPages-2){
- liTag+=`<li class="dots"><span>...</span></li>`
- }
- liTag+=`<li class="numb" onclick="klikPagination(${totalPages},${totalPages})"><span>${totalPages}</span></li>`
- }
- if(page < totalPages){
- liTag += `<li class="btn next" onclick="klikPagination(${totalPages},${page+1})"><span>Next ><i class="fas fa-angle-right"></i></span></li>`;
- }
- }
- ulTag.innerHTML = liTag;
-}
-
-function klikPagination(totalPages,page){
- makePagination(totalPages,page);
- changePage(page);
-}
-
-function changePage(page){
- const xhr = new XMLHttpRequest();
- var getpage = (page-1);
- const url = '/api/getpost/'+getpage.toString();
-
- xhr.open('GET', url, true);
- xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
-
- xhr.onreadystatechange = function () {
- if (xhr.readyState === 4) {
- if (xhr.status === 200) {
- const response = JSON.parse(xhr.responseText);
- if(response.status==="error"){
- alert(response.message);
- }
- else if(response.status==="sukses"){
- console.log(response);
- const box = document.querySelectorAll('.box');
- box.forEach(function(e){
- e.remove();
- });
- const pagination = document.querySelectorAll('.pagination');
- pagination.forEach(function(e){
- e.remove();
- });
- var totalpost = response.data.count;
- var totalPage = Math.ceil(totalpost/10);
- createPost(response.data.data,totalPage,page);
- }
- } else {
- console.error('Gagal melakukan permintaan');
- }
- }
- };
- xhr.send();
-}
+showposts();
diff --git a/src/public/js/post.js b/src/public/js/post.js
index 9dfffa3570d80e47c9fabf86f3c7a693a7cef0e1..5092ee1c36ef7dad5635eb18e0a9aa70ebf09d6c 100644
--- a/src/public/js/post.js
+++ b/src/public/js/post.js
@@ -1,212 +1,263 @@
-let currUrl = window.location.href;
-currUrl = currUrl.split('/');
-postid = currUrl[currUrl.length-1];
-ownerid = currUrl[currUrl.length-2];
-function makePostID(element){
- const box = document.getElementById('content');
- const username = document.createElement('p');
- username.textContent = "@"+element.username;
- const nama = document.createElement('p');
- nama.textContent = element.profile_name;
-
- const simpanidentitas = document.createElement('div');
- simpanidentitas.classList.add('kolom');
- simpanidentitas.appendChild(nama);
- simpanidentitas.appendChild(username);
-
- const fotoprofile = document.createElement('img');
- fotoprofile.classList.add('fotoprofil');
- if(element.profile_picture_path==null){
- fotoprofile.src = '/public/assets/kajuha.jpg';
- }
- else{
- path = element.profile_picture_path;
- path = path.replace("/var/www/html", '');
- fotoprofile.src = path;
+function showposts(owner_id=null) {
+ const xhr = new XMLHttpRequest();
+ let url = '/api/getpost/0';
+ if(owner_id !== null) {
+ url = url.concat("?owner_id=", owner_id);
}
- const identitas = document.createElement('div');
- identitas.classList.add('iden');
- identitas.addEventListener('click',function(){window.location.href = '/profiles/'+ownerid});
- identitas.appendChild(fotoprofile);
- identitas.appendChild(simpanidentitas);
- box.appendChild(identitas);
+ xhr.open('GET', url, true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
- const isitext = document.createElement('p');
- isitext.textContent = element.body;
- isitext.classList.add('isitext-post');
- box.appendChild(isitext);
- var pathToRemove = "/var/www/html";
- var path = element.path;
- if(path!=null){
- let gettype = element.path
- let type = gettype.split('.').pop();
- path = path.replace(pathToRemove, '');
- console.log(path);
- if(type=='jpg' || type=='jpeg' || type=='png'){
- const isifoto = document.createElement('img');
- isifoto.src = path;
- isifoto.classList.add('foto');
- box.appendChild(isifoto);
- }
- else if(type=='mp4'){
- const isivideo = document.createElement('video');
- isivideo.src = path;
- isivideo.classList.add('video');
- isivideo.controls = true;
- box.appendChild(isivideo);
- }
- else if(type=='mp3'){
- const isiaudio = document.createElement('audio');
- isiaudio.src = path;
- isiaudio.classList.add('audio');
- isiaudio.controls = true;
- box.appendChild(isiaudio);
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ if(response.status==="error"){
+ alert(response.message);
+ }
+ else if(response.status==="sukses"){
+ console.log(response);
+ var totalpost = response.data.count;
+ var totalPage = Math.ceil(totalpost/10);
+ createPost(response.data.data,totalPage,1);
+ }
+ } else {
+ console.error('Gagal melakukan permintaan');
+ }
}
- }
+ };
+ xhr.send();
}
-function makeReply(element){
- const box = document.createElement('div');
- box.classList.add('box');
- const username = document.createElement('p');
- username.textContent = "@"+element.username;
- const nama = document.createElement('p');
- nama.textContent = element.profile_name;
+function createPost(data,totalsemuapage,pagenow,owner_id=null){
+ const post = document.getElementById('list-post');
+ data.forEach(element => {
+ const username = document.createElement('p');
+ username.textContent = "@"+element.username;
+ const nama = document.createElement('p');
+ nama.textContent = element.profile_name;
- const simpanidentitas = document.createElement('div');
- simpanidentitas.classList.add('kolom');
- simpanidentitas.appendChild(nama);
- simpanidentitas.appendChild(username);
+ const simpanidentitas = document.createElement('div');
+ simpanidentitas.classList.add('kolom');
+ simpanidentitas.appendChild(nama);
+ simpanidentitas.appendChild(username);
- const fotoprofile = document.createElement('img');
- fotoprofile.classList.add('fotoprofil');
- if(element.profile_picture_path==null){
- fotoprofile.src = '/public/assets/kajuha.jpg';
- }
- else{
- path = element.profile_picture_path;
- path = path.replace("/var/www/html", '');
- fotoprofile.src = path;
- }
+ const fotoprofile = document.createElement('img');
+ fotoprofile.classList.add('fotoprofil');
+ if(element.profile_picture_path==null){
+ fotoprofile.src = '/public/assets/kajuha.jpg';
+ }
+ else{
+ path = element.profile_picture_path;
+ path = path.replace("/var/www/html", '');
+ fotoprofile.src = path;
+ }
- const identitas = document.createElement('div');
- identitas.classList.add('iden');
- identitas.addEventListener('click',function(){window.location.href = '/profiles/'+element.id});
- identitas.appendChild(fotoprofile);
- identitas.appendChild(simpanidentitas);
- box.appendChild(identitas);
+ const identitas = document.createElement('div');
+ identitas.classList.add('iden');
+ identitas.appendChild(fotoprofile);
+ identitas.appendChild(simpanidentitas);
+ identitas.addEventListener('click',function(){gotoProfile(element.id)});
- const isitext = document.createElement('p');
- isitext.textContent = element.body;
- isitext.classList.add('isitext-post');
- box.appendChild(isitext);
- var pathToRemove = "/var/www/html";
- var path = element.path;
- if(path!=null){
- let gettype = element.path
- let type = gettype.split('.').pop();
- path = path.replace(pathToRemove, '');
- console.log(path);
- if(type=='jpg' || type=='jpeg' || type=='png'){
- const isifoto = document.createElement('img');
- isifoto.src = path;
- isifoto.classList.add('foto');
- box.appendChild(isifoto);
+ const box = document.createElement('div');
+ box.classList.add('box');
+ box.appendChild(identitas);
+
+ const isitext = document.createElement('p');
+ isitext.textContent = element.body;
+ isitext.classList.add('isitext');
+ isitext.addEventListener('click',function(){gotoPost(element.post_id,element.id)});
+ box.appendChild(isitext);
+ var pathToRemove = "/var/www/html";
+ var path = element.path;
+ if(path!=null){
+ let gettype = element.path
+ let type = gettype.split('.').pop();
+ path = path.replace(pathToRemove, '');
+ // console.log(path);
+ if(type=='jpg' || type=='jpeg' || type=='png'){
+ const isifoto = document.createElement('img');
+ isifoto.src = path;
+ isifoto.classList.add('foto');
+ box.appendChild(isifoto);
+ }
+ else if(type=='mp4'){
+ const isivideo = document.createElement('video');
+ isivideo.src = path;
+ isivideo.classList.add('video');
+ isivideo.controls = true;
+ box.appendChild(isivideo);
+ }
+ else if(type=='mp3'){
+ const isiaudio = document.createElement('audio');
+ isiaudio.src = path;
+ isiaudio.classList.add('audio');
+ isiaudio.controls = true;
+ box.appendChild(isiaudio);
+ }
}
- else if(type=='mp4'){
- const isivideo = document.createElement('video');
- isivideo.src = path;
- isivideo.classList.add('video');
- isivideo.controls = true;
- box.appendChild(isivideo);
+ const logolike = document.createElement('i');
+ logolike.classList.add('fas','fa-thumbs-up');
+ const like = document.createElement('button');
+ like.classList.add('like-button');
+ like.addEventListener('click',function(){likeId(element.post_id,element.id)});
+ like.appendChild(logolike);
+ const buatbutton = document.createElement('div');
+ buatbutton.classList.add('button-container');
+ buatbutton.appendChild(like);
+ box.appendChild(buatbutton);
+ post.appendChild(box);
+ });
+ const list = document.createElement('ul');
+ const pagination = document.createElement('div');
+ pagination.classList.add('pagination');
+ pagination.appendChild(list);
+ post.appendChild(pagination);
+ makePagination(totalsemuapage,pagenow);
+}
+function gotoPost(postid,ownerid){
+ console.log(postid,"post");
+ const xhr = new XMLHttpRequest();
+ const url = '/api/clickpost';
+ xhr.open('PUT', url, true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ if(response.status==="error"){
+ alert("Failed to go to post");
+ }
+ else if(response.status==="success"){
+ console.log(response);
+ }
+ } else {
+ console.error('Gagal melakukan permintaan');
}
- else if(type=='mp3'){
- const isiaudio = document.createElement('audio');
- isiaudio.src = path;
- isiaudio.classList.add('audio');
- isiaudio.controls = true;
- box.appendChild(isiaudio);
}
- }
- const listreply = document.getElementById('list-reply');
- listreply.appendChild(box);
+ };
+ xhr.send(`post_id=${encodeURIComponent(postid)}&owner_id=${encodeURIComponent(ownerid)}`);
+ window.location.href = "/post/"+ownerid+"/"+postid;
}
-
-const xhr = new XMLHttpRequest();
-const url = '/api/getpostid/'+ownerid+'/'+postid;
-xhr.open('GET',url,true);
-xhr.setRequestHeader('Content-Type','application/json');
-xhr.onreadystatechange = function () {
- if (xhr.readyState === 4) {
- if (xhr.status === 200) {
- const response = JSON.parse(xhr.responseText);
- if(response.status==="error"){
- alert(response.message);
+function gotoProfile(userid){
+ console.log(userid,"user");
+ window.location.href = "/profiles/"+userid;
+}
+function likeId(postid,userid){
+ console.log("like",postid);
+ const xhr = new XMLHttpRequest();
+ const url = '/api/like';
+ xhr.open('POST', url, true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ if(response.status==="failed"){
+ alert("Already like post");
+ }
+ else if(response.status==="success"){
+ console.log(response);
+ alert("Like post success");
+ }
+ } else {
+ console.error('Gagal melakukan permintaan');
}
- // console.log(response);
- makePostID(response);
- } else {
- console.error('Gagal melakukan permintaan');
- }
- }
-};
-xhr.send();
+ }
+ };
+ xhr.send(`post_id=${encodeURIComponent(postid)}&owner=${encodeURIComponent(userid)}`);
+}
-const inputreply = document.getElementById('reply');
-const buttonreply = document.getElementById('reply-button');
-buttonreply.addEventListener('click',function(){
- const valuereply = inputreply.value;
- let regex = /^\s/;
- if(valuereply==="" || regex.test(valuereply)){
- alert("Reply tidak boleh kosong atau hanya spasi");
+function makePagination(totalPages,page,owner_id=null){
+ console.log(page);
+ const ulTag = document.querySelector('ul');
+ let liTag = '';
+ if(totalPages===0){
+ liTag+=`<p class="kosong">Belum ada post</p>`
}
- else if(valuereply!==""){
- let url = '/api/reply/'+ownerid+'/'+postid;
- console.log(valuereply);
- let xhr = new XMLHttpRequest();
- xhr.open('POST',url,true);
- xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
- xhr.onreadystatechange = function () {
- if (xhr.readyState === 4) {
- if (xhr.status === 200) {
- const response = JSON.parse(xhr.responseText);
- if(response.status==="failed"){
- alert(response.message);
- }
- else{
- window.location.reload();
- }
- } else {
- console.error('Gagal melakukan permintaan');
+ else{
+ let activeLi;
+ let beforePage = page - 1;
+ let afterPage = page + 1;
+ if(page>1){
+ liTag += `<li class="btn prev" onclick="klikPagination(${totalPages},${page-1})"><span><i class="fas fa-angle-left"></i>< Prev</span></li>`;
+ }
+ if(page>2){
+ liTag+=`<li class="numb" onclick="klikPagination(${totalPages},1)"><span>1</span></li>`
+ if(page>3){
+ liTag+=`<li class="dots"><span>...</span></li>`
}
+ }
+ for (let i=beforePage;i<=afterPage;i++){
+ if(i>totalPages){
+ continue;
+ }
+ if(i==0){
+ i=1
}
- };
- xhr.send(`body=${encodeURIComponent(valuereply)}`);
- }
-});
-const xhr2 = new XMLHttpRequest();
-const url2 = '/api/getreply/'+ownerid+'/'+postid;
-xhr2.open('GET',url2,true);
-xhr2.setRequestHeader('Content-Type','application/json');
-xhr2.onreadystatechange = function () {
- if (xhr2.readyState === 4) {
- if (xhr2.status === 200) {
- const response = JSON.parse(xhr2.responseText);
- console.log(response);
- if(response.status==="error"){
- alert(response.message);
+ if(page==i){
+ activeLi = "active";
+ }
+ else{
+ activeLi = "";
+ }
+ liTag+=`<li class="numb ${activeLi}" onclick="klikPagination(${totalPages},${i})"><span>${i}</span></li>`
+ }
+ if(page<totalPages-1){
+ if(page<totalPages-2){
+ liTag+=`<li class="dots"><span>...</span></li>`
+ }
+ liTag+=`<li class="numb" onclick="klikPagination(${totalPages},${totalPages})"><span>${totalPages}</span></li>`
}
- // console.log(response);
- if(response.status!=="kosong"){
- response.forEach(element => {
- makeReply(element);
- });
+ if(page < totalPages){
+ liTag += `<li class="btn next" onclick="klikPagination(${totalPages},${page+1})"><span>Next ><i class="fas fa-angle-right"></i></span></li>`;
}
- } else {
- console.error('Gagal melakukan permintaan');
}
+ ulTag.innerHTML = liTag;
+}
+
+function klikPagination(totalPages,page){
+ makePagination(totalPages,page);
+ changePage(page);
+}
+
+function changePage(page,owner_id=null){
+ const xhr = new XMLHttpRequest();
+ var getpage = (page-1);
+ var url = '/api/getpost/'+getpage.toString();
+ if(owner_id !== null) {
+ url = url.concat("?owner_id=", owner_id);
}
-};
-xhr2.send();
+
+ xhr.open('GET', url, true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ if(response.status==="error"){
+ alert(response.message);
+ }
+ else if(response.status==="sukses"){
+ console.log(response);
+ const box = document.querySelectorAll('.box');
+ box.forEach(function(e){
+ e.remove();
+ });
+ const pagination = document.querySelectorAll('.pagination');
+ pagination.forEach(function(e){
+ e.remove();
+ });
+ var totalpost = response.data.count;
+ var totalPage = Math.ceil(totalpost/10);
+ createPost(response.data.data,totalPage,page);
+ }
+ } else {
+ console.error('Gagal melakukan permintaan');
+ }
+ }
+ };
+ xhr.send();
+}
\ No newline at end of file
diff --git a/src/public/js/profile.js b/src/public/js/profile.js
index aead17e4cbb1bad58c8890e96aaab715f73f2009..a2aa94831d7a6a557d7f187cf851d6c257726cdc 100644
--- a/src/public/js/profile.js
+++ b/src/public/js/profile.js
@@ -18,6 +18,10 @@ if(splitUrl[splitUrl.length-1] == "profiles"){
else{
namaprofile.textContent = response.data.profile_name;
username.textContent = "@"+response.data.username;
+
+ // show posts of the user to the page
+ const profile_id = response.data.id;
+ showposts(profile_id);
}
} else {
console.error('Gagal melakukan permintaan');
@@ -47,6 +51,10 @@ else{
});
const box = document.getElementById('box');
box.appendChild(buttonfollow);
+
+ // show posts of the user to the page
+ const profile_id = id;
+ showposts(profile_id);
}
else if(response.status==="success"){
namaprofile.textContent = response.data.profile_name;
@@ -59,6 +67,10 @@ else{
});
const box = document.getElementById('box');
box.appendChild(buttonfollow);
+
+ // show posts of the user to the page
+ const profile_id = id;
+ showposts(profile_id);
}
else if(response.status==="success3"){
window.location.href = '/profiles';
diff --git a/src/public/js/reply.js b/src/public/js/reply.js
new file mode 100644
index 0000000000000000000000000000000000000000..9dfffa3570d80e47c9fabf86f3c7a693a7cef0e1
--- /dev/null
+++ b/src/public/js/reply.js
@@ -0,0 +1,212 @@
+let currUrl = window.location.href;
+currUrl = currUrl.split('/');
+postid = currUrl[currUrl.length-1];
+ownerid = currUrl[currUrl.length-2];
+function makePostID(element){
+ const box = document.getElementById('content');
+ const username = document.createElement('p');
+ username.textContent = "@"+element.username;
+ const nama = document.createElement('p');
+ nama.textContent = element.profile_name;
+
+ const simpanidentitas = document.createElement('div');
+ simpanidentitas.classList.add('kolom');
+ simpanidentitas.appendChild(nama);
+ simpanidentitas.appendChild(username);
+
+ const fotoprofile = document.createElement('img');
+ fotoprofile.classList.add('fotoprofil');
+ if(element.profile_picture_path==null){
+ fotoprofile.src = '/public/assets/kajuha.jpg';
+ }
+ else{
+ path = element.profile_picture_path;
+ path = path.replace("/var/www/html", '');
+ fotoprofile.src = path;
+ }
+
+ const identitas = document.createElement('div');
+ identitas.classList.add('iden');
+ identitas.addEventListener('click',function(){window.location.href = '/profiles/'+ownerid});
+ identitas.appendChild(fotoprofile);
+ identitas.appendChild(simpanidentitas);
+ box.appendChild(identitas);
+
+ const isitext = document.createElement('p');
+ isitext.textContent = element.body;
+ isitext.classList.add('isitext-post');
+ box.appendChild(isitext);
+ var pathToRemove = "/var/www/html";
+ var path = element.path;
+ if(path!=null){
+ let gettype = element.path
+ let type = gettype.split('.').pop();
+ path = path.replace(pathToRemove, '');
+ console.log(path);
+ if(type=='jpg' || type=='jpeg' || type=='png'){
+ const isifoto = document.createElement('img');
+ isifoto.src = path;
+ isifoto.classList.add('foto');
+ box.appendChild(isifoto);
+ }
+ else if(type=='mp4'){
+ const isivideo = document.createElement('video');
+ isivideo.src = path;
+ isivideo.classList.add('video');
+ isivideo.controls = true;
+ box.appendChild(isivideo);
+ }
+ else if(type=='mp3'){
+ const isiaudio = document.createElement('audio');
+ isiaudio.src = path;
+ isiaudio.classList.add('audio');
+ isiaudio.controls = true;
+ box.appendChild(isiaudio);
+ }
+ }
+}
+function makeReply(element){
+ const box = document.createElement('div');
+ box.classList.add('box');
+
+ const username = document.createElement('p');
+ username.textContent = "@"+element.username;
+ const nama = document.createElement('p');
+ nama.textContent = element.profile_name;
+
+ const simpanidentitas = document.createElement('div');
+ simpanidentitas.classList.add('kolom');
+ simpanidentitas.appendChild(nama);
+ simpanidentitas.appendChild(username);
+
+ const fotoprofile = document.createElement('img');
+ fotoprofile.classList.add('fotoprofil');
+ if(element.profile_picture_path==null){
+ fotoprofile.src = '/public/assets/kajuha.jpg';
+ }
+ else{
+ path = element.profile_picture_path;
+ path = path.replace("/var/www/html", '');
+ fotoprofile.src = path;
+ }
+
+ const identitas = document.createElement('div');
+ identitas.classList.add('iden');
+ identitas.addEventListener('click',function(){window.location.href = '/profiles/'+element.id});
+ identitas.appendChild(fotoprofile);
+ identitas.appendChild(simpanidentitas);
+ box.appendChild(identitas);
+
+ const isitext = document.createElement('p');
+ isitext.textContent = element.body;
+ isitext.classList.add('isitext-post');
+ box.appendChild(isitext);
+ var pathToRemove = "/var/www/html";
+ var path = element.path;
+ if(path!=null){
+ let gettype = element.path
+ let type = gettype.split('.').pop();
+ path = path.replace(pathToRemove, '');
+ console.log(path);
+ if(type=='jpg' || type=='jpeg' || type=='png'){
+ const isifoto = document.createElement('img');
+ isifoto.src = path;
+ isifoto.classList.add('foto');
+ box.appendChild(isifoto);
+ }
+ else if(type=='mp4'){
+ const isivideo = document.createElement('video');
+ isivideo.src = path;
+ isivideo.classList.add('video');
+ isivideo.controls = true;
+ box.appendChild(isivideo);
+ }
+ else if(type=='mp3'){
+ const isiaudio = document.createElement('audio');
+ isiaudio.src = path;
+ isiaudio.classList.add('audio');
+ isiaudio.controls = true;
+ box.appendChild(isiaudio);
+ }
+ }
+ const listreply = document.getElementById('list-reply');
+ listreply.appendChild(box);
+}
+
+const xhr = new XMLHttpRequest();
+const url = '/api/getpostid/'+ownerid+'/'+postid;
+xhr.open('GET',url,true);
+xhr.setRequestHeader('Content-Type','application/json');
+xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ if(response.status==="error"){
+ alert(response.message);
+ }
+ // console.log(response);
+ makePostID(response);
+ } else {
+ console.error('Gagal melakukan permintaan');
+ }
+ }
+};
+xhr.send();
+
+const inputreply = document.getElementById('reply');
+const buttonreply = document.getElementById('reply-button');
+buttonreply.addEventListener('click',function(){
+ const valuereply = inputreply.value;
+ let regex = /^\s/;
+ if(valuereply==="" || regex.test(valuereply)){
+ alert("Reply tidak boleh kosong atau hanya spasi");
+ }
+ else if(valuereply!==""){
+ let url = '/api/reply/'+ownerid+'/'+postid;
+ console.log(valuereply);
+ let xhr = new XMLHttpRequest();
+ xhr.open('POST',url,true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ if(response.status==="failed"){
+ alert(response.message);
+ }
+ else{
+ window.location.reload();
+ }
+ } else {
+ console.error('Gagal melakukan permintaan');
+ }
+ }
+ };
+ xhr.send(`body=${encodeURIComponent(valuereply)}`);
+ }
+});
+
+const xhr2 = new XMLHttpRequest();
+const url2 = '/api/getreply/'+ownerid+'/'+postid;
+xhr2.open('GET',url2,true);
+xhr2.setRequestHeader('Content-Type','application/json');
+xhr2.onreadystatechange = function () {
+ if (xhr2.readyState === 4) {
+ if (xhr2.status === 200) {
+ const response = JSON.parse(xhr2.responseText);
+ console.log(response);
+ if(response.status==="error"){
+ alert(response.message);
+ }
+ // console.log(response);
+ if(response.status!=="kosong"){
+ response.forEach(element => {
+ makeReply(element);
+ });
+ }
+ } else {
+ console.error('Gagal melakukan permintaan');
+ }
+ }
+};
+xhr2.send();