Block YouTube video by default

assets/css/common/global.css

@@ -25,6 +25,10 @@ a {
     color: #72afd2;
 }
 
+.cursor-pointer {
+    cursor: pointer;
+}
+
 /**
  * Sceditor iframe
  */

assets/css/components/posts/ui.css

@@ -63,6 +63,20 @@
 	text-align: center;
 }
 
+.post .post-youtube.post-youtube-placeholder {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: space-around;
+	background-color: #3c8dbc;
+	color: white;
+	border-radius: 5px;
+}
+
+.post .post-youtube.post-youtube-placeholder .title {
+	font-size: 150%;
+}
+
 .post .post-youtube {
 	width: 100%;
 	height: 300px;

assets/js/components/posts/ui.js

@@ -424,9 +424,41 @@ ComunicWeb.components.posts.ui = {
 		//In case of YouTube video
 		else if(info.kind == "youtube"){
 
+			//Create frame placeholder
+			var youtube_placeholder = createElem2({
+				appendTo: postRoot,
+				type: "div",
+				class: "post-youtube post-youtube-placeholder"
+			});
+
+			//Title 
+			createElem2({
+				appendTo: youtube_placeholder,
+				type: "div",
+				class: "title",
+				innerHTML: "<i class='fa fa-youtube-play'></i> YouTube Movie"
+			});
+
+			createElem2({
+				appendTo: youtube_placeholder,
+				type: "a",
+				class: "btn btn-default",
+				innerHTML: "Open on YouTube",
+				href: "https://youtube.com/watch?v=" + info.file_path,
+			}).target = "_blank";
+
+			var openHere = createElem2({
+				appendTo: youtube_placeholder,
+				type: "div",
+				class: "cursor-pointer",
+				innerHTML: "Open here"
+			});
+
+			openHere.addEventListener("click", function(){
+
 				//Create iframe
 				var youtube_iframe = createElem2({
-				appendTo: postRoot,
+					insertBefore: youtube_placeholder,
 					type: "iframe",
 					class: "post-youtube",
 					src: "https://www.youtube-nocookie.com/embed/"+info.file_path+"?rel=0"
@@ -436,6 +468,10 @@ ComunicWeb.components.posts.ui = {
 				youtube_iframe.setAttribute("allow", "encrypted-media");
 				youtube_iframe.setAttribute("allowfullscreen", "");
 
+				youtube_placeholder.remove();
+
+			});
+
 		}
 
 		//In case of PDF