Display text posts and images posts

assets/css/components/posts/ui.css

@@ -0,0 +1,17 @@
+/**
+ * Posts UI stylesheet
+ *
+ * @author Pierre HUBERT
+ */
+
+.post .post_content {
+	text-align: center;
+}
+
+.post .post-buttons {
+	text-align: center;
+}
+
+.post .post-image {
+	width: 100%;
+}

assets/css/pages/userPage/main.css

@@ -0,0 +1,10 @@
+/**
+ * Main posts stylesheet
+ *
+ * @author Pierre HUBERT
+ */
+
+.page-contener {
+	max-width: 1500px;
+	margin: auto;
+}

assets/js/common/functionsSchema.js

@@ -634,6 +634,27 @@ var ComunicWeb = {
 
 		},
 
+		/**
+		 * Posts components
+		 */
+		posts: {
+
+			/**
+			 * Posts communication interface
+			 */
+			interface: {
+				//TODO : implement
+			},
+
+			/**
+			 * Posts UI
+			 */
+			ui: {
+
+			},
+
+		},
+
 		/**
 		 * Modern textarea handler
 		 */

assets/js/components/posts/interface.js

@@ -0,0 +1,28 @@
+/**
+ * Posts communication interface with the API
+ * 
+ * @author Pierre HUBERT
+ */
+
+ComunicWeb.components.posts.interface = {
+
+	/**
+	 * Get user posts
+	 * 
+	 * @param {int} userID The ID of the target user
+	 * @param {function} callback Callback function
+	 */
+	get_user: function(userID, callback){
+
+		//Prepare the API request
+		var APIuri = "posts/get_user";
+		var params = {
+			userID: userID
+		};
+
+		//Make the request
+		ComunicWeb.common.api.makeAPIrequest(APIuri, params, true, callback);
+
+	},
+
+}

assets/js/components/posts/ui.js

@@ -0,0 +1,149 @@
+/**
+ * Posts UI
+ * 
+ * @author Pierre HUBERT
+ */
+
+ComunicWeb.components.posts.ui = {
+
+	/**
+	 * Show a single post
+	 * 
+	 * @param {Object} infos Informations about the post
+	 * @param {HTMLElement} target The target for the post
+	 */
+	display_post: function(infos, target){
+
+		//Create post root element
+		var postRoot = createElem2({
+			appendTo: target,
+			type: "div",
+			class: "post"
+		});
+
+		//Display user block
+		var userBlock = createElem2({
+			appendTo: postRoot,
+			type: "div",
+			class: "user-block"
+		});
+
+		//Display user account image
+		var userAccountImage = createElem2({
+			appendTo: userBlock,
+			type: "img",
+			class: "img-circle img-bordered-sm",
+			src: ComunicWeb.__config.assetsURL + "img/defaultAvatar.png"
+		});
+
+		//Add user name
+		var userNameBlock = createElem2({
+			appendTo: userBlock,
+			type: "span",
+			class: "username",
+		});
+
+		var userName = createElem2({
+			appendTo: userNameBlock,
+			type: "a",
+			innerHTML: "Loading"
+		});
+
+		//Add post description
+		var postDescription = createElem2({
+			appendTo: userBlock,
+			type: "span",
+			class: "description"
+		});
+
+		//Show the age of the post
+		postDescription.innerHTML = ComunicWeb.common.date.timeDiffToStr(infos.post_time) + " ago";
+
+		//Load user informations
+		ComunicWeb.user.userInfos.getUserInfos(infos.userID, function(result){
+			if(result.firstName){
+				userAccountImage.src = result.accountImage;
+				userName.innerHTML = result.firstName + " " + result.lastName;
+			}
+		});
+
+
+		//Add post attachement (if any)
+		if(infos.kind == "text"){
+			//Do nothing
+		}
+
+		//In case of image
+		else if(infos.kind == "image"){
+
+			//Image link
+			var imageLink = createElem2({
+				appendTo: postRoot,
+				type:"a",
+				href: infos.file_path_url,
+			});
+
+			//Image element
+			createElem2({
+				appendTo: imageLink,
+				type: "img",
+				src: infos.file_path_url,
+				class: "post-image"
+			});
+
+			//Enable lightbox
+			imageLink.onclick = function(){
+				$(this).ekkoLightbox({
+					alwaysShowClose: true,
+				});
+				return false;
+			}
+		}
+
+		else {
+			//Log error
+			ComunicWeb.debug.logMessage("Not implemented kind of post: " + infos.kind);
+			ComunicWeb.common.error.submitError("notice", "Unimplemented kind of post" + infos.kind, 0, {});
+		}
+
+
+		//Add post content
+		var postContent = createElem2({
+			appendTo: postRoot,
+			type: "div",
+			class: "post_content",
+			innerHTML: infos.content
+		});
+
+
+
+
+		//Add bottom elements container
+		var bottomArea = createElem2({
+			appendTo: postRoot,
+			type: "ul",
+			class: "list-inline post-buttons"
+		});
+
+		//Load likes
+		var likesTarget = createElem2({
+			appendTo: bottomArea,
+			type: "li",
+		});
+
+		var userLiking = null;
+		if(signed_in()){
+			userLiking = infos.userlike;
+		}
+
+		//Call component
+		ComunicWeb.components.like.button.display(
+			"post",
+			infos.ID,
+			infos.likes,
+			userLiking,
+			likesTarget
+		);
+	}
+
+}

