chapman.ShopProductImages = function( options ) {
    $.extend( this, options );
};

chapman.ShopProductImages.prototype = {

    $: function( a ) {
        return $( a, this.container );
    },

    widthMain: 'width=315',
    widthThumb: 'width=100',
    classHover: 'hover',
    mainImage: null,

    init: function() {

        this.mainImage = this.$( 'img.main' );

        this.$( 'img.thumb' )
            .click( this.onThumbClicked.bind(this) )
            .hover( this.onThumbHover.bind(this) );

    },

    onThumbHover: function( evt ) {

        $( evt.target )
            .toggleClass( this.classHover );

    },

    onThumbClicked: function( evt ) {

        var thumb = $( evt.target );
        var mainSrc = this.mainImage
                          .attr( 'src' )
                          .replace( this.widthMain, this.widthThumb );
        var thumbSrc = thumb.attr( 'src' )
                            .replace( this.widthThumb, this.widthMain )

        this.mainImage.attr( 'src', thumbSrc );
        thumb.attr( 'src', mainSrc );
        
    }

};