/*
* Hot Joomla Templates - jQuery Gallery 1.0.0
*
* Copyright 2010,(http://www.hotjoomlatemplates.com)
*
*
* Depends:
*	jquery.ui.core.js
*	jquery.ui.widget.js
*/


(function(jQuery, undefined) {
    jQuery.widget("hjt.hjtgallery", {
        options: {
            displayListItems: 3,
            startTimeout: 500,
            fadeTimeout: 1000,
            slideTimeout: 10000,
            repeatSlideShow: 1,
            swapItemsTimeout: 1500,
            imgDir: 'HJT/css/images',
            arrowWidth: '48px',
            arrowHeight: '34px',
            leftArrowOffset: 10,
            rightArrowOffset: -10,
            hightlight: ['design'],
            starsVerticalOffset: 0,
            starsDistance: 6
        },

        _BaseHTML: "",
        _Container: null,
        _InnerElements: null,
        _ItemsListContainer: null,
        _ItemsList: null,
        _ImageView: null,
        _ImageArray: null,
        _ItemArray: null,
        _SeparattorArray: null,
        _Cursor: -1,
        _cmdLeft: null,
        _cmdRight: null,
        _PrevIndex: -1,
        _StarsArray: null,
        _SlideShowRun: 1,


        _create: function() {
            var self = this,
			    options = self.options;
            var el = jQuery(this.element);
            el.hide();
            this._InnerElements = el.children(); // CUVAMO ORIGINALNI HTML
            this._BaseHTML = el.html();
            this._Container = el;

            this._ImageArray = new Array();
            this._ItemArray = new Array();
            this._SeparattorArray = new Array();
            this._StarsArray = new Array();

            var n = 0;
            var ImageState = 0;
            var ItmA = this._ItemArray;
            var ImgA = this._ImageArray;
            var Details;

            this._InnerElements.each(function(index) {
                switch (jQuery(this).get(0).tagName.toUpperCase()) {
                    case ("IMG"):
                        if (ImageState == 0) {
                            ItmA[n] = jQuery("<tr class='hjt-gallery-list-item'></tr>");
                            var ThumbTD = jQuery("<td class='hjt-gallery-list-item-thumb'></td>");
                            Details = jQuery("<td class='hjt-gallery-list-item-content'></td>");
                            ThumbTD.append(jQuery(this));
                            ItmA[n].append(ThumbTD);
                            ItmA[n].append(Details);
                            ImageState = 1;
                        } else {
                            ImgA[n] = jQuery(this);
                            ImageState = 0;
                        }
                        break;
                    case ("HR"):
                        n++;
                        break;
                    case ("H3"):
                        if (self.options.hightlight == undefined || self.options.hightlight == null || self.options.hightlight == '') {
                            //
                        }
                        else if (self.options.hightlight.constructor.toString().indexOf("Array") == -1) {
                            jQuery(this).html(jQuery(this).text().toUpperCase().replace(self.options.hightlight, "<span class='hjt-hightlight'>" + self.options.hightlight + "</span>"));
                        }
                        else {
                            var j = 0;
                            while (j < self.options.hightlight.length) {
                                jQuery(this).html(jQuery(this).text().toUpperCase().replace(self.options.hightlight[j].toUpperCase(), "<span class='hjt-hightlight'>" + self.options.hightlight[j].toUpperCase() + "</span>"));
                                j++;
                            }
                        }
                        jQuery(this).prepend("<div class='hjt-item-arrow'></div>");
                        Details.append(jQuery(this));
                        break;
                    default:
                        try {
                            Details.append(jQuery(this));
                        } catch (exc) { }
                        break;
                }
            });

            el.html(""); // CISTIMO KONTEJNER
            el.addClass("hjt-gallery-container");
            el.append(jQuery("<table cellpadding='0' cellspacing='0'><tr><td class='hjt-gallery-list-container'></td><td class='hjt-gallery-image-view-container'></td><tr><table>"))

            this._ItemsListContainer = jQuery("<div></div>");
            this._ItemsListContainer.addClass("hjt-gallery-list-slider");

            this._ItemsList = jQuery("<table cellpadding='0' cellspacing='0' ></table>");
            this._ItemsList.addClass("hjt-gallery-list");

            this._ImageView = jQuery('<div></div>');
            this._ImageView.addClass("hjt-gallery-image-view");

            this._cmdLeft = jQuery("<div class='hjt-gallery-cmd-left'><img src='modules/mod_hot_designation/images/hjt_gallery_left.png' /></div>");
            this._cmdRight = jQuery("<div class='hjt-gallery-cmd-right'><img src='modules/mod_hot_designation/images/hjt_gallery_right.png' /></div>");



            this._ItemsListContainer.append(this._ItemsList);
            jQuery(el.find('.hjt-gallery-list-container')[0]).append(this._ItemsListContainer);
            jQuery(el.find('.hjt-gallery-image-view-container')[0]).append(this._ImageView);

            jQuery(el.find('.hjt-gallery-image-view-container')[0]).append(this._cmdLeft);
            jQuery(el.find('.hjt-gallery-image-view-container')[0]).append(this._cmdRight);



            var i = 0;
            while (i < n) {
                this._ItemArray[i].bind('click', { ItemIndex: i, Controler: this }, this.onItem_Click);
                i++;
            }

            i = 0;
            while (i < this._ItemArray.length) {
                this._StarsArray[i] = jQuery('<div class="hjt-star"></div>');
                if (jQuery.browser.msie) {
                    if (jQuery.browser.version < 8) {
                        this._StarsArray[i].css({ 'float': "left" });
                    }
                }

                jQuery(el.find('.hjt-gallery-image-view-container')[0]).append(this._StarsArray[i]);
                i++;
            }

            this._cmdLeft.bind('click', { Controler: this }, this.onCmdLeft_Click);
            this._cmdRight.bind('click', { Controler: this }, this.onCmdRight_Click);

            el.show(options.startTimeout);

            n = 0;
            var newHeight = 0;
            while (n < this._ItemArray.length) {
                if ((this._ItemArray[n] != undefined) ||
                            (this._ItemArray[n] != null) ||
                            (this._ItemArray[n] != '')) {
                    if (jQuery.browser.opera) {
                        this._ItemsList.append(this._ItemArray[n]);
                        if (n < this.options.displayListItems) newHeight += this._ItemArray[n].innerHeight();

                        this._SeparattorArray[n] = jQuery("<tr><td class='hjt-gallery-list-item-sppliter' colspan= '2'></td></tr>");
                        this._ItemsList.append(this._SeparattorArray[n]);
                        if (n % this.options.displayListItems != (this.options.displayListItems - 1)) {
                            if (n < this.options.displayListItems) newHeight += this._SeparattorArray[n].innerHeight();
                        }
                    }
                    else {
                        this._ItemsList.append(this._ItemArray[n]);
                        if (n < this.options.displayListItems) newHeight += this._ItemArray[n].height();

                        this._SeparattorArray[n] = jQuery("<tr><td class='hjt-gallery-list-item-sppliter' colspan= '2'></td></tr>");
                        this._ItemsList.append(this._SeparattorArray[n]);
                        if (n % this.options.displayListItems != (this.options.displayListItems - 1)) {
                            if (n < this.options.displayListItems) newHeight += this._SeparattorArray[n].height();
                        }
                    }
                }
                n++;
            }
            if (n > 0) this.DisplayImage(0);

            if (this._ItemsListContainer.height() != newHeight) this._ItemsListContainer.height(newHeight);

            var VerticalArrowsPositon = this._ImageView.height() / 2 + this.options.starsVerticalOffset;
            if (jQuery.browser.opera) {
                VerticalArrowsPositon = this._ImageView.innerHeight() / 2 + this.options.starsVerticalOffset;
            }


            this._cmdLeft.css({ height: this.options.arrowHeight, width: this.options.arrowWidth, top: "-" + VerticalArrowsPositon + "px", left: this.options.leftArrowOffset + "px" });
            this._cmdRight.css({ height: this.options.arrowHeight, width: this.options.arrowWidth, top: "-" + VerticalArrowsPositon + "px", left: this.options.rightArrowOffset + "px" });


            try {
                if (this._SlideShowRun == 1) {
                    window.setInterval(function() {
                        if (self._SlideShowRun != 1) return;
                        if (self._Cursor == self._ItemArray.length - 1) {
                            if (self.options.repeatSlideShow == 1) self._Cursor = -1;
                        }
                        self.Next();
                    }, this.options.slideTimeout);


                }
            } catch (ex) { this._Cursor = -1; }

        },

        _setOption: function(key, value) {
            this.options[key] = value;
        },

        onItem_Click: function(eArgs) {
            var Self = eArgs.data.Controler;
            var Index = eArgs.data.ItemIndex;
            Self._SlideShowRun = 0;
            Self.DisplayImage(Index);
        },

        onCmdLeft_Click: function(eArgs) {
            var Self = eArgs.data.Controler;
            Self._SlideShowRun = 0;
            Self.Prev();
        },

        onCmdRight_Click: function(eArgs) {
            var Self = eArgs.data.Controler;
            Self._SlideShowRun = 0;
            Self.Next();
        },

        DisplayImage: function(Index) {
            var Self = this;
            if (Index == Self._PrevIndex) return;
            if ((Index < 0) || (Index >= Self._ImageArray.length)) {
                if (Self._PrevIndex != -1) {
                    var Old = Self._ImageArray[Self._PrevIndex];
                    Old.fadeOut(Self.options.fadeTimeout, function() {
                        Old.remove();
                    });
                    Self._ItemArray[Self._PrevIndex].removeClass("hjt-gallery-list-item-selected");

                    Self._Cursor = -1;
                }
            }
            else {
                if (Self._PrevIndex == -1) {
                    Self._ImageArray[Index].hide();
                    Self._ImageArray[Index].css({ position: "static" });
                    Self._ImageView.append(Self._ImageArray[Index]);
                    Self._ImageArray[Index].fadeIn(Self.options.fadeTimeout);

                }
                else {
                    var Old = Self._ImageArray[Self._PrevIndex];
                    Old.css({ position: "absolute" });
                    Old.fadeOut(Self.options.fadeTimeout, function() {
                        Old.remove();
                    });
                    Self._ImageArray[Index].hide();
                    Self._ImageArray[Index].css({ position: "static" });
                    Self._ImageView.append(Self._ImageArray[Index]);
                    Self._ImageArray[Index].fadeIn(Self.options.fadeTimeout);
                }

                if (Self._PrevIndex != -1) {
                    Self._ItemArray[Self._PrevIndex].removeClass("hjt-gallery-list-item-selected");

                }

                Self._PrevIndex = Index;
                Self._Cursor = Index;
                Self._ItemArray[Index].addClass("hjt-gallery-list-item-selected");

                var i = 0;
                while (i < Self._ItemArray.length) {
                    if (Self._Cursor == i) {
                        Self._StarsArray[i].addClass('hjt-star-selected').removeClass('hjt-star');
                    } else
                        Self._StarsArray[i].addClass('hjt-star').removeClass('hjt-star-selected');
                    i++;
                }



            }


        },

        Next: function() {
            var Self = this;
            if (this._Cursor == this._ItemArray.length - 1) return;
            this._Cursor++;
            if (this._Cursor < this._ItemArray.length) {

                if (this._Cursor % this.options.displayListItems == 0) {
                    var n = 0;

                    var preHeight = 0;
                    while (n < this._Cursor) {
                        if ((this._ItemArray[n] != undefined) ||
                            (this._ItemArray[n] != null) ||
                            (this._ItemArray[n] != '')) {

                            if (jQuery.browser.opera) {
                                preHeight += this._ItemArray[n].innerHeight();
                                preHeight += this._SeparattorArray[n].innerHeight();
                            }
                            else {
                                preHeight += this._ItemArray[n].height();
                                preHeight += this._SeparattorArray[n].height();
                            }
                        }
                        n++;
                    }

                    n = 0;
                    var newHeight = 0;
                    while (n < this.options.displayListItems) {

                        if ((this._ItemArray[this._Cursor + n] != undefined) ||
                            (this._ItemArray[this._Cursor + n] != null) ||
                            (this._ItemArray[this._Cursor + n] != '')) {
                            if (this._Cursor + n < this._ItemArray.length) {
                                if (jQuery.browser.opera) {
                                    newHeight += this._ItemArray[this._Cursor + n].innerHeight();
                                    if (n != this.options.displayListItems - 1) {
                                        newHeight += this._SeparattorArray[this._Cursor + n].innerHeight();
                                    }
                                }
                                else {
                                    newHeight += this._ItemArray[this._Cursor + n].height();
                                    if (n != this.options.displayListItems - 1) {
                                        newHeight += this._SeparattorArray[this._Cursor + n].height();
                                    }
                                }

                            }
                        }
                        n++;
                    }


                    if (this._ItemsListContainer.height() < newHeight) this._ItemsListContainer.height(newHeight);
                    if (preHeight != Number(this._ItemsList.css('top').replace('px', ''))) {
                        this._ItemsList.animate({ top: String(-preHeight) + 'px' }, this.options.swapItemsTimeout, 'linear', function() {
                            if (Self._ItemsListContainer.height() != newHeight) Self._ItemsListContainer.height(newHeight);
                            Self.DisplayImage(Self._Cursor);
                        });
                    } else {
                        if (this._ItemsListContainer.height() != newHeight) this._ItemsListContainer.height(newHeight);
                        this.DisplayImage(this._Cursor);
                    }
                } else {
                    this.DisplayImage(this._Cursor);
                }
            }

        },

        Prev: function() {
            var Self = this;
            if (this._Cursor == 0) return;
            this._Cursor--;
            if (this._Cursor >= 0) {
                if (this._Cursor % this.options.displayListItems == this.options.displayListItems - 1) {
                    var n = 0;

                    var preHeight = 0;
                    while (n < this._Cursor - this.options.displayListItems + 1) {
                        if ((this._ItemArray[n] != undefined) ||
                            (this._ItemArray[n] != null) ||
                            (this._ItemArray[n] != '')) {
                            if (jQuery.browser.opera) {
                                preHeight += this._ItemArray[n].innerHeight();
                                preHeight += this._SeparattorArray[n].innerHeight();
                            }
                            else {
                                preHeight += this._ItemArray[n].height();
                                preHeight += this._SeparattorArray[n].height();
                            }

                        }
                        n++;
                    }


                    n = 0;
                    var newHeight = 0;
                    while (n < this.options.displayListItems) {
                        if ((this._ItemArray[this._Cursor - this.options.displayListItems + n + 1] != undefined) ||
                            (this._ItemArray[this._Cursor - this.options.displayListItems + n + 1] != null) ||
                            (this._ItemArray[this._Cursor - this.options.displayListItems + n + 1] != '')) {
                            if (jQuery.browser.opera) {

                                newHeight += this._ItemArray[this._Cursor - this.options.displayListItems + n + 1].innerHeight();
                                if ((this._Cursor - this.options.displayListItems + n + 1) % this.options.displayListItems != this.options.displayListItems - 1) {
                                    newHeight += this._SeparattorArray[this._Cursor - this.options.displayListItems + n + 1].innerHeight();
                                }
                            }
                            else {
                                newHeight += this._ItemArray[this._Cursor - this.options.displayListItems + n + 1].height();
                                if ((this._Cursor - this.options.displayListItems + n + 1) % this.options.displayListItems != this.options.displayListItems - 1) {
                                    newHeight += this._SeparattorArray[this._Cursor - this.options.displayListItems + n + 1].height();
                                }
                            }
                        }
                        n++;
                    }

                    var ILCH = this._ItemsListContainer.height();
                    if (jQuery.browser.opera) {
                        ILCH = this._ItemsListContainer.innerHeight();
                    }

                    if (ILCH < newHeight) this._ItemsListContainer.height(newHeight);
                    if (preHeight != Number(this._ItemsList.css('top').replace('px', ''))) {
                        this._ItemsList.animate({ top: String(-preHeight) + 'px' }, this.options.swapItemsTimeout, 'linear', function() {
                            if (ILCH != newHeight) Self._ItemsListContainer.height(newHeight);
                            Self.DisplayImage(Self._Cursor);
                        });
                    } else {
                        if (ILCH != newHeight) this._ItemsListContainer.height(newHeight);
                        this.DisplayImage(this._Cursor);
                    }

                } else {
                    this.DisplayImage(this._Cursor);
                }
            }
        },

        SlideShowRun: function(state) {
            if (this._SlideShowRun == 0 && state != 0) {
                this._SlideShowRun = state;
                this.Next();
            }
            else {
                this._SlideShowRun = state;
            }
        },

        destroy: function() {
            jQuery(this.element).html(this._baseHTML);
            jQuery.Widget.prototype.destroy.call(this);
        }


    }); // widget
})(jQuery);