var main;
var plugin;
function createMySilverlightPlugin()
{  
 plugin=   Silverlight.createObject(
        "myxaml.xaml",                  // Source property value.
        parentElement,                  // DOM reference to hosting DIV tag.
        "mySilverlightPlugin",         // Unique plug-in ID value.
        {                               // Per-instance properties.
            width:'1000',                // Width of rectangular region of 
                                        // plug-in area in pixels.
            height:'800',               // Height of rectangular region of 
                                        // plug-in area in pixels.
            inplaceInstallPrompt:false, // Determines whether to display 
                                        // in-place install prompt if 
                                        // invalid version detected.
            background:'Green',       // Background color of plug-in.
            isWindowless:'false',       // Determines whether to display plug-in 
                                        // in Windowless mode.
            framerate:'24',             // MaxFrameRate property value.
            version:'1.1'               // Silverlight version to use.
        },
        {
            onError:null,               // OnError property value -- 
                                        // event handler function name.
            onLoad:null                 // OnLoad property value -- 
                                        // event handler function name.
        },
        null);                          // Context value -- event handler function name.
}
function createMyPicPlugin()
{  
 plugin= Silverlight.createObject(
        "myMenu.xaml",                  // Source property value.
        parentElement,                  // DOM reference to hosting DIV tag.
        "myMyPicPlugin",         // Unique plug-in ID value.
        {                               // Per-instance properties.
            width:'100%',                // Width of rectangular region of 
                                        // plug-in area in pixels.
            height:'100%',               // Height of rectangular region of 
                                        // plug-in area in pixels.
            inplaceInstallPrompt:false, // Determines whether to display 
                                        // in-place install prompt if 
                                        // invalid version detected.
            background:'Black',       // Background color of plug-in.
            isWindowless:'false',       // Determines whether to display plug-in 
                                        // in Windowless mode.
            framerate:'24',             // MaxFrameRate property value.
            version:'1.0'               // Silverlight version to use.
        },
        {
            onError:null,               // OnError property value -- 
                                        // event handler function name.
            onLoad:null                 // OnLoad property value -- 
                                        // event handler function name.
        },
        null);                          // Context value -- event handler function name.
}

// Define state variables for drag and drop operation.
var beginX;
var beginY;
var isMouseDown = false;
var zOrder;
var cLeft;
var cTop;
var LastObject;

// Start drag and drop operation.
function mouseButtonDown(sender, mouseEventArgs)
{
    // Set the beginning position of the mouse.
    beginX = mouseEventArgs.getPosition(null).x;
    beginY = mouseEventArgs.getPosition(null).y;
    cLeft=sender["Canvas.Left"];
    cTop=sender["Canvas.Top"];
    LastObject=sender
    //var Host= sender.getHost();
    var rect= sender.findName("Holder")
   rect.ImageSource=sender.Source
    //sender.Height=Host.clientHeight;
    //sender.Width= Host.clientWidth;
    isMouseDown = true;
    zOrder=sender["Canvas.Zindex"]
    sender["Canvas.ZIndex"]=5;
    // Ensure this object is the only one receiving mouse events.
    sender.captureMouse();
   // alert("z;=" + sender["Canvas.ZIndex"] + " zz:=" + zOrder)
    
}

// Reposition object during drag and drop operation.
function mouseMoved(sender, mouseEventArgs)
{
    // Determine whether the mouse button is down.
    // If so, move the object.
    if (isMouseDown == true)
    {
        // Retrieve the current position of the mouse.
        var currX = mouseEventArgs.getPosition(null).x;
        var currY = mouseEventArgs.getPosition(null).y;

        // Reset the location of the object.
        sender["Canvas.Left"] += currX - beginX;
        sender["Canvas.Top"] += currY - beginY;

        // Update the beginning position of the mouse.
        beginX = currX;
        beginY = currY;
    }
}

// Stop drag and drop operation.
function mouseButtonUp(sender, mouseEventArgs)
{
    isMouseDown = false;

    // Allow all objects to receive mouse events.
    LastObject.Height="50"
    LastObject.Width="50"
    LastObject["Canvas.ZIndex"]=zOrder;
    LastObject["Canvas.Top"]=cTop;
    LastObject["Canvas.Left"]=cLeft;
    sender.releaseMouseCapture();
  
   
}

// On load Operation
function canvasOnLoad(sender,evArgs)
{

// Retrieve a reference to the plug-in.
    var slPlugin = sender.getHost();
plugin=slPlugin
main=sender.findName("rootCanvas")
    // Create a Downloader object.
    var downloader = slPlugin.createObject("downloader");

    // Add DownloadProgressChanged and Completed events.
    downloader.addEventListener("downloadProgressChanged", onDownloadProgressChanged);
    downloader.addEventListener("completed", onCompleted);

  downloader.open("GET", "pics/pics.zip");

    // Execute the Downloader request.
    downloader.send();

}

// Event handler for updating visual progress indicator
function onDownloadProgressChanged(sender, eventArgs)
{
    // Calculate the downloaded percentage.
    var percentage = Math.floor(sender.downloadProgress * 100);

    // Update the Rectangle and TextBlock objects of the visual progress indicator.
   objprogressText= sender.findName("progressText");
    objprogressText.text = percentage + "%";
    objprogressRectangle= sender.findName("progressRectangle");
    
    objprogressRectangle.width = percentage * 2; 
}

// Event handler for the Completed event.
function onCompleted(sender, eventArgs)
{
    // Retrieve downloaded XAML content.
    //var xamlFragment = sender.ResponseText;

    // Create the objects from the XAML content.
    //var plugin = sender.getHost();
    //var button = plugin.content.createFromXaml(xamlFragment);

    // Add downloaded XAML content to the root Canvas of the plug-in.
   var rootCanvas = sender.findName("rootCanvas");
   // rootCanvas.children.add(button);
    objprogressText= sender.findName("progressText");
    rootCanvas.children.Remove(objprogressText);
   
    objprogressRectangle= sender.findName("progressRectangle");
    rootCanvas.children.Remove(objprogressRectangle);
    BuildImagePanel(sender);
    var the_text=Emu();
 var spObj3=new createScrollablePanel("sp3",850,130,340,410,"V",the_text,"Yellow",15,"Arial Black","#FF0000");
    sender=null;
}

 function BuildImagePanel(downloaderObj)
 {
    var lft= 150;
    var element;
    var img;
    
    ///var plugin = document.getElementById("myMyPicPlugin");
    var rootCanvas = plugin.content.Root
   
    for (x=0;x< imArray.length;x++)
    {
        element = CreateImageElement(lft,0,50,50,x);
        img=plugin.content.createFromXaml(element);
        rootCanvas.children.insert(0,img);

        img.setSource(downloaderObj, imArray[x] +".png");
        lft +=55;
    }
   return element
 }