// start jqzoom
    var options = {
            zoomWidth: 281,
            zoomHeight: 281,
            xOffset: 10,
            yOffset: 0,
            position: "right"
        };
    $('.jqzoom').jqzoom(options);  

$(document).ready(function () {
    $.ajax({
        type: "POST",
        url: SFUI.ThisWebsite.getPublicJsonService("products/getProductExtraImagesInfo") + "&pid=" + current_product_id,
        dataType: "json",
        success: function (msg) {
            // create arrays related to images
            jqzoom_images = [];
            jqzoom_images_large = [];
            jqzoom_images_thumb = [];

            for (var key in msg) {
                var obj = msg[key];
                for (var prop in obj) {
                    if (prop === "srcUrl") {
                        the_path = obj[prop];
                    }
                    if (prop === "extraImgsCsv") {
                        prop_arr = obj[prop].split(",");
                        for (i = 0; i < prop_arr.length; i++) {
                            if (prop_arr[i] != "undefined") {
                                jqzoom_images_large[i] = prop_arr[i];
                            } // if
                        } // for
                    } else if (prop === "smallExtraImgsCsv") {
                        prop_arr = obj[prop].split(",");
                        for (i = 0; i < prop_arr.length; i++) {
                            if (prop_arr[i] != "undefined") {
                                jqzoom_images[i] = prop_arr[i];
                            } // if
                        } // for
                    } else if (prop === "thumbnailExtraImgsCsv") {
                        prop_arr = obj[prop].split(",");
                        for (i = 0; i < prop_arr.length; i++) {
                            if (prop_arr[i] != "undefined") {
                                jqzoom_images_thumb[i] = prop_arr[i];
                            } // if
                        } // for
                    }
                } // for
            }
            
            // render thumbnails
            
            var the_thumb_list_container = $('.thumb_list');
            
            for (i = 0; i < jqzoom_images.length; i++) {
                // create image
                $('<img src="' + the_path + jqzoom_images_thumb[i] + '">')
                // append it to thumb_list_container 
                .appendTo(the_thumb_list_container)
                
                // add image-switcher functionality to thumbnails
                .hover(function () {
                    // change attributes
                	$("#img_0").attr("href", $(this).data("Data").the_large_img_src);
                	$("#img_0 img").attr("src", $(this).data("Data").the_big_img_src);
                });

    			// store data related to "normal" and "hover" image states
    			$('.thumb_list img').eq(i).data( "Data",
    						 { 
    							the_large_img_src: the_path + jqzoom_images_large[i], 
    							the_big_img_src: the_path + jqzoom_images[i] 
    				          });
           
            } // for
            
            // add hover state to thumbnails
            
            $('.thumb_list img').hover(function(){
            	$('.thumb_list img').removeClass("thumb_selected");
            	$(this).addClass("thumb_selected");
            }); // each
            
            // simulate mousover on first thumbnail
            
            $('.thumb_list img').eq(0).hover();
            
            // preload images
			
	        jQuery.preloadImages = function () {
	            for (var i = 0; i < arguments.length; i++) {
	                jQuery("<img>").attr("src", arguments[i]);
	            }
	        } // function
	        
	        // preload large images
	        for (i = 0; i < jqzoom_images.length; i++) {
	            $.preloadImages(the_path + jqzoom_images_large[i]); 
	        };
	        
	        // preload big images
			for (i = 0; i < jqzoom_images.length; i++) {
	            $.preloadImages(the_path + jqzoom_images[i]);
	        };
            
        } // success
    }); // ajax  

}); // ready