Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
107 lines (99 sloc) 7.01 KB

testing system from WebSchool

JS iframe виджет

DEMO

Описание

Данная система тестироваиния предназначена для создания своего теста, который можно поместить на сайт. Система тестирования имеет следующие особенности:

  1. Ручное заполнение вопросов, через .json файл
  2. Настраивается большинство параметров тестирования(количество вопросов, минимальное количество правильных ответов для похождения теста, количество минут на прохождение теста и описание)
  3. Есть три типа вопросов: с открытым вопросом, с выбором одного вопроса из списка(<=5) и с выбором одного или нескольких вопросов из списка(<=5)
  4. После прохождения теста результаты отправляются в родительское окно и дальше мы можем с ними работать, как захотим
  5. Тестирование защищенно от просмотра ответов
  6. Дизайн основан на открытом фреймворке materialize, внешний вид можно настроить под свои нужды
  7. Есть возможность выбрать определенное количество вопросов из банка вопросов
  8. Выборка вопросов происходит со случайной прогрессирующей последовательностью.

Инструкция

  1. Скачиваем репозиторий и загружаем к себе на хостинг
  2. Создаем в каталоге папку с названием вашего теста
  3. Копируем в созданную папку файл "test.php"
  4. Создаём в этой же папке файл "questions.json"
  5. Заполняем файл "questions.json" вопросами (см. инструкцию ниже)
  6. Вставляем тест на сайт и задаём параметры.

Инструкция по заполнению файла "questions.json"

Файл "questions.json" имеет следующую структуру:

{
  "1": {
    "question": "Содержание вопроса с выбором одного варианта из нескольких предолженных",
    "1": "Вариант один",
    "2": "Вариант два",
    "3": "Вариант три",
    "4": "Вариант четыре",
    "5": "Вариант пять",
    "answer": "Вариант три",
    "type":"oneRight"
  },
  "2": {
    "question": "Содержание вопроса с выбором нескольких вариантов из нескольких предложенных",
    "1": "Вариант один",
    "2": "Вариант два",
    "3": "Вариант три",
    "4": "Вариант четыре",
    "5": "Вариант пять",
    "answer" : "Вариант дваВариант четыреВариант пять",
    "type":"multiRight"
  },
  "3": {
    "question": "Содержание вопроса с открытым ответом",
    "answer":"Ответ на вопрос",
    "type":"open"
  }
}

Согласно структуре:

  • В данном примере представленно три вопроса, таких вопросов может быть неограниченное количество.
  • В текущей версии есть три типа вопросов: вопрос с выбором одного варианта ответа из нескольких, вопрос с выбором нескольких вариантов ответа и открытый вопрос, где надо вписать строку/слово в текстовое поле.
  • Вариантов ответа может быть от одного до пяти
  • в поле "answer" копируется текст ответа
  • Если "type" Задан "multiRight", то в поле "answer" вставляются все ответы по порядку без пробела.
  • В соответствии типа вопроса изменяется поле "type", оно может быть трех видов: "oneRight" - вопрос с выбором одного варианта ответа из нескольких, "multiRight" - вопрос с выбором нескольких вариантов ответа и "open" - открытый вопрос.
  • При заполнении следует избегать ситсксических ошибок, для удобства можно воспользоваться следующим сервисом jshint, Или аналогичным.

Вставка теста на сайт

Для добавления теста на сайт, необходимо вставить iframe и отправить в него настройки. Пример ниже:

<script> 
document.write('<iframe id="test-window" src="PATH TO TEST/tests/test_demo_ru/test.php#?hash="' + Math.random() + '"></iframe>');

// Отправляем данные в дочернее окно
window.onload = function(){
$(function(){
       var message = {
            countQuestionsInTest : 20, 
            countQuestionsAll: 44,
            countPointsToOK : 15,
            min : 10,
            testName : 'Название теста'
        };
       var iframe = $('#test-window');
       iframe[0].contentWindow.postMessage(message, document.location);
       });
};
  </script>

В объекте message мы передаем настройки нашего теста.

  • countQuestionsInTest - Количество вопросов, которые будут в тесте (не больше, чем значение countQuestionsAll)
  • countQuestionsAll - Количество вопросов всего в файле questions.json (не меньше, чем значение countQuestionsInTest)
  • countPointsToOK - Минимальное количество вопросов, на которые необходимо ответить (не больше, чем значение countQuestionsInTest)
  • min - Количество времени отведенное на выполнение теста
  • testName - Название теста