{"id":762,"date":"2024-04-24T09:28:46","date_gmt":"2024-04-24T08:28:46","guid":{"rendered":"https:\/\/itsiller-software.com\/?page_id=762"},"modified":"2024-05-03T17:29:33","modified_gmt":"2024-05-03T16:29:33","slug":"9-3","status":"publish","type":"page","link":"https:\/\/itsiller-software.com\/index.php\/9-3\/","title":{"rendered":"9"},"content":{"rendered":"<div>\n<div class=\"sentence\" id=\"sentence1\" data-words=\"Does,this,train,go,to,Brighton?\" data-correct-sequence=\"Does,this,train,go,to,Brighton?\"><\/div>\n<ul class=\"word-list\" id=\"word-list1\"><\/ul>\n<div class=\"result\" id=\"result1\"><\/div>\n<hr \/>\n<\/div>\n<div>\n<div class=\"sentence\" id=\"sentence2\" data-words=\"This,is,another,example,sentence\" data-correct-sequence=\"This,is,another,example,sentence\"><\/div>\n<ul class=\"word-list\" id=\"word-list2\"><\/ul>\n<div class=\"result\" id=\"result2\"><\/div>\n<hr \/>\n<\/div>\n<div>\n<style> \n    hr {\n    margin-top: 0;\n    margin-bottom: 0;<\/p>\n<p>}\n   .sentence, .word-list, .result {\n  font-family: 'Raleway', sans-serif;\n  font-size: 13pt;\n} \n  .word-list {\n    margin-bottom: -10px;\n    position: relative; \/* \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 \u0441\u043b\u043e\u0432 *\/\n}<\/p>\n<p>.word-list .selected {\n    position: absolute; \/* \u041f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u0443\u0435\u043c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u044b\u0435 \u0441\u043b\u043e\u0432\u0430 \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e *\/\n    top: 100%; \/* \u0420\u0430\u0437\u043c\u0435\u0449\u0430\u0435\u043c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u044b\u0435 \u0441\u043b\u043e\u0432\u0430 \u043f\u043e\u0434 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u043e\u043c \u0441\u043b\u043e\u0432 *\/\n    left: 0; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u0435\u043c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u044b\u0435 \u0441\u043b\u043e\u0432\u0430 \u043f\u043e \u043b\u0435\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e *\/\n    display: none; \/* \u0421\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u044b\u0435 \u0441\u043b\u043e\u0432\u0430 \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e *\/\n} <\/p>\n<p>  .sentence {\n    margin-bottom: -15px;\n  }\n  .word-list {\n    margin-bottom: 3px;\n  }\n  .word-list li {\n    cursor: pointer;\n    display: inline-block;\n    margin-right: 10px;\n  }\n  .word-list li.selected {\n    color: #7886bc;\n}\n  }\n  .result {\n    margin-bottom: 0px;\n  }\n  .correct {\n    color: green;\n  }\n  .incorrect {\n    color: red;\n  }\n<\/style>\n<\/div>\n<div>\n<p>    <script src=\"https:\/\/code.jquery.com\/jquery-3.6.0.min.js\"><\/script><br \/>\n<script>\n$(document).ready(function() {\n  \/\/ \u0418\u0442\u0435\u0440\u0438\u0440\u0443\u0435\u043c\u0441\u044f \u043f\u043e \u0432\u0441\u0435\u043c \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u043c\n  $('.sentence').each(function(index) {\n    var sentenceId = index + 1;\n    var words = $(this).attr('data-words').split(',');\n    var correctSequence = $(this).attr('data-correct-sequence').split(',');\n    var shuffledWords = shuffle(words);<\/p>\n<p>    \/\/ \u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u043b\u043e\u0432 \u0434\u043b\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0435\u043d\u0438\u044f\n    shuffledWords.forEach(function(word) {\n      $('#word-list' + sentenceId).append('<\/p>\n<li>' + word + '<\/li>\n<p>');\n    });<\/p>\n<p>    var sentence = [];<\/p>\n<p>    $('.word-list#word-list' + sentenceId + ' li').click(function() {\n  var word = $(this).text();\n  var sentenceElement = '#sentence' + sentenceId;\n  var resultListElement = '#result' + sentenceId;<\/p>\n<p>  if (!sentence.includes(word)) {\n    sentence.push(word);\n    $(sentenceElement).text(sentence.join(' '));\n    $(this).addClass('selected');\n    checkSequence(sentence, correctSequence, resultListElement);\n  } else {\n    var index = sentence.indexOf(word);\n    sentence.splice(index, 1);\n    $(this).removeClass('selected'); \/\/ \u0423\u0434\u0430\u043b\u044f\u0435\u043c \u043a\u043b\u0430\u0441\u0441 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\n    checkSequence(sentence, correctSequence, resultListElement);\n  }\n});<\/p>\n<p>    $('.sentence#sentence' + sentenceId).click(function() {\n    var word = $(this).text().split(' ').pop();\n    var index = sentence.indexOf(word);\n    var wordListElement = '.word-list#word-list' + sentenceId;\n    var resultListElement = '#result' + sentenceId;<\/p>\n<p>    if (index !== -1) {\n        sentence.splice(index, 1);\n        $(this).text(sentence.join(' '));\n        $(wordListElement + ' li:contains(' + word + ')').removeClass('selected'); \/\/ \u0423\u0434\u0430\u043b\u044f\u0435\u043c \u043f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0443 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430\n        checkSequence(sentence, correctSequence, resultListElement);\n    }\n});\n  });<\/p>\n<p>  function checkSequence(sentence, correctSequence, resultListElement) {\n    var currentSequence = sentence;\n    var isCorrect = true;<\/p>\n<p>    if (currentSequence.length !== correctSequence.length) {\n      isCorrect = false;\n    } else {\n      for (var i = 0; i < currentSequence.length; i++) {\n        if (currentSequence[i] !== correctSequence[i]) {\n          isCorrect = false;\n          break;\n        }\n      }\n    }\n    \n    if (isCorrect) {\n      $(resultListElement).text('correct').removeClass('incorrect').addClass('correct');\n    } else {\n      $(resultListElement).text('incorrect').removeClass('correct').addClass('incorrect');\n    }\n  }\n  \n  \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u0438\u0432\u0430\n  function shuffle(array) {\n    var currentIndex = array.length, randomIndex;\n\n    while (currentIndex != 0) {\n      randomIndex = Math.floor(Math.random() * currentIndex);\n      currentIndex--;\n\n      [array[currentIndex], array[randomIndex]] = [array[randomIndex], array[currentIndex]];\n    }\n\n    return array;\n  }\n});\n<\/script>\n<\/div>\n<p><!--more--><br \/>\n<!-- {\"type\":\"layout\",\"children\":[{\"type\":\"section\",\"props\":{\"image_position\":\"center-center\",\"style\":\"default\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"middle\",\"width\":\"default\"},\"children\":[{\"type\":\"row\",\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\"},\"children\":[{\"type\":\"text\",\"props\":{\"column_breakpoint\":\"m\",\"content\":\"\n\n<div class=\\\"sentence\\\" id=\\\"sentence1\\\" data-words=\\\"Does,this,train,go,to,Brighton?\\\" data-correct-sequence=\\\"Does,this,train,go,to,Brighton?\\\"><\\\/div>\\n\n\n<ul class=\\\"word-list\\\" id=\\\"word-list1\\\"><\\\/ul>\\n\n\n<div class=\\\"result\\\" id=\\\"result1\\\"><\\\/div>\n\n<hr \\\/>\\n\",\"margin\":\"default\",\"margin_remove_bottom\":true,\"margin_remove_top\":true}},{\"type\":\"text\",\"props\":{\"column_breakpoint\":\"m\",\"content\":\"\\n\n\n<div class=\\\"sentence\\\" id=\\\"sentence2\\\" data-words=\\\"This,is,another,example,sentence\\\" data-correct-sequence=\\\"This,is,another,example,sentence\\\"><\\\/div>\\n\n\n<ul class=\\\"word-list\\\" id=\\\"word-list2\\\"><\\\/ul>\\n\n\n<div class=\\\"result\\\" id=\\\"result2\\\"><\\\/div>\n\n<hr \\\/>\\n\\n\\n\\n\",\"margin\":\"default\",\"margin_remove_bottom\":true,\"margin_remove_top\":true}}]}]}]},{\"type\":\"section\",\"props\":{\"image_position\":\"center-center\",\"style\":\"default\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"middle\",\"width\":\"default\"},\"children\":[{\"type\":\"row\",\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\"}}]}]},{\"type\":\"section\",\"props\":{\"image_position\":\"center-center\",\"style\":\"default\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"middle\",\"width\":\"default\"},\"children\":[{\"type\":\"row\",\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\"},\"children\":[{\"type\":\"html\",\"props\":{\"content\":\"\n\n<style> \\n    hr {\\n    margin-top: 0;\\n    margin-bottom: 0;\\n    \\n}\\n   .sentence, .word-list, .result {\\n  font-family: 'Raleway', sans-serif;\\n  font-size: 13pt;\\n} \\n  .word-list {\\n    margin-bottom: -10px;\\n    position: relative; \\\/* \\u0414\\u043e\\u0431\\u0430\\u0432\\u043b\\u044f\\u0435\\u043c \\u043f\\u043e\\u0437\\u0438\\u0446\\u0438\\u043e\\u043d\\u0438\\u0440\\u043e\\u0432\\u0430\\u043d\\u0438\\u0435 \\u0434\\u043b\\u044f \\u043a\\u043e\\u043d\\u0442\\u0435\\u0439\\u043d\\u0435\\u0440\\u0430 \\u0441\\u043b\\u043e\\u0432 *\\\/\\n}\\n\\n.word-list .selected {\\n    position: absolute; \\\/* \\u041f\\u043e\\u0437\\u0438\\u0446\\u0438\\u043e\\u043d\\u0438\\u0440\\u0443\\u0435\\u043c \\u0432\\u044b\\u0431\\u0440\\u0430\\u043d\\u043d\\u044b\\u0435 \\u0441\\u043b\\u043e\\u0432\\u0430 \\u0430\\u0431\\u0441\\u043e\\u043b\\u044e\\u0442\\u043d\\u043e *\\\/\\n    top: 100%; \\\/* \\u0420\\u0430\\u0437\\u043c\\u0435\\u0449\\u0430\\u0435\\u043c \\u0432\\u044b\\u0431\\u0440\\u0430\\u043d\\u043d\\u044b\\u0435 \\u0441\\u043b\\u043e\\u0432\\u0430 \\u043f\\u043e\\u0434 \\u043a\\u043e\\u043d\\u0442\\u0435\\u0439\\u043d\\u0435\\u0440\\u043e\\u043c \\u0441\\u043b\\u043e\\u0432 *\\\/\\n    left: 0; \\\/* \\u0412\\u044b\\u0440\\u0430\\u0432\\u043d\\u0438\\u0432\\u0430\\u0435\\u043c \\u0432\\u044b\\u0431\\u0440\\u0430\\u043d\\u043d\\u044b\\u0435 \\u0441\\u043b\\u043e\\u0432\\u0430 \\u043f\\u043e \\u043b\\u0435\\u0432\\u043e\\u043c\\u0443 \\u043a\\u0440\\u0430\\u044e *\\\/\\n    display: none; \\\/* \\u0421\\u043a\\u0440\\u044b\\u0432\\u0430\\u0435\\u043c \\u0432\\u044b\\u0431\\u0440\\u0430\\u043d\\u043d\\u044b\\u0435 \\u0441\\u043b\\u043e\\u0432\\u0430 \\u0438\\u0437\\u043d\\u0430\\u0447\\u0430\\u043b\\u044c\\u043d\\u043e *\\\/\\n} \\n    \\n\\n    \\n  .sentence {\\n    margin-bottom: -15px;\\n  }\\n  .word-list {\\n    margin-bottom: 3px;\\n  }\\n  .word-list li {\\n    cursor: pointer;\\n    display: inline-block;\\n    margin-right: 10px;\\n  }\\n  .word-list li.selected {\\n    color: #7886bc;\\n}\\n  }\\n  .result {\\n    margin-bottom: 0px;\\n  }\\n  .correct {\\n    color: green;\\n  }\\n  .incorrect {\\n    color: red;\\n  }\\n<\\\/style>\"},\"name\":\"style\"}]}]}]},{\"type\":\"section\",\"props\":{\"image_position\":\"center-center\",\"style\":\"default\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"middle\",\"width\":\"default\"},\"children\":[{\"type\":\"row\",\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\"},\"children\":[{\"type\":\"html\",\"props\":{\"content\":\"<script src=\\\"https:\\\/\\\/code.jquery.com\\\/jquery-3.6.0.min.js\\\"><\\\/script>\\n<script>\\n$(document).ready(function() {\\n  \\\/\\\/ \\u0418\\u0442\\u0435\\u0440\\u0438\\u0440\\u0443\\u0435\\u043c\\u0441\\u044f \\u043f\\u043e \\u0432\\u0441\\u0435\\u043c \\u043f\\u0440\\u0435\\u0434\\u043b\\u043e\\u0436\\u0435\\u043d\\u0438\\u044f\\u043c\\n  $('.sentence').each(function(index) {\\n    var sentenceId = index + 1;\\n    var words = $(this).attr('data-words').split(',');\\n    var correctSequence = $(this).attr('data-correct-sequence').split(',');\\n    var shuffledWords = shuffle(words);\\n    \\n    \\\/\\\/ \\u0413\\u0435\\u043d\\u0435\\u0440\\u0438\\u0440\\u0443\\u0435\\u043c \\u0441\\u043b\\u0443\\u0447\\u0430\\u0439\\u043d\\u044b\\u0439 \\u0441\\u043f\\u0438\\u0441\\u043e\\u043a \\u0441\\u043b\\u043e\\u0432 \\u0434\\u043b\\u044f \\u0442\\u0435\\u043a\\u0443\\u0449\\u0435\\u0433\\u043e \\u043f\\u0440\\u0435\\u0434\\u043b\\u043e\\u0436\\u0435\\u043d\\u0438\\u044f\\n    shuffledWords.forEach(function(word) {\\n      $('#word-list' + sentenceId).append('\n\n<li>' + word + '<\\\/li>');\\n    });\\n    \\n    var sentence = [];\\n    \\n    $('.word-list#word-list' + sentenceId + ' li').click(function() {\\n  var word = $(this).text();\\n  var sentenceElement = '#sentence' + sentenceId;\\n  var resultListElement = '#result' + sentenceId;\\n\\n  if (!sentence.includes(word)) {\\n    sentence.push(word);\\n    $(sentenceElement).text(sentence.join(' '));\\n    $(this).addClass('selected');\\n    checkSequence(sentence, correctSequence, resultListElement);\\n  } else {\\n    var index = sentence.indexOf(word);\\n    sentence.splice(index, 1);\\n    $(this).removeClass('selected'); \\\/\\\/ \\u0423\\u0434\\u0430\\u043b\\u044f\\u0435\\u043c \\u043a\\u043b\\u0430\\u0441\\u0441 \\u0442\\u043e\\u043b\\u044c\\u043a\\u043e \\u0434\\u043b\\u044f \\u0442\\u0435\\u043a\\u0443\\u0449\\u0435\\u0433\\u043e \\u044d\\u043b\\u0435\\u043c\\u0435\\u043d\\u0442\\u0430\\n    checkSequence(sentence, correctSequence, resultListElement);\\n  }\\n});\\n    \\n    $('.sentence#sentence' + sentenceId).click(function() {\\n    var word = $(this).text().split(' ').pop();\\n    var index = sentence.indexOf(word);\\n    var wordListElement = '.word-list#word-list' + sentenceId;\\n    var resultListElement = '#result' + sentenceId;\\n\\n    if (index !== -1) {\\n        sentence.splice(index, 1);\\n        $(this).text(sentence.join(' '));\\n        $(wordListElement + ' li:contains(' + word + ')').removeClass('selected'); \\\/\\\/ \\u0423\\u0434\\u0430\\u043b\\u044f\\u0435\\u043c \\u043f\\u043e\\u0434\\u0441\\u0432\\u0435\\u0442\\u043a\\u0443 \\u0442\\u043e\\u043b\\u044c\\u043a\\u043e \\u0434\\u043b\\u044f \\u0443\\u0434\\u0430\\u043b\\u0435\\u043d\\u043d\\u043e\\u0433\\u043e \\u0441\\u043b\\u043e\\u0432\\u0430\\n        checkSequence(sentence, correctSequence, resultListElement);\\n    }\\n});\\n  });\\n  \\n  function checkSequence(sentence, correctSequence, resultListElement) {\\n    var currentSequence = sentence;\\n    var isCorrect = true;\\n    \\n    if (currentSequence.length !== correctSequence.length) {\\n      isCorrect = false;\\n    } else {\\n      for (var i = 0; i < currentSequence.length; i++) {\\n        if (currentSequence[i] !== correctSequence[i]) {\\n          isCorrect = false;\\n          break;\\n        }\\n      }\\n    }\\n    \\n    if (isCorrect) {\\n      $(resultListElement).text('correct').removeClass('incorrect').addClass('correct');\\n    } else {\\n      $(resultListElement).text('incorrect').removeClass('correct').addClass('incorrect');\\n    }\\n  }\\n  \\n  \\\/\\\/ \\u0424\\u0443\\u043d\\u043a\\u0446\\u0438\\u044f \\u0434\\u043b\\u044f \\u043f\\u0435\\u0440\\u0435\\u043c\\u0435\\u0448\\u0438\\u0432\\u0430\\u043d\\u0438\\u044f \\u043c\\u0430\\u0441\\u0441\\u0438\\u0432\\u0430\\n  function shuffle(array) {\\n    var currentIndex = array.length, randomIndex;\\n\\n    while (currentIndex != 0) {\\n      randomIndex = Math.floor(Math.random() * currentIndex);\\n      currentIndex--;\\n\\n      [array[currentIndex], array[randomIndex]] = [array[randomIndex], array[currentIndex]];\\n    }\\n\\n    return array;\\n  }\\n});\\n<\\\/script>\"},\"name\":\"script\"}]}]}]}],\"version\":\"4.3.8\"} --><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-762","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/pages\/762","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/comments?post=762"}],"version-history":[{"count":45,"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/pages\/762\/revisions"}],"predecessor-version":[{"id":1433,"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/pages\/762\/revisions\/1433"}],"wp:attachment":[{"href":"https:\/\/itsiller-software.com\/index.php\/wp-json\/wp\/v2\/media?parent=762"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}