// 初期数値定義
// 6x4用
var thumbWidth = 140;
var thumbHeight = 105;
var thumbWidthMax = 170;
var thumbHeightMax = 128;
var thumbMargin = 10;
var thumbWnumber = 6;
var thumbHnumber = 4;

// 8x6用
/*var thumbWidth = 100;
var thumbHeight = 75;
var thumbWidthMax = 110;
var thumbHeightMax = 85;
var thumbMargin = 8;
var thumbWnumber = 8;
var thumbHnumber = 6;
*/

// ESCフルスクリーン解除のためのフラグ
var escBtnFlg = false;

// 詳細画面で表示しているIDを管理 1 or 2
var descriptionID = 1;

// 表示中の詳細画面のアニメーションフラグ
var nowAnimationDescriptionFlg = false;

// 表示中の詳細画面オブジェクトのナンバー管理
var nowActiveDescription = 1;

// 表示中の詳細画面オブジェクトの左右
var nowActiveDescriptionLR = "right";

// フルスクリーンで表示している画像オブジェクトのID
var fullscreenImageID = 1;

// フルスクリーンのサムネイルの基準となるCanvas.Left
var fullscrCanvasLeft = 0;

// フルスクリーンで表示している画像のID
var slideImageNumber = 0;

// ロードした画像の枚数
var loadedImageNumber = 0;

// ロードする画像の枚数
var loadImageNumber = 0;

var json = new Array();

// 詳細画面に表示する画像のファイル名を格納する配列
var imageArray = new Array();

// 詳細画面に表示する画像のIDを格納する配列
var imageNoArray = new Array();

function initVar(sender,arg)
{   
    // ESCフルスクリーン解除のためのフラグ
    escBtnFlg = false;

    // 詳細画面で表示しているIDを管理 1 or 2
    descriptionID = 1;

    // 表示中の詳細画面のアニメーションフラグ
    nowAnimationDescriptionFlg = false;

    // 表示中の詳細画面オブジェクトのナンバー管理
    nowActiveDescription = 1;

    // 表示中の詳細画面オブジェクトの左右
    nowActiveDescriptionLR = "right";

    // フルスクリーンで表示している画像オブジェクトのID
    fullscreenImageID = 1;

    // フルスクリーンのサムネイルの基準となるCanvas.Left
    fullscrCanvasLeft = 0;

    // フルスクリーンで表示している画像のID
    slideImageNumber = 0;

    // ロードした画像の枚数
    loadedImageNumber = 0;

    // ロードする画像の枚数
    loadImageNumber = 0;

    json = new Array();

    // 詳細画面に表示する画像のファイル名を格納する配列
    imageArray = new Array();
    
    // 詳細画面に表示する画像のIDを格納する配列
    imageNoArray = new Array();
}


if (!window.meisaku)
	window.meisaku = {};

meisaku.Scene = function() 
{
}

