var index_id = 0;

function view_image( direction ) {
    
    if( !img_array[(index_id + direction)] ) { return false; }
    
    index_id = (index_id + direction);
    
    // get current information about image
    var cur_width  = $( '#image_file' ).width();
    var cur_height = $( '#image_file' ).height();
    
    // update the image
    $( '#image_panel_left' ).css( 'display', 'none' );
    $( '#image_panel_right' ).css( 'display', 'none' );
    $( '#image_file' ).css( 'display', 'none' ); // hide it while we resize
    $( '#image_file' ).attr( 'src', img_array[index_id]['src'] );
    
    var __width = img_array[index_id]['width'];
    var __height = img_array[index_id]['height'];
    
    // split size
    var __split_width = ( __width / 2 ) - 2;
    var __split_height = ( __height ) - 70;
    
    // update clickable area
    $( '#image_panel_left' ).css( {
        'width': __split_width + 'px',
        'height': __height + 'px',
        'cursor': 'pointer'
    } );
    
    $( '#image_nav_left' ).css( {
        'width': __split_width + 'px',
        'height': __split_height + 'px'
    } );
    
    $( '#image_panel_right' ).css( {
        'width': __split_width + 'px',
        'height': __height + 'px',
        'cursor': 'pointer'
    } );
    
    $( '#image_nav_right' ).css( {
        'width': __split_width + 'px',
        'height': __split_height + 'px'
    } );

    // assign image size
    $( '#image_file' ).attr( 'width', img_array[index_id]['width'] );
    $( '#image_file' ).attr( 'height', img_array[index_id]['height'] );

    // set the holder's height
    $( '#file_holder' ).attr( 'height', ( cur_height ) + 'px' );
    $( '#file_holder' ).attr( 'width', ( cur_width ) + 'px' );
    
    // id counter
    $( '#image_id_text' ).text( ( index_id + 1 ) );
    
    var x_dir = '+';
    var y_dir = '+';
    
    var adj_x = ( ( cur_width - img_array[index_id]['width'] ) / 2 );
    if( adj_x < 0 ) {
        x_dir = '-';
        adj_x = Math.abs( adj_x );
    }
    
    var adj_y = ( ( cur_height - img_array[index_id]['height'] ) / 2 );
    if( adj_y < 0 ) {
        y_dir = '-';
        adj_y = Math.abs( adj_y );
    }
    
    if( adj_x == 0 && adj_y == 0 ) {
        $( '#image_file' ).css( 'display', 'block' );
        $( '#image_panel_left' ).css( 'display', 'block' );
        $( '#image_panel_right' ).css( 'display', 'block' );
    }
    else {
        $( '#file_holder' ).animate(
            { 
                width: ( Math.abs( img_array[index_id]['width'] ) ) + 'px',
                height: ( Math.abs( img_array[index_id]['height'] ) + 10 ) + 'px'
            },
            {
                duration: 800
            }
        );
        
        $( '#simplemodal-container' ).animate(
            {
                left: x_dir + '=' + adj_x + 'px',
                top: y_dir + '=' + adj_y + 'px'
            },
            {
                duration: 800,
                complete: function() {
                    $( '#image_file' ).css( 'display', 'block' );
                    $( '#image_panel_left' ).css( 'display', 'block' );
                    $( '#image_panel_right' ).css( 'display', 'block' );
                }
            }
        );
    }
        
    if( !img_array[(index_id+1)] ) {
        $( '#image_next' ).attr( 'src', HTML_ROOT + '/images/temp/transparent.gif' );
        $( '#text_next' ).addClass( 'gray' ).unbind();
        $( '#image_panel_right' ).unbind().css( 'cursor', 'auto' );
    }
    else {
        $( '#image_next' ).attr( 'src', HTML_ROOT + '/images/temp/viewer_next.gif' );
        $( '#text_next' ).removeClass( 'gray' ).unbind().bind( 'click', function(e) { return view_image( +1 ); } );
        $( '#image_panel_right' ).unbind().bind( 'click', function(e) { return view_image( +1 ); } );
    }
    
    if( !img_array[(index_id-1)] ) {
        $( '#image_prev' ).attr( 'src', HTML_ROOT + '/images/temp/transparent.gif' );
        $( '#text_prev' ).addClass( 'gray' ).unbind();
        $( '#image_panel_left' ).unbind().css( 'cursor', 'auto' );
    }
    else {
        $( '#image_prev' ).attr( 'src', HTML_ROOT + '/images/temp/viewer_prev.gif' );
        $( '#text_prev' ).removeClass( 'gray' ).unbind().bind( 'click', function(e) { return view_image( -1 ); } );
        $( '#image_panel_left' ).unbind().bind( 'click', function(e) { return view_image( -1 ); } );
    }

    return false;
}

