var prevAnimationTargetId = null;
var prevCallbackTargetId = null;
var screenHeight;
var screenWidth;

function showContent(animationTargetId, callbackTargetId, buttonTargetId) {
    var contentPanel = document.getElementById(animationTargetId);
    var detailPanel = document.getElementById(callbackTargetId);
    var buttonPanel = document.getElementById(buttonTargetId);
    var anim1 = new Animator({
        duration: 1000,
        transition: Animator.tx.easeIn,
        onComplete: function() {
            buttonPanel.disabled = false;
        }
    });
    var screenWidth = document.getElementById('fullpage').clientWidth;

    buttonPanel.disabled = true;
    anim1.addSubject(new CSSStyleSubject(contentPanel, "left: " + (screenWidth - 660) + ";"));
    if (prevAnimationTargetId != null && prevCallbackTargetId != null) {
        var prevContentPanel = document.getElementById(prevAnimationTargetId);
        var prevDetailPanel = document.getElementById(prevCallbackTargetId);
        var anim2 = new Animator({
            duration: 1000,
            transition: Animator.tx.easeOut,
            onComplete: function() {
                prevDetailPanel.style.display = 'none';
                detailPanel.style.display = 'block'; }
        });
        anim2.addSubject(new CSSStyleSubject(prevContentPanel, "left: " + screenWidth + ";"));
        anim1.duration = 1000;
        var animators = [];
        animators[0] = anim2;
        animators[1] = anim1;
        var animSeq = new AnimatorChain(animators);
        animSeq.play();
    }
    else {
        detailPanel.style.display = 'block';
        anim1.play();
    }
    prevAnimationTargetId = animationTargetId;
    prevCallbackTargetId = callbackTargetId;
}

function hideContent(animationTargetId, callbackTargetId) {
    var contentPanel = document.getElementById(animationTargetId);
    var detailPanel = document.getElementById(callbackTargetId);
    var anim1 = new Animator({
        duration: 1000,
        transition: Animator.tx.easeOut,
        onComplete: function() { detailPanel.style.display = 'none'; }
    });
    var screenWidth = document.getElementById('fullpage').clientWidth;
    
    anim1.addSubject(new CSSStyleSubject(contentPanel, "left: " + screenWidth + ";"));
    anim1.play();
    prevAnimationTargetId = null;
    prevCallbackTargetId = null;
}

function firstPositions(contentDivId, ContentSlideOutDivId) {
    var contentDiv = document.getElementById(contentDivId);
    var screenWidth = document.getElementById('fullpage').clientWidth;
    var screenHeight;
    var contentPanel = document.getElementById(ContentSlideOutDivId);

    prevAnimationTargetId = null;
    prevCallbackTargetId = null;
    
    if (navigator.appName.indexOf('Microsoft') != -1) {
        screenHeight = document.getElementById('fullpage').offsetHeight;
    }
    else {
        screenHeight = window.innerHeight;
    }
    contentDiv.style.left = '25px';
    contentDiv.style.top = '25px';
    contentDiv.style.height = (screenHeight - 85) + 'px';
    contentDiv.style.minHeight = (screenHeight - 85) + 'px';
    contentDiv.style.width = (screenWidth - 50) + 'px';
    if (contentPanel != null) {
        contentPanel.style.height = screenHeight + 'px';
        contentPanel.style.width = (screenWidth - 175) + 'px';
        contentPanel.style.top = '0px';

        var anim1 = new Animator({
            duration: 1,
            transition: Animator.tx.easeOut
        });
        var screenWidth = document.getElementById('fullpage').clientWidth;
        anim1.addSubject(new CSSStyleSubject(contentPanel, "left: " + screenWidth + ";"));
        anim1.play();
    }
}

function HandleResize() {
    resizeCapabilities();
}

window.onresize = HandleResize;