[300] Webservices in flash

[rolandhii]

Due to the webservices HTML page in 200-series players is no longer shown in 300-series, I decided to write this little flash app to show the contents of webservices in flash UI.

Since I am a beginner in flash programming, I have decided to open the source code here so that other people can help in improving this little app.

This is written using FlashDevelop following Steve's nice example here: [FLASH] Development

PHP Code:

/**
 * ...
 * @author Roland Hii
 */
class Main {
    static var webServices:Array = new Array();
    static var highlightMC:MovieClip = null;
    static var selectedColumn:Number = 0;
    static var selectedIndex:Number = 0;
    static var selectedRow:Number = 0;
    static var infoTF:TextField = null;

    static var parentMC:MovieClip = null;
    static var firstCellX:Number = 0;
    static var firstCellY:Number = 0;
    static var center24Format:TextFormat = null;
    static var left14Format:TextFormat = null;

    // Constants.
    static var CELL_HEIGHT:Number = 98;
    static var CELL_WIDTH:Number = 132;
    static var HIGHLIGHT_OFFSET_X:Number = -14;
    static var HIGHLIGHT_OFFSET_Y:Number = -34;
    static var NUM_OF_COLS:Number = 8;
    static var NUM_OF_ROWS:Number = 4;
    static var SCREEN_HEIGHT_SAFE:Number = 656;
    static var SCREEN_WIDTH_SAFE:Number = 1100;

    public static function main(swfRoot:MovieClip):Void {
        // Entry point.
        parentMC = swfRoot;

        // Make sure the stage is set to 1280x720.
        firstCellX = (Stage.width - SCREEN_WIDTH_SAFE) / 2;
        firstCellY = (Stage.height - SCREEN_HEIGHT_SAFE) / 2;

        center24Format = new TextFormat();
        center24Format.align = "center";
        center24Format.size = 24;

        left14Format = new TextFormat();
        left14Format.align = "left";
        left14Format.size = 14;

        // Register listeners.
        var keyListener:Object = new Object();
        keyListener.onKeyDown = klOnKeyDownCB;
        Key.addListener(keyListener);

        // Load the page to retrieve the list of webservices installed.
        var lv:LoadVars = new LoadVars();
        lv.onData = lvOnDataCB;
        lv.load("http://127.0.0.1:8883/webservices.cgi");
    }

    private static function klOnKeyDownCB():Void {
        switch (Key.getCode()) {
            case Key.ENTER:
                if (webServices[selectedIndex].link != null) {
                    var lv:LoadVars = new LoadVars();
                    lv.onData = lvOnDataKeyEnterCB;
                    lv.load(webServices[selectedIndex].link);
                    infoTF.text = "Loading '" + webServices[selectedIndex].link + "'...\n";
                }
                break;
            case Key.UP:
                if (selectedRow > 0) {
                    selectedRow--;
                    selectedIndex -= NUM_OF_COLS;
                    highlightMC._y = firstCellY + HIGHLIGHT_OFFSET_Y + (selectedRow * CELL_HEIGHT);
                    showSelectedTitle(selectedIndex);
                }
                break;
            case Key.DOWN:
                if (selectedRow < (NUM_OF_ROWS - 1)) {
                    selectedRow++;
                    selectedIndex += NUM_OF_COLS;
                    highlightMC._y = firstCellY + HIGHLIGHT_OFFSET_Y + (selectedRow * CELL_HEIGHT);
                    showSelectedTitle(selectedIndex);
                }
                break;
            case Key.LEFT:
                if (selectedColumn > 0) {
                    selectedColumn--;
                    selectedIndex--;
                    highlightMC._x = firstCellX + HIGHLIGHT_OFFSET_X + (selectedColumn * CELL_WIDTH);
                    showSelectedTitle(selectedIndex);
                }
                break;
            case Key.RIGHT:
                if (selectedColumn < (NUM_OF_COLS - 1)) {
                    selectedColumn++;
                    selectedIndex++;
                    highlightMC._x = firstCellX + HIGHLIGHT_OFFSET_X + (selectedColumn * CELL_WIDTH);
                    showSelectedTitle(selectedIndex);
                }
                break;
        }
    }

