//
// Имплементация на автоматична смяна на картинката при движение с мишката
// върху елемент. Картинката на елемента се замества със същата картинка с със
// суфикс _h след името и.
//
// Поддържат се елементи IMG, както и елементи със дефинирано CSS свойство
// background-image
//

$(document).ready(function(){
    $("img.hover, div.hover").each(function() {
        var bg  = this.tagName == 'IMG' ? 0 : 1;
        var img = bg ? $(this).css('background-image') : this.src;

        if ( ! img ){
            return;
        }

        // ако сме взели картинката през background-image трябва да премахнем стринга url()
        if ( bg ){
            img.match(/url\("?(.*?)"?\)$/);
            img = RegExp.$1;
        }

        // премахваме домейна от картинката
        img.match(/^https?:\/\/.*?(\/.*)$/)
        img = RegExp.$1;

        // зареждаме картинките, за да не се получава премигване при смяна
        this._out      = new Image();
        this._out.src  = img;


        img.match(/^(.*)\.(\w+)$/);
        this._over     = new Image();
        this._over.src = RegExp.$1 + "_h." + RegExp.$2;

        // ще закъчим хендлърите обработващи over/out на мишката само ако сме заредили
        // успешно картинката за over
        var node = this;
        $(this._over).load(function(){
            if ( bg ){
                $(node).mouseover(function(){ $(node).css('background-image', "url(" + node._over.src  + ")")  })
                $(node).mouseout( function(){ $(node).css('background-image', "url(" + node._out.src   + ")") })
            }else{
                $(node).mouseover(function(){ node.src = node._over.src; })
                $(node).mouseout( function(){ node.src = node._out.src;  })
            }
        })
    })
})