make thumbnail directly from video and use poster for sound files

resources/views/index.edge

@@ -146,13 +146,11 @@
                         <p><a class="button is-link is-rounded" href="{{ file.location }}" download>Download<i class="fas fa-fw fa-file-download" aria-hidden="true"></i></a></p>
                         <p><button class="button is-link is-rounded" onclick="toClipboard('https:\/\/namejeff.xyz\/{{ file.location }}')">Add to clipboard<i class="fas fa-fw fa-clipboard" aria-hidden="true"></i></button></p>
                     </div>
-                    <figure class="image">
-                        <video muted width="720" height="480" loop onmouseover="this.play()" onmouseout="this.pause();" oncanplay="this.muted=true">
-                            <source src="{{ file.location }}" type="video/mp4">
-                            <img src="data:image/png;base64, {{ file.img }}">
-                        </video>
+                    <video muted width="720" height="480" loop onmouseover="this.play()" onmouseout="this.pause();" oncanplay="this.muted=true" poster="{{ file.img }}" preload="metadata">
+                        <source src="{{ file.location }}#t=0.5" >
+                        <img src="{{ file.img }}" title="Your browser does not support the <video> tag">
+                    </video>
                         <!-- <img src="data:image/png;base64, {{ file.img }}"> -->
-                    </figure>
                 </article>
             </div>
             @endeach