meisaku.Scene.prototype =
{
	handleLoad: function(plugIn, userContext, rootElement) 
	{
	    // FireFoxで発生するJSキャッシュクリア
	    initVar();
	    
	    var slPlugin = plugIn;
	    
	    var downloader = slPlugin.createObject("downloader");
        //downloader.addEventListener("downloadProgressChanged", onDownloadProgressChanged);
        downloader.addEventListener("completed", Silverlight.createDelegate(this, this.startImageLoad));
        downloader.open("GET", "silverlightfiles/data.json");
        downloader.send();
	},
	
	startImageLoad: function(sender, arg)
	{
	    var caravan = document.getElementById("silverlightPlugIn");
        
	    json = eval("(" + sender.ResponseText +")");
	    loadImageNumber = json.ssmovie.length;
	    
	    for(var i = 0;i<loadImageNumber;i++)
	    {
	        var downloader = caravan.createObject("downloader");
            //downloader.addEventListener("downloadProgressChanged", onDownloadProgressChanged);
            
            downloader.addEventListener("completed", Silverlight.createDelegate(this, this.loadedImage));
            downloader.open("GET", "silverlightfiles/ssmovieimages/" + json.ssmovie[i].image);
            downloader.send();
        }
	},
	
	loadedImage: function(sender, arg)
	{
	    var caravan = document.getElementById("silverlightPlugIn");
	    var tmp = caravan.content.findName("loadedPercentage");
	    
	    loadedImageNumber++;
	    var percentageNumber = Math.round(loadedImageNumber / loadImageNumber * 100);
	    if(loadedImageNumber == loadImageNumber)
	    {
	        tmp.Text = "LoadComplete 100%";
	        tmp = caravan.content.findName("loadingBar");
	        tmp.Width = 0;
	        tmp["Canvas.Left"] = 241;
	        this.initFunction();
	    }else{
	        tmp.Text = "NowLoading " + percentageNumber + "%";
	        
	        tmp = caravan.content.findName("loadingBar");
	        tmp.Width = 241 - (241 * percentageNumber / 100);
	        tmp["Canvas.Left"] = 241 * percentageNumber / 100;
	    }
	    
	},
	
	loadedErrorImage: function(sender, arg)
	{
	    loadedImageNumber++;
	},
	
	initFunction: function (sender,arg){
	    var caravan = document.getElementById("silverlightPlugIn");
	    
	    var sb = caravan.content.findName("loadingAnimeEnd");
        sb.Begin();
        
	    var thumbCanvas = caravan.content.findName("thumbBaseCanvas");
	    
        var canvasLeft = (972 - thumbWnumber * (thumbWidth + thumbMargin) - thumbMargin) / 2;
        var canvasTop = (532 - thumbHnumber * (thumbHeight + thumbMargin) - thumbMargin) / 2;
        
        thumbCanvas["Canvas.Left"] = canvasLeft;
        thumbCanvas["Canvas.Top"] = canvasTop;
	    
	    var jsonNumber = 0;
	    
	    var xamlFragment = '<Canvas xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">';
	    
	    for (var i=1; i<=thumbHnumber; ++i)
	    {
	        for (var j=1; j<=thumbWnumber; ++j)
	        {
	            var canvasTop = (thumbHeight+thumbMargin) * (i-1) + thumbMargin;
	            var canvasleft = (thumbWidth+thumbMargin) * (j-1) + thumbMargin;
	            
                if(json.ssmovie.length > jsonNumber)
                {
	                var imageFilename = "silverlightfiles/ssmovieimages/" + json.ssmovie[jsonNumber].image;
                }else{
                    var imageFilename = "";
                }
                
                imageArray["image" + j + "-" + i] = json.ssmovie[jsonNumber].fullimage;
                imageNoArray["image" + j + "-" + i] = json.ssmovie[jsonNumber].no;
	            
	            xamlFragment += '<Canvas ';
	            xamlFragment += 'x:Name="canvas' + j + '-' + i + '" ';
	            xamlFragment += 'Canvas.Top="' + canvasTop + '" ';
	            xamlFragment += 'Canvas.Left="' + canvasleft + '" ';
	            xamlFragment += '>';
                xamlFragment += '<Image ';
	            xamlFragment += 'x:Name="image' + j + '-' + i + '" ';
	            xamlFragment += 'Source="' + imageFilename + '" ';
	            xamlFragment += 'Width="' + thumbWidth + '" Height="' + thumbHeight + '" ';
	            xamlFragment += 'Stretch="UniformToFill" Opacity="0" />';
                xamlFragment += '<Rectangle ';
	            xamlFragment += 'x:Name="stroke' + j + '-' + i + '" ';
	            xamlFragment += 'Stroke="#FFFFFFFF" ';
	            xamlFragment += 'Opacity="0" ';
	            xamlFragment += 'Width="' + thumbWidth + '" Height="' + thumbHeight + '" ';
	            xamlFragment += 'StrokeThickness="2"/>';
	            
                xamlFragment += '</Canvas>';
                
                jsonNumber++;
                
            }
        }
        
        xamlFragment += '</Canvas>';
        
	    var thumbXaml = caravan.content.createFromXaml(xamlFragment, false);
	    thumbCanvas.children.add(thumbXaml);
	    
	    
	    // アニメーション定義（storyboard動的生成）
	    var rootCanvas = caravan.content.findName("rootCanvas");
	    
	    var xamlFragment2 = '<Storyboard xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="ssmovieStart">';
	    
	    for (var i=1; i<=thumbHnumber; ++i)
	    {
	        for (var j=1; j<=thumbWnumber; ++j)
	        {
	            // マウスオーバーアニメーション定義
	            var moveX = (thumbWidthMax - thumbWidth)/2;
	            var moveY = (thumbHeightMax - thumbHeight)/2;
	            var xamlFragment = '<Storyboard xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="image' + j + '-' + i + 'mouseOver">';
                xamlFragment += '<Storyboard Storyboard.TargetName="image' + j + '-' + i + '">';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbWidthMax + '" Storyboard.TargetProperty="(Width)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbHeightMax + '" Storyboard.TargetProperty="(Height)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="-' + moveX + '" Storyboard.TargetProperty="(Canvas.Left)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="-' + moveY + '" Storyboard.TargetProperty="(Canvas.Top)"/>';
                xamlFragment += '</Storyboard>';
                xamlFragment += '<Storyboard Storyboard.TargetName="stroke' + j + '-' + i + '">';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="1" Storyboard.TargetProperty="(Opacity)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbWidthMax + '" Storyboard.TargetProperty="(Width)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbHeightMax + '" Storyboard.TargetProperty="(Height)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="-' + moveX + '" Storyboard.TargetProperty="(Canvas.Left)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="-' + moveY + '" Storyboard.TargetProperty="(Canvas.Top)"/>';
                xamlFragment += '</Storyboard>';
                xamlFragment += '</Storyboard>';
                var thumbXaml = caravan.content.createFromXaml(xamlFragment, false);
                rootCanvas.Resources.add(thumbXaml);
                
	            // マウスアウトアニメーション定義
	            var xamlFragment = '<Storyboard xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="image' + j + '-' + i + 'mouseLeave">';
                xamlFragment += '<Storyboard Storyboard.TargetName="image' + j + '-' + i + '">';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbWidth + '" Storyboard.TargetProperty="(Width)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbHeight + '" Storyboard.TargetProperty="(Height)"/>';
                xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)">';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="0" x:Name="image' + j + '-' + i + 'left1"/>';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.3" Value="0" x:Name="image' + j + '-' + i + 'left2"/>';
                xamlFragment += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)">';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="0" x:Name="image' + j + '-' + i + 'top1"/>';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.3" Value="0" x:Name="image' + j + '-' + i + 'top2"/>';
                xamlFragment += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment += '</Storyboard>';
                xamlFragment += '<Storyboard Storyboard.TargetName="stroke' + j + '-' + i + '">';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="0" Storyboard.TargetProperty="(Opacity)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbWidth + '" Storyboard.TargetProperty="(Width)"/>';
                xamlFragment += '<DoubleAnimation Duration="00:00:00.2" To="' + thumbHeight + '" Storyboard.TargetProperty="(Height)"/>';
                xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)">';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="0" x:Name="stroke' + j + '-' + i + 'left1"/>';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.3" Value="0" x:Name="stroke' + j + '-' + i + 'left2"/>';
                xamlFragment += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)">';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="0" x:Name="stroke' + j + '-' + i + 'top1"/>';
                xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.3" Value="0" x:Name="stroke' + j + '-' + i + 'top2"/>';
                xamlFragment += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment += '</Storyboard>';
                xamlFragment += '</Storyboard>';
                var thumbXaml = caravan.content.createFromXaml(xamlFragment, false);
                rootCanvas.Resources.add(thumbXaml);
                
                // スタートアニメーション定義
                var beginTime = (j + i - 1) / 14 * 100 + 150;
                beginTime = Math.round(beginTime);
                beginTime = beginTime / 100;
                xamlFragment2 += '<Storyboard BeginTime="00:00:0' + beginTime + '" Storyboard.TargetName="image' + j + '-' + i + '">';
                xamlFragment2 += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Opacity)">';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="1"/>';
                xamlFragment2 += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment2 += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Width)">';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="' + (thumbWidth + 10) + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="' + thumbWidth + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01" Value="' + thumbWidth + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.2" Value="' + (thumbWidth + 10) + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.4" Value="' + thumbWidth + '"/>';
                xamlFragment2 += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment2 += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Height)">';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="' + (thumbHeight + 10) + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="' + thumbHeight + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01" Value="' + thumbHeight + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.2" Value="' + (thumbHeight + 10) + '"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.4" Value="' + thumbHeight + '"/>';
                xamlFragment2 += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment2 += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)">';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-5"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.2" Value="-5"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.4" Value="0"/>';
                xamlFragment2 += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment2 += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)">';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-5"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.2" Value="-5"/>';
                xamlFragment2 += '<SplineDoubleKeyFrame KeyTime="00:00:01.4" Value="0"/>';
                xamlFragment2 += '</DoubleAnimationUsingKeyFrames>';
                xamlFragment2 += '</Storyboard>';
                
                // サムネイル画像にイベントをセット 
	            var targetName_str = "image" + j + "-" + i;
	            var target_Image = caravan.content.findName(targetName_str);
	            target_Image.addEventListener("MouseEnter", Silverlight.createDelegate(this, this.enterImage));
	            target_Image.addEventListener("MouseLeave", Silverlight.createDelegate(this, this.leaveImage));
		        target_Image.addEventListener("MouseLeftButtonUp", Silverlight.createDelegate(this, this.selectImage));
	            target_Image.Cursor = "Hand";
                
                jsonNumber++;
            }
        }
        
        xamlFragment2 += '</Storyboard>';
        var thumbXaml = caravan.content.createFromXaml(xamlFragment2, false);
        rootCanvas.Resources.add(thumbXaml);
        
        
        // フルスクリーンのサムネイル画像の生成
        var fullscreenThumbList = caravan.content.findName("fullscreenThumbList");
        var xamlFragment = '<Canvas xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">';
        xamlFragment += '<Canvas x:Name="fullscrcanvas">';
        
	    for (var i = 0; i < json.ssmovie.length; i++) {
            var canvasleft = 90 * i;
            xamlFragment += '<Canvas ';
            xamlFragment += 'x:Name="fullscrcanvas' + i + '" ';
            xamlFragment += 'Canvas.Top="10" ';
            xamlFragment += 'Canvas.Left="' + canvasleft + '" ';
	        xamlFragment += '>';
            xamlFragment += '<Image ';
	        xamlFragment += 'x:Name="fullscrimage' + i + '" ';
	        xamlFragment += 'Source="silverlightfiles/ssmovieimages/' + json.ssmovie[i].image + '" ';
	        xamlFragment += 'Width="80" Height="80" ';
	        xamlFragment += 'Stretch="Uniform" />';
            xamlFragment += '</Canvas>';
	    }
        
        xamlFragment += '</Canvas>';
        xamlFragment += '</Canvas>';
        
	    var thumbXaml = caravan.content.createFromXaml(xamlFragment, false);
	    fullscreenThumbList.children.add(thumbXaml);
	    
	    var fullImage = caravan.content.findName("fullImage1");
	    fullImage.Source = "silverlightfiles/ssmovieimages/" + json.ssmovie[0].image;
	    var fullImage = caravan.content.findName("fullImage2");
	    fullImage.Source = "silverlightfiles/ssmovieimages/" + json.ssmovie[0].image;
	    
	    
	    for (var i = 0; i < json.ssmovie.length; i++) {
            // マウスアウトアニメーション定義
            var xamlFragment = '<Storyboard xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="fullscrimage' + i + 'Click">';
            xamlFragment += '<Storyboard Storyboard.TargetName="fullscrcanvas">';
            xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)">';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.5" KeySpline="0,1,0,1" Value="' + (-90) * i + '" x:Name="fullscrimage' + i + 'left" />';
            xamlFragment += '</DoubleAnimationUsingKeyFrames>';
            xamlFragment += '</Storyboard>';
            xamlFragment += '</Storyboard>';
            var thumbXaml = caravan.content.createFromXaml(xamlFragment, false);
            rootCanvas.Resources.add(thumbXaml);
            
            xamlFragment = '<Storyboard xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Storyboard.TargetName="fullscrimage' + i + '" x:Name="fullscrimage' + i + 'wave">';
            xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Width)">';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="94"/>';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="80"/>';
            xamlFragment += '</DoubleAnimationUsingKeyFrames>';
            xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Height)">';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="94"/>';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="80"/>';
            xamlFragment += '</DoubleAnimationUsingKeyFrames>';
            xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)">';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-7"/>';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0"/>';
            xamlFragment += '</DoubleAnimationUsingKeyFrames>';
            xamlFragment += '<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)">';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-7"/>';
            xamlFragment += '<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0"/>';
            xamlFragment += '</DoubleAnimationUsingKeyFrames>';
            xamlFragment += '</Storyboard>';
            var thumbXaml = caravan.content.createFromXaml(xamlFragment, false);
            rootCanvas.Resources.add(thumbXaml);
            
            target_Image = caravan.content.findName("fullscrimage" + i);
            target_Image.addEventListener("MouseLeftButtonUp", Silverlight.createDelegate(this, this.selectFullscreenImage));
	        target_Image.Cursor = "Hand";
	    }
	    
	    caravan.content.onFullScreenChange = backNormalScreen;
	    
	    
        var sb = caravan.content.findName("ssmovieStart");
        sb.Begin();
	},
    
    // サムネイル画像ロールオーバー
    enterImage: function(sender,arg)
    {
        var caravan = document.getElementById("silverlightPlugIn");
        var storyboardName = sender.Name + "mouseOver";
	
	    var sb = caravan.content.findName(storyboardName);
	    sb.Begin();
	    
	    var idArray = returnAroundIDArray(sender.Name);
	    
	    for(i in idArray)
	    {
	        if(idArray[i][0] > 0 && idArray[i][0] <= thumbWnumber && idArray[i][1] > 0 && idArray[i][1] <= thumbHnumber)
	        {
	            storyboardName = "image" + idArray[i][0] + "-" + idArray[i][1];
	            var tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "left1");
	            tmp.Value = idArray[i][2];
	            tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "top1");
	            tmp.Value = idArray[i][3];
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "left1");
	            tmp.Value = idArray[i][2];
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "top1");
	            tmp.Value = idArray[i][3];
	            var tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "left2");
	            tmp.Value = idArray[i][4];
	            tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "top2");
	            tmp.Value = idArray[i][5];
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "left2");
	            tmp.Value = idArray[i][4];
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "top2");
	            tmp.Value = idArray[i][5];
	            sb = caravan.content.findName(storyboardName + "mouseLeave");
	            sb.Begin();
	        }
	    }
	    
	    // 画像を詳細画面に貼り付け
	    if(sender.Name.slice(5,6) > thumbWnumber / 2)
	    {
	        nowActiveDescriptionLR = "left";
	    }else{
	        nowActiveDescriptionLR = "right";
	    }
	    var descriptionImage = caravan.content.findName("descriptionImage" + nowActiveDescription + nowActiveDescriptionLR);
	    descriptionImage.Source = sender.Source;
	    
	    var descriptionImage = caravan.content.findName("descriptionText" + nowActiveDescription + nowActiveDescriptionLR);	    
	    descriptionImage.Source = "silverlightfiles/textimages/" + imageArray[sender.Name];
	    
	    var sb = caravan.content.findName("activeDescription" + nowActiveDescription + nowActiveDescriptionLR);
	    sb.Begin();
	    
	    nowAnimationDescriptionFlg = true;
	    
	    
    },
    
    // サムネイル画像ロールアウト
    leaveImage: function(sender,arg)
    {
        var caravan = document.getElementById("silverlightPlugIn");
        var storyboardName = sender.Name + "mouseLeave";
	
	    var sb = caravan.content.findName(storyboardName);
	    sb.Begin();
	    
	    var idArray = returnAroundIDArray(sender.Name);
	    
	    for(i in idArray)
	    {
	        if(idArray[i][0] > 0 && idArray[i][0] <= thumbWnumber && idArray[i][1] > 0 && idArray[i][1] <= thumbHnumber)
	        {
	            storyboardName = "image" + idArray[i][0] + "-" + idArray[i][1];
	            var tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "left1");
	            tmp.Value = 0;
	            tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "top1");
	            tmp.Value = 0;
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "left1");
	            tmp.Value = 0;
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "top1");
	            tmp.Value = 0;
	            var tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "left2");
	            tmp.Value = 0;
	            tmp = caravan.content.findName("image" + idArray[i][0] + "-" + idArray[i][1] + "top2");
	            tmp.Value = 0;
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "left2");
	            tmp.Value = 0;
	            tmp = caravan.content.findName("stroke" + idArray[i][0] + "-" + idArray[i][1] + "top2");
	            tmp.Value = 0;
	            sb = caravan.content.findName(storyboardName + "mouseLeave");
	            sb.Begin();
	        }
	    }
	    
	    var sb = caravan.content.findName("negativeDescription" + nowActiveDescription + nowActiveDescriptionLR);
	    sb.Begin();
	    
	    if(nowActiveDescription == 1)
	    {
	        nowActiveDescription = 2;
	    }else{
	        nowActiveDescription = 1;
	    }
    },
    
    // サムネイル画像ロールクリック、詳細情報表示へ
    selectImage: function(sender,arg)
    {   
        location.href = 'http://ssff.jp.msn.com/meisaku/' + imageNoArray[sender.Name] + '.htm';
    },
    
    // フルスクリーンサムネイルクリックアニメーション
    selectFullscreenImage: function(sender,arg)
    {
        var caravan = document.getElementById("silverlightPlugIn");
        
        if(fullscreenImageID != 1)
        {
            fullscreenImageID = 1;
        }
        else
        {
            fullscreenImageID = 2;
        }
        
        // 0をマイナスすることで変数タイプを数字にする。
        var tmpSlideImageNumber = sender.Name.slice(12) - 0;
        if(slideImageNumber > tmpSlideImageNumber){
            slideImageNumber = tmpSlideImageNumber;
            var storyboardName = "Fullscreen" + fullscreenImageID + "right";
	        var sb = caravan.content.findName(storyboardName);
	        sb.Begin();
        }else if(slideImageNumber < tmpSlideImageNumber){
            slideImageNumber = tmpSlideImageNumber;
            var storyboardName = "Fullscreen" + fullscreenImageID + "left";
	        var sb = caravan.content.findName(storyboardName);
	        sb.Begin();
        }else{
        
        }
        
	    var fullImage = caravan.content.findName("fullImage" + fullscreenImageID);
	    fullImage.Source = "silverlightfiles/ssmovieimages/" + json.ssmovie[slideImageNumber].image;
	    
	    var fullImage = caravan.content.findName("fullText" + fullscreenImageID);
	    fullImage.Source = "silverlightfiles/fulltextimages/" + json.ssmovie[slideImageNumber].fullimage;
        
        // サムネイルリスト移動
        var storyboardName = sender.Name + "Click";
	    var sb = caravan.content.findName(storyboardName);
	    sb.Begin();
	    
	    // サムネイルウェーブアニメーション
	    for(var i = 0 ; i < json.ssmovie.length ; i++)
	    {
	        var slideNumber = (slideImageNumber - 0 + i );
	        if(slideNumber < json.ssmovie.length){
                storyboardName = "fullscrimage" + slideNumber + "wave";
                sb = caravan.content.findName(storyboardName);
                sb.BeginTime = "00:00:" + (i * 7 / 100);
                sb.Begin();
            }
	        var slideNumber = slideImageNumber - i;
	        if(slideNumber >= 0){
                storyboardName = "fullscrimage" + slideNumber + "wave";
                sb = caravan.content.findName(storyboardName);
                sb.BeginTime = "00:00:" + (i * 7 / 100);
                sb.Begin();
            }
	    }
    }
}


