var quizDiv = document.createElement('div');
quizDiv.id = 'innerquiz';
document.getElementById("quiz").innerHTML = function () {/*<style scoped>
#quiz h1, #quiz h2, #quiz h3, #quiz h4, #quiz p {
    clear: both;
    line-height: 20px;
    font-size: 16px;
}

#quiz h4 {
    font-size: 50px;
    letter-spacing: -3.5px;
    line-height: 50px;
}

#quiz h2.title {
    text-align: center;
    padding: 10px;
    color: #fff;
    background-color: #E2021B;
}

#quiz h2.subtitle {
    margin-top: 15px;
}

#quiz .question h2 {
    margin-top: 25px;
    margin-bottom: 25px;
}

#quiz div.question {
    display: none;
    margin-top: 40px;
}

#quiz div.answer {
    display: block;
    margin-top: 5px;
    background-color: #454545;
    color: #fff;
    padding: 5px 10px;
}

#quiz div.answer:hover {
    background-color: #FFF;
    border: 1px #454545 solid;
    color: #454545;
    padding: 4px 9px;
    font-weight: bold;
}

#quiz ul.quiznav {
    display: none;
    margin-bottom: 25px;
    clear: both;
    padding: 0;
}

#quiz ul.quiznav li {
    float: left;
    border: 5px #f7f7f7 solid;
    border-radius: 5px;
    list-style-type: none;

}

#quiz button.startquiz {
    margin: 25px auto;
}

#quiz span.quiznav {
    font-size: 12px;
    line-height: 12px;
    margin-bottom: 5px;
    display: block;
}
#quiz span.quiznav.left {
    float: left;
}
#quiz span.quiznav.right {
    float: right;
}

#quiz div#quizresult {
    text-align:center;
}

#quiz span.quizstarten {
    white-space: nowrap;
}

#quiz p.showdetails {
    margin-top: 15px;
}

#quiz div.resultdetail {
    display: none;
    height: 90%;
    left: 0;
    margin: 5% 10%;
    padding: 10px;
    position: absolute;
    top: 0;
    width: 80%;
    background-color: #fff;
    overflow: scroll;
    border: 2px #ccc solid;
}

#quiz .resultdetail p {
    margin-bottom: 5px;
    padding: 8px 10px;
}

#quiz .resultdetail p.correct {
    background: #DFF0D8;
}

#quiz .resultdetail p.notcorrect {
    background: #F2DEDE;
}

#quiz #quizresult span.appetizer-title {
	min-height: auto !important;
}

#quiz p.showdetails {
    cursor: pointer;
}

#quiz p.credits {
        color: #999999;
        font-size: 12px;
}
</style>
<span><img class="quizheader" src="https://quiz.idowa.de/index.php?rex_media_type=quiz&rex_media_file=mars.jpg" title="In dieser Woche ist Halloween. Eine Zeit, in der es auch im Fernsehen gruselig wird. Wir haben zehn Fragen zu Horror-Filmen für Sie. Rätseln Sie mit.  (Foto: Roland Weihrauch, dpa)" alt="Bild zum Quiz In dieser Woche ist Halloween. Eine Zeit, in der es auch im Fernsehen gruselig wird. Wir haben zehn Fragen zu Horror-Filmen für Sie. Rätseln Sie mit.  (Foto: Roland Weihrauch, dpa)" style="width: 100%;"/><p class="credits quizheader">Quelle: esoc/ESA/dpa</p></span>
<h2 class="quizheader subtitle">In dieser Woche ist Halloween. Eine Zeit, in der es auch im Fernsehen gruselig wird. Wir haben zehn Fragen zu Horror-Filmen für Sie. Rätseln Sie mit.  (Foto: Roland Weihrauch, dpa)</h2>
<span class='quiznav left'></span><span class='quiznav right'></span><ul class='quiznav'><li data-number="0"></li>
<li data-number="1"></li>
<li data-number="2"></li>
<li data-number="3"></li>
<li data-number="4"></li>
<li data-number="5"></li>
<li data-number="6"></li>
<li data-number="7"></li>
<li data-number="8"></li>
<li data-number="9"></li></ul><div style='clear:both;'></div><div class="question" data-number="0">
<h2>Wie heißt die erste Romanverfilmung von Steven King? (Foto: Erik S. Lesser, dpa)</h2>
<img src="https://quiz.idowa.de/index.php?rex_media_type=quiz&rex_media_file=44169823.jpg" title="" alt="" style="width: 100%;"/><p class="credits"></p>
<div class="answer" data-number="0" data-info="6151">
<p>Es</p>
</div>
<div class="answer" data-number="1" data-info="5948">
<p>Misery</p>
</div>
<div class="answer" data-number="2" data-info="2229">
<p>Carrie - die jüngste Tochter des Satans</p>
</div>
</div>
<div class="question" data-number="1">
<h2>Was war der erfolgreichste Film von Steven King?</h2>
<div class="answer" data-number="0" data-info="5801">
<p>Cujo</p>
</div>
<div class="answer" data-number="1" data-info="9628">
<p>The Shining</p>
</div>
<div class="answer" data-number="2" data-info="4089">
<p>Friedhof der Kuscheltiere</p>
</div>
</div>
<div class="question" data-number="2">
<h2>In welchem Horrorfilm spielte Drew Barrymore nicht mit? (Foto: Paul Buck, dpa)</h2>
<img src="https://quiz.idowa.de/index.php?rex_media_type=quiz&rex_media_file=58500301.jpg" title="" alt="" style="width: 100%;"/><p class="credits"></p>
<div class="answer" data-number="0" data-info="9973">
<p>Feuerkind</p>
</div>
<div class="answer" data-number="1" data-info="9990">
<p>Transilvania</p>
</div>
<div class="answer" data-number="2" data-info="3079">
<p>Scream</p>
</div>
</div>
<div class="question" data-number="3">
<h2>Welcher Schauspieler spielte den Freddy Krueger in "Nightmare on Elmstreet"? (Foto: Stephen Morrison, dpa)</h2>
<img src="https://quiz.idowa.de/index.php?rex_media_type=quiz&rex_media_file=21927730.jpg" title="" alt="" style="width: 100%;"/><p class="credits"></p>
<div class="answer" data-number="0" data-info="6079">
<p>Richard Bachmann</p>
</div>
<div class="answer" data-number="1" data-info="8641">
<p>Robert de Niro</p>
</div>
<div class="answer" data-number="2" data-info="4575">
<p>Robert Englund</p>
</div>
</div>
<div class="question" data-number="4">
<h2>Wer spielte nicht in "Carrie - die jüngste Tochter des Satans" mit?</h2>
<div class="answer" data-number="0" data-info="7981">
<p>Sissy Spacek</p>
</div>
<div class="answer" data-number="1" data-info="7169">
<p>John Travolta</p>
</div>
<div class="answer" data-number="2" data-info="3030">
<p>Jamie Lee Curtis</p>
</div>
</div>
<div class="question" data-number="5">
<h2>Welcher Gegenstand spielt eine wichtige Rolle im Film "The Ring"?</h2>
<div class="answer" data-number="0" data-info="1549">
<p>Ein Dolch</p>
</div>
<div class="answer" data-number="1" data-info="6912">
<p>Eine Videokassette</p>
</div>
<div class="answer" data-number="2" data-info="8531">
<p>Ein Lenkdrachen</p>
</div>
</div>
<div class="question" data-number="6">
<h2>Wie heißt das Hotel im Film "The Shining"?</h2>
<div class="answer" data-number="0" data-info="6169">
<p>Beach Ressort</p>
</div>
<div class="answer" data-number="1" data-info="6243">
<p>Overlook</p>
</div>
<div class="answer" data-number="2" data-info="9656">
<p>Heavenly</p>
</div>
</div>
<div class="question" data-number="7">
<h2>Welches Medikament wird der kleinen Regan in "Der Exorzist" verschrieben, als sie besessen wird? (Foto: Friso Gentsch, dpa)</h2>
<img src="https://quiz.idowa.de/index.php?rex_media_type=quiz&rex_media_file=107476162.jpg" title="" alt="" style="width: 100%;"/><p class="credits"></p>
<div class="answer" data-number="0" data-info="8593">
<p>Amphetamin</p>
</div>
<div class="answer" data-number="1" data-info="3863">
<p>Noradrenalin</p>
</div>
<div class="answer" data-number="2" data-info="4374">
<p>Ritalin</p>
</div>
</div>
<div class="question" data-number="8">
<h2>Wie heißt das satanische Buch in Sam Raimis "Tanz der Teufel"?</h2>
<div class="answer" data-number="0" data-info="6061">
<p>Libra Satanis</p>
</div>
<div class="answer" data-number="1" data-info="2970">
<p>Necronomicon Ex-Mortis</p>
</div>
<div class="answer" data-number="2" data-info="3511">
<p>Die satanischen Verse</p>
</div>
</div>
<div class="question" data-number="9">
<h2>Wie heißt der Clown in Steven Kings "Es"?</h2>
<div class="answer" data-number="0" data-info="6792">
<p>Pennywise</p>
</div>
<div class="answer" data-number="1" data-info="9364">
<p>Hallywell</p>
</div>
<div class="answer" data-number="2" data-info="9347">
<p>Anderland</p>
</div>
</div>
<button type="submit" class="button submit startquiz" name="Starten">    		<span class="icon-arrow-3 arrow-right"></span><span class="quizstarten">Quiz starten</span></button>
<div class="resultdetail"></div>



*/
}.toString().slice(15, -4);

