推論引擎 | Programming Project | OrangeApple Learning Platform

{"id":52585,"student_id":10,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n    \u003ctitle\u003eDocument\u003c/title\u003e\\n    \u003clink rel=\\\"stylesheet\\\" href=\\\"https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css\\\"\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n    \u003cdiv class=\\\"chatbox\\\"\u003e\\n        \u003ch5 class=\\\"text-center\\\"\u003eAlice\u003c/h5\u003e\\n        \u003cdiv class=\\\"comments js-comment\\\"\u003e\\n        \u003c/div\u003e\\n        \u003cinput class=\\\"form-control js-input\\\" placeholder=\\\"是/不是/不知道\\\"\u003e\\n    \u003c/div\u003e\\n    \u003cscript src=\\\"https://unpkg.com/rivescript@latest/dist/rivescript.min.js\\\" type=\\\"application/javascript\\\" charset=\\\"utf-8\\\"\u003e\u003c/script\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"body {\\n    width: 100vw;\\n    height: 100vh;\\n    padding: 10px;\\n}\\n\\nh5 {\\n    position: absolute;\\n    top: 0;\\n    width: 100%;\\n    border-bottom: 2px solid #ddd;\\n    padding-bottom: 10px;\\n    color: #666;\\n    background-color: #fff;\\n    z-index: 1;\\n}\\n\\n.chatbox {\\n    max-width: 550px;\\n    height: calc(100vh - 20px);\\n    margin: auto;\\n    position: relative;\\n    \\n}\\n\\n.chatbox input {\\n    position: absolute;\\n    bottom: 0;\\n}\\n\\n.comments {\\n    position: absolute;\\n    top: 0;\\n    left: 0;\\n    width: 100%;\\n    height: 100%;\\n    padding: 50px 10px;\\n    overflow-y: scroll;\\n}\\n\\n.comment span {\\n    display: inline-block;\\n    max-width: 75%;\\n    padding: 8px;\\n    border-radius: 20px;\\n    font-size: .9rem;\\n}\\n\\n.comment.comment-right {\\n    text-align: right;\\n}\\n\\n.comment.comment-right span {\\n    color: #fff;\\n    background-color: rgb(59, 114, 241);\\n}\\n\\n.comment.comment-left span {\\n    color: #555;\\n    background-color: rgb(210, 210, 210);\\n}\",\"js\":\"var rules = [\\n    {fact: '哺乳類', cause: ['泌乳']},\\n    {fact: '鳥類', cause: ['有羽毛']},\\n    {fact: '鳥類', cause: ['會飛','生蛋']},\\n    {fact: '食肉類', cause: ['哺乳類', '吃肉']},\\n    {fact: '食肉類', cause: ['有爪', '利齒', '兩眼前視']},\\n    {fact: '有蹄類', cause: ['哺乳類', '有蹄']},\\n    {fact: '偶蹄類', cause: ['哺乳類', '反芻']},\\n    {fact: '獵豹', cause: ['哺乳類', '吃肉', '斑點']},\\n    {fact: '老虎', cause: ['哺乳類', '吃肉', '條紋']},\\n    {fact: '長頸鹿', cause: ['有蹄類', '長腿', '斑點']},\\n    {fact: '斑馬', cause: ['有蹄類', '條紋']},\\n    {fact: '鴕鳥', cause: ['鳥類', '長腿']},\\n    {fact: '魚', cause: ['魚類', '生蛋']}\\n]\\n\\nvar facts = [];\\n\\nfunction chaining () {\\n    for (var i=0; i\u003crules.length; i++) {\\n        if (check(rules[i]) \u0026\u0026 rules[i].satisfy == undefined) {\\n            rules[i].satisfy = true;\\n            facts.push(rules[i].fact);\\n            return chaining();\\n        }\\n    }\\n}\\n\\nfunction check (rule) {\\n    for (var i=0; i\u003crule.cause.length; i++) {\\n        var idx = facts.indexOf(rule.cause[i]);\\n        if (idx == -1) return false;\\n    }\\n    return true;\\n}\\n\\nfunction reply (fact) {\\n    facts.push(fact);\\n    chaining();\\n    addComment(facts, 'left');\\n}\\n\\naddComment('請描述一下這個動物的特徵？', 'left');\"}","created_at":"2018-12-16T09:57:34.027+08:00","updated_at":"2019-11-11T06:57:59.839+08:00","name":"推論引擎","language":"web","screenshot":{"url":"/uploads/project/screenshot/52585/39283fabd7c9500f0c66b96aff8eb67b.jpg"},"parent_id":51972,"plugin":"var input = document.querySelector('.js-input');\nvar comment = document.querySelector('.js-comment');\n\ninput.addEventListener('keydown', function (e) {\n    if (e.keyCode === 13) {\n        var q = input.value;\n        var html = '\u003cp class=\"comment comment-{float}\"\u003e\u003cspan\u003e{text}\u003c/span\u003e\u003c/p\u003e';\n        comment.innerHTML += html.replace('{float}', 'right').replace('{text}', q);\n        comment.scrollTop = comment.scrollHeight;\n        \n        reply(q);\n        \n        input.value = '';\n        \n        \n    }\n});\n\nfunction addComment (text, float) {\n    comment.innerHTML += `\u003cp class=\"comment comment-${float}\"\u003e\u003cspan\u003e${text}\u003c/span\u003e\u003c/p\u003e`\n    comment.scrollTop = comment.scrollHeight;\n}","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":500,"hashid":"wdksp6p4","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}