// サムネイル８方向の画像のIDを取得
function returnAroundIDArray(imageName)
{
    var j = imageName.slice(5,6);
    var i = imageName.slice(7,8);
    
    var idArray = new Array();
    var idArrayNumber = 0;
    
    var jArray = new Array();
    
    var tmp = j;
    tmp--;
    jArray.push(tmp);
    jArray.push(j);
    var tmp = j;
    tmp++;
    jArray.push(tmp);
    
    // 左上
    var tmp = i;
    tmp--;
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[0];
    idArray[idArrayNumber][1] = tmp;
    idArray[idArrayNumber][2] = thumbMargin * -1 * 1.3;
    idArray[idArrayNumber][3] = thumbMargin * -1 * 1.3;        
    idArray[idArrayNumber][4] = thumbMargin * -1;
    idArray[idArrayNumber][5] = thumbMargin * -1;        
    idArrayNumber++;
    
    // 上
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[1];
    idArray[idArrayNumber][1] = tmp;
    idArray[idArrayNumber][2] = 0;
    idArray[idArrayNumber][3] = thumbMargin * -1 * 1.3;
    idArray[idArrayNumber][4] = 0;
    idArray[idArrayNumber][5] = thumbMargin * -1;
    idArrayNumber++;
    
    // 右上
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[2];
    idArray[idArrayNumber][1] = tmp;
    idArray[idArrayNumber][2] = thumbMargin * 1.3;
    idArray[idArrayNumber][3] = thumbMargin * -1 * 1.3;
    idArray[idArrayNumber][4] = thumbMargin;
    idArray[idArrayNumber][5] = thumbMargin * -1;
    idArrayNumber++;
    
    // 左
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[0];
    idArray[idArrayNumber][1] = i;
    idArray[idArrayNumber][2] = thumbMargin * -1 * 1.3;
    idArray[idArrayNumber][3] = 0;
    idArray[idArrayNumber][4] = thumbMargin * -1;
    idArray[idArrayNumber][5] = 0;
    idArrayNumber++;
    
    // 右
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[2];
    idArray[idArrayNumber][1] = i;
    idArray[idArrayNumber][2] = thumbMargin * 1.3;
    idArray[idArrayNumber][3] = 0;
    idArray[idArrayNumber][4] = thumbMargin;
    idArray[idArrayNumber][5] = 0;
    idArrayNumber++;
    
    // 左下
    var tmp = i;
    tmp++;
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[0];
    idArray[idArrayNumber][1] = tmp;
    idArray[idArrayNumber][2] = thumbMargin * -1 * 1.3;
    idArray[idArrayNumber][3] = thumbMargin * 1.3;  
    idArray[idArrayNumber][4] = thumbMargin * -1;
    idArray[idArrayNumber][5] = thumbMargin;        
    idArrayNumber++;
    
    // 下
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[1];
    idArray[idArrayNumber][1] = tmp;
    idArray[idArrayNumber][2] = 0;
    idArray[idArrayNumber][3] = thumbMargin * 1.3;
    idArray[idArrayNumber][4] = 0;
    idArray[idArrayNumber][5] = thumbMargin;
    idArrayNumber++;
    
    // 右下
    idArray[idArrayNumber] = new Array();
    idArray[idArrayNumber][0] = jArray[2];
    idArray[idArrayNumber][1] = tmp;
    idArray[idArrayNumber][2] = thumbMargin * 1.3;
    idArray[idArrayNumber][3] = thumbMargin * 1.3;
    idArray[idArrayNumber][4] = thumbMargin;
    idArray[idArrayNumber][5] = thumbMargin;
        
    return idArray;
}



