var ImgPlayer = function () {
    this.PlayDelay = 1000; //1s;
    var playTimerHandler = null;
    var isStopped = false;
    var elemImg = null, dataItems = [], updateInfoCallback = null;
    var item = null, w, h;
    var lastActivities = new Date();

    var looplyPlay = function (player) {
        if (isStopped)
            return;

        if (playTimerHandler != null)
            clearTimeout(playTimerHandler);

        if (player.item != null) { 
            delete player.item;
        }

        player.item = dataItems.shift();
        //console.log("data-length=" + dataItems.length);
        if (player.item != null &&
            player.item != undefined &&
            player.item.fileType == 0) {
            var img = new Object(); new Image();

            if (player.item.fileContent.substring(0, 5) == "data:") {
                $(elemImg).attr("src", player.item.fileContent);
            } else {
                $(elemImg).attr("src", "data:image/jpg;base64," + player.item.fileContent);
            }
            delete player.item.fileContent; 
            /*
            $(img).load(function () {
                player.w = img.width;
                player.h = img.height;
                $(elemImg).attr("src", $(img).attr("src"));
                if (updateInfoCallback != null) {
                    updateInfoCallback(player.item, $(elemImg).height(), $(elemImg).width(), 0); //playing...
                }
                //$(img).remove("load");
                delete img;
            });*/
            lastActivities = new Date();
        } else {
            //do not waiting message too fast, for example; at 30 fps, 
            //but downloading speed cannot reach this speed, in this case do not show error message.
            if ((new Date()).getTime() - lastActivities.getTime() > 3 * 1000) {
                updateInfoCallback(null, 0, 0, 1); // waiting.
            }
        }
        if (player.PlayDelay < 0)
            player.PlayDelay = 1000;
        else if (player.PlayDelay > 1000 * 10) {
            player.PlayDelay = 10 * 1000;
        }

        playTimerHandler = setTimeout(function () { looplyPlay(player) }, player.PlayDelay);
    };

    /*
    Initialize the canvas elements and data source.
    */
    this.Init = function (_elemParent, playSpeed, _updateInfoCallback) {
        this.PlayDelay = playSpeed;
        $(_elemParent).empty();
        elemImg = $("<img  id='cameraImg' class='player imgplayer' src='/resellerwebsite/images/camera/CameraLoading.gif' style='vertical-align: middle;visibility:visible' visibility='visible'/>");
        $(_elemParent).append(elemImg);
        updateInfoCallback = _updateInfoCallback;

        $(".imgplayer").on("load", function () {
            var img = $(this)[0];
            player.w = img.naturalWidth;
            player.h = img.naturalHeight;
            if (updateInfoCallback != null) {
                updateInfoCallback(player.item, player.h, player.w, 0); //playing...
            }  
        }); 

    };

    /*
    Start to play.
    */
    this.Play = function (_dataItems) {
        dataItems = _dataItems;
        isStopped = false;
        looplyPlay(this);
    };

    this.Seek = function (index) {
         
    };

    /*
    Stop to play the images.
    */
    this.Stop = function () {
        if (playTimerHandler != null)
            clearTimeout(playTimerHandler);
        isStopped = true;
    };

    /*
    Request full screen
    */
    this.FullScreen = function () {
        //player.requestFullscreen();
        return false;
    }

    /*
    Exit full screen.
    */
    this.ExitFullScreen = function () {
        //player.exitFullscreen();
        return false;
    }

    /*
    Reset playing context.
    */
    this.Reset = function () {
        //do nothing.
    }

    this.Getdimension = function () {
        if (player != null) {
            if (this.w > 0 && this.h > 0) {
                return new Array(this.w, this.h);
            } else {
                return new Array($(elemImg).width(), $(elemImg).height());
            }
        }
        else {
            return new Array(0, 0);
        }
    }

    this.Zoom = function () {

    };

    this.Mute = function () {

    };

    return this;
}