assets/js/pages/userPage/main.js

@@ -134,7 +134,7 @@ ComunicWeb.pages.userPage.main = {
 		var row = createElem2({
 			appendTo: sectionContent,
 			type: "div",
-			class: "row"
+			class: "row page-contener"
 		});
 
 		//Create left column
@@ -151,10 +151,10 @@ ComunicWeb.pages.userPage.main = {
 		var rightColumn = createElem2({
 			appendTo: row,
 			type: "div",
-			class: "col-md-9"
+			class: "col-md-6"
 		});
 
-		//Display text
+		//Display posts
 		ComunicWeb.pages.userPage.posts.display(infos, params, rightColumn);
 	}
 

assets/js/pages/userPage/posts.js

@@ -22,10 +22,48 @@ ComunicWeb.pages.userPage.posts = {
 			class: "box box-primary"
 		});
 
-		//Check whether a precise post has to be opened or not
+		var postsBody = createElem2({
-		//TODO implement
+			appendTo: postsBlock,
+			type: "div",
+			class: "box-body"
+		});
+
+		//Get the posts from the API
+		ComunicWeb.components.posts.interface.get_user(userInfos.userID, function(result){
+
+			//Check for errors
+			if(result.error){
+				//Display notification
+				ComunicWeb.common.notificationSystem.showNotification("Couldn't get user posts!", "danger", 4, "Error");
+			}
+			else {
+
+				//Show the posts
+				ComunicWeb.pages.userPage.posts._show(result, postsBody);
+
+			}
+		});
 		
-	}
+	},
+
+	/**
+	 * Show user posts
+	 * 
+	 * @param {Object} posts The list of posts to display
+	 * @param {HMTLElement} target The rendering target
+	 */
+	_show: function(posts, target){
+		
+		//Process each post
+		var i;
+		for(i in posts){
+			
+			//Display post
+			ComunicWeb.components.posts.ui.display_post(posts[i], target);
+
+		}
+
+	},
 
 
 

corePage/config/dev.config.php

@@ -50,10 +50,14 @@ $config['CSSfiles'] = array(
 		"%PATH_ASSETS%css/components/userSelect/userSelect.css",
 
 		//Emojies
-	"%PATH_ASSETS%css/components/emoji/parser.css",
+		"%PATH_ASSETS%css/components/emoji/parser.css",
+
+		//Posts component
+		"%PATH_ASSETS%css/components/posts/ui.css",
 
 	//Pages stylesheets
 		//User Page
+		"%PATH_ASSETS%css/pages/userPage/main.css",
 		"%PATH_ASSETS%css/pages/userPage/accessForbidden.css",
 );
 
@@ -162,6 +166,10 @@ $config['JSfiles'] = array(
 		"%PATH_ASSETS%js/components/like/button.js",
 		"%PATH_ASSETS%js/components/like/interface.js",
 
+		//Posts component
+		"%PATH_ASSETS%js/components/posts/interface.js",
+		"%PATH_ASSETS%js/components/posts/ui.js",
+
 		//Modern textarea handler
 		"%PATH_ASSETS%js/components/textarea.js",