var questionCountSum = 0;
var questionCountAct = 1;

var answerCorrect = 0;
var answerFalse = 0;

function prevSlide() {
    lastNumber = -1;
    actNumber = -1;
    jQuery(".question").each(function () {
        lastNumber = actNumber;
        actNumber = jQuery(this).data("number");
        if (jQuery(this).is(":visible") && lastNumber != -1) {
            jQuery(this).hide();
            jQuery(".question[data-number=" + lastNumber + "]").show();
        }
    });
}

function nextSlide() {
    lastNumber = -1;
    actNumber = -1;
    showNext = false;
    jQuery(".question").each(function () {

        if (showNext) {
            toFadeIn = this;
            setTimeout(function(){ jQuery(toFadeIn).fadeIn();}, 300);
            showNext = false;
        } else {
            lastNumber = actNumber;
            actNumber = jQuery(this).data("number");
            if (jQuery(this).is(":visible")) {
                questionCountAct++;
                showNext = true;
                jQuery(this).fadeOut(300);
                jQuery("span.quiznav.left").html("Frage " + questionCountAct+"/"+questionCountSum);
                jQuery("span.quiznav.right").html(answerCorrect+" Punkte");
            }
        }
    });

    if (showNext) {
        //jQuery(".quizstarten").html("Quiz nochmals stpielen");
        jQuery(".startquiz").show();
        jQuery("span.quiznav").hide();
        jQuery("ul.quiznav").hide();
        var theMessage = "Sie haben<br/><span class='appetizer-title'>" + answerCorrect + "</span> von " + (answerCorrect + answerFalse) + " Fragen richtig beantwortet";
        var theShareMessage = "Ich habe " + answerCorrect + " von " + (answerCorrect + answerFalse) + " Fragen beim idowa-Quiz richtig beantwortet. Selbst mitmachen auf http://www.idowa.de";

        var twitterLink = '<a target="_blank" href="http://twitter.com/home?status=' + encodeURI(theShareMessage) + '" title="Auf Twitter weitersagen"><img src="https://www.abendzeitung-muenchen.de/www/abendzeitung_muenchen/_responsive/images/icons/ic-twitter.png" alt="Twitter" title="auf Twitter teilen"/></a>';
        var facebookLink = '<a target="_blank" href="http://www.facebook.com/sharer.php?caption=' + encodeURI("Teilnahme am idowa-Quiz") + '&description=' + encodeURI(theShareMessage) + '&u=https://www.idowa.de" title="Auf Facebook weitersagen"><img src="https://www.abendzeitung-muenchen.de/www/abendzeitung_muenchen/_responsive/images/icons/ic-facebook.png" alt="Facebook" title="auf Facebook teilen"/></a>';
        //jQuery(".prev").hide();
        //jQuery(".next").hide();
        jQuery("#quiz").prepend("<div id='quizresult'><p><br/><br/>Ergebnis teilen:<br/><br/>" + twitterLink + "&nbsp;&nbsp;&nbsp;&nbsp;" + facebookLink+"</p><p class='showdetails'>Ergebnis im Detail anzeigen</p></div>");

        jQuery(".showdetails").off("click");
        jQuery(".showdetails").on("click", function(){
            jQuery(".resultdetail").fadeIn();
            jQuery(".resultdetail").off("click");
            jQuery(".resultdetail").on("click", function(){
                jQuery(this).fadeOut();
            });
        });

        if (typeof iom != "undefined") {
            var iam_data_quiz = {
                "st" : "idowa",
                "sv" : "ke",
                "cp" : "ik_idowa_quiz",
		"mg" : "yes"
            }
            iom.c(iam_data_quiz, 1);
        }

        jQuery.get( "https://quiz.idowa.de/score/110/"+answerCorrect, function( data ) {
            jQuery("#quizresult").prepend("<p>"+theMessage + "!<br/>Der Durchschnitt liegt bei <b style='font-size: 18px;'>"+data+"</b> richtig beantworteten Fragen.</p>");
        });
    }

}

