Recherche avancée

Sur d’autres sites (7252)

• FFMPEG & ScrollMagic : Safari bug

  27 novembre 2020, par gusv7

  I got this site where video playback is linked to scroll position. I'm using a FFMPEG-encoded .mp4 file and ScrollMagic to handle the scroll event. It works perfectly on Chrome, Opera and FF, but crashes on Safari : the animation is delayed and the video disappears once it reaches the end of the playback on Safari OS. It also doesn't show on iOS, not in Safari or Chrome... :/

  


  Here's the markup :

  


  <section class="shaka-container padding-x-lg flex-end">&#xA;  <div class="shaka">&#xA;    <video src="/assets/maozinha.mp4" type="video/mp4" playsinline="true"></video>&#xA;  </div>&#xA;</section>&#xA;

  


  The JS :

  


  &#xA;<code class="echappe-js">&lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/gsap.min.js&quot;&gt;&lt;/script&gt;&#xA;&#xA;&lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.8/ScrollMagic.min.js&quot; integrity=&quot;sha512-8E3KZoPoZCD&amp;#x2B;1dgfqhPbejQBnQfBXe8FuwL4z/c8sTrgeDMFEnoyTlH3obB4/fV&amp;#x2B;6Sg0a0XF&amp;#x2B;L/6xS4Xx1fUEg==&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;&#xA;&#xA;&lt;script&gt;&amp;#xA;  // Shaka Animation&amp;#xA;    const intro = document.querySelector(&amp;#x27;.shaka&amp;#x27;);&amp;#xA;    const video = intro.querySelector(&amp;#x27;video&amp;#x27;);&amp;#xA;&amp;#xA;    // SCROLL MAGIC&amp;#xA;&amp;#xA;    const controller = new ScrollMagic.Controller();&amp;#xA;&amp;#xA;    // Scenes&amp;#xA;    const scene = new ScrollMagic.Scene({&amp;#xA;      duration: 0,&amp;#xA;      triggerElement: intro,&amp;#xA;      triggerHook: 0,   &amp;#xA;    })&amp;#xA;    .addTo(controller);&amp;#xA;&amp;#xA;    // Video Animation&amp;#xA;&amp;#xA;    let accelamount = 0.5;&amp;#xA;    let scrollpos = 0;&amp;#xA;    let delay = 0;&amp;#xA;&amp;#xA;    scene.on(&amp;#x27;update&amp;#x27;, e =&gt; {&amp;#xA;      scrollpos = e.scrollPos / 1000;&amp;#xA;    });&amp;#xA;&amp;#xA;    setInterval(() =&gt; {&amp;#xA;      delay &amp;#x2B;= (scrollpos - delay) * accelamount;&amp;#xA;      video.currentTime = delay;&amp;#xA;    }, 24);&amp;#xA;&lt;/script&gt;&#xA;

  


  I wonder if the video encoding is the issue or how Safari processes the video playback ? I've used the following encoding for the video :

  


  First :
ffmpeg -i ~/assets/mao-final.mp4 -vf scale=960:-2 -movflags faststart -vcodec libx264 -crf 20 -g 1 -pix_fmt yuv420p mao-final-960.mp4

  


  Then,
ffmpeg -i ~/assets/mao-final.mp4 -vf scale=960:-2 -movflags faststart -vcodec libx264 -crf 20 -g 1 -pix_fmt yuv420p maozinha.mp4

  


  I'm considering changing it to a canvas animation if I can't get to a solution. Please help !

  


• How to merge segmented webvtt subtitle files and output a single file ?

  15 février, par Dobbelina

  How to merge a segmented webvtt subtitle file and output a single file ?,
m3u8 looks like this example :

  



  #EXTM3U
#EXT-X-VERSION:4
#EXT-X-PLAYLIST-TYPE:VOD
#EXT-X-MEDIA-SEQUENCE:1
#EXT-X-INDEPENDENT-SEGMENTS
#EXT-X-TARGETDURATION:4
#USP-X-TIMESTAMP-MAP:MPEGTS=900000,LOCAL=1970-01-01T00:00:00Z
#EXTINF:4, no desc
0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-1.webvtt
#EXTINF:4, no desc
0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-2.webvtt
#EXTINF:4, no desc
0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-3.webvtt
#EXTINF:4, no desc
0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-4.webvtt
#EXTINF:4, no desc
0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-5.webvtt
#EXTINF:4, no desc
0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-6.webvtt
#EXT-X-ENDLIST


  



  I noticed that each segment is not synchronized/cued against total playing time, but against the individual ts segments.
