<?php

$id = Str::random(5);

$moduleHtml = '
    <div id="'.$id.'" class="question-builder"></div>

    <script>
        var '.$id.'_docReady = function (fn) {
            var stateCheck = setInterval(function () {
                if (document.readyState !== "complete") return;
                clearInterval(stateCheck);
                try {fn()} catch (e) {}
            }, 1000);
        };
        '.$id.'_docReady(function () {
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState === XMLHttpRequest.DONE) {
                    if (xmlhttp.status === 200) {
                        let questionContainer = document.getElementById("'.$id.'");
                        questionContainer.innerHTML = xmlhttp.responseText;

                        if (document.body.classList.contains("web-editor")) {
                            var anchors = document.getElementsByClassName("card-link");
                            if (anchors.length > 0) {
                                for (var i = 0; i < anchors.length; i++) {
                                    anchors[i].style = "pointer-events: none; cursor: default;";
                                }
                            }
                        }
                    }
                }
            };
            xmlhttp.open("GET", "/api/builder/question", true);
            xmlhttp.send();
        });
    </script>
';

$moduleSettings = '
    {
        "ref": "",
        "style": "style-1"
    }
';
?>

<div class="row clearfix border-0">
    <div class="col-12"
         data-noedit
         data-module="question"
         data-dialog-width="500px"
         data-module-desc="Question"
         data-html="{{ encode_uri_component($moduleHtml) }}"
         data-settings="{{ encode_uri_component($moduleSettings) }}"
    >
    </div>
</div>
