Recherche avancée

Médias (91)

Autres articles (59)

  • Encoding and processing into web-friendly formats

    13 avril 2011, par

    MediaSPIP automatically converts uploaded files to internet-compatible formats.
    Video files are encoded in MP4, Ogv and WebM (supported by HTML5) and MP4 (supported by Flash).
    Audio files are encoded in MP3 and Ogg (supported by HTML5) and MP3 (supported by Flash).
    Where possible, text is analyzed in order to retrieve the data needed for search engine detection, and then exported as a series of image files.
    All uploaded files are stored online in their original format, so you can (...)

  • Les autorisations surchargées par les plugins

    27 avril 2010, par

    Mediaspip core
    autoriser_auteur_modifier() afin que les visiteurs soient capables de modifier leurs informations sur la page d’auteurs

  • Supporting all media types

    13 avril 2011, par

    Unlike most software and media-sharing platforms, MediaSPIP aims to manage as many different media types as possible. The following are just a few examples from an ever-expanding list of supported formats : images : png, gif, jpg, bmp and more audio : MP3, Ogg, Wav and more video : AVI, MP4, OGV, mpg, mov, wmv and more text, code and other data : OpenOffice, Microsoft Office (Word, PowerPoint, Excel), web (html, CSS), LaTeX, Google Earth and (...)

Sur d’autres sites (5698)

  • srtp : Mark a few variables as uninitialized

    15 janvier 2013, par Martin Storsjö

    srtp : Mark a few variables as uninitialized

  • lls : mark max_order as unsigned short

    25 février 2013, par Luca Barbato

    lls : mark max_order as unsigned short

  • How to record an HTML animation and save it as a video, in an automated manner in the backend

    14 mai 2022, par frizurd

    I need to record a webpage and save it as a video, in an automated manner, without human interaction.

    


    I am creating a NodeJS app that generates MP4 videos on the request of the user. The user provides an MP3 file, the app generates animated waveforms for the sound file on top of an illustration.

    


    What I came up with so far is a system that opens a generated web page in the backend, plays the audio file, and shows audio visualization for the audio file on an HTML canvas element. On top of another canvas with mainly static components, such as images, that do not animate. The system records this, the output will be a video file. Finally, I will merge the video file with the sound file to create the final file for the user.

    


    I came up with 2 possible solutions but both of them have problems which I am not able to solve at the moment.

    


    


    Solution #1

    


    Use a headless browser API such as Phantomjs or Puppeteer to snatch a screenshot x time every second and pipe it to FFmpeg.

    


    The problem

    


    The problem with this is that the process is not realtime. It would work fine if it's JUST an animation but mine is dependant on the audio file. The audio file will play-on during the render which results in a glitchy 1FPS-esque video.

    


    Possible solution ?

    


    Don't play the audio file live but convert the audio file into raw data. Animate the audio visualization based on the raw data instead.
Not sure how to do this and if it's even possible.

    


    


    Solution #2

    


    Play, record, and save the animation, all in the frontend.
Could use ccapture.js to record and save a canvas.
Use a headless browser to open the page and save it to disk when it's done playing.
Doesn't sound like it's the best solution.

    


    The problem(s)

    


    I have more than 1 canvas.
It takes a while, especially when the audio file is longer than 10 minutes.
Making users wait for a long time can be a deal-breaker.

    


    Possible solution ?

    


    Merge canvases into one.

    


    No idea how to speed up the rendering time and I doubt it's possible this way.

    


Navigation