function view_portfolio( direction ) {
    
    if( !img_array[(index_id + direction)] ) { return false; }
    
    index_id = (index_id + direction);
    
    $( '#imagepane' ).css( 'background', 'transparent url('+HTML_ROOT+'/images/temp/ajax-loader-gray-pmdl.gif) center no-repeat' );
    
    var img = new Image();
    
    // update the image
    $( img ).load( function() {
    	$( '#imagepane' ).css( 'background', 'transparent url('+img_array[index_id]['src']+') top left no-repeat' );
    } ).attr( 'src', img_array[index_id]['src'] );
    
    var __width = 900;
    var __height = 365;
    
    // split size
    var __split_width = ( __width / 2 ) - 2;
    var __split_height = ( __height ) - 70;
    
    // update clickable area
    $( '#image_panel_left' ).css( {
        'width': __split_width + 'px',
        'height': __height + 'px',
        'cursor': 'pointer'
    } );
    
    $( '#image_nav_left' ).css( {
        'width': __split_width + 'px',
        'height': __split_height + 'px'
    } );
    
    $( '#image_panel_right' ).css( {
        'width': __split_width + 'px',
        'height': __height + 'px',
        'cursor': 'pointer'
    } );
    
    $( '#image_nav_right' ).css( {
        'width': __split_width + 'px',
        'height': __split_height + 'px'
    } );
        
    if( !img_array[(index_id+1)] ) {
        $( '#image_next' ).attr( 'src', HTML_ROOT + '/images/temp/transparent.gif' );
        $( '#image_panel_right' ).unbind().css( 'cursor', 'auto' );
    }
    else {
        $( '#image_next' ).attr( 'src', HTML_ROOT + '/images/temp/viewer_next.gif' );
        $( '#image_panel_right' ).unbind().bind( 'click', function(e) { return view_portfolio( +1 ); } );
    }
    
    if( !img_array[(index_id-1)] ) {
        $( '#image_prev' ).attr( 'src', HTML_ROOT + '/images/temp/transparent.gif' );
        $( '#image_panel_left' ).unbind().css( 'cursor', 'auto' );
    }
    else {
        $( '#image_prev' ).attr( 'src', HTML_ROOT + '/images/temp/viewer_prev.gif' );
        $( '#image_panel_left' ).unbind().bind( 'click', function(e) { return view_portfolio( -1 ); } );
    }
    
    $( 'div.pdi' ).each( function() {
		$( this ).removeClass( 'portfolio_description_image_active' ).addClass( 'portfolio_description_image' );
	} );

    $( '#portfolio_imagelink_' + (index_id+1) ).removeClass( 'portfolio_description_image' ).addClass( 'portfolio_description_image_active' );

    return false;
}

function init_position( _maxwidth, _maxheight )
{
    $( '#main_logo' ).each( function() {
        
        var _height = $( this ).attr( 'sheight' );
        var _width = $( this ).attr( 'swidth' );
        
        // force image size based off getimagesize()
        $( this ).attr( 'height', _height );
        $( this ).attr( 'width', _width );
        $( this ).show();
        
        // center image
        var _bufferwidth = -( ( _width - _maxwidth ) / 2 );
        var _bufferheight = -( ( _height - _maxheight ) / 2 );
        $( this ).css( {
            'margin-top': _bufferheight,
            'margin-left': _bufferwidth
        } );
    } );
}

function init_overview_image( _maxwidth, _maxheight )
{
    $( '#overview_image img' ).each( function() {
        
        var _height = $( this ).attr( 'sheight' );
        var _width = $( this ).attr( 'swidth' );
        
        // force image size based off getimagesize()
        $( this ).attr( 'height', _height );
        $( this ).attr( 'width', _width );
        $( this ).show();
        
        // center image
        var _bufferwidth = -( ( _width - _maxwidth ) / 2 );
        var _bufferheight = -( ( _height - _maxheight ) / 2 );
        $( this ).css( {
            'margin-top': _bufferheight,
            'margin-left': _bufferwidth
        } );
    } );
}