var mouseDownPosition = 0;
var mouseDownValue = -1;
var thumbCenter = 3.75;

function slider_Loaded(sender, args) {
    slider_SetValue(sender, 50);
}

function slider_MouseLeftButtonDown(sender, args) {    
    var coordinate = args.getPosition(null).x;
    var slider = sender.findName("slider");
    coordinate -= slider["Canvas.Left"];
    slider_SetValue(slider, coordinate - thumbCenter);     
    
}

function slider_thumb_MouseLeftButtonDown(sender, args) {
    var slider = sender.findName("slider");
    sender.captureMouse();
    mouseDownValue = slider_GetValue(slider);
    mouseDownPosition = args.getPosition(null).x;   
    
}

function slider_thumb_MouseLeftButtonUp(sender, args) {
    var slider = sender.findName("slider");
    slider.releaseMouseCapture();
    mouseDownValue = -1;
}

function slider_thumb_MouseMove(sender, args) {
    var slider = sender.findName("slider");
    if (mouseDownValue != -1) {
        var newValue = mouseDownValue + (args.getPosition(null).x - mouseDownPosition);    
        slider_SetValue(slider, newValue);
    }   
}

function slider_GetValue(sender) {
    var thumb = sender.findName("slider_thumb");
    return thumb["Canvas.Left"];         
}

function slider_SetValue(sender, newValue) {
    
    if (newValue > sender.width ) {
        newValue = sender.width;
        mouseDownValue = -1;
    }
    if (newValue < - thumbCenter) {
        newValue = - thumbCenter;
        mouseDownValue = -1;
    }
    var thumb = sender.findName("slider_thumb");    
    thumb["Canvas.Left"] = newValue;
    
    var imageCont = getCanvas();
    imageCont.ScaleX = (newValue + 50) / 100;
    imageCont.ScaleY = (newValue + 50) / 100;
    
    
    var WinCanvas = document.getElementById("SilverlightPlugIn");    
    WinCanvas.width  = 767 * (newValue + 50) / 100;
    WinCanvas.height = 850 * (newValue + 50) / 100;

}

function getCanvas(){
    var WinCanvas = document.getElementById("SilverlightPlugIn");    
    return WinCanvas.content.findName("mainScale");
}