JFMedir embed survey demo

by romanych

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Embed survey demo</title>
    <meta name="userreport:mediaId" value="8e1caac7-98ad-431d-b327-f61d963bc225" />
    <style>
        .wrapper {
            max-width: 600px;
            min-width: 300px;
            margin: 0 auto;
        }

        #surveyContainer {
            height: 400px;
            border: 3px darkgray dashed;
            padding: 10px;
            margin-top: 20px;
        }
    </style>
</head>

<body>
    <script>
function showSurvey() {
    window.audienceProjectLayer = window.audienceProjectLayer || [];
    audienceProjectLayer.push(['embedSurvey', 'surveyContainer', {
        ignoreLocalQuarantine: true,
        surveyUrl: 'https://localhost:8000/vs/survey.html',
        onDoneCallback: surveEnded,
        customizations: {
            "invitation": {
                "headline": "We want to understand you better. Answer few questions please",
                "accept": "Sure",
                "decline": "Skip"
            },
            "thankYou": {
                "headline": "Much appreciated",
                "close": "Proceed to results",
                "built": ""
            },
            disabledQuestions: [2, 23]
        }
    }])
}

function surveEnded() {
    document.getElementById("surveyContainer").innerHTML = "Survey ended";
}
    </script>
    <script src="https://sak.userreport.com/jfmedier/launcher.js" async></script>
    <div class="wrapper">
        <h1>Embed survey demo</h1>
        <p>Using embed survey functionality you can decide when users should be interviewed based on your logic.</p>
        <p>You can do some customizations to the survey - invitation screen, thank you screen and disable some questions
        </p>
        <pre style='color:#000000;background:#ffffff;'>
<span style='color:#800000; font-weight:bold; '>function</span> showSurvey<span...