If ffmpeg could be used to do this, what magic input do i need to give it ?

  



  A single correctly cued vtt or srt file is what i want.

  



  I have a great appetite and don't like chunks, lol !

  



  Thanks for any replies you lovely people !

  



  ---

  



  With this i get a merged vtt file, but the cues are all wrong :

  



  ffmpeg -i "https://cmoreseusphlsvod60.akamaized.net/vod/bea44/0ghzi1b2cz5(11792107_ISMUSP).ism/0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000.m3u8" -f segment -segment_time 4 -segment_format webvtt -scodec copy out-%05d.vtt


  



  Each segment is not synchronized/cued against total playing time, but against the individual ts segments.
Example output of above command :

  



  WEBVTT

00:00.000 --> 00:03.040
Du har aktier i ett företag
som saknar framtid.

00:00.000 --> 00:03.280
De vill ha aktierna.
Du känner dem inte, Olga.

00:00.000 --> 00:01.720
De som får Kastrups aktier vinner.


  



  Cues all start like this which isn't very helpfull : 00:00.000

  



  Some segments contains no cues, like segment 15 for example :
https://cmoreseusphlsvod60.akamaized.net/vod/bea44/0ghzi1b2cz5(11792107_ISMUSP).ism/0ghzi1b2cz5(11792107_ISMUSP)-textstream_swe=2000-15.webvtt

  



  


  "A WebVTT Segment MAY contain no cues ; this indicates that no
 subtitles are to be displayed during that period."

  


  


• FFmpeg cant recognize 3 channels with each 32 bit

  4 avril 2022, par Chryfi

  I am writing the linearized depth buffer of a game to openEXR using FFmpeg. Unfortunately, FFmpeg does not adhere to the openEXR file specification fully (like allowing unsigned integer for one channel) so I am writing one float channel to openEXR, which is put into the green channel with this command -f rawvideo -pix_fmt grayf32be -s %WIDTH%x%HEIGHT% -r %FPS% -i - -vf %DEFVF% -preset ultrafast -tune zerolatency -qp 6 -compression zip1 -pix_fmt gbrpf32le %NAME%_depth_%d.exr.

  


  The float range is from 0F to 1F and it is linear. I can confirm that the calculation and linearization is correct by testing 16 bit integer (per pixel component) PNG in Blender compositor. The 16 bit integer data is written like this short s = (short) (linearzieDepth(depth) * (Math.pow(2,16) - 1)) whereas for float the linearized value is directly written to OpenEXR without multiplying with a value.

  


  However, when viewing the openEXR file it doesn't have the same "gradient" as the 16 bit png... when viewing them side by side, it appears as if the values near 0 are not linear, and they are not as dark as they should be like in the 16 bit png.
(And yes, I set the image node to linear), and comparing it with 3d tracking data from the game I cant reproduce the depth and cant mask things using the depth buffer where as with the png I can.

  


  How is it possible for a linear float range to turn out so different to a linear integer range in an image ?

  


  UPDATE :

  


  I now write 3 channels to the ffmpeg with this code

  


  float f2 = this.linearizeDepth(depth);

buffer.putFloat(f2);
buffer.putFloat(0);
buffer.putFloat(0);


  


  the byte buffer is of the size width * height * 3 * 4 -> 3 channels with each 4 bytes. The command is now -f rawvideo -pix_fmt gbrpf32be -s %WIDTH%x%HEIGHT% -r %FPS% -i - -vf %DEFVF% -preset ultrafast -tune zerolatency -qp 6 -compression zip1 -pix_fmt gbrpf32le %NAME%_depth_%d.exr which should mean that the input (byte buffer) is expecting 32 bit floats with 3 channels.

  


  FFmpeg is somehow splitting up channels or whatever... could be a bug, could be my fault ?