function answerClicked(elem) {
    theInfo = jQuery(elem).data("info");

    if (typeof iom != "undefined") {
        var iam_data_quiz = {
		"st" : "idowa",
                "sv" : "ke",
                "cp" : "ik_idowa_quiz",
                "mg" : "yes"
        }
        iom.c(iam_data_quiz, 1);

    }

    actQuestionText = jQuery(elem).parent().find("h2").html();



    if (theInfo % (9 / 3) == 0) {
        answerCorrect++;
        actQuestionStyle = "correct";
        jQuery("ul.quiznav li[data-number='"+jQuery(elem).parent().data("number")+"']").attr("style", "border: 5px solid #3c763d;" );
        jQuery(elem).css({"background-color": "#3C763D", "color": "#fff"});

        actAnswerText = "<br/><br/><b style=\"font-size: 80%;\">Ihre Antwort:<br/>" + jQuery(elem).find("p").html() + '</b>';
    } else {
        answerFalse++;
        jQuery("ul.quiznav li[data-number='"+jQuery(elem).parent().data("number")+"']").attr("style", "border: 5px solid #E2021B;" );
        jQuery(elem).css({"background-color": "#E2021B", "color": "#fff"});
        actAnswerText = "<br/><br/><b style=\"font-size: 80%;\">Ihre Antwort:<br/>" + jQuery(elem).find("p").html() + "</b>";
        actQuestionStyle = "notcorrect";
        jQuery(elem).parent().find(".answer").each(function(){
            if (jQuery(this).data("info") % (9 / 3) == 0) {
                jQuery(this).css({"background-color": "#3C763D", "color": "#fff"});
                actAnswerText = actAnswerText + "<br/><br/><b style=\"font-size: 80%;\">Richtige Antwort:</b></br> " + jQuery(this).find("p").html();
            }
        });
    }
    jQuery(".resultdetail").append("<p class='"+actQuestionStyle+"'><b style=\"font-size: 80%;\">Frage:</b><br/><span style=\"font-style: italic;\">"+actQuestionText+actAnswerText+"</span></p>");
    setTimeout(nextSlide, 500);
    //nextSlide();
}

