Skip to content

Instantly share code, notes, and snippets.

@GregoryArmstrong
Last active October 3, 2017 19:49
Show Gist options
  • Save GregoryArmstrong/652302635e6bf7da0d0a0bda13bfd228 to your computer and use it in GitHub Desktop.
Save GregoryArmstrong/652302635e6bf7da0d0a0bda13bfd228 to your computer and use it in GitHub Desktop.
MeMa-PHP / Flowplayer

MediaManager (MeMa, Granicus Video) / Flowplayer Video Switch

  • MeMa: ~40% of Granicus revenue, $12 million recurring annually
  • Originally Granicus used Windows Media Player (.wmv) through Internet Explorer
  • Silverlight compatibility added after WMP
  • H.264 format added (video compression codec), along with Performance Accelerator for encoders. H.264 works for most mobile platforms, has high quality
  • ModernVideoPlayer (MVP) added, custom flash player built by Granicus
  • JWPlayer introduced, MVP converted into Granicus Video Player (GVP). Eventually issues arose with JWPlayer's support team, as well as 'Pro' features not usable in Granicus' forked code

Switch needed due to:

  • CDN cancellation (4-6 Weeks Notice)
  • Flash player deprecation (Issues w/ mobile platforms, security problems, etc)
  • HTML5 compatible player needed
  • JWPlayer wanted a lot of $ to continue

Notable pain points & corresponding solutions:

  1. Inline Captioning / Below Video Captioning / Fullscreen Captioning

    • Built-in Flowplayer functions for entering/exiting fullscreen
    • Custom JS event triggers & caption displays tied to custom buttons for CC/FF/RW, showing/hiding the proper elements
  2. Desynchronization of live streaming video & corresponding captioning

    • PubNub used to stream captions data.
    • PubNub request for captions is received and delivered immediately, however our video file data is slightly delayed due to time required to encode/stream. PubNub must be slowed down to match video timestamps, because video cannot be sped up.
  3. Archived videos utilize .NET side of MeMa

    • Archived videos do not have the same issue with captions that streaming live video does. Player must handle both situations to produce a similar experience.

    • Archive captions use:

      VTT, Video Text Tracks - Handled via HTML Element

  4. Regression Testing

    • Edge / IE / Chrome / FireFox / Safari
    • Desktop / Tablet / Mobile
    • Live / Archive / Captions
    • Regular viewing / fullscreen viewing / embedded viewing / query parameters
    • Document & Agenda Viewer / Index Points

Next Steps:

  • Remove old/unused MVP & GVP Code
  • Client custom solution support
  • Mobile/responsive redesign
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment