@{
    Layout = "~/Views/Shared/_LayoutExam.cshtml";
    var q = (NP.Model.Question)ViewBag.q;
    var qis = (List<NP.Model.QuestionItem>)ViewBag.qi;
}
<div class="off-canvas">
    <nav class="btn_menu invisible"><button type="button" title="전체 메뉴 열기"></button></nav>
    <aside class="off-canvas-nav">
        <nav class="global-nav">
            <div class="top">문제 목록<a href="#" class="btn_close"><span>창닫기</span></a></div>
            <ul class="dropdown">
                <li class="dropdown-wrap" data-idx="1"> <a class="dropdown-toggle none" href="#">1번 | @(q.atypename)(@(q.dpoint))</a> </li>
            </ul>
        </nav>
    </aside>
    <div class="header_test">
        <h1 class="test">온라인 시험 응시 </h1>
        <div class="test_top">
            <div class="cons">
                <div class="num"><strong>1 문항</strong> <span class="txt">@q.dpoint 점 만점</span></div>
                <div class="time" id="rtime">제한없음</div>
            </div>
        </div>
    </div>
    <div class="container_test">
        <div class="consBox" id="consbox">
                <div class="evbox" data-idx="1" data-qblock="1">
                    <div id="q1" style="font-size: 20px; color: #000; background-color: #ddd; margin-top: 20px; padding: 5px;">[1번문제] <span style="font-size: 13px;">@q.atypename @(q.dpoint)점</span></div>
                    <div class="qbox" data-eqno="1" data-atype="@q.atype" data-qno="@q.qno" data-passspace="1" data-ignorecase="1">
                        <div class="quest">@Html.Raw(q.qtext)</div>
                        @if (q.atype == 0)
                        {
                            <ul class="list_2" style="color: #000;">
                                @foreach (var qi in qis)
                                {
                                    <li><label><input type="@(q.rightcount > 1 ? "checkbox" : "radio")" name="multi1" class="qicheck" id="qi@(qi.qino)" value="@qi.qino" />&nbsp;@(qi.qitext ?? "")</label>@Html.Raw(string.IsNullOrEmpty(qi.fileurl) ? "" : ("<div class=\"cons\"><img style=\"max-width: 90%;\" for=\"qi" + qi.qino + "\" src=\"" + (Model.Files + qi.fileurl) + "\" /></div>"))</li>
                                }
                            </ul>
                        }
                        else
                        {
                            <div class="answer">
                                @if (q.atype == 2)
                                {
                                    <textarea maxlength="1500" class="qtextarea" placeholder="답안을 입력하세요(최대1500글자)"></textarea>
                                }
                                else
                                {
                                    <input type="text" maxlength="1500" class="qtextarea" placeholder="답안을 입력하세요(최대1500글자)" value="" />
                                    <div class="txt">
                                        ※ 전산으로 자동 채점 되므로 정확한 단어를 써야 정답으로 처리됩니다.<br/>
                                        ※ 특수문자, 기호, 괄호 등이 포함되면 오답처리 될 수 있습니다.
                                    </div>
                                }
                            </div>
                        }
                    </div>
                </div>
        </div>
        <div class="footerWrap_test">
            <div class="footer">
                <div class="fl">
                    
                </div>
                <div class="fr" style="margin-left: 10px;"><a href="#" class="button medium orange" id="btnsubmit">제출</a></div>
            </div>
        </div>
    </div>
</div>
@section scripts{
    <style type="text/css">
        .quest img {
            max-width: 99% !important;
        }
        .hidecursor {
            cursor: default;
        }
    </style>
    <script>
    var si;
    var rseq = 120;
    var vcount = 1000;
    var cblock = 1;
    var lastblock = 1;
    $(document).ready(function () {
        $(document).on("mouseup", function (e) {
            var el = e.target || event.target;
            if (!$(el).is("input") && !$(el).is("textarea") && !$(el).is("a")) {
                if (document.selection) {
                    document.selection.empty()
                } else {
                    window.getSelection().removeAllRanges()
                }
            }
        });
        si = setInterval(ctime, 1000);
        $("#btnsubmit").on("click", function () {
            stopsoundall();
            if (!$("#btnsubmit").hasClass("btnhide")) {
                if ($("li.dropdown-wrap a.none").length > 0) {
                    confirmtoggle(true,"미응시한 문항이 있습니다. 그래도 제출하시겠습니까?", "save(true);");
                }
                else {
                    confirmtoggle(true, "시험제출을 완료하시겠습니까? 완료하시면 시험이 종료되며 더 이상 수정이 불가능합니다.", "save(true);");
                }
            }
        });
        $(".evbox").on("change", function () {
            $("li.dropdown-wrap[data-idx=" + $(this).attr("data-idx") + "] a").addClass("none");
            if ($(this).find("input.qicheck:checked").length > 0 || ($(this).find(".qtextarea").length > 0 && getBytes($(this).find(".qtextarea").val()) > 0)) {
                $("li.dropdown-wrap[data-idx=" + $(this).attr("data-idx") + "] a").removeClass("none");
            }
        });
        if (!ismobile()) {
            $("#wrap").addClass("move-right");
        }
    });
    $(window).on("keydown", function (e) {
        if (e.keyCode == 17 || e.keyCode == 18 || e.keyCode == 27 || (e.keyCode > 111 && e.keyCode < 124) || e.altKey || e.ctrlKey) {
            prv(); return false;
        }
    });
    var _issubmit = false;
    var _isfullscreenbrs = false;
    var _isie = true;
    var _isstarted = false;
    function launchIntoFullscreen(element) {
        if (element.requestFullscreen) {
            element.requestFullscreen();
        } else if (element.mozRequestFullScreen) {
            element.mozRequestFullScreen();
        } else if (element.webkitRequestFullscreen) {
            element.webkitRequestFullscreen();
        } else if (element.msRequestFullscreen) {
            element.msRequestFullscreen();
        }
    }
    function save(issubmit) {
        msg("시험을 제출했습니다.", null, null, null, "self.close()");
        clearTimeout(ctime);
    }
    var _absalertclose = true;
    function ctime() {
        rseq--;
        $("#rtime").text(fillzero(Math.floor(rseq / 60), 3) + " : " + fillzero(rseq % 60, 2));            
        if (rseq < 60) {
            $("#rtime").css({ "color": rseq % 2 > 0 ? "red" : "#ff8400", "font-size": "40px" });
        }
    }
    </script>
}