// 詳細情報消去
function endNegativeDescription(sender,arg)
{
    if(!nowAnimationDescriptionFlg)
    {
        var caravan = document.getElementById("silverlightPlugIn");
    }
}

// 詳細情報アクティブアニメーション終了
function endActiveDescription(sender, arg)
{
    nowAnimationDescriptionFlg = false;
}

// フルスクリーン切り替え
function fullscreentbtn(sender, arg)
{
    var SilverlightControl = sender.getHost();
    SilverlightControl.content.fullScreen = !SilverlightControl.content.fullScreen;
    
    var screenWidth = SilverlightControl.content.actualWidth;
    var screenHeight = SilverlightControl.content.actualHeight;
    
	var caravan = document.getElementById("silverlightPlugIn");
	
	var fullscreenImagetmp = caravan.content.findName("fullscreenImage");
	var imageListCanvastmp = caravan.content.findName("thumbBaseCanvas");
	var imageCanvastmp = caravan.content.findName("thumbCanvas");
	var backGroundtmp = caravan.content.findName("backGround");
	if(fullscreenImagetmp.Visibility =="Visible")
	{
	    imageListCanvastmp.Visibility = "Visible";
	    imageCanvastmp.Visibility = "Visible";
	    backGroundtmp.Visibility = "Visible";
	    var sb = caravan.content.findName("negativeFullscreen");
	    sb.Begin();
	    
	    var Pathtmp = caravan.content.findName("goFullPath");
        Pathtmp.Visibility = "Visible";
	    Pathtmp = caravan.content.findName("backFullPath");
        Pathtmp.Visibility = "Collapsed";
        
	    var sb = caravan.content.findName("moveFullscreenBtn");
	    var leftMove = caravan.content.findName("moveFullscreenLeft");
	    leftMove.To = 928;
	    leftMove.Duration = "00:00:00";
	    
	    sb.Begin();
	    
	}else{
        
	    var tmp = caravan.content.findName("loadingAnimeCanvas");
        tmp.Visibility = "Collapsed";
        
	    fullscreenImagetmp.Visibility = "Visible";	
	    imageListCanvastmp.Visibility = "Collapsed";
	    imageCanvastmp.Visibility = "Collapsed";
	    backGroundtmp.Visibility = "Collapsed";
        
        var fullScrHeader = caravan.content.findName("fullscreenHeader");
        fullScrHeader.Width = screenWidth + 20;
        
        var fullScrCtr = caravan.content.findName("fullscreenControl");
        fullScrCtr.Width = screenWidth + 20;
        fullScrCtr["Canvas.Top"] = screenHeight - 100;
        
        var fullScrThumbCtr = caravan.content.findName("fullscreenThumbList");
        fullScrThumbCtr.Width = screenWidth;
        fullScrThumbCtr["Canvas.Top"] = screenHeight - 100;
        fullScrThumbCtr["Canvas.Left"] = screenWidth / 2 - 40;
        fullscrCanvasLeft = screenWidth / 2 - 40;
        
        var fullScrThumbLine = caravan.content.findName("fullscreenThumbLine");
        fullScrThumbLine["Canvas.Top"] = screenHeight - 100 + 13;
        fullScrThumbLine["Canvas.Left"] = screenWidth / 2 - 45;
	    
	    var fullImagetmp = caravan.content.findName("fullImageCanvas");
	    fullImagetmp["Canvas.Top"] = (screenHeight - 100) / 2 - 150;
        fullImagetmp["Canvas.Left"] = screenWidth / 2 - 200;
               
	    var sb = caravan.content.findName("activeFullscreen");
	    sb.Begin();
	    	    
	    
	    var Pathtmp = caravan.content.findName("goFullPath");
        Pathtmp.Visibility = "Collapsed";
	    Pathtmp = caravan.content.findName("backFullPath");
        Pathtmp.Visibility = "Visible";
        
	    var sb = caravan.content.findName("moveFullscreenBtn");
	    var leftMove = caravan.content.findName("moveFullscreenLeft");
	    leftMove.To = screenWidth - 44;
	    leftMove.Duration = "00:00:00";
	    
	    sb.Begin();
	}
	
	var sb = caravan.content.findName("goFullScreenBtnLeave");
	sb.Begin();
	var sb = caravan.content.findName("backFullScreenBtnLeave");
	sb.Begin();
}

