From: Paul Hänsch <paul@plutz.net>
Date: Thu, 14 Oct 2021 13:44:52 +0000 (+0200)
Subject: video styling (controls, size, etc...)
X-Git-Url: https://git.plutz.net/?p=rawnet;a=commitdiff_plain;h=c54a337bcc1f582416bb9ad42ce04e633c15cac7

video styling (controls, size, etc...)
---

diff --git a/page_channel.sh b/page_channel.sh
index bc05b15..cc25c27 100755
--- a/page_channel.sh
+++ b/page_channel.sh
@@ -166,6 +166,7 @@ w_video(){
            VIDEO_NAME="$(UNSTRING "$VIDEO_NAME")"
     VIDEO_DESCRIPTION="$(UNSTRING "$VIDEO_DESCRIPTION")"
     VIDEO_DESCR_CACHE="$(UNSTRING "$VIDEO_DESCR_CACHE")"
+         VIDEO_LENGTH="$(printf %i "$VIDEO_LENGTH" 2>&-)"
 
     [ "${VIDEO_STATUS}" = public ] || AUTHOR || return 0
 
@@ -181,7 +182,7 @@ w_video(){
             ]' "$_BASE" "$CHANNEL_ID" "$VIDEO_ID" \
                "$(HTML "${VIDEO_NAME:-(Unnamed Video)}")" \
                "$thumb" \
-               "$((${VIDEO_LENGTH%.*} / 60))" "$((${VIDEO_LENGTH%.*} % 60))" \
+               "$((VIDEO_LENGTH / 60))" "$((VIDEO_LENGTH % 60))" \
                "$(UNSTRING "$DESCR_CACHE")"
   else
     return 1
diff --git a/page_video.sh b/page_video.sh
index b7b9953..fc1d358 100644
--- a/page_video.sh
+++ b/page_video.sh
@@ -255,9 +255,9 @@ elif [ "$channel" -a "$video" ]; then
 	  ]
 	]')
 	$( [ $VIDEO_STATUS != void ] && printf '
-	[video
-	  [source src="%s/video/%s/%s.mp4"]
-	]' "$_BASE" "$channel" "$video"
+	[video preload=none controls=controls width=%i height=%i
+	  [source src="%s/video/%s/%s.mp4" type="video/mp4"]
+	]' "$VIDEO_RESX" "$VIDEO_RESY" "$_BASE" "$channel" "$video"
         )
 	$(AUTHOR && printf '[a .button href="edit" edit]')
 	[h1 .name $(HTML "$VIDEO_NAME")]
diff --git a/rawnet.css b/rawnet.css
index aca0303..320ec9a 100644
--- a/rawnet.css
+++ b/rawnet.css
@@ -213,23 +213,28 @@ body.channels main .channel > .description h2 {
   max-height: 8em;
 }
 
-.video.edit form > .delete {
+body.video.edit form > .delete {
   text-align: right;
 }
-.video.edit form #delconfirm + label:after {
+body.video.edit form #delconfirm + label:after {
   content: '\0A';
   white-space: pre;
 }
-.video.edit form #delconfirm + label + button {
+body.video.edit form #delconfirm + label + button {
   pointer-events: none;
   color: #AAA;
   border-color: #AAA;
   left: -.75em;
 }
-.video.edit form #delconfirm:checked + label + button {
+body.video.edit form #delconfirm:checked + label + button {
   pointer-events: auto;
   color: inherit;
   border-color: inherit;
   background-color: #FDD;
 }
 
+body.video video {
+  display: block;
+  margin: 0 auto;
+  max-height: 80vh;
+}