function SurveyQuestionnaire() {

    var activeDialog = 'surveyQuestionnaireDialog1';
    
    this.SurveyQuestionnaire = function() {
        if (document.getElementById('surveyCheckboxQuestionReasonModernization').checked || document.getElementById('surveyCheckboxQuestionReasonBuild').checked) {
            document.getElementById('surveyQuestionInformationFoundTr').style.display = 'table-row';
        }
        if (document.getElementById('surveyQuestionAccomodationTypeSelect').value == 'singlefamilyhouse') {
            document.getElementById('surveyQuestionAgeTr').style.display = 'table-row';
        }
    }

    /* public */
    this.showDialog = function(dialog) {
        if (activeDialog != dialog) {
            document.getElementById(activeDialog).style.display = 'none';
        }
        document.getElementById(dialog).style.display = 'block';
        activeDialog = dialog;
    }
    
    this.closeDialog = function() {
        document.getElementById(activeDialog).style.display = 'none';
    }
    
    this.checkboxClicked = function(checkBox) {
        switch (checkBox.id) {
            case 'surveyCheckboxQuestionReasonModernization':
            case 'surveyCheckboxQuestionReasonBuild':
                if (checkBox.checked) {
                    document.getElementById('surveyQuestionInformationFoundTr').style.display = 'table-row';
                } else if (! document.getElementById('surveyCheckboxQuestionReasonModernization').checked && ! document.getElementById('surveyCheckboxQuestionReasonBuild').checked) {
                    document.getElementById('surveyQuestionInformationFoundTr').style.display = 'none';
                }
                break;
            default:
        }
    }
    
    this.radioButtonClicked = function(radioButton) {
    }
    
    this.selectChanged = function(select) {
        switch (select.id) {
            case 'surveyQuestionAccomodationTypeSelect':
                if (select.value == 'singlefamilyhouse') {
                    document.getElementById('surveyQuestionAgeTr').style.display = 'table-row';
                } else {
                    document.getElementById('surveyQuestionAgeTr').style.display = 'none';
                }
                break;
            default:
        }
    }
    
    // call "constructor" method
    this.SurveyQuestionnaire();
}

