/*
 * Ext JS Library 2.0 Beta 1
 * Copyright(c) 2006-2007, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */
// reference local blank image
Ext.BLANK_IMAGE_URL = 'extjs/resources/images/default/s.gif';

if (typeof(albums)=='undefined') eval('var albums = [];');

function addAlbum(id, name, data, root_url) {
    albums[albums.length] = {'id':id, 'name':name, 'data':data, 'album':null, 'root_url':root_url};
}
//var photoAlbum_goRight, photoAlbum_goLeft;
/*if (typeof(photoalbum_id)!='undefined') 
    eval("var photoAlbum_id"+photoalbum_id+" = {};");
*/

function doAlbums() {
    for( i=0; i<albums.length; i++ ) {
        album = albums[i];
        if ( album['album']==null ) {
            album['album']= createAlbumPopUp(album['id'],album['data'],album['name'],album['root_url']);
        }
    }
    
}

function photoAlbum_goLeft(id) {
    for( i=0; i<albums.length; i++ ) {
        album = albums[i];
        if ( album['id']==id && album['album']!=null ) {
            album['album']._goLeft();
        }
    }
    
}

function photoAlbum_goRight(id) {
    for( i=0; i<albums.length; i++ ) {
        album = albums[i];
        if ( album['id']==id && album['album']!=null ) {
            album['album']._goRight();
        }
    }
    
}

function showAlbum(id) {
    for( i=0; i<albums.length; i++ ) {
        album = albums[i];
        if ( album['id']==id && album['album']!=null ) {
            album['album'].window.show();
            album['album'].applyData();
        }
    }
    
}

function createAlbumPopUp(id,data,title,root_url) {
//    Ext.QuickTips.init();
    var storePA;
    
    storePA = new Ext.data.SimpleStore ({
        data: data,
        fields: ['order', 'title', 'id', 'image_url', 'description','caption','source'],
        sortInfo: {field: 'order', direction: 'ASC'}
    });

    var panel = new Ext.Panel( {
        id:'photoalbum-popup'+id,
        cls:'mainPanel',
        hideBorders: true,
        html: "Loading content...",
        region: 'center',
        margins:'0 0 0 0' 
    });
    
    var winPA;

    winPA = new Ext.Window({
        title: title,
        closeAction: 'hide',
        closable:true,
        width:600,
        height:550,
        plain:true,
        layout: 'border',
        frame: false,

        items: panel
    });

    //winPA.show();
    
    var myAlbum = {

        root_url: root_url!=null?root_url:"",
        panel: panel,
        store: storePA,
        currentIndex:0,
        totalCount:storePA.getTotalCount(),
        lastIndex:storePA.getTotalCount()-1,
        window: winPA,
        
        applyData: function() {
            currentRecord = this.store.getAt(this.currentIndex);
            var photo_data = { 
                'title': currentRecord.get('title'),
                'image_url': this.root_url+'images/loading.gif',    //currentRecord.get('image_url')
                'description': currentRecord.get('caption'),
                'source': currentRecord.get('source'),
                'source_title': currentRecord.get('source').length > 0?'Source:':'',
                'index': (this.currentIndex+1),
                'total': this.totalCount,
                'arrow_left': this.currentIndex==0?'<img src="'+this.root_url+'images/albumArrowLD.png" />':'<a href="javascript:photoAlbum_goLeft('+id+')"><img src="'+this.root_url+'images/albumArrowL.png" /></a>',
                'arrow_right': this.currentIndex==this.lastIndex?'<img src="'+this.root_url+'images/albumArrowRD.png" />':'<a href="javascript:photoAlbum_goRight('+id+')"><img src="'+this.root_url+'images/albumArrowR.png" /></a>'
            }
            if ( this.panel.body ) {
                albumTemplate.overwrite(this.panel.body, photo_data);
                //after a new image is set, resize it to fit
                var imgExt = this.panel.body.select("div.photoAlbumImg img");
                if ( imgExt && imgExt.elements && imgExt.elements.length>0 )
                    this.preloadImage(currentRecord.get('image_url'), imgExt.elements[0]);
				else alert("could not load image "+currentRecord.get('image_url'));
            }
        },
        
        preloadImage: function(src,img) {
            var newImg = new Image();
            newImg.onerror = function() {
				alert("could not load image "+src);
            }
            newImg.onload = function() {
                //resize image
                var max_width = 560;
                var max_height = 290;
                var rw = this.width*1.0/max_width;
                var rh = this.height*1.0/max_height;
                var r = (rw>rh?rw:rh);
                if ( r >1 ) {//resize only if too big
                    img.width = parseInt(this.width/r);
                    img.height = parseInt(this.height/r);
                }
                img.src = this.src;
            };
            newImg.src = src;
        },

        
        _goLeft : function() {
            //alert('go left '+currentIndex);
            this.currentIndex --;
            if ( this.currentIndex < 0 )
                this.currentIndex = 0;
            this.applyData();
        },

        _goRight : function() {
            //alert('go right '+storePA.getTotalCount());

            this.currentIndex ++;
            if ( this.currentIndex > this.lastIndex )
                this.currentIndex = this.lastIndex;
            this.applyData();
        }
    }
/*
    if (typeof(photoalbum_id)!='undefined') {
        eval("photoAlbum_id"+photoalbum_id+".photoAlbum_goLeft=photoAlbum_goLeft");
        eval("photoAlbum_id"+photoalbum_id+".photoAlbum_goRight=photoAlbum_goRight");
    }
*/
    return myAlbum;
}
    
Ext.onReady(function() {
    doAlbums();
});

