dev: add video vtl & youtube vtl files #24465

dotCMS/src/main/webapp/WEB-INF/velocity/static/storyblock/dotVideo.vtl

@@ -0,0 +1,10 @@
+<div style="max-width: 100%; margin-bottom: 1.5rem; text-align: #if($!item.attrs.textAlign && $!item.attrs.textAlign != "null")$!item.attrs.textAlign#{else}center#end">
+    <video
+        controls
+        style="max-width: 100%; aspect-ratio: 16 / 9;"
+        src="#if($!item.attrs.src && $!item.attrs.src != "null")$!item.attrs.src#{else}$!item.attrs.data.asset#end"
+        width="#if($!item.attrs.width && $!item.attrs.width != "null")$!item.attrs.width#{else}100%#end"
+        height="#if($!item.attrs.height && $!item.attrs.height != "null")$!item.attrs.height#{else}auto#end"
+    />
+</div>
+

dotCMS/src/main/webapp/WEB-INF/velocity/static/storyblock/youtube.vtl

@@ -0,0 +1,17 @@
+#set($src =  $!item.attrs.src)
+#set($path =  $!src.split('/'))
+#set($index = $!path.size() - 1)
+#set($videoId = $!path.get($index))
+
+<div style="max-width: 100%;text-align: center; margin-bottom: 1.5rem;">
+    <iframe
+        width="100%"
+        height="auto"
+        style="aspect-ratio: 16 / 9;"
+        src="https://www.youtube.com/embed/$videoId"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        allowfullscreen
+    ></iframe>
+</div>
+