// フルスクリーン完了後処理
function stopAnime(sender, arg)
{
    escBtnFlg = true;
}

// フルスクリーンからESCキーで戻った時対応
function backNormalScreen(sender, arg)
{
    if(escBtnFlg){
        var caravan = document.getElementById("silverlightPlugIn");
          
	    var imageListCanvastmp = caravan.content.findName("thumbBaseCanvas");
        imageListCanvastmp.Visibility = "Visible";
        
	    var imageCanvastmp = caravan.content.findName("thumbCanvas");
        imageCanvastmp.Visibility = "Visible";
        
        var sb = caravan.content.findName("negativeFullscreen");
        sb.Begin();
        
	    var Pathtmp = caravan.content.findName("goFullPath");
        Pathtmp.Visibility = "Visible";
	    Pathtmp = caravan.content.findName("backFullPath");
        Pathtmp.Visibility = "Collapsed";
        
	    var sb = caravan.content.findName("moveFullscreenBtn");
	    var leftMove = caravan.content.findName("moveFullscreenLeft");
	    leftMove.To = 928;
	    leftMove.Duration = "00:00:00";
	    
	    sb.Begin();
	    
	    var sb = caravan.content.findName("goFullScreenBtnLeave");
	    sb.Begin();
    }
}

// フルスクリーン完全消去（フルスクリーン消去のマウス操作がサムネイルクリックと勘違いしないように）
function collapsedfullscreenImage(sender, arg)
{  
    var caravan = document.getElementById("silverlightPlugIn");
    var fullscreen = caravan.content.findName("fullscreenImage");
    fullscreen.Visibility = "Collapsed";
   
    escBtnFlg = false;
}

