$(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
            }
            
            // determine if JQZoom should be used
            // Only use JQZoom if the first Extra image is at least 1000px wide            
            // ajax to php page. argument includes image url
            // php page "viking_extra_image_size.php" has curl request to grab image size
            var check_my_size = the_path + jqzoom_images_large[0];
            $.post( "viking_extra_image_size.php", 
            		{
            			image_to_check: check_my_size
            		},
            		function(data){
            	  		use_jq_zoom = data;
////////
            if(jqzoom_images_large.length < 2) {
            	// add "missing" image
            	$('#large_image_holder').html("<img src='images_templ/no_image_big.jpg' alt='' border=''>");
            } else {
            // render images
            // change href attribute of static, big image
           var first_zoom_image = the_path + jqzoom_images_large[0];
          
          if(use_jq_zoom == "yes"){
        	  $("#img_0").attr("href",first_zoom_image);
        	  $("#img_0").attr("title",vb_product_name);
          } //use_jq_zoom
           // $('#large_image_holder').append(zoom_image);
			// make the large image holder 20px taller than first image to prevent wobbling
			//var large_image_holder_mod_height = $("#large_image_holder").height() + 20;
			//$('#large_image_holder').css("height",large_image_holder_mod_height);
			//$('#large_image_holder').css("overflow","hidden");
            // render thumb images
          for (i = 0; i < jqzoom_images.length; i++) {
                var swatch_image = "<a class='img_" + i + "' href='#'><img src='" + the_path + jqzoom_images_thumb[i] + "'></a>";
                $('.thumb_list').append(swatch_image);
            };
$('.thumb_list').append('<br clear="all">');
            var curr_a_id = "img_0";
            // initial highlighted and rollover effect for thumb images
            $(".thumb_list a").attr("id", "thumb_not_selected");
            $(".img_0").attr("id", "thumb_selected");
            $(".thumb_list a").each(function (i) {
                // add hover functionality to thumbnail images. Changes large image.
                $(this).hover(function () {
                    thumb_class = $(this).attr('class');
                    if (curr_a_id == thumb_class) {
                        return (false);
                    } else {
                        $(".thumb_list a").attr("id", "thumb_not_selected");
                        $(this).attr("id", "thumb_selected");
                        function make_curr_a_id() {
                            curr_a_id = thumb_class;
                        }
                        thumb_classx = document.getElementById(thumb_class);
                        make_curr_a_id();
                        var curr_index = thumb_class.split("_");
                        var curr_index = curr_index[1];
                        if(use_jq_zoom == "yes"){
                        		var zoom_image = "<a class='jqzoom' id='" + curr_a_id + "' href='" + the_path + jqzoom_images_large[curr_index] + "' title='" + vb_product_name + "'><img src='" + the_path + jqzoom_images[curr_index] + "'></a>";
                        } else {
                    		    var zoom_image = "<a class='jqzoom' id='" + curr_a_id + "' title='" + vb_product_name + "'><img src='" + the_path + jqzoom_images[curr_index] + "'></a>";
                        } // if_use_jq_zoom
                        
                        $('#large_image_holder').html(zoom_image);
                        if(use_jq_zoom == "yes"){ 
                        var options = {
                            zoomWidth: 426,
                            zoomHeight: 426,
                            xOffset: 7,
                            yOffset: 0,
                            position: "right",
                            title: false
                        };
                        $('.jqzoom').jqzoom(options);
                        }// if use_jq_zoom

                        return (false);
                    } //else
                }); // hover
                $(this).click(function () {
                    return false;
                }); // click
            }); // each
            // invoke the jqzoom plugin - disabled
            if(use_jq_zoom == "yes"){
			var options = {
                zoomWidth: 426,
                zoomHeight: 426,
                xOffset: 7,
                yOffset: 0,
                position: "right",
                title: false
            };
            $('.jqzoom').jqzoom(options);
            } // if use_jq_zoom
            // preload images
            // create array of all large images
			
            jQuery.preloadImages = function () {
                for (var i = 0; i < arguments.length; i++) {
                    jQuery("<img>").attr("src", arguments[i]);
                }
            }
/*
            if(use_jq_zoom == "yes"){
	            for (i = 0; i < jqzoom_images.length; i++) {
	                $.preloadImages(the_path + jqzoom_images_large[i]);
	               
	            };
            } // use_jq_zoom
*/
			for (i = 0; i < jqzoom_images.length; i++) {
                $.preloadImages(the_path + jqzoom_images[i]);
            };
			
            } // if
          }); // ajax post 
        } // success
    }); // ajax
 
 // jqzoom -- disabled
/*
  var options = {
                zoomWidth: 481,
                zoomHeight: 481,
                xOffset: 7,
                yOffset: 0,
                position: "right"
            };
            $('.jqzoom').jqzoom(options);
*/
}); // ready