/**
 * Renders a given map
 *
 *  Copyright (C) 2012  Mike Gerwitz
 *
 *  This program is free software: you can redistribute it and/or modify
 *  it under the terms of the GNU Affero General Public License as published by
 *  the Free Software Foundation, either version 3 of the License, or
 *  (at your option) any later version.
 *
 *  This program is distributed in the hope that it will be useful,
 *  but WITHOUT ANY WARRANTY; without even the implied warranty of
 *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *  GNU Affero General Public License for more details.
 *
 *  You should have received a copy of the GNU Affero General Public License
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */


/**
 * Renders a map to a canvas
 */
ltjs.MapRender = Class( 'MapRender',
{
    /**
     * Property to hold lock bit on canvas element
     * @type {string}
     */
    'private const _LOCK': '__$$MapRenderLock$$',

    /**
     * Animation interval in milliseconds
     * @type {number}
     */
    'private const _ANIM_INTERVAL': 200,


    /**
     * 2d context to which map should be drawn
     * @type {CanvasRenderingContext2d}
     */
    'private _ctx': null,

    /**
     * 2d context to which masked game objects should be drawn
     * @type {CanvasRenderingContext2d}
     */
    'private _ctxObj': null,

    /**
     * Tile set to be rendered
     * @type {Object}
     */
    'private _tiles': {},

    /**
     * Animation timer
     * @type {number}
     */
    'private _animTimer': 0,


    /**
     * Initialize renderer with a canvas context and a tile set
     *
     * An additional canvas of equal dimensions will be created and laid atop of
     * the provided canvas to render masked game objects.
     *
     * @param  {CanvasRenderingContext2d}  ctx    canvas 2d context
     * @param  {Object}                    tiles  tile set to render
     */
    __construct: function( ctx, tiles )
    {
        this._ctx   = ctx;
        this._tiles = tiles;

        // ensure that we are exclusively rendering to this canvas (no other
        // MapRenders)
        this._lockCanvas();

        this._ctxObj = this._getObjCanvas();
    },


    /**
     * Lock the canvas to prevent other MapRender instances from rendering to it
     *
     * The purpose of this is to provide feedback to the user/developer in the
     * event that multiple MapRender instances are attempting to render to the
     * same canvas, which would certainly cause display issues and confusion.
     *
     * @return  {undefined}
     */
    'private _lockCanvas': function()
    {
        var o = this._ctx,
            l = this.__self.$( '_LOCK' );

        // simple one-line check to both set the lock and fail if the lock is
        // already set (implying that something else is already rendering to the
        // canvas)
        if ( ( o[ l ] ^= 1 ) !== 1 )
        {
            // reset the lock
            o[ l ] = 1;

            throw Error(
                'Could not set exclusive lock on canvas (in use by another ' +
                'MapRender instance)'
            );
        }
    },


    /**
     * Remove exclusive lock on canvas to permit other MapRender instances to
     * render to it
     *
     * This will also destroy the overlay canvas that the masked objects were
     * rendered to. The remaining canvas will not be cleared.
     *
     * @return  {MapRender}  self
     */
    'public freeCanvas': function()
    {
        var c = this._ctxObj.canvas;

        // clear any running animations
        this._clearAnimation();

        // destroy the overlay canvas
        c.parentNode.removeChild( c );

        // free the lock
        this._ctx[ this.__self.$( '_LOCK' ) ] = 0;
        return this;
    },


    /**
     * Create the overlaying canvas for masked elements and return a 2d context
     *
     * @return  {CanvasRenderingContext2d}  2d context for new canvas element
     */
    'private _getObjCanvas': function()
    {
        var canvas     = this._ctx.canvas,
            canvas_obj = document.createElement( 'canvas' );

        // mimic the dimensions and positions of the original canvas
        canvas_obj.style.position = 'absolute';
        canvas_obj.width          = canvas.width;
        canvas_obj.height         = canvas.height;
        canvas_obj.style.left     = ( canvas.offsetLeft + 'px' );
        canvas_obj.style.top      = ( canvas.offsetTop + 'px' );

        // append the new canvas to the DOM under the same parent
        canvas.parentNode.appendChild( canvas_obj );

        return canvas_obj.getContext( '2d' );
    },


    /**
     * Render the provided map
     *
     * @param  {Map}  map  map to render
     *
     * @return  {MapRender}  self
     */
    'public render': function( map )
    {
        if ( !( Class.isA( ltjs.Map, map ) ) )
        {
            throw TypeError( 'Invalid Map provided' );
        }

        var objs  = map.getObjects(),
            size  = map.getDimensions(),
            omap  = map.getObjectTileMap(),
            sizex = size[ 0 ],
            sizey = size[ 1 ],
            i     = objs.length,

            // tiles to animate
            anim = [],

            // get the width and height from one of the tiles
            t = this._tiles.dirt.data,
            w = t.width,
            h = t.height;

        // render each object (remember, we're dealing with columns, not rows;
        // see Map.getObjects())
        while ( i-- )
        {
            var oid  = objs[ i ],
                tid  = omap[ oid ],
                tile = ( this._tiles[ tid ] || {} ).first,

                x = ( Math.floor( i / sizex ) * w ),
                y = ( ( i % sizey ) * h );

            // tunnels are handled a bit differently than other objects
            if ( map.isObjectTunnel( oid ) )
            {
                this._renderTunnel( x, y, map.getTunnelColor( oid ) );
                continue;
            }

            // queue for animation if it contains more than a single frame
            if ( this._canAnimate( tid ) )
            {
                anim.push( [ tile, x, y ] );
            }

            this._drawTile( tile, x, y );
        }

        this._beginAnimation( anim );

        return this;
    },


    'private _canAnimate': function( tid )
    {
        var tdata = this._tiles[ tid ];
        return ( tdata.next !== tdata );
    },


    /**
     * Draw the tile identified by the given id
     *
     * The tile will be drawn to the appropriate canvas depending on whether or
     * not it has been masked. If it does have a mask, it will be drawn to the
     * overlaying canvas and the dirt tile will be drawn underneath it.
     *
     * @param  {string}  tid  tile id
     * @param  {number}  x    left position
     * @param  {number}  y    top position
     *
     * @return  {undefined}
     */
    'private _drawTile': function( tile, x, y )
    {
        var ctx  = ( tile.masked ) ? this._ctxObj : this._ctx;

        ctx.putImageData( tile.data, x, y );

        if ( tile.masked )
        {
            this._ctx.putImageData( this._tiles.dirt.data, x, y );
        }
    },


    /**
     * Render the given tunnel
     *
     * The tunnel background color (which will peek through the mask) is
     * rendered to the base canvas, whereas the tunnel tile itself is rendered
     * on the overlaying canvas.
     *
     * @param  {number}  x      left position
     * @param  {number}  y      top position
     * @param  {string}  color  tunnel color (CSS value)
     *
     * @return  {undefined}
     */
    'private _renderTunnel': function( x, y, color )
    {
        var tdata = this._tiles.tunnel.data;

        // fill tile with the appropriate background color for this tile
        this._ctx.fillStyle = color;
        this._ctx.fillRect( x, y, tdata.width, tdata.height );

        // render the tile to the overlay canvas
        this._ctxObj.putImageData( tdata, x, y );
    },


    /**
     * Begin basic tile animation
     *
     * At each animation interval, each tile will be advanced a single frame and
     * rendered atop of the previous.
     *
     * @param  {Array.<Array.<Object,number,number>>}  anim  array of tiles to
     *                                                       animate; tdata,x,y
     *
     * @return  {number}  animation timer id
     */
    'private _beginAnimation': function( anim )
    {
        var _self = this;

        // clear any existing rendering animations
        this._clearAnimation();

        return this._animTimer = setInterval( function()
        {
            var i = anim.length;

            while ( i-- )
            {
                var cur = anim[ i ];

                // draw next frame
                cur[ 0 ] = cur[ 0 ].next;
                _self._drawTile.apply( _self, anim[ i ] );
            }
        }, this.__self.$( '_ANIM_INTERVAL' ) );
    },


    /**
     * Clear any running animation timers
     *
     * It is important that this be done when a MapRender instance is done being
     * used, or it will remain in memory indefinitely!
     *
     * @return  {undefined}
     */
    'private _clearAnimation': function()
    {
        this._animTimer = +clearInterval( this._animTimer );
    }
} );