/********************************************************************
*	Verych Gallery v.1.0a
*	Copyright: Roman Veremyov (rveremyov@gmail.com, roman@verych.ru)
*	Source: http://jsgallery.verych.ru
*	License: GNU GPL
********************************************************************/

var VG = Class.create();
VG.prototype = {
  initialize: function(owner, name, items_small, items_big, picture, from, expand, collapse, show_title, skin) {
  
  	//properties
    this.text_picture = picture;
  	this.text_from = from;
  	this.text_exp_up = collapse;
  	this.text_exp_down = expand;
  	this.menu_item_h = 75;
  	this.menu_navigation_left = '<';
  	this.menu_navigation_right = '>';
    this.menu_line_interval = 5;
    this.ppl = 5; //pictures per line
    this.menu_lines = Math.ceil(items_small.length/this.ppl);
    this.menu_current_line = 0;
  	this.menu_h = parseInt(this.menu_item_h * this.menu_lines + this.menu_line_interval * this.menu_lines);
  	this.unit = 'px';
    this.current = 0;
    this.caption_visibility = show_title;
    this.skin = skin;
    this.owner = $(owner);
    this.items_small = items_small;
    this.items_big = items_big;
    this.name = name;
    this.exp = true;
    
    //container of gallery
    this.container = $(document.createElement("div"));
    this.container.className = this.skin;
    this.container.addClassName("vg_container");
    this.owner.appendChild(this.container);
    
    //caption
    if(this.caption_visibility)
    {
	    this.caption = $(document.createElement("div"));
	    this.caption.appendChild(document.createTextNode(this.name));
	    this.caption.addClassName("vg_caption");
	    this.container.appendChild(this.caption);
    }
    //big picture
    this.bigpic = $(document.createElement("img"));
    
    //big picture container
    this.view = $(document.createElement("div"));
    this.view.addClassName("vg_bigpiccont");
    this.view.appendChild(this.bigpic);
    this.container.appendChild(this.view);
    
    //menu
    this.menu = $(document.createElement("div"));
    this.menu.addClassName("vg_menu");
    this.menu.style.height = this.menu_h + this.unit;
    this.submenu = $(document.createElement("div"));
    this.submenu.addClassName("vg_submenu");
    //this.submenu.style.height = this.menu_h + this.unit;
    this.initMenu();
    this.menu.appendChild(this.submenu);
    this.container.appendChild(this.menu);

    //menu navigation
    this.menunavigationtable = $(document.createElement("table"));
    this.menunavigationtable.addClassName("vg_menu_navigation_table");
    this.menunavigationtablerow = this.menunavigationtable.insertRow(0);
      
    //containers for navigation menu sections
    this.menunavigationtabletd_expander = this.menunavigationtablerow.insertCell(0);
    this.menunavigationtabletd_navigation = this.menunavigationtablerow.insertCell(0);
    this.menunavigationtabletd_paginator = this.menunavigationtablerow.insertCell(0);
    this.menunavigation = $(document.createElement("div"));
    this.menunavigation.addClassName("vg_menu_navigation");
    this.menunavigation.appendChild(this.menunavigationtable);
    this.container.appendChild(this.menunavigation);
    
    //navigation
    this.navigation_buttons = $(document.createElement("ul"));
    this.navigation_buttons.addClassName("vg_navigation_buttons");
    
    this.navigation_button_right = $(document.createElement("li"));
    this.navigation_button_right.tag = this;
    this.addEvent(this.navigation_button_right, 'onclick', this.rClick);
    this.navigation_button_right.addClassName("vg_right");

    this.navigation_button_left =  $(document.createElement("li"));
    this.navigation_button_left.tag = this;
    this.addEvent(this.navigation_button_left, 'onclick', this.lClick);
    this.navigation_button_left.addClassName("vg_left");

    this.navigation_buttons.appendChild(this.navigation_button_left);
    this.navigation_buttons.appendChild(this.navigation_button_right);
    this.navigation_button_left.appendChild(document.createTextNode(this.menu_navigation_left));
    this.navigation_button_left.addClassName("vg_menu_navigation_button_off");      
    this.navigation_button_right.appendChild(document.createTextNode(this.menu_navigation_right));
    this.navigation_button_right.addClassName("vg_menu_navigation_button");
    
    this.menunavigationtabletd_navigation.appendChild(this.navigation_buttons);
  
  	//expander
  	if(this.menu_lines > 1)
  	{
	  	this.expander = $(document.createElement("div"));
	    this.expander.addClassName("vg_expander");
	    this.expander.appendChild(document.createTextNode(this.text_exp_up));
	    this.expander.tag = this;
	    this.addEvent(this.expander, 'onclick', this.expClick);
	    this.menunavigationtabletd_expander.appendChild(this.expander);
    }
    this.setPicture(0);
  },

  updatePaginator: function() {
  	 this.paginatormessage = 
  	 this.menunavigationtabletd_paginator.innerHTML = this.text_picture + ': <strong>'+ (this.current + 1) + '</strong> ' + this.text_from + ' <strong>' + this.menuItems.length + '</strong>';
  },
  
  setDefaultBigPic: function() {
  	if(this.items_big.length > (this.current))
  	{
  		this.bigpic.src = this.items_big[this.current];
  	}
  },
  
  initMenu: function() {
  	if(this.items_small.length > 0)
  	{
  		this.menuItems = new Array();
  		this.menuItemPics = new Array();
  		for(var i=0; i<this.items_small.length; i++)
  		{
  			this.menuItemPics[i] = $(document.createElement("img"));
  			this.menuItemPics[i].src = this.items_small[i];
  			this.menuItemPics[i].tag = i;
  		
  			this.menuItems[i] = $(document.createElement("div"));
  			this.menuItems[i].addClassName("vg_menuitem");
 			
 			//alert(1);
  			this.menuItems[i].tag = this;
  			this.menuItems[i].appendChild(this.menuItemPics[i]);
  			
  			//on click event 
  			this.addEvent(this.menuItems[i], 'onclick', this.itemClick);
  			
  			if(i%this.ppl == (this.ppl-1))
  			{
  				this.menuItems[i].addClassName("vg_last_item");
  			}
  			
  			this.submenu.appendChild(this.menuItems[i]);
  		}
   	}
  },
  
  addEvent: function(elt, name, handler, atEnd) {
	  name = name.replace(/^(on)?/, 'on'); 
	  var prev = elt[name];
	  var tmp = '__tmp';
	  elt[name] = function(e) {
	    if (!e) e = window.event;
	    var result;
	    if (!atEnd) {
	      elt[tmp] = handler; result = elt[tmp](e); elt[tmp] = null;
	      if (result === false) return result;
	    }
	    if (prev) {
	      elt[tmp] = prev; result = elt[tmp](e); elt[tmp] = null;
	    }
	    if (atEnd && result !== false) {
	      elt[tmp] = handler; result = elt[tmp](e); elt[tmp] = null;
	    }
	    return result;
	  }
	  return handler;
  },
  
  setExp: function(exp) {
  	if(exp)
  	{
  		this.menu.style.height = this.menu_h + this.unit;
  		this.expander.innerHTML = this.text_exp_up;
        this.expander.removeClassName('vg_collapsed');
  	}
  	else
  	{
  		this.menu.style.height = (this.menu_item_h + this.menu_line_interval) + this.unit;
  		this.expander.innerHTML = this.text_exp_down;
        this.expander.addClassName('vg_collapsed');
  	}
  	this.updateCurrentLine();
  },
  
  updateCurrentLine: function() {
  	if(!this.exp)
  	{
  		this.menu_current_line = Math.ceil((this.current+1)/this.ppl) - 1;
  		this.submenu.style.top = (-this.menu_current_line*(this.menu_item_h + this.menu_line_interval)) + this.unit;
  	}
  	else
  	{
  		this.submenu.style.top = '0px';
  	}
  },
  
  expClick: function(e) {
  	this.tag.exp = !this.tag.exp;
	this.tag.setExp(this.tag.exp);
  },
  
  itemClick: function(e) {
	this.tag.setPicture(this.childNodes[0].tag); 
  },
  
  lClick: function(e) {
	this.tag.setCurrent(this.tag.current - 1); 
  },
  
  rClick: function(e) {
	this.tag.setCurrent(this.tag.current + 1); 
  },
  
  setCurrent: function(new_current) {
  
  	if(new_current < 0) return;
  	if(new_current >= this.menuItems.length) return;
7  	
	this.setPicture(new_current); 
  },
  
  setPicture: function(num) {
  
  	var new_current = num;
	if(new_current == 0)
  	{
  		this.navigation_button_left.addClassName("vg_menu_navigation_button_off");
  		this.navigation_button_left.removeClassName("vg_menu_navigation_button");
  		this.navigation_button_right.removeClassName("vg_menu_navigation_button_off");
  		this.navigation_button_right.addClassName("vg_menu_navigation_button");
  		
  	}
  	if(new_current == (this.menuItems.length-1))
  	{
  		this.navigation_button_right.addClassName("vg_menu_navigation_button_off");
  		this.navigation_button_right.removeClassName("vg_menu_navigation_button");
  		this.navigation_button_left.removeClassName("vg_menu_navigation_button_off");
  		this.navigation_button_left.addClassName("vg_menu_navigation_button");
  		
  	}
  	if((new_current > 0)&&(new_current < (this.menuItems.length-1)))
  	{
  		this.navigation_button_right.removeClassName("vg_menu_navigation_button_off");
  		this.navigation_button_left.removeClassName("vg_menu_navigation_button_off");
  		this.navigation_button_right.addClassName("vg_menu_navigation_button");
  		this.navigation_button_left.addClassName("vg_menu_navigation_button");
  	}
  
	this.current = num;
	this.setDefaultBigPic();
	for(var i=0; i<this.menuItems.length; i++)
	{
		
		this.menuItems[i].removeClassName('vg_menuitem_selected');
	}
	this.menuItems[num].addClassName('vg_menuitem_selected');
	this.updatePaginator();
	this.updateCurrentLine();
  }
}