function WriteWebsiteTopMenu() 
{
document.write('<table width="100%">');
//document.write('<tr><td align="right"><a class="top_menu_small" href="http://www.feng-gui.com/dashboard/" title="customer login">customer login</a></td></tr>');
document.write('<tr><td align="left"> ');
document.write('<div id="menu-header-wrap">');
document.write('<div id="menu-header">');
document.write('<ul class="menu">');
document.write('<li class="drop"><a href="http://www.feng-gui.com/products.htm">Products</a> <span class="toggle">&nbsp;</span>');
document.write('<ul>');
document.write('<li><a href="http://www.feng-gui.com/products.htm">Overview</a></li>');
document.write('<li><a href="http://www.feng-gui.com/products.htm#price">Price</a></li>');
document.write('<li><a href="http://www.feng-gui.com/products.htm#price">Order</a></li>');
document.write('</ul>');
document.write('</li>');
document.write('<li class="drop"><a href="http://www.feng-gui.com/faq.htm">&nbsp;Resources&nbsp;</a><span class="toggle">&nbsp;</span>');
document.write('<ul>');
document.write('<li><a href="http://www.feng-gui.com/faq.htm#how">Science</a></li>');
document.write('<li><a href="http://www.feng-gui.com/faq.htm#quality">Quality</a></li>');
document.write('<li><a href="http://www.feng-gui.com/help.htm">Dashboard Help</a></li>');
document.write('<li><a href="http://www.feng-gui.com/services.htm">Developers</a></li>');
document.write('</ul>');
document.write('</li>');

document.write('<li class="drop"><a href="http://www.feng-gui.com/clients.htm">Customers</a><span class="toggle">&nbsp;</span>');
document.write('<ul>');
document.write('<li><a href="http://www.feng-gui.com/clients.htm">Customer List</a></li>');
document.write('<li><a href="http://www.feng-gui.com/clients.htm#Testimonials">Testimonials</a></li>');
document.write('<li><a href="http://www.feng-gui.com/Dashboard/">Login</a></li>');
document.write('</ul>');
document.write('</li>');

document.write('<li class="drop"><a href="http://www.feng-gui.com/about.htm">Company</a><span class="toggle">&nbsp;</span>');
document.write('<ul>');
document.write('<li><a href="http://www.feng-gui.com/about.htm">About us</a></li>');
document.write('<li><a href="http://blog.feng-gui.com/">Blog</a></li>');
document.write('<li><a href="http://www.feng-gui.com/professionalservices.htm">Professional Services</a></li>');
document.write('<li><a href="http://www.feng-gui.com/research.htm">Research</a></li>');
document.write('</ul>');
document.write('</li>');
document.write('</ul>');
document.write('</div>');
document.write('</div>');
document.write('</td></tr>');
document.write('</table>');
}
function WriteWebsiteTopMenu1()
{
    document.write('<table width="100%" height="100%"><tr><td align="right">');
    /*document.write('<!-- google search box start-->');
    document.write('<div id="cse" style="width: 100%;">Loading</div>');
    document.write('<script src="http://www.google.com/jsapi" type="text/javascript"></script>');
    document.write('<script type="text/javascript">');
    document.write('   google.load("search", "1");');
    document.write('   google.setOnLoadCallback(function(){');
    document.write('      new google.search.CustomSearchControl("012030197418657076493:2tappketom0").draw("cse");');
    document.write('   }, true);');
    document.write('</script>');
    document.write('<!-- Google search box end-->');
*/

    document.write('<a class="top_menu_small" href="http://www.feng-gui.com/dashboard/" title="customer login">customer login</a>&nbsp;&nbsp;');
    document.write('</td></tr>');
    
    document.write('<tr><td align="right">');
    document.write('<a class="top_menu" href="http://www.feng-gui.com">Home</a>&nbsp;|&nbsp;');
    document.write('<a class="top_menu" href="http://www.feng-gui.com/faq.htm" title="Frequent Asked Questions">Help</a>&nbsp;|&nbsp;');
    document.write('<a class="top_menu" href="http://www.feng-gui.com/products.htm" title="Products">Products</a>&nbsp;|&nbsp;');
    document.write('<a class="top_menu" href="http://www.feng-gui.com/clients.htm" title="Clients">Clients</a>&nbsp;|&nbsp;');    
    document.write('<a class="top_menu" href="http://blog.feng-gui.com/" title="Blog">Blog</a>&nbsp;|&nbsp;');    
    document.write('<a class="top_menu" href="http://www.feng-gui.com/about.htm" title="About us">About&nbsp;us</a>&nbsp;');
    document.write('</td></tr>');
        
    document.write('</table>');
}

//
// set the main image and heatmap for the current thumbnail
//
var imgPreloader_width;
var imgPreloader_height;
var obj_imgImageOrig;
var obj_imgImage;
var obj_imgImage_perception;

