Andrew-Chen-Wang/RichEditorView

Videos

Closed this issue · 2 comments

I'm thinking about making video functionality available as well using video.js.

Here are some potential concerns:

  1. Asynchronosity. Actually, this might just be my issue since I don't know much about JS, but while using video.js's main website's demo, I saw how they have the buffer and the async functionality. We need to somehow implement that to avoid 1GB base64 encoded videos being synchronously loaded from a server
  2. Sending the video to a server. I imagine that RichEditorView is meant for apps that also have backends, so I strongly encourage us to figure out how to implement base64 encoded media, store it in something like an array, and allow for its upload to a server by offering another functionality.
    • And then in that case, when the server receives the HTML, it will also need to receive the additional base64 encoded data (that is the media e.g. images and videos) for processing such as uploading to S3 and having a file size limit.
    • A potential method is adding a swift function and a JS array for interaction.
    • Another potential method is to store the base64 encoded data inside their respective video or img tags, and then the server has to deal with grabbing the base64 encoded data. (Btw, encoding the data on the frontend is not enough. Always base64 encode the data on the backend as well)
  3. Sending an HTML tag with the video player from video.js will mean we also have to strip the tags... but that should be relatively easy

Another issue that is arising (but have not tested yet) is a memory issue. Loading a 1GB video (approximately 10 minutes with normal 1080p resolution I think) in memory is going to crash the app. It is better if it is sent to a server first (some bucket that can serve media files).

So an alternative for a video will be the following:

  • Instead of loading the video while a user is editing, save a selected link that matches an ID.
  • This methodology will become abnormally long, so I may have to split server-based RTE with Offline-based RTE.
    • RECOMMENDED: An offline-based RTE can use FileManager. OR
    • This offline-based RTE can still load the base64 into the text editor because the user could possibly delete the video within the photos app.
  • With server-based RTE, the methodology is the same as before: insert an id attribute inside the video (or image since this functionality will go hand in hand) tag.
    • Save the base64 inside FileManager temporarily. This avoids the user accidentally thinking that the media has been saved.

Added in #4