
var HomeEffects = new Class({

    HOVERBOX_TYPES: ['report', 'student', 'search', 'subscriber', 'other', 'enquiries', 'miscellaneous'],

    arr_bullets: null,
    int_bullets_per_photo: null,

    // internal properties
    int_bullet_idx: 3,
    int_photo_idx: 0,
    int_bullet_count: 0,

    
    
    /**
     * Constructor
     *
     * Creates the necessary "flash" highlighting divs which fade in and out when a new
     * bullet is shown. Also sets up the periodical bullet/photo changing function.
     *
     * @param arr arr_bullets            Array of strings containing each bullet text
     * @param int int_bullets_delay      Time (in ms) between each bullet change
     * @param int int_bullets_per_photo  Number of bullets that change before the photo changes
     * @return void
     */
    initialize: function(arr_bullets, int_bullet_delay, int_bullets_per_photo) {
    
        // store bullets text and params
        this.arr_bullets = arr_bullets;
        this.int_bullets_per_photo = int_bullets_per_photo;

	    // create highlighting divs
	    var arr_bullets = $(document.body).getElements('.bullet_wrapper');
	    
	    for(var i = 0, ilen = arr_bullets.length; i < ilen; i++) {
	    
	        var obj_coords = arr_bullets[i].getCoordinates($(document.body).getElement('.container'));
	    
	        var elm_flash = new Element('div', {
	            'class': 'bullet_highlight',
	            'styles': {
	                'width': obj_coords.width - 100,
	                'height': obj_coords.height
	            }
	        }).inject(arr_bullets[i], 'top');
	        
	        // create a tween object for the element for efficiency
	        elm_flash.set('tween');
	    }
	    
	    // initiate the transitions every x seconds
	    this.update_bullets.periodical(int_bullet_delay, this);
	    
	    // setup the tips on the hoverboxes (where a title is present)
	    var arr_types = this.HOVERBOX_TYPES;
	    
	    for(var i = 0, ilen = arr_types.length; i < ilen; i++) {
	    
	        var str_type = arr_types[i];
	        
		    new Tips('.home_boxes .box.' + str_type + ' a[title]', {
		       className: 'hoverbox_tip ' + str_type
		    });
		}
	},



    /**
     * Updates the next bullet point to change with a new one. Checks to see if it's time to also
     * update a photo
     *
     * @return void
     */
    update_bullets: function() {
        
        var elm_flash = $(document.body).getElements('.bullet_highlight')[this.int_bullet_idx % 3];
        var elm_text = $(document.body).getElements('.bullet_content')[this.int_bullet_idx % 3];

        // update bullet text at the next index and highlight the div behind
        elm_text.set('html', arr_bullets_text[this.int_bullet_idx]);
        
        //elm_flash.fade('show', { duration: 4000 });
        //elm_flash.fade('out');
        elm_flash.fade('show');
        elm_flash.get('tween', { property: 'opacity', duration: 1500 }).start(0);
        
        this.int_bullet_idx++;
        
        if(this.int_bullet_idx > arr_bullets_text.length - 1) { 
            this.int_bullet_idx = 0; 
        }
        
        if(this.int_bullet_count == this.int_bullets_per_photo) {
            this.update_photos();
            this.int_bullet_count = 0;
        }
        
        // do we need to change a photo
        this.int_bullet_count++;
    },
    
    
    
    /**
     * Updates the photo to the next in the set.
     *
     * @return void
     */
    update_photos: function() {
    
        // photos
        var arr_photos = $('home_photos').getElements('div');
        
        var elm_photo_out = arr_photos[this.int_photo_idx];
        
        if(this.int_photo_idx + 1 > arr_photos.length -1) {
            this.int_photo_idx = 0;
        }
        else {
            this.int_photo_idx++;
        }
        
        // transition the current photo and the next photo
        elm_photo_in = arr_photos[this.int_photo_idx];
        elm_photo_in.fade('show');
        elm_photo_out.fade('hide');
        
    }

});