function startQuiz(){
    
    if (typeof iom != "undefined") {
	var iam_data_quiz = {
                "st" : "idowa",
                "sv" : "ke",
                "cp" : "ik_idowa_quiz",
                "mg" : "yes"
        }
        iom.c(iam_data_quiz, 1)
    }
    var firstQuestionsIsHide = true;
    jQuery("div#quizresult").remove();
    jQuery(".resultdetail").html("");
    questionCountSum = 0;
    questionCountAct = 1;
    answerCorrect = 0;
    answerFalse = 0;
    jQuery("ul.quiznav li").each(function(){
       jQuery(this).attr("style", "border: 5px solid #f7f7f7;");
       questionCountSum++;
    });
    jQuery("button.startquiz").hide();
    jQuery(".quizheader").slideUp();
    jQuery(".question").each(function () {
        if(firstQuestionsIsHide){
            jQuery(this).slideDown();
            firstQuestionsIsHide = false
        }
    });
    jQuery("#quiz div.answer").attr({"style": ""});
    jQuery("span.quiznav.left").html("Frage 1/"+questionCountSum);
    jQuery("span.quiznav.right").html(answerCorrect+" Punkte");
    jQuery(".quiznav").each(function(){jQuery(this).slideDown()});

}

function onJqueryReady(){



    jQuery("document").ready(function () {
        jQuery(".prev").on("click", function () {
            prevSlide();
        });
        jQuery(".next").on("click", function () {
            nextSlide();
        });
        jQuery(".startquiz").on("click", function () {
            startQuiz();
        });

        jQuery(".answer").on("click", function () {
            answerClicked(this);
        });

    });
}

function checkJquery(){
    console.log("checkJquery...");
    if(typeof jQuery == 'undefined'){
        console.log("Jquery not ready...");
        setTimeout(checkJquery, 200);
    } else {
        onJqueryReady();
    }
}

checkJquery();