function SetMainImage(ThumbImageId)
{
// set main original image
var imgImageOrig_src = document.getElementById(ThumbImageId).src;
imgImageOrig_src = imgImageOrig_src.replace("_thumb.png",".png");

// set main heatmap image
var img_heatmap_src = imgImageOrig_src;
img_heatmap_src = img_heatmap_src.replace("files/images/","files/heatmaps/");

// set main perception image
var img_perception_src = img_heatmap_src;
img_perception_src = img_perception_src.replace(".png", "_perception.png");

// rescale the images
obj_imgImageOrig = document.getElementById("imgImageOrig");
obj_imgImage = document.getElementById("imgImage");
obj_imgImage_perception = document.getElementById("imgImagePerception");


imgPreloader = new Image();
imgPreloader.onload = function() {
    imgPreloader_width = this.width;
    imgPreloader_height = this.height;

    scale_width = imgPreloader_width/imgPreloader_height; 
    scale_height = imgPreloader_height/imgPreloader_width; 
    thumbRatio = 384 / 256;
    imageRatio = imgPreloader_width / imgPreloader_height;

    //if image is smaller than minimum size
    //load it as is
    if ((imgPreloader_width <= 384) && (imgPreloader_height <= 256))
    {
        //alert(imgPreloader.height);
        obj_imgImageOrig.style.height =imgPreloader_height +"px";
        obj_imgImage.style.height = imgPreloader_height + "px";
        obj_imgImage_perception.style.height = imgPreloader_height + "px";
        
        obj_imgImageOrig.style.width =imgPreloader_width +"px";
        obj_imgImage.style.width = imgPreloader_width + "px";
        obj_imgImage_perception.style.width = imgPreloader_width + "px";
    }
    else
    {
        thumbWidth = 384;
        thumbHeight = 256;
        if (thumbRatio < imageRatio) {
          thumbHeight = (thumbWidth / imageRatio);
        } else {
          thumbWidth = (thumbHeight * imageRatio);
        }
        obj_imgImageOrig.style.width= thumbWidth +"px";
        obj_imgImage.style.width = thumbWidth + "px";
        obj_imgImage_perception.style.width = thumbWidth + "px";
        
        obj_imgImageOrig.style.height=thumbHeight +"px";
        obj_imgImage.style.height = thumbHeight + "px";
        obj_imgImage_perception.style.height = thumbHeight + "px";
    }

};
imgPreloader.src = img_heatmap_src;


obj_imgImageOrig.src = imgImageOrig_src;
obj_imgImage.src = img_heatmap_src;
obj_imgImage_perception.src = img_perception_src;


//using this input to transfer the selected image to the server
document.getElementById("selected_imgImageOrig").value = ThumbImageId;//obj_imgImageOrig.src;

}

function SetMainImageScaled() {

    // set main original image
    var imgImageOrig_src = document.getElementById("imgImageOrig").src;
    var img_heatmap_src = imgImageOrig_src;
    img_heatmap_src = img_heatmap_src.replace("files/images/", "files/heatmaps/");

    // rescale the image
    obj_imgImageOrig = document.getElementById("imgImageOrig");
    obj_imgImage = document.getElementById("imgImage");


    imgPreloader = new Image();
    imgPreloader.onload = function() {
        imgPreloader_width = this.width;
        imgPreloader_height = this.height;

        scale_width = imgPreloader_width / imgPreloader_height;
        scale_height = imgPreloader_height / imgPreloader_width;
        thumbRatio = 384 / 256;
        imageRatio = imgPreloader_width / imgPreloader_height;

        //if image is smaller than minimum size
        //load it as is
        if ((imgPreloader_width <= 384) && (imgPreloader_height <= 256)) {
            //alert(imgPreloader.height);
            obj_imgImageOrig.style.height = imgPreloader_height + "px";
            obj_imgImage.style.height = imgPreloader_height + "px";
            obj_imgImageOrig.style.width = imgPreloader_width + "px";
            obj_imgImage.style.width = imgPreloader_width + "px";
        }
        else {
            thumbWidth = 384;
            thumbHeight = 256;
            if (thumbRatio < imageRatio) {
                thumbHeight = (thumbWidth / imageRatio);
            } else {
                thumbWidth = (thumbHeight * imageRatio);
            }
            obj_imgImageOrig.style.width = thumbWidth + "px";
            obj_imgImage.style.width = thumbWidth + "px";
            obj_imgImageOrig.style.height = thumbHeight + "px";
            obj_imgImage.style.height = thumbHeight + "px";
        }

    };
    imgPreloader.src = img_heatmap_src;


    obj_imgImageOrig.src = imgImageOrig_src;
    obj_imgImage.src = img_heatmap_src;
}

function DownloadFile(service_url, image_id)
{
obj_img = document.getElementById(image_id);
var url = service_url + '?url=' + obj_img.src;
location.href = url;
}