Create comments form.

assets/css/components/comments/form.css

@@ -0,0 +1,25 @@
+/**
+ * Comments form stylesheet
+ *
+ * @author Pierre HUBERT
+ */
+
+.comment-creation-form {
+	margin-top: 10px;
+}
+
+.comment-creation-form:first-child {
+	margin-top: 0px;
+}
+
+.comment-creation-form .comment-image-select {
+	margin-bottom: -2px !important;
+}
+
+.comment-creation-form .comment-image-select input[type="file"]{
+	display: none;
+}
+
+.comment-creation-form .comment-image-select a {
+	color: black;
+}

assets/js/common/functionsSchema.js

@@ -731,11 +731,18 @@ var ComunicWeb = {
 				//TODO : implement
 			},
 
+			/**
+			 * Comments creation form
+			 */
+			form: {
+				//TODO : implement
+			},
+
 			/**
 			 * Comments editor
 			 */
 			editor: {
-
+				//TODO : implement
 			},
 
 			/**

assets/js/components/comments/form.js

@@ -0,0 +1,81 @@
+/**
+ * Comments form
+ * 
+ * @author Pierre HUBERT
+ */
+ComunicWeb.components.comments.form = {
+	
+	/**
+	 * Display comments creation form
+	 * 
+	 * @param {number} postID The ID of the target post
+	 * @param {HTMLElement} target The target for the form
+	 */
+	display: function(postID, target){
+		
+		//Create form contener
+		var commentForm = createElem2({
+			appendTo: target,
+			type: "form",
+			class: "comment-creation-form"
+		});
+
+		//Create input group
+		var inputGroup = createElem2({
+			appendTo: commentForm,
+			type: "div",
+			class: "input-group input-group-sm"
+		});
+
+		//Add text input
+		var newCommentText = createElem2({
+			appendTo: inputGroup,
+			type: "input",
+			elemType: "text",
+			class: "form-control",
+			placeholder: "New comment..."
+		});
+
+		//Add button group
+		var buttonsGroup = createElem2({
+			appendTo: inputGroup,
+			type: "span",
+			class: "input-group-btn"
+		});
+
+		//Add image pick button
+		var addImageLabel = createElem2({
+			appendTo: buttonsGroup,
+			type: "label",
+			class: "comment-image-select"
+		});
+
+		var imageFile = createElem2({
+			appendTo: addImageLabel,
+			type: "input",
+			elemType: "file"
+		});
+
+		var imageButton = createElem2({
+			appendTo: addImageLabel,
+			type: "a",
+			class: "btn btn-flat",
+			innerHTML: "<i class='fa fa-picture-o'></i>"
+		})
+
+		//Add send button
+		var sendButton = createElem2({
+			appendTo: buttonsGroup,
+			type: "button",
+			class: "btn btn-default btn-flat",
+			innerHTML: "Send"
+		});
+
+		//Catch form when submitted
+		commentForm.onsubmit = function(){
+			alert("Send !");
+			return false;
+		}
+	},
+
+}

assets/js/components/comments/ui.js

@@ -55,6 +55,11 @@ ComunicWeb.components.comments.ui = {
 			this._show_comment(infos[i], usersInfos['user-' + infos[i].userID], contener);
 		}
 
+		//Add comment creation form (if possible)
+		if(signed_in()){
+			ComunicWeb.components.comments.form.display(postID, contener)
+		}
+
 	},
 
 	/**

system/config/dev.config.php

@@ -144,6 +144,7 @@ class Dev {
 
 			//Comments component
 			"css/components/comments/ui.css",
+			"css/components/comments/form.css",
 
 		//Pages stylesheets
 			//User Page
@@ -234,6 +235,7 @@ class Dev {
 			"js/components/comments/ui.js",
 			"js/components/comments/actions.js",
 			"js/components/comments/interface.js",
+			"js/components/comments/form.js",
 			"js/components/comments/editor.js",
 			"js/components/comments/utils.js",