// ローディングアニメーション完全消去
function loadingAnimeEndComplete(sender, arg)
{
    var caravan = document.getElementById("silverlightPlugIn");
    var tmp = caravan.content.findName("loadingAnimeCanvas");
    tmp.Visibility = "Collapsed";
}

// ボタンアニメーション
function goFullScreenBtnMouseOver(sender,arg)
{
	var caravan = document.getElementById("silverlightPlugIn");
	var sb = caravan.content.findName("goFullScreenBtnOver");
	sb.Begin();
}
function goFullScreenBtnMouseLeave(sender,arg)
{
	var caravan = document.getElementById("silverlightPlugIn");
	var sb = caravan.content.findName("goFullScreenBtnLeave");
	sb.Begin();
}

// ボタンアニメーション
function backFullScreenBtnMouseOver(sender,arg)
{
	var caravan = document.getElementById("silverlightPlugIn");
	var sb = caravan.content.findName("backFullScreenBtnOver");
	sb.Begin();
}
function backFullScreenBtnMouseLeave(sender,arg)
{
	var caravan = document.getElementById("silverlightPlugIn");
	var sb = caravan.content.findName("backFullScreenBtnLeave");
	sb.Begin();
}

// 該当ページへジャンプ
function jumpPage(sender, arg)
{
    location.href = 'http://ssff.jp.msn.com/meisaku/' + json.ssmovie[slideImageNumber].no + '.htm';
}