    private static function lvOnDataCB(src:String):Void {
        if (src == undefined) {
            trace("Error loading content.");
            return;
        }

        // Draw background.
        var bg:MovieClip = parentMC.createEmptyMovieClip("bg", parentMC.getNextHighestDepth());
        bg._x = 0;
        bg._y = 0;
        bg.loadMovie(src.split('<body file background="')[1].split('"')[0]);

        // Find all webservices installed.
        var hrefList:Array = src.split('<a href="');
        var length:Number = hrefList.length;
        // First item is the part before delimiter, ignore it.
        for (var i = 1; i < length; i++) {
            var href:String = hrefList[i].split('"')[0];
            if (href != "file:///opt/sybhttpd/default/webservices_edit.html") {
                if ((href == "#") ||
                    (href == "file:///opt/syb/local/appcenter/index.phf") ||
                    (href == "http://127.0.0.1:8883/torrent/bt.cgi") ||
                    (href.indexOf("http://www.mspportal.com/") >= 0)) {
                    href = null;
                }

                webServices.push({
                    link:href,
                    title:hrefList[i].split('fip="')[1].split('"')[0],
                    thumbnail:hrefList[i].split('<img src="')[1].split('"')[0]
                });
            }
        }

        // Draw table.
        var c:Number = 0;
        var r:Number = 0;
        length = webServices.length;
        for (var i = 0; i < length; i++) {
            var thumbnail:MovieClip = parentMC.createEmptyMovieClip("thumbnail" + i, parentMC.getNextHighestDepth());
            thumbnail._x = firstCellX + (c * CELL_WIDTH);
            thumbnail._y = firstCellY + (r * CELL_HEIGHT);
            thumbnail.loadMovie(webServices[i].thumbnail);

            if (++c >= NUM_OF_COLS) {
                c = 0;
                ++r;
            }
        }

        // Get the highlight thumbnail (in the last IMG tag).
        var lastIndex:Number = src.lastIndexOf('<img src="') + '<img src="'.length;
        highlightMC = parentMC.createEmptyMovieClip("highlight", parentMC.getNextHighestDepth());
        highlightMC.loadMovie(src.substring(lastIndex, src.indexOf('"', lastIndex)));

        // Set default highlight to the first item.
        highlightMC._x = firstCellX + HIGHLIGHT_OFFSET_X;
        highlightMC._y = firstCellY + HIGHLIGHT_OFFSET_Y;
        selectedColumn = 0;
        selectedRow = 0;
        selectedIndex = 0;

        // Create text field to show some info.
        infoTF = parentMC.createTextField("infoTF", parentMC.getNextHighestDepth(), firstCellX, firstCellY + (NUM_OF_ROWS * CELL_HEIGHT),
                                          SCREEN_WIDTH_SAFE, SCREEN_HEIGHT_SAFE - (firstCellY + (NUM_OF_ROWS * CELL_HEIGHT)));
        infoTF.autoSize = "left";
        infoTF.background = false;
        infoTF.backgroundColor = 0;
        infoTF.html = true;
        infoTF.multiline = true;
        infoTF.textColor = 0xFFFFFF;
        infoTF.wordWrap = true;
        infoTF.setNewTextFormat(center24Format);

        showSelectedTitle(selectedIndex);
    }

    private static function lvOnDataKeyEnterCB(src:String):Void {
        infoTF.background = true;
        infoTF.setNewTextFormat(left14Format);
        if (src == undefined) {
            infoTF.text += "Error loading content.\n";
        } else {
            // Print the output without HTML tags.
            infoTF.htmlText = src;
        }
        infoTF.setNewTextFormat(center24Format);
    }

    private static function showSelectedTitle(index:Number):Void {
        infoTF.background = false;
        infoTF.textColor = (webServices[index].link == null) ? 0x444444 : 0xFFFFFF;
        infoTF.text = (index + 1) + "/" + webServices.length + ": " + webServices[index].title;
    }
} 


Hope this is useful. Any feedbacks are welcome!

Edit: Added screenshots and attached the compiled binary.

[accident]

good starter project.

Something I wanted to do but ended up heading a different direction for my stuff was to take a couple still maintained existing libraries for flashlite to extend text clips. They add javascript and tables to existing flash html support. Shouldn't be too hard to further extend them for tvid and playback support and should do more than gaya does today. not really going to offer a full on browser but should fully support all the gaya interfaces out now and add in XHR support.

[rolandhii]

Added screenshots and attached the compiled binary.