//***********************************  API class *************************************
    var CImgGalleryAPI = function(){
        //buttons array
        this.instances = new Array(); //[0] => name ; [1] => object
    }
    
    CImgGalleryAPI.prototype.get_instances = function()
    {
        return this.instances;
    }

    CImgGalleryAPI.prototype.get_instance = function(name)
    {        
        for(var i = 0; i < this.instances.length; i++){
            if(this.instances[i][0] == name) return this.instances[i][1];
        }   
        return null;
    }

    CImgGalleryAPI.prototype.add_instance = function(name, instance)
    {                                                                    
        this.instances[this.instances.length] = new Array(name, instance);
    }

    //creating api object
    var ImgGalleryAPI = new CImgGalleryAPI();
    
    
    
    
    function imggallery_delete_image(instance_name, id){
        var instance = ImgGalleryAPI.get_instance(instance_name);
        instance.delete_image(id);
    }
    
    function imggallery_set_default_image(instance_name, id){
        var instance = ImgGalleryAPI.get_instance(instance_name);
        instance.set_default_image(id);
    }
    
    function imggallery_remove_default_image(instance_name){
        var instance = ImgGalleryAPI.get_instance(instance_name);
        instance.set_default_image(null);
    }



    var CImgGallery = function(instance_name, root_url, save_path, save_url, thumb_width, thumb_height, allow_descr){
        this.class_name = 'CImgGallery';
        this.instance_name = instance_name;
        this.root_url = root_url;
        this.save_path = save_path; 
        this.save_url = save_url; 
        this.thumb_width = thumb_width;
        this.thumb_height = thumb_height;
        this.allow_descr = allow_descr;                   
        this.container_id = '';
        this.images = new Array();
        this.defimg_id = null;
        //current id is used for unique identification id
        this.curr_id = 0;
        //creating container
        this.obj_cnt = document.createElement('div');
        this.obj_cnt.className = 'imggallery_cnt';
            //creating hidden fields
            this.obj_hidden = document.createElement('input');   
            this.obj_hidden.type = 'hidden';
            this.obj_hidden.name = this.instance_name;
            this.obj_cnt.appendChild(this.obj_hidden);
            //creating default image container
            this.obj_defimg_cnt = document.createElement('div');
            this.obj_defimg_cnt.className = 'imggallery_defimg_cnt';
            this.obj_defimg_cnt.style.width = this.thumb_width + 50 + 'px';
            this.obj_cnt.appendChild(this.obj_defimg_cnt);
                //creating default image links container
                this.obj_defimg_links_cnt = document.createElement('div');
                this.obj_defimg_links_cnt.className = 'imggallery_links_cnt';
                this.obj_defimg_cnt.appendChild(this.obj_defimg_links_cnt);
                    //creating default image delete link
                    this.obj_defimg_link_delete = document.createElement('a');
                    this.obj_defimg_link_delete.className = 'imggallery_link_delete';
                    this.obj_defimg_link_delete.style.backgroundImage = 'url(' + this.root_url + '/images/delete.gif)';
                    this.obj_defimg_link_delete.href = "javascript: imggallery_remove_default_image('" + this.instance_name + "');";
                    this.obj_defimg_link_delete.innerHTML = '<span class="imggallery_span">Elimina</span>';
                    this.obj_defimg_links_cnt.appendChild(this.obj_defimg_link_delete);
                //creating default image object
                this.obj_defimg = document.createElement('img');
                this.obj_defimg.src = '';
                this.obj_defimg.width = this.thumb_width;
                this.obj_defimg.height = this.thumb_height;
                this.obj_defimg.border = '0';
                this.obj_defimg_cnt.appendChild(this.obj_defimg);
            //creating images container
            this.obj_images_cnt = document.createElement('div');
            this.obj_images_cnt.className = 'imggallery_images_cnt';
            this.obj_cnt.appendChild(this.obj_images_cnt); 
            //creating spacer
            this.obj_spacer = document.createElement('div');
            this.obj_spacer.className = 'imggallery_spacer';
            this.obj_cnt.appendChild(this.obj_spacer); 
        //notifying default image change
        this._defimg_changed();
        //notifying simages change
        this._images_changed();
        //adding instance to api class
        ImgGalleryAPI.add_instance(this.instance_name, this);
    }
    
    CImgGallery.prototype._new_id = function(){
        this.curr_id++;
        return this.curr_id;
    }
    //adds a generic object
    CImgGallery.prototype._add_imgobj = function(state, clientid, path, url, fname, origfname, descr, def){
        var imgobj = new CImage(this, this._new_id(), state, clientid, path, url, fname, origfname, descr);
        this.images[this.images.length] = imgobj;
        this.images[this.images.length-1].place();
        if(def) this.defimg_id = imgobj.id;
        //notifyng items and default image changed
        this._images_changed();
        this._defimg_changed(); 
    }
    //adds an object image flagged as new that exists in save_path and is accessible in save_url
    CImgGallery.prototype._add_new_imgobj = function(fname, origfname, descr){
        this._add_imgobj(IMAGESTATE_NORMAL, '', this.save_path, this.save_url, fname, origfname, descr, false);
    }
    //adds an object image flagged as initial. Client that is usig classes sets image using xml
    CImgGallery.prototype._add_init_imgobj = function(clientid, path, url, fname, origfname, descr, def){
        this._add_imgobj(IMAGESTATE_NORMAL, clientid, path, url, fname, origfname, descr, def);
    }
    CImgGallery.prototype._get_image_by_id = function(id){
        for(var i = 0; i < this.images.length; i++){
            if(this.images[i].id == id){
                return this.images[i];
            }
        }     
    }
    CImgGallery.prototype._refresh_xml = function(){
        this.obj_hidden.value = this.get_xml();
    }
    
    //notification events
    CImgGallery.prototype._defimg_changed = function(){
        var defimg = this._get_image_by_id(this.defimg_id);     
        if(!defimg || defimg.state == IMAGESTATE_DELETED){
            this.obj_defimg.style.display = 'none';
        } else {               
            //setting preview for the default image 
            this.obj_defimg.src = defimg.obj_img.src;
            this.obj_defimg.style.display = '';
        }
        this._refresh_xml();
    }
    CImgGallery.prototype._images_changed = function(){
        for(var i = 0; i < this.images.length; i++){
            this.images[i].refresh_pos();    
        }  
        this._refresh_xml();
    }
   
   
       
    CImgGallery.prototype.set_container_id = function(container_id){
        this.container_id = container_id;
    }
    //loads data from xml
    CImgGallery.prototype.set_init_xml = function(xml){
        xml_doc = xml__parse(xml);
        var xml_root = xml_doc.getElementsByTagName('root')[0];
        //getting images                                                                       
        var xml_images = xml_root.getElementsByTagName('item');  
        for(var i = 0; i < xml_images.length; i++){
            var xml_default = xml__get_node_text_content(xml_images[i].getElementsByTagName('default')[0]) == '0' ? false: true;
            var xml_clientid = xml__get_node_text_content(xml_images[i].getElementsByTagName('id')[0]);
            var xml_path = xml__get_node_text_content(xml_images[i].getElementsByTagName('path')[0]);
            var xml_url = xml__get_node_text_content(xml_images[i].getElementsByTagName('url')[0]);
            var xml_fname = xml__get_node_text_content(xml_images[i].getElementsByTagName('fname')[0]);
            var xml_origfname = xml__get_node_text_content(xml_images[i].getElementsByTagName('origfname')[0]);
            var xml_descr = xml__get_node_text_content(xml_images[i].getElementsByTagName('descr')[0]);
            this._add_init_imgobj(xml_clientid, xml_path, xml_url, xml_fname, xml_origfname, xml_descr, xml_default);
        }
    }
    CImgGallery.prototype.add_images = function(){
        window.open(this.root_url + '/' + 'imggallery_upload.php?savepath=' + this.save_path + '&instance_name=' + this.instance_name, '', 'height=500,width=500');          
    }
    CImgGallery.prototype.delete_image = function(id){
        for(var i = 0; i < this.images.length; i++){
            if(this.images[i].id == id){
                this.images[i].remove();
                if(!this.images[i].clientid){
                    for(var j = i; j < this.images.length - 1; j++){
                        this.images[j] = this.images[j + 1];
                        this.images.length = this.images.length - 1;
                    }
                } else {
                    this.images[i].state = IMAGESTATE_DELETED;
                }
                //checking if image is the default image
                if(id == this.defimg_id){
                    this._defimg_changed();
                }
                //notifyng items changed
                this._images_changed();
                return;
            }
        } 
    }
    CImgGallery.prototype.delete_all_images = function(){
        for(var i = 0; i < this.images.length; i++){ 
            this.delete_image(this.images[i].id)
        }
    }
    CImgGallery.prototype.set_default_image = function(id){
        this.defimg_id = id;
        this._defimg_changed();
    }
    CImgGallery.prototype.get_xml = function(){
        var xml = '';
        xml += '<root>';
        for(var i = 0; i < this.images.length; i++){
            xml += this.images[i].get_xml();       
        }
        xml += '</root>';
        return xml;
    }
    
    CImgGallery.prototype.place = function(){
        var cnt = document.getElementById(this.container_id);
        if(cnt) cnt.appendChild(this.obj_cnt);
    }
    CImgGallery.prototype.remove = function(){
        var cnt = document.getElementById(this.container_id);
        if(cnt) cnt.removeChild(this.obj_cnt)
    }

    

    var IMAGESTATE_NORMAL = 0;
    var IMAGESTATE_DELETED = 1;
    
    var CImage = function(imggallery, id, state, clientid, path, url, fname, origfname, descr){
        this.class_name = 'CImage';
        this.imggallery = imggallery;
        this.id = id;
        this.clientid = clientid;              //used by the client that is using class
        this.state = state;
        this.path = path;           //path to image
        this.url = url;             //url to image  
        this.fname = fname;         //filename of the image
        this.origfname = origfname; //original filename i new upload
        this.descr = descr;
        //creating image container obj
        this.obj_cnt = document.createElement('div');
        this.obj_cnt.className = 'imggallery_img_cnt';
        this.obj_cnt.style.width = (Number(this.imggallery.thumb_width) + 20) + 'px';
        this.obj_cnt.style.left = '0px';
            //creating image links container
            this.obj_links_cnt = document.createElement('div');
            this.obj_links_cnt.className = 'imggallery_links_cnt';
            this.obj_cnt.appendChild(this.obj_links_cnt);
                //creating delete link
                this.obj_link_delete = document.createElement('a');
                this.obj_link_delete.className = 'imggallery_link_delete';
                this.obj_link_delete.style.backgroundImage = 'url(' + this.imggallery.root_url + '/images/delete.gif)';
                this.obj_link_delete.href = "javascript: imggallery_delete_image('" + this.imggallery.instance_name + "','" + this.id + "');";
                this.obj_link_delete.innerHTML = '<span class="imggallery_span">Elimina</span>';
                this.obj_links_cnt.appendChild(this.obj_link_delete);
                //creating default link
                this.obj_link_default = document.createElement('a');
                this.obj_link_default.className = 'imggallery_link_default';
                this.obj_link_default.style.backgroundImage = 'url(' + this.imggallery.root_url + '/images/default.gif)';
                this.obj_link_default.href = "javascript: imggallery_set_default_image('" + this.imggallery.instance_name + "','" + this.id + "');";
                this.obj_link_default.innerHTML = '<span class="imggallery_span">Predefinita</span>';
                this.obj_links_cnt.appendChild(this.obj_link_default);
            //creating image object
            this.obj_img = document.createElement('img');
            this.obj_img.src = this.url + '/' + this.fname;
            this.obj_img.width = this.imggallery.thumb_width;
            this.obj_img.height = this.imggallery.thumb_height;
            this.obj_img.border = '0';      
            this.obj_cnt.appendChild(this.obj_img);
            //creating textarea
            this.obj_textarea = document.createElement('textarea');
            this.obj_textarea.className = 'imggallery_textarea';
            this.obj_cnt.appendChild(this.obj_textarea); 
            //creating spacer
            this.obj_spacer = document.createElement('div');
            this.obj_spacer.className = 'imggallery_spacer';
            this.obj_cnt.appendChild(this.obj_spacer);
    }
    
    CImage.prototype._xml_specialchars = function(string){
        var tt = {"&":"&#038;", '"':"&#034;", "<":"&#060;", ">":"&#062;", "'":"&#039;"};
        for(var str in tt){
            string = String(string).replace('/' + str + '/g', tt[str]);          
        }
        return string;
    }                           
    
    CImage.prototype.get_xml = function(){
        var xml = '';
        xml += '<item>';
            xml += '<default>' + this._xml_specialchars(this.imggallery.defimg_id == this.id ? '1' : '0') + '</default>';
            xml += '<id>' + this._xml_specialchars(this.clientid) + '</id>';
            xml += '<state>' + this._xml_specialchars(this.state) + '</state>';
            xml += '<path>' + this._xml_specialchars(this.path) + '</path>';
            xml += '<url>' + this._xml_specialchars(this.url) + '</url>';
            xml += '<fname>' + this._xml_specialchars(this.fname) + '</fname>';
            xml += '<origfname>' + this._xml_specialchars(this.origfname) + '</origfname>';
            xml += '<descr>' + this._xml_specialchars(this.descr) + '</descr>';
        xml += '</item>';
        return xml;
    }
    
    
    CImage.prototype.refresh_pos = function(){
        var pos = 0;
        for(var i = 0; i < this.imggallery.images.length; i++){
            if(this.imggallery.images[i].state == IMAGESTATE_DELETED) continue;
            if(this.imggallery.images[i].id == this.id) break;
            pos++;
        }
        this.obj_cnt.style.left = String(pos * (Number(this.imggallery.thumb_width) + 20)) + 'px';    
    }
    
    
    CImage.prototype.place = function(){
        this.refresh_pos();
        this.imggallery.obj_images_cnt.appendChild(this.obj_cnt);
    }
    
    CImage.prototype.remove = function(){
        this.imggallery.obj_images_cnt.removeChild(this.obj_cnt);
    }