<!DOCTYPE html>
<html>

<head>
    <title>easygenerator</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />

    <meta http-equiv="cache-control" content="max-age=0" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
    <meta http-equiv="pragma" content="no-cache" />

    <link href='http://fonts.googleapis.com/css?family=Roboto:500,400,300,100,700&subset=latin,cyrillic-ext' rel='stylesheet'
        type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed&subset=latin,cyrillic-ext' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Roboto+Slab:400,700&subset=latin,cyrillic-ext' rel='stylesheet' type='text/css'>

    <link rel="stylesheet" href="styles.css?v=1517318961580">
</head>

<body>
    <div data-bind="template: { afterRender: renderingFinished }">
        <img class="course-logo" data-bind="event: { load: logoUploaded, error: logoUploaded }, attr: { src: logoUrl }" />

        <h1 class="course-caption" data-bind="text: title"></h1>

        <!-- ko if: hasIntroductionContent -->
        <div class="course-intro-text styled-content content" data-bind="loadHtml: introductionContent"></div>
        <!-- /ko -->
        <!-- ko foreach: { data: sections, as: 'section' } -->
        <!-- ko if: $root.filterQuestionTypes(section.questions).length > 0 -->
        <h2 class="section-info" data-bind="text: section.title"></h2>

        <div>

            <!-- ko foreach: { data: $root.filterQuestionTypes(section.questions), as: 'question' } -->

            <div class="question-body">

                <!-- ko if: question.type == 'informationContent' -->

                <h3 class="question-title" data-bind="text: question.title"></h3>
                <!-- ko if: question.learningContents.length > 0 -->
                <ul class="learning-content-items content">
                    <!-- ko foreach: question.learningContents -->
                    <li class="learning-content-item styled-content" data-bind="loadHtml: html"></li>
                    <!-- /ko -->
                </ul>
                <!-- /ko -->
                <!-- /ko -->
                <!-- ko ifnot: question.type == 'informationContent' -->
                <!-- ko if: question.learningContents.length > 0 -->
                <ul class="learning-content-items content with-icon">
                    <!-- ko foreach: question.learningContents -->
                    <li class="learning-content-item styled-content" data-bind="loadHtml: html"></li>
                    <!-- /ko -->
                </ul>
                <!-- /ko -->
                <h3 class="question-title with-icon" data-bind="text: question.title, css: {survey: question.isSurvey}"></h3>

                <!-- ko if: question.questionInstructions.length > 0 -->
                <div class="question-content-wrapper">
                    <!-- ko foreach: question.questionInstructions -->
                    <div class="question-content styled-content" data-bind="loadHtml: html"></div>
                    <!-- /ko -->
                </div>
                <!-- /ko -->

                <!-- ko if: question.type == 'singleSelectText' -->
                <ul class="question-answers-list" data-bind="foreach: question.answers">
                    <li class="radio">
                        <span class="radio-icon-wrapper">
                            <button class="radio-icon"></button>
                        </span>
                        <label class="radio-text" data-bind="text: text"></label>
                    </li>
                </ul>
                <!-- /ko -->
                <!-- ko if: question.type == 'multipleSelect' -->
                <ul class="question-answers-list" data-bind="foreach: question.answers">
                    <li class="checkbox">
                        <span class="checkbox-icon-wrapper">
                            <button class="checkbox-icon"></button>
                        </span>
                        <label class="checkbox-text" data-bind="text: text"></label>
                    </li>
                </ul>
                <!-- /ko -->
                <!-- ko if: question.type == 'singleSelectImage' -->
                <ul class="single-select-image" data-bind="foreach: question.answers">
                    <li class="select-image">
                        <div class="select-image-wrapper">
                            <span class="preview-thumbnail">
                                <img class="thumbnail" data-bind="event: { load: $root.singleSelectImageAnswerLoaded, error: $root.singleSelectImageAnswerLoaded }, attr:{ 'data-image': image, src: image + '?height=200&amp;width=250&amp;scaleBySmallerSide=true' }">
                            </span>
                            <button class="preview-button-wrapper"></button>
                        </div>
                        <div class="question-answer-radiobutton-wrapper">
                            <a class="question-answer-radiobutton">&nbsp;</a>
                        </div>
                    </li>
                </ul>
                <!-- /ko -->
                <!-- ko if: question.type == 'fillInTheBlank' -->
                <div class="question-content-wrapper blank-content fill-in-the-blank">
                    <!-- ko if: question.hasContent -->
                    <div class="question-content blank-answers styled-content" data-bind="loadHtml: content"></div>
                    <!-- /ko -->
                </div>
                <!-- /ko -->
                <!-- ko if: question.type == 'textMatching' -->
                <div class="text-matching-caption" data-translate-text="[text matching question pdf hint]">
                    Сombine elements from the left column with the elements on the right
                </div>
                <!-- ko foreach: $root.shuffleKeyValues(question.answers) -->
                <div class="text-matching-row">
                    <div class="text-matching-column">
                        <div class="text-matching-source-wrapper">
                            <div class="text-matching-source">
                                <div class="text-matching-source-text-wrapper">
                                    <div class="text-matchig-source-text" data-bind="text: key"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="text-matching-column empty">&nbsp;</div>
                    <div class="text-matching-column">
                        <div class="text-matching-target-wrapper">
                            <div class="text-matching-target">
                                <div class="text-matching-target-text-wrapper">
                                    <div class="text-matching-target-text" data-bind="text: value"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <!-- /ko -->
                <!-- /ko -->
                <!-- ko if: question.type == 'rankingText' -->
                <div data-bind="foreach: $root.shuffle(question.answers)">
                    <div class="ranking-item">
                        <div class="ranking-item-box"></div>
                        <div class="ranking-item-text" data-bind="text: text"></div>
                    </div>
                </div>
                <!-- /ko -->
                <!-- ko if: question.type == 'statement' -->
                <ul class="statement">
                    <li class="statement-headers-group">
                        <div class="statement-option" data-translate-text="[statement question true text]">
                            True
                        </div>
                        <div class="statement-option" data-translate-text="[statement question false text]">
                            False
                        </div>
                    </li>

                    <!-- ko foreach: question.answers -->
                    <li class="statement-item">
                        <span class="statement-option ">
                            <span class="radio-icon-wrapper">
                                <button class="radio-icon"></button>
                            </span>
                        </span>
                        <span class="statement-option-separator-wrapper">
                            <span class="statement-option-separator"></span>
                        </span>
                        <span class="statement-option">
                            <span class="radio-icon-wrapper">
                                <button class="radio-icon"></button>
                            </span>
                        </span>
                        <span class="statement-label" data-bind="text: text"></span>
                    </li>
                    <!-- /ko -->
                </ul>
                <!-- /ko -->
                <!-- ko if: question.type == 'openQuestion' -->
                <div class="edit-field-wrapper">
                    <textarea class="edit-field selectable"></textarea>
                </div>
                <!-- /ko -->
                <!-- /ko -->

            </div>

            <!-- /ko -->

        </div>
        <!-- /ko -->
        <!-- /ko -->
    </div>
    <script src="scripts.js?v=1517318961580"></script>
</body>

</html>