Flex 4.6 and FlashlsOSFM.swc

[rafa8626]

I'm trying to compile a custom OSFM player using Flex 4.6 but so far I haven't been successful. I have created my own class but so far is not doing anything. Can you assist me on this, please?

This is the line I'm using to compile it:

$flex_path/bin/mxmlc -define+=CONFIG::LOGGING,false -strict=false -compiler.debug=true -warnings=true ./src/flash/flash-video-hls/HlsMediaElement.as -o build/mediaelement-flash-video-hls.swf -library-path+=$flex_path/lib $libraries -use-network=true -target-player $target_version -source-path ./src/flash/flash-video-hls -headless-server -static-link-runtime-shared-libraries -include-libraries+=./src/flash/flash-video-hls/flashlsOSMF.swc

It doesn't come up with any errors but when I try to execute the new SWF nothing happens

[mangui]

Hi @Ron666
have you tried running your swf with flash debug ? you might have a runtime exception at the beginning of the execution

[rafa8626]

How do I set it up to use the Flash debug? I'm still learning things on the Flash/AS3 world

[mangui]

you need to dl it from https://www.adobe.com/support/flashplayer/debug_downloads.html and follows instructions.
FP debug is really useful to track runtime exceptions

[rafa8626]

Thanks I'll give it a try and let you know

[rafa8626]

OK I installed it but this is what I get...

Here's the code I used to test it (using the same Flex line above):

package {

    import flash.display.*;
    import flash.events.*;
    import flash.media.*;
    import flash.net.*;
    import flash.system.*;
    import flash.external.*;
    import flash.utils.getDefinitionByName;

    import org.osmf.containers.MediaContainer;
    import org.osmf.elements.VideoElement;

    import org.osmf.media.DefaultMediaFactory;
    import org.osmf.media.MediaElement;
    import org.osmf.media.MediaPlayer;
    import org.osmf.media.PluginInfoResource;
    import org.osmf.media.MediaPlayerState;

    import org.osmf.events.TimeEvent;
    import org.osmf.events.MediaPlayerStateChangeEvent;
    import org.osmf.events.MediaErrorEvent;
    import org.osmf.events.MediaFactoryEvent;
    import org.osmf.events.LoadEvent;

    import org.osmf.net.StreamingURLResource;

    import org.osmf.traits.MediaTraitBase;

    import org.mangui.hls.HLS;
    import org.mangui.hls.HLSSettings;
    import org.mangui.hls.event.HLSEvent;
    import org.mangui.hls.constant.HLSPlayStates;
    import org.mangui.hls.utils.Log;
    import org.mangui.osmf.plugins.HLSPlugin;
    import org.mangui.osmf.traits.HLSNetStreamLoadTrait;

    public class HlsMediaElement extends Sprite {

        // Video components
        private var _url: String = "";
        private var _volume: Number = 1;
        private var _position: Number = 0;
        private var _duration: Number = 0;
        private var _bufferedTime: Number = 0;

        // Video status
        private var _isPaused: Boolean = true;
        private var _isLoaded: Boolean = false;
        private var _isEnded: Boolean = false;
        private var _isMuted: Boolean = false;
        private var _isConnected: Boolean = false;
        private var _isManifestLoaded:Boolean = false;

        // Shim
        private var _id: String;
        private var _stageWidth: Number;
        private var _stageHeight: Number;

        // OSMF
        private var _contentMediaElement: MediaElement;
        private var _mediaPlayer: MediaPlayer;
        private var _mediaContainer: MediaContainer;
        private var _mediaFactory: DefaultMediaFactory;
        private var _resource: StreamingURLResource;

        // HLS
        private var _hls:HLSPlugin;
        private var _hlsState:String = HLSPlayStates.IDLE;
        private var _playQueued:Boolean = false;

        /**
         * @constructor
         */
        public function HlsMediaElement() {

            Security.allowDomain(['*']);
            Security.allowInsecureDomain(['*']);

            var flashVars: Object = LoaderInfo(this.root.loaderInfo).parameters;

            _id = flashVars.uid;

            // stage setup
            stage.align = StageAlign.TOP_LEFT;
            stage.scaleMode = StageScaleMode.NO_SCALE;
            _stageWidth = stage.stageWidth;
            _stageHeight = stage.stageHeight;

            // Create a media container & add the MediaElement
            _mediaFactory = new DefaultMediaFactory();

            _mediaContainer = new MediaContainer();
            _mediaContainer.mouseEnabled = true;
            _mediaContainer.clipChildren = true;
            _mediaContainer.width = _stageWidth;
            _mediaContainer.height = _stageHeight;
            addChild(_mediaContainer);

            var PluginLoad:HLSPlugin;

            HLSSettings.logInfo = false;

            var pluginInfoClass:Class = getDefinitionByName( "org.mangui.osmf.plugins.HLSPlugin" ) as Class;
            var pluginResources:PluginInfoResource = new PluginInfoResource(new pluginInfoClass());

            _mediaFactory.addEventListener(MediaFactoryEvent.PLUGIN_LOAD, onLoadPluginEvent);

            _mediaPlayer = new MediaPlayer();
            _mediaPlayer.autoPlay = false;
        }

        //
        // Javascript bridged methods
        //
        private function onLoadPluginEvent(): void {

                _resource = new StreamingURLResource('http://www.streambox.fr/playlists/test_001/stream.m3u8');
                _contentMediaElement = _mediaFactory.createMediaElement(_resource);

                if (_contentMediaElement) {
                    _contentMediaElement.smoothing = true;
                    if (_mediaPlayer.media != null) {
                        _mediaContainer.removeMediaElement(_mediaPlayer.media);
                    }

                    _mediaContainer.addMediaElement(_contentMediaElement);

                    _isLoaded = true;
                    _isPaused = true;

                    _mediaPlayer.media = _contentMediaElement;
                    _mediaPlayer.load();
                }
            }
    }

}

[rafa8626]

Or is there a way to integrate the HLS class without using the plugin approach within a OSMF custom player?

[mangui]

Are you doing this in the scope of ME.js ? Osmf is bloated and complex... it adds 300 kB overhead to your swf. best is to avoid it whenever possible.

[rafa8626]

Thanks. I'll take that in consideration. I wanted to standardize the shims since we'll have M(PEG)-DASH shim and that is only coded for OSMF but I see your point.

[mangui]

welcome !
indeed dash.as relies on OSMF ...
but anyway ME.js also has other source handlers independent from OSMF.
https://github.com/johndyer/mediaelement/tree/3.x-dev/src/flash
using OSMF wrapper adds additional glue on top of flashls / NetStream API
I implemented flashls OSMF wrapper for interoperability purpose, but using a standard media engine interface should be enough for ME.js use case (set-get src/play/pause/set-get currentTime/set-get volume/get buffered/close ... + the usual events)