function Survey(overrideState) {

    /* public classvars */
    this.questionnaire = null;
    
    /* private classvars */
    var avatar = document.getElementById('avatar');
    var avatarFocusTop = 80;
    var avatarFocusLeft = -120;
    var avatarFocusWidth = 300;
    var avatarFocusHeight = 258;
    var avatarTop = -90;
    var avatarLeft = 425;
    var avatarWidth = Math.round(avatarFocusWidth / 4);
    var avatarHeight = Math.round(avatarFocusHeight / 4);
    var avatarDisplayState = 'NONE';
    
    var surveyBubble = document.getElementById('surveyBubble');
    var surveyBubbleTable = document.getElementById('surveyBubbleTable');
    var displayState = false;
    
    var surveyState = 'Start';
    
    /* constructor method */
    this.Survey = function() {
        util = new Util();
        util.pngfix('avatar', 'images/website/avatar_animated.gif', avatarWidth, avatarHeight);
        util.pngfix('surveyBubbleTL', 'images/website/sprechblase_o_l.png', 50, 50);
        util.pngfix('surveyBubbleTR', 'images/website/sprechblase_o_r.png', 50, 50);
        util.pngfix('surveyBubbleBL', 'images/website/sprechblase_u_l.png', 50, 50);
        util.pngfix('surveyBubbleBR', 'images/website/sprechblase_u_r.png', 50, 50);
        util.pngfix('surveyBubbleArrow', 'images/website/sprechblase_pfeil.png', 57, 27);
        
        // falls im cookie gesetzter Zustand überschrieben werden soll:
        if (overrideState != null && overrideState.match(/^(START|ACCEPTED|DECLINED|INVALID|INVALIDEMAIL|SAVED|FINISHED)$/)) {
            this.setState(overrideState);
        } else {
            this.setState(getCookieValue('surveyState'));
        }
        
        switch (this.getState()) {
            // Zustaende in denen der Avatar prinzipiell eingeblendet ist
            case 'START':
            case 'ACCEPTED':
            case 'INVALID':
            case 'INVALIDEMAIL':
            case 'SAVED':
                this.showAvatar();
                break;
            // Zustaende in denen der Avatar ausgeblendet ist
            case 'DECLINED':
            case 'FINISHED':
                break;
            default:
                this.setState('START');
                this.showAvatar();
                break;
        }
    }
    
    /* public */
    /* starts the servey */
    this.start = function() {
    
        switch (this.getState()) {
            case 'START':
                this.focusAvatar();
                showParticipationDialog();
                break;
            case 'ACCEPTED':
                break;
            case 'INVALID':
                this.focusAvatar();
                if (this.questionnaire == null) {
                    this.questionnaire = new SurveyQuestionnaire();
                    this.questionnaire.showDialog('surveyInvalidDialog');
                }
                showSurveyForm();
                break;
            case 'INVALIDEMAIL':
                this.focusAvatar();
                if (this.questionnaire == null) {
                    this.questionnaire = new SurveyQuestionnaire();
                    this.questionnaire.showDialog('surveyInvalidEmailDialog');
                }
                showSurveyForm();
                break;
            case 'SAVED':
                this.focusAvatar();
                this.setState('FINISHED');
                if (this.questionnaire == null) {
                    this.questionnaire = new SurveyQuestionnaire();
                }
                this.questionnaire.showDialog('surveyQuestionnaireFinishedDialog');
                showSurveyForm();
                break;
            case 'DECLINED':
            case 'FINISHED':
                break;
            default:
        }
    }
    
    /* public */
    /* abort survey and persist surveyState DECLINED */
    this.decline = function() {
        // persisting surveyState DECLINED
        this.setState('DECLINED');
        closeDiv('surveyParticipationDialog');
        closeSurveyForm();
        this.closeAvatar();
    }
    
    /* public */
    /* persist surveyState ACCEPTED */
    this.participate = function() {
        // persisting surveyState ACCEPTED
        this.setState('ACCEPTED');
        closeDiv('surveyParticipationDialog');
        showDiv('surveyIntroductionDialog');
    }
    
    /* public */
    this.closeIntroductionDialog = function() {
        closeDiv('surveyIntroductionDialog');
        closeSurveyForm();
        this.unfocusAvatar();
    }
    
    /* public */
    this.showQuestionnaireDialog = function(dialogId) {
        if (this.questionnaire != null) {
            this.questionnaire.showDialog(dialogId);
        }
    }
    
    /* public */
    this.closeQuestionnaireDialog = function() {
        if (this.questionnaire != null) {
            this.questionnaire.closeDialog();
        }
    }
    
    /* public */
    this.closeQuestionnaire = function() {
        this.questionnaire.closeDialog();
        closeSurveyForm();
        this.unfocusAvatar();
        this.closeAvatar();
    }
    
    /* public */    
    /* displays the avatar in small size */
    this.showAvatar = function() {

        avatar.style.top = avatarTop + 'px';
        avatar.style.left = avatarLeft + 'px';
        
        this.avatarDisplayState = 'MINIMIZED';
        
        showDiv('avatar');
    }
    
    /* public */    
    /* hides avatar and persists surveyState DECLINED */
    this.closeAvatar = function() {
        this.avatarDisplayState = 'NONE';
        closeDiv('avatar');
    }
    
    /* public */    
    /* moves the avatar into focus */
    var animationStep = 0;
    var maxAnimationSteps = 10;
    this.focusAvatar = function() {
        this.avatarDisplayState = 'MAXIMIZED';
        util = new Util();
        util.pngfix('avatar', 'images/website/avatar.png', avatarWidth, avatarHeight);
        // reset animation step
        animationStep = 0;
        
        // setting z-index
        document.getElementById('avatarContainer').style.zIndex = 200;
        
        animateFocus();
    }
    
    /* public */    
    /* unfocus the avatar */
    this.unfocusAvatar = function() {
        this.avatarDisplayState = 'MINIMIZED';
        // reset animation step
        animationStep = 0;
        
        document.getElementById('avatarContainer').style.zIndex = 10;
        
        animateUnfocus();
    }
    
    /* public */
    this.avatarClicked = function() {
        
        if (this.avatarDisplayState == 'MINIMIZED') {
            this.focusAvatar();
            showSurveyForm();
            
            switch (this.getState()) {
                case null:
                    /* dieser fall kann eintreten, wenn auf der Startseite auf den minimierten Avatar
                     * geklickt wurde. Zu diesem Zeitpunkt ist die Frage nach der Teilnahme u.U. noch
                     * nicht beantwortet und auch somit der Status z.B. noch auf START. Der null Fall
                     * sollte jedoch nicht eintreten können (cookie wurde im Constructor nicht gesetzt) */
                    this.setState('START');
                case 'START':
                    showParticipationDialog();
                    break;
                case 'ACCEPTED':
                case 'INVALID':
                case 'INVALIDEMAIL':
                    if (this.questionnaire == null) {
                        this.questionnaire = new SurveyQuestionnaire();
                        this.questionnaire.showDialog('surveyQuestionnaireDialog1');
                        //window.setTimeout('questionnaire.showDialog(\'surveyQuestionnaireDialog1\')', 400);
                    }
                    break;
                case 'SAVED':
	                this.setState('FINISHED');
	                if (this.questionnaire == null) {
	                    this.questionnaire = new SurveyQuestionnaire();
	                }
	                this.questionnaire.showDialog('surveyQuestionnaireFinishedDialog');
	                break;
                default:
            }
        } else {
           // hides the surveyForm (background). The actual dialog will continue! 
           if (displayState) {
               closeSurveyForm();
           }
           this.unfocusAvatar();
        }
    }
    
    /* private */
    this.getState = function() {
        return surveyState;
    }
    
    /* private */
    this.setState = function(state) {
        if (state != null && state.match(/^(START|ACCEPTED|DECLINED|INVALID|SAVED|FINISHED|INVALIDEMAIL)$/)) {
            setCookie('surveyState', state);
            surveyState = state;
        }
    }
    
    /* private */
    function animateFocus() {

        var movLeft = avatarFocusLeft - avatarLeft;
        var movTop = avatarFocusTop - avatarTop;
        var width = avatarWidth;
        var height = avatarHeight;
        
        var avatarImgElement = getAvatarImgElement();
        
        if (animationStep++ < maxAnimationSteps) {
            avatar.style.top = avatarTop + Math.round(animationStep * movTop / maxAnimationSteps) + "px";
            avatar.style.left = avatarLeft + Math.round(animationStep * movLeft / maxAnimationSteps) + "px";
            
            width = Math.round(avatarFocusWidth - (avatarFocusWidth - avatarWidth) / maxAnimationSteps * (maxAnimationSteps - animationStep)) + "px";
            height = Math.round(avatarFocusHeight - (avatarFocusHeight - avatarHeight) / maxAnimationSteps * (maxAnimationSteps - animationStep)) + "px";
            //avatar.style.width = Math.round(avatarWidth + (avatarFocusWidth - avatarWidth) / maxAnimationSteps * animationStep) + "px";
            //avatar.style.height = Math.round(avatarHeight + (avatarFocusHeight - avatarHeight) / maxAnimationSteps * animationStep) + "px";
            
            avatarImgElement.style.height = height;
            avatarImgElement.style.width = width;
            
            if (animationStep < maxAnimationSteps) {
                window.setTimeout(function(){animateFocus()}, 0);
            }
        }
        if (animationStep >= maxAnimationSteps) {
            //alert(Math.round(avatarFocusWidth - (avatarFocusWidth - avatarWidth) / maxAnimationSteps * (maxAnimationSteps - animationStep)) + "px");
            //alert(Math.round(avatarHeight + (avatarFocusHeight - avatarHeight) / maxAnimationSteps * animationStep) + "px");
            avatarImgElement.style.width = avatarFocusWidth + "px";
            avatarImgElement.style.height = avatarFocusHeight + "px";
        }
    }
    
    /* private */
    function animateUnfocus() {
        var movLeft = avatarLeft - avatarFocusLeft;
        var movTop = avatarTop - avatarFocusTop;
        var avatarImgElement = getAvatarImgElement();
        
        if (animationStep++ < maxAnimationSteps) {
            avatar.style.top = avatarFocusTop + Math.round(animationStep * movTop / maxAnimationSteps) + "px";
            avatar.style.left = avatarFocusLeft + Math.round(animationStep * movLeft / maxAnimationSteps) + "px";
            
            var width = Math.round(avatarFocusWidth - (avatarFocusWidth - avatarWidth) / maxAnimationSteps * animationStep) + "px";
            var height = Math.round(avatarFocusHeight - (avatarFocusHeight - avatarHeight) / maxAnimationSteps * animationStep) + "px";
            
            avatarImgElement.style.height = height;
            avatarImgElement.style.width = width;
            
            if (animationStep < maxAnimationSteps) {
                window.setTimeout(function(){animateUnfocus()}, 1);
            }
        }
        if (animationStep >= maxAnimationSteps) {
            util = new Util();
            util.pngfix('avatar', 'images/website/avatar_animated.gif', avatarWidth, avatarHeight);
        }
    }
    
    /* private */
    /* displays survey form */
    function showSurveyForm() {
        displayState = true;
        
        //surveyBubbleTable.style.top = top + 'px';
        //surveyBubbleTable.style.left = left + 'px';
        
        // display bubble dialog background
        surveyBubble.style.display = 'block';
    }
    
    /* private */
    /* close survey form */
    function closeSurveyForm() {
        displayState = false;
        surveyBubble.style.display = 'none';
    }
    
    /* private */
    /* display participation dialog */
    function showParticipationDialog() {
        if (!displayState) {
            showSurveyForm();
        }
        showDiv('surveyParticipationDialog');
    }
    
    /* private */
    function showDiv(dialogId) {
        document.getElementById(dialogId).style.display = 'block';
    }
    
    /* private */
    function closeDiv(dialogId) {
        document.getElementById(dialogId).style.display = 'none';
    }
    
    /* private */
    function getCookieValue(key) {
        var cookieArray = document.cookie.split(";");
        var iterator = 0;
        var keyValue = null;
        
        while (iterator < cookieArray.length) {
            var keyValue = cookieArray[iterator].split("=");
            if (trim(keyValue[0]) == key) {
                return trim(keyValue[1]);
            }
            iterator++;
        }
        return null;
    }
    
    /* private */
    function setCookie(key, value) {
        var expirationDate = new Date();
        var month = expirationDate.getMonth();
        if (month == 12) {
            expriationDate.setMonth(1);
            expirationDate.setYear(expirationDate.getYear() + 1);
        } else {
            expirationDate.setMonth(expirationDate.getMonth() + 1);
        }
        var expires = expirationDate.toGMTString();
        document.cookie = key + '=' + value + '; expires=' + expires;
    }
    
    /* private */
    function getAvatarImgElement() {
        var arVersion = navigator.appVersion.split("MSIE")
        var version = parseFloat(arVersion[1])
        var avatarChildren = null;
        
        if ((version >= 5.5) && (document.body.filters)) {
            avatarChildren = avatar.getElementsByTagName('div');
        } else {
            avatarChildren = avatar.getElementsByTagName('img');
        }
        
        if (avatarChildren.length > 0) {
            return avatarChildren[0];
        }
        return null;
    }
    
    /* private */
    function trim(whitespaceString) {
        // Erst führende, dann Abschließende Whitespaces entfernen
        return whitespaceString.replace(/^\s+/, '').replace(/\s+$/, '');
    }
    
    // call constructor
    this.Survey();
}