= | 程式專案 | 橘蘋學習平台

{"id":191865,"student_id":12205,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n    \u003ctitle\u003eios計算機 |  程式專案 | let's programes EP1\u003c/title\u003e\u003cmeta content=\\\"線上學會 MIT Scratch, JavaScript, micro:bit, Ozobot! 全球第一個華文兒童程式學習平台!\\\" name=\\\"description\\\" /\u003e\u003cmeta content=\\\"text/html; charset=UTF-8\\\" http-equiv=\\\"Content-Type\\\" /\u003e\u003cmeta content=\\\"width=device-width, initial-scale=1\\\" name=\\\"viewport\\\" /\u003e\u003cmeta content=\\\"1801378909903067\\\" property=\\\"fb:app_id\\\" /\u003e\u003cmeta content=\\\"ios計算機 |  程式專案 | 橘蘋學習平台\\\" itemprop=\\\"name\\\" /\u003e\u003cmeta content=\\\"/facebook_og_default_preview.png\\\" itemprop=\\\"image\\\" /\u003e\u003cmeta content=\\\"線上學會 MIT Scratch, JavaScript, micro:bit, Ozobot! 全球第一個華文兒童程式學習平台!\\\" itemprop=\\\"description\\\" /\u003e\u003cmeta content=\\\"線上學會 MIT Scratch, JavaScript, micro:bit, Ozobot! 全球第一個華文兒童程式學習平台!\\\" property=\\\"og:description\\\" /\u003e\u003cmeta content=\\\"ios計算機 |  程式專案 | 橘蘋學習平台\\\" property=\\\"og:title\\\" /\u003e\u003cmeta content=\\\"website\\\" property=\\\"og:type\\\" /\u003e\u003cmeta content=\\\"https://koding.school/projects/wdksq24z/edit\\\" property=\\\"og:url\\\" /\u003e\u003cmeta content=\\\"https://cdn8.koding.school/facebook_og_default_preview.png\\\" property=\\\"og:image\\\" /\u003e\u003cmeta content=\\\"橘蘋學習平台\\\" property=\\\"og:site_name\\\" /\u003e\u003cmeta content=\\\"\\\" property=\\\"og:video\\\" /\u003e\u003cmeta content=\\\"\\\" property=\\\"og:video:secure_url\\\" /\u003e\u003cmeta content=\\\"video/mp4\\\" property=\\\"og:video:type\\\" /\u003e\u003cmeta content=\\\"400\\\" property=\\\"og:video:width\\\" /\u003e\u003cmeta content=\\\"300\\\" property=\\\"og:video:height\\\" /\u003e\u003clink href=\\\"https://cdn8.koding.school/favicon.ico\\\" rel=\\\"shortcut icon\\\" type=\\\"image/x-icon\\\" /\u003e\u003c!--GA Code--\u003e\u003cscript\u003e\\n        (function(i, s, o, g, r, a, m) {\\n            i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function() {\\n                (i[r].q = i[r].q || []).push(arguments)}, i[r].l = 1*new Date(); a = s.createElement(o),\\n            m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)\\n        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\\n        ga('create', 'UA-99102104-1', 'auto');\\n        ga('send', 'pageview');\\n    \u003c/script\u003e\\n    \u003c!--Facebook Pixel Code--\u003e\u003cscript\u003e\\n        !function (f, b, e, v, n, t, s) {\\n            if (f.fbq) return;\\n            n = f.fbq = function () {\\n                n.callMethod ?\\n                n.callMethod.apply(n, arguments): n.queue.push(arguments)\\n            };\\n            if (!f._fbq) f._fbq = n;\\n            n.push = n;\\n            n.loaded = !0;\\n            n.version = '2.0';\\n            n.queue = [];\\n            t = b.createElement(e);\\n            t.async = !0;\\n            t.src = v;\\n            s = b.getElementsByTagName(e)[0];\\n            s.parentNode.insertBefore(t, s)\\n        }(window, document, 'script',\\n            'https://connect.facebook.net/en_US/fbevents.js');\\n        fbq('init', '841617052639483');\\n        fbq('track', 'PageView');\\n    \u003c/script\u003e\\n    \u003cnoscript\u003e\u003cimg height=\\\"1\\\" src=\\\"https://www.facebook.com/tr?id=841617052639483\u0026amp;ev=PageView\u0026amp;noscript=1\\\" width=\\\"1\\\" /\u003e\u003c/noscript\u003e\u003c!--End Facebook Pixel Code--\u003e\u003clink rel=\\\"stylesheet\\\" media=\\\"screen\\\" href=\\\"https://cdn7.koding.school/assets/editor-506ddd010c5370846042b39515c42f9118adb5f165a84cf545fe0c0f98621122.css\\\" /\u003e\u003cmeta name=\\\"csrf-param\\\" content=\\\"authenticity_token\\\" /\u003e\\n    \u003cmeta name=\\\"csrf-token\\\" content=\\\"K3h3liCld3hVKsmk5+OVh7y0UA/SF5A5j0/yQZRtv8i5XF8Zf7RcBCAgz6vBUUkYxdIj9j1UNAiqGzrnvuwtNw==\\\" /\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n    \u003ctextarea id=\\\"projectJsonData\\\" style=\\\"display: none;\\\"\u003e{\u0026quot;id\u0026quot;:191864,\u0026quot;student_id\u0026quot;:12205,\u0026quot;content\u0026quot;:\u0026quot;{\\\\\u0026quot;html\\\\\u0026quot;:\\\\\u0026quot;\\\\u003c!DOCTYPE html\\\\u003e\\\\\\\\n\\\\u003chtml\\\\u003e\\\\\\\\n\\\\u003chead\\\\u003e\\\\\\\\n\\\\\\\\t\\\\u003ctitle\\\\u003e計算機\\\\u003c/title\\\\u003e\\\\\\\\n\\\\\\\\t\\\\u003cscript src=\\\\\\\\\\\\\u0026quot;https://code.jquery.com/jquery-3.3.1.min.js\\\\\\\\\\\\\u0026quot;\\\\u003e\\\\u003c/script\\\\u003e\\\\\\\\n\\\\u003c/head\\\\u003e\\\\\\\\n\\\\u003cbody\\\\u003e\\\\\\\\n    \\\\\\\\n    \\\\u003cdiv id=\\\\\\\\\\\\\u0026quot;app\\\\\\\\\\\\\u0026quot;\\\\u003e\\\\\\\\n        \\\\u003cp\\\\u003e\\\\u003c/p\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-light\\\\\\\\\\\\\u0026quot;\\\\u003eC\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-light\\\\\\\\\\\\\u0026quot;\\\\u003e(\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-light\\\\\\\\\\\\\u0026quot;\\\\u003e)\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-orange\\\\\\\\\\\\\u0026quot;\\\\u003e/\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e7\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e8\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e9\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-orange\\\\\\\\\\\\\u0026quot;\\\\u003e*\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e4\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e5\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e6\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-orange\\\\\\\\\\\\\u0026quot;\\\\u003e-\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e1\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e2\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e3\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-orange\\\\\\\\\\\\\u0026quot;\\\\u003e+\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003edel\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e0\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e.\\\\u003c/button\\\\u003e\\\\\\\\n        \\\\u003cbutton class=\\\\\\\\\\\\\u0026quot;bg-gray\\\\\\\\\\\\\u0026quot;\\\\u003e=\\\\u003c/button\\\\u003e\\\\\\\\n    \\\\u003c/div\\\\u003e\\\\\\\\n    \\\\\\\\n\\\\u003c/body\\\\u003e\\\\\\\\n\\\\u003c/html\\\\u003e\\\\\u0026quot;,\\\\\u0026quot;css\\\\\u0026quot;:\\\\\u0026quot;body {\\\\\\\\n    background-color: black;\\\\\\\\n    text-align: center;\\\\\\\\n    padding: 100px;\\\\\\\\n\\\\\\\\n}\\\\\\\\n\\\\\\\\n#app {\\\\\\\\n    width: 300px;\\\\\\\\n    height: 400px;\\\\\\\\n    /*可使margin自動抓一半，但需要有設定此元件大小*/\\\\\\\\n    margin: auto;\\\\\\\\n}\\\\\\\\n\\\\\\\\np {\\\\\\\\n    color: #fff;\\\\\\\\n    text-align: right;\\\\\\\\n    font-size: 40px;\\\\\\\\n    \\\\\\\\n    height: 60px;\\\\\\\\n    padding: 5px;\\\\\\\\n    margin: 5px;\\\\\\\\n}\\\\\\\\n\\\\\\\\nbutton {\\\\\\\\n    /* 一顆按鈕：寬70px + 邊寬5px = 75px */\\\\\\\\n    /* 一排按鈕：75px * 4 = 300px */\\\\\\\\n    width: 70px;\\\\\\\\n    height: 70px;\\\\\\\\n\\\\\\\\n    border-width: 5px;\\\\\\\\n    border-radius: 50%;\\\\\\\\n    border-color: black;\\\\\\\\n\\\\\\\\n    color: #fff;\\\\\\\\n    font-size: 20px;\\\\\\\\n\\\\\\\\n    /* 去除點擊時外圍的藍色框框，與border不同處於outline，border並不佔空間 */\\\\\\\\n    outline: none;\\\\\\\\n}\\\\\\\\n\\\\\\\\n.bg-orange {\\\\\\\\n    background-color: orange;\\\\\\\\n}\\\\\\\\n.bg-light {\\\\\\\\n    background-color: #777;\\\\\\\\n}\\\\\\\\n.bg-gray {\\\\\\\\n    background-color: #333;\\\\\\\\n}\\\\\\\\n\\\\\\\\n/* 以上為預設程式碼 */\\\\\\\\n\\\\\\\\n\\\\\\\\nbutton:active{\\\\\\\\n    transform: scale(0.9, 0.9);\\\\\\\\n\\\\\\\\n}\\\\\\\\n\\\\\\\\n/* .bg-orange:hover {#777\\\\\\\\n    background-color: #FFDAB9;\\\\\\\\n} */\\\\\\\\n\\\\\\\\n\\\\\\\\n/* .bg-light:hover {\\\\\\\\n    background-color: #aaa;\\\\\\\\n} */\\\\\\\\n\\\\\\\\n\\\\\\\\n/* .bg-gray:hover {\\\\\\\\n    background-color: #666;\\\\\\\\n} */\\\\\\\\n\\\\\u0026quot;,\\\\\u0026quot;js\\\\\u0026quot;:\\\\\u0026quot;\\\\\\\\n$(\u0026#39;button\u0026#39;).click(clicked)\\\\\\\\nfunction clicked() {\\\\\\\\n    //將點擊的按鈕資料存到變數\\\\\\\\n    var char = $(this).text();\\\\\\\\n    // console.log(char);\\\\\\\\n\\\\\\\\n    var result;\\\\\\\\n    var screen_val = $(\u0026#39;p\u0026#39;).text();\\\\\\\\n\\\\\\\\n    if (char == \u0026#39;C\u0026#39;) {\\\\\\\\n        result = \u0026#39;\u0026#39;;\\\\\\\\n    } else if (char == \u0026#39;del\u0026#39;) {\\\\\\\\n        result = screen_val.slice(0, screen_val.length - 1);\\\\\\\\n    }\\\\\\\\n    else if (char == \u0026#39;=\u0026#39;) {\\\\\\\\n        try {\\\\\\\\n            result = eval(screen_val);\\\\\\\\n        } catch (e) {\\\\\\\\n            $(\u0026#39;p\u0026#39;).text(\u0026#39;Error\u0026#39;);\\\\\\\\n            alert(e)\\\\\\\\n        }\\\\\\\\n    } else {\\\\\\\\n        result = screen_val + char;\\\\\\\\n    }\\\\\\\\n\\\\\\\\n\\\\\\\\n    $(\u0026#39;p\u0026#39;).text(result);\\\\\\\\n}\\\\\u0026quot;}\u0026quot;,\u0026quot;created_at\u0026quot;:\u0026quot;2020-09-14T12:58:44.334+08:00\u0026quot;,\u0026quot;updated_at\u0026quot;:\u0026quot;2020-09-21T21:26:51.612+08:00\u0026quot;,\u0026quot;name\u0026quot;:\u0026quot;ios計算機\u0026quot;,\u0026quot;language\u0026quot;:\u0026quot;web\u0026quot;,\u0026quot;screenshot\u0026quot;:{\u0026quot;url\u0026quot;:\u0026quot;https://cdn3.koding.school/uploads/project/screenshot/191864/8b5ade107cbc93ba5ffa7849e1f2a7ba.jpg\u0026quot;},\u0026quot;parent_id\u0026quot;:3,\u0026quot;plugin\u0026quot;:\u0026quot;\u0026quot;,\u0026quot;description\u0026quot;:null,\u0026quot;note\u0026quot;:null,\u0026quot;status\u0026quot;:\u0026quot;public\u0026quot;,\u0026quot;like_student_ids\u0026quot;:[],\u0026quot;is_featured\u0026quot;:false,\u0026quot;views\u0026quot;:6,\u0026quot;hashid\u0026quot;:\u0026quot;wdksq24z\u0026quot;,\u0026quot;is_content_changed\u0026quot;:false,\u0026quot;review_status\u0026quot;:\u0026quot;unsubmitted\u0026quot;,\u0026quot;submitted_at\u0026quot;:null,\u0026quot;reviewed_at\u0026quot;:null,\u0026quot;advise\u0026quot;:null,\u0026quot;is_deleted\u0026quot;:false}\u003c/textarea\u003e\u003ctextarea id=\\\"projectJsonAssets\\\" style=\\\"display: none;\\\"\u003e[]\u003c/textarea\u003e\u003cscript\u003e\\n        function htmlDecode (input) {\\n            var doc = new DOMParser().parseFromString(input, \\\"text/html\\\");\\n            return doc.documentElement.textContent;\\n        }\\n        var PROJECT = JSON.parse(htmlDecode(projectJsonData.innerHTML));\\n        var PROJECT_ASSETS = JSON.parse(htmlDecode(projectJsonAssets.innerHTML));\\n        var SANDBOX_URL = 'https://sb.koding.school/projects/wdksq24z/js_inject';\\n        var PROJECT_ASSET_NAMES = [];\\n    \u003c/script\u003e\\n    \u003cscript\u003e\\n        LOCALES = {\\n            main_script: \\\"程式碼\\\",\\n            plugin: \\\"擴充\\\",\\n            asset: \\\"素材\\\",\\n            backdrop: \\\"遊戲場景\\\",\\n            console: \\\"主控台\\\",\\n            screenshot: \\\"截取圖片\\\",\\n            preview: \\\"預覽\\\",\\n            filename: \\\"檔案名稱\\\",\\n            control: \\\"操作\\\",\\n            rename: \\\"重新命名\\\",\\n            insert_script: \\\"插入程式...\\\",\\n            run: \\\"執行\\\",\\n            stop: \\\"暫停\\\",\\n            clear: \\\"清除\\\",\\n            upload_image: \\\"圖片上傳\\\",\\n            format_document: \\\"格式化\\\"\\n        };\\n    \u003c/script\u003e\\n    \u003cscript\u003e\\n        var MODE;\\n        var PROJECT_ID;\\n        var PROJECT_NAME;\\n        var IS_MY_PROJECT;\\n        var CODE_LANGUAGE;\\n        var SANDBOX_URL;\\n        var HAS_PROJECT;\\n        var SHOW_PLUGIN;\\n        var NEXT_SECTION_URL;\\n        var RESOURCE_TYPE;\\n        var NEDD_EXAMINE;\\n        var ANSWER_SCRIPT;\\n        var FORM_POST_URL;\\n    \u003c/script\u003e\\n    \u003cscript\u003e\\n        HAS_PROJECT = true;\\n        PROJECT_ID = 'wdksq24z';\\n        PROJECT_NAME = 'ios計算機';\\n        IS_MY_PROJECT = true;\\n        CODE_LANGUAGE = 'web';\\n        SHOW_PLUGIN = false;\\n    \u003c/script\u003e\\n    \u003cscript\u003e\\n        SANDBOX_URL = 'https://sb.koding.school/projects/wdksq24z/web_inject';\\n    \u003c/script\u003e\\n    \u003cscript\u003e\\n        MODE = 'free';\\n    \u003c/script\u003e\\n    \u003cdiv id=\\\"container\\\"\u003e\\n        \u003cdiv id=\\\"header\\\"\u003e\\n            \u003cdiv class=\\\"nav-btn dropdown dropdown-right js-dropdown\\\" style=\\\"float:left\\\"\u003e\\n                \u003cbutton class=\\\"btn btn-default dropdown-btn js-dropdown-btn\\\"\u003e橘蘋學習平台\u003c/button\u003e\u003cdiv class=\\\"dropdown-menu js-dropdown-menu\\\"\u003e\\n                    \u003cdiv class=\\\"dropdown-menu-exit js-dropdown-menu-exit\\\"\u003e\u003c/div\u003e\\n                    \u003ca href=\\\"/\\\"\u003e橘蘋學習平台\u003c/a\u003e\u003ca href=\\\"/my/projects\\\"\u003e我的作品\u003c/a\u003e\\n                \u003c/div\u003e\\n            \u003c/div\u003e\\n            \u003cdiv class=\\\"nav-btn\\\"\u003e\\n                \u003cinput class=\\\"js-name-input\\\" style=\\\"width:30vw\\\" value=\\\"ios計算機\\\" /\u003e\\n            \u003c/div\u003e\\n            \u003cdiv class=\\\"nav-btn settings dropdown dropdown-left js-dropdown\\\" style=\\\"float:right; margin-right:0;\\\"\u003e\\n                \u003cbutton class=\\\"btn btn-default dropdown-btn icon icon-settings js-dropdown-btn\\\"\u003e\u003c/button\u003e\u003cdiv class=\\\"dropdown-menu js-dropdown-menu\\\"\u003e\\n                    \u003cdiv class=\\\"dropdown-menu-exit js-dropdown-menu-exit\\\"\u003e\u003c/div\u003e\\n                    \u003ca href=\\\"/projects/wdksq24z\\\"\u003e檢視專案頁\u003c/a\u003e\u003cspan class=\\\"js-export-btn\\\"\u003e匯出\u003c/span\u003e\u003cspan class=\\\"js-remix-btn\\\"\u003e複製\u003c/span\u003e\u003cspan class=\\\"js-import-btn\\\"\u003e匯入\u003cinput class=\\\"js-import-input\\\" type=\\\"file\\\" /\u003e\u003c/span\u003e\u003ca data-confirm=\\\"你確定嗎？\\\" rel=\\\"nofollow\\\" data-method=\\\"delete\\\" href=\\\"/projects/wdksq24z\\\"\u003e刪除\u003c/a\u003e\u003cspan data-target=\\\"#exportAPKModal\\\" data-toggle=\\\"modal\\\" onclick=\\\"document.querySelector(\u0026#39;.js-save-project\u0026#39;).click()\\\"\u003e下載 Android APP (APK)\u003c/span\u003e\u003cspan class=\\\"js-screenshot-btn\\\"\u003e截圖\u003c/span\u003e\u003chr class=\\\"my-0\\\"\u003e\u003cspan class=\\\"js-open-web-fullscreen\\\"\u003e前往網站頁面\u003c/span\u003e\u003c/hr\u003e\\n            \u003c/div\u003e\\n        \u003c/div\u003e\\n        \u003cdiv class=\\\"nav-btn layout dropdown dropdown-left js-dropdown\\\" style=\\\"float:right\\\"\u003e\\n            \u003cbutton class=\\\"btn btn-default dropdown-btn icon icon-layout js-dropdown-btn\\\"\u003e\u003c/button\u003e\u003cdiv class=\\\"dropdown-menu js-dropdown-menu\\\"\u003e\\n                \u003cdiv class=\\\"dropdown-menu-exit js-dropdown-menu-exit\\\"\u003e\u003c/div\u003e\\n                \u003cspan class=\\\"js-layout-1-1-1\\\"\u003e1:1:1\u003c/span\u003e\u003cspan class=\\\"js-layout-1-1\\\"\u003e1:1\u003c/span\u003e\u003cspan class=\\\"js-layout-1\\\"\u003efull\u003c/span\u003e\\n            \u003c/div\u003e\\n        \u003c/div\u003e\\n        \u003cdiv class=\\\"nav-btn\\\" style=\\\"float:right\\\"\u003e\\n            \u003cbutton class=\\\"btn btn-default icon icon-save js-save-btn js-save-project\\\"\u003e\u003c/button\u003e\\n        \u003c/div\u003e\\n        \u003cdiv class=\\\"loading-cover js-loading-cover\\\"\u003e\\n            \u003cimg src=\\\"https://cdn2.koding.school/assets/loading/loading-27c7b0ca6518a411dd3f4cfaf5a335b13c55f4e1200569805abb205f449b73fc.gif\\\" /\u003e\\n        \u003c/div\u003e\\n    \u003c/div\u003e\\n    \u003cdiv id=\\\"main\\\"\u003e\\n        \u003ciframe class=\\\"editor js-editor\\\" data-src=\\\"/projects/wdksq24z/editor?plugin=false\\\" style=\\\"width: 100%; height: 100%; border-width: 0px; position: absolute; top: 0; left: 0;\\\"\u003e\u003c/iframe\u003e\\n    \u003c/div\u003e\\n\u003c/div\u003e\\n\u003cdiv class=\\\"docs\\\" id=\\\"document\\\"\u003e\\n    \u003cdiv class=\\\"docs-container\\\"\u003e\\n        \u003cdiv class=\\\"docs-toggle js-docs-toggle\\\"\u003e\\n            \u003ci class=\\\"fa fa-chevron-right\\\"\u003e\u003c/i\u003e\\n        \u003c/div\u003e\\n    \u003c/div\u003e\\n\u003c/div\u003e\\n\u003cdiv aria-hidden=\\\"true\\\" class=\\\"modal fade\\\" id=\\\"exportAPKModal\\\" role=\\\"dialog\\\" tabindex=\\\"-1\\\"\u003e\\n    \u003cdiv class=\\\"modal-dialog\\\" role=\\\"document\\\" style=\\\"max-width: 400px\\\"\u003e\\n        \u003cdiv class=\\\"modal-content\\\"\u003e\\n            \u003cdiv class=\\\"modal-body\\\" style=\\\"text-align: center;\\\"\u003e\\n                \u003cp style=\\\"font-size: 16px\\\"\u003e\\n                    用手機掃描下方 QRCode 進行安裝\\n                \u003c/p\u003e\\n                \u003cdiv\u003e\\n                    \u003cimg src=\\\"https://chart.apis.google.com/chart?cht=qr\u0026amp;chld=L|0\u0026amp;chl=https%3A%2F%2Fkoding.school%2Fprojects%2Fwdksq24z%2Fexport.apk\u0026amp;chs=240x240\\\" /\u003e\\n                \u003c/div\u003e\\n                \u003cp style=\\\"font-size: 12px; color: #999;\\\"\u003e\\n                    或您也可以\\n                    \u003ca id=\\\"export-apk-link\\\" style=\\\"cursor: pointer; color: #999; text-decoration: underline;\\\" target=\\\"_blank\\\"\u003e下載 APK\u003c/a\u003e\\n                    到這台電腦\\n                \u003c/p\u003e\\n            \u003c/div\u003e\\n            \u003cdiv class=\\\"modal-footer\\\"\u003e\\n                \u003cbutton class=\\\"btn\\\" data-dismiss=\\\"modal\\\" style=\\\"color: #333; width: 70px; background-color: #fff; border: 1px solid; border-color: #ccc;\\\" type=\\\"button\\\"\u003e關閉\u003c/button\u003e\\n            \u003c/div\u003e\\n        \u003c/div\u003e\\n    \u003c/div\u003e\\n\u003c/div\u003e\\n\u003cdiv aria-hidden=\\\"true\\\" class=\\\"modal fade\\\" id=\\\"exportAPKModal\\\" role=\\\"dialog\\\" tabindex=\\\"-1\\\"\u003e\\n    \u003cdiv class=\\\"modal-dialog\\\" role=\\\"document\\\" style=\\\"max-width: 400px\\\"\u003e\\n        \u003cdiv class=\\\"modal-content\\\"\u003e\\n            \u003cdiv class=\\\"modal-body\\\" style=\\\"text-align: center;\\\"\u003e\\n                \u003cp style=\\\"font-size: 16px\\\"\u003e\\n                    用手機掃描下方 QRCode 進行安裝\\n                \u003c/p\u003e\\n                \u003cdiv\u003e\\n                    \u003cimg src=\\\"https://chart.apis.google.com/chart?cht=qr\u0026amp;chld=L|0\u0026amp;chl=https%3A%2F%2Fkoding.school%2Fprojects%2Fwdksq24z%2Fexport.apk\u0026amp;chs=240x240\\\" /\u003e\\n                \u003c/div\u003e\\n                \u003cp style=\\\"font-size: 12px; color: #999;\\\"\u003e\\n                    或您也可以\\n                    \u003ca id=\\\"export-apk-link\\\" style=\\\"cursor: pointer; color: #999; text-decoration: underline;\\\" target=\\\"_blank\\\"\u003e下載 APK\u003c/a\u003e\\n                    到這台電腦\\n                \u003c/p\u003e\\n            \u003c/div\u003e\\n            \u003cdiv class=\\\"modal-footer\\\"\u003e\\n                \u003cbutton class=\\\"btn\\\" data-dismiss=\\\"modal\\\" style=\\\"color: #333; width: 70px; background-color: #fff; border: 1px solid; border-color: #ccc;\\\" type=\\\"button\\\"\u003e關閉\u003c/button\u003e\\n            \u003c/div\u003e\\n        \u003c/div\u003e\\n    \u003c/div\u003e\\n\u003c/div\u003e\\n\u003cscript src=\\\"https://cdn0.koding.school/assets/sections-569204c5fd01b8244d90fe4f5f3ff5669625f2968de00f7888cfa0824e3d6ba2.js\\\"\u003e\u003c/script\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\\n\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n\u003cmeta content=\\\"text/html; charset=UTF-8\\\" http-equiv=\\\"Content-Type\\\" /\u003e\\n\u003c/head\u003e\\n\u003cbody style=\\\"margin:0px;\\\"\u003e\\n\u003ctextarea id=\\\"mainCode\\\" style=\\\"display: none;\\\"\u003e\\n$(\u0026#39;button\u0026#39;).click(clicked)\\nfunction clicked() {\\n//將點擊的按鈕資料存到變數\\nvar char = $(this).text();\\n// console.log(char);\\n\\nvar result;\\nvar screen_val = $(\u0026#39;p\u0026#39;).text();\\n\\nif (char == \u0026#39;C\u0026#39;) {\\nresult = \u0026#39;\u0026#39;;\\n} else if (char == \u0026#39;del\u0026#39;) {\\nresult = screen_val.slice(0, screen_val.length - 1);\\n}\\nelse if (char == \u0026#39;=\u0026#39;) {\\ntry {\\nresult = eval(screen_val);\\n} catch (e) {\\n$(\u0026#39;p\u0026#39;).text(\u0026#39;Error\u0026#39;);\\nalert(e)\\n}\\n} else {\\nresult = screen_val + char;\\n}\\n\\n\\n$(\u0026#39;p\u0026#39;).text(result);\\n}\u003c/textarea\u003e\u003ctextarea id=\\\"pluginCode\\\" style=\\\"display: none;\\\"\u003e\u003c/textarea\u003e\u003cscript\u003e\\nvar TOKEN = \\\"bul6jy3yuynpt0jm6agqq2890ief1m4z\\\",\\nPROJECT_ID = 'wdksq24z',\\nUSER_ID = 12205,\\nUSER_NAME = \\\"jayden0331\\\",\\nENV = \\\"production\\\";\\n\u003c/script\u003e\\n\u003cscript src=\\\"https://cdn8.koding.school/assets/sandbox/web-5f989a47e78b4517afa433dda915acc1e4a87b3e353322afeaa11ba883ebe4d2.js\\\"\u003e\u003c/script\u003e\\n\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n\u003ctitle\u003e計算機\u003c/title\u003e\\n\u003cscript src=\\\"https://code.jquery.com/jquery-3.3.1.min.js\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n\\n\u003cdiv id=\\\"app\\\"\u003e\\n\u003cp\u003e\u003c/p\u003e\\n\u003cbutton class=\\\"bg-light\\\"\u003eC\u003c/button\u003e\\n\u003cbutton class=\\\"bg-light\\\"\u003e(\u003c/button\u003e\\n\u003cbutton class=\\\"bg-light\\\"\u003e)\u003c/button\u003e\\n\u003cbutton class=\\\"bg-orange\\\"\u003e/\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e7\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e8\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e9\u003c/button\u003e\\n\u003cbutton class=\\\"bg-orange\\\"\u003e*\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e4\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e5\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e6\u003c/button\u003e\\n\u003cbutton class=\\\"bg-orange\\\"\u003e-\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e1\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e2\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e3\u003c/button\u003e\\n\u003cbutton class=\\\"bg-orange\\\"\u003e+\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003edel\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e0\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e.\u003c/button\u003e\\n\u003cbutton class=\\\"bg-gray\\\"\u003e=\u003c/button\u003e\\n\u003c/div\u003e\\n\\n\u003c/body\u003e\\n\u003c/html\u003e\\n\u003cstyle\u003e\\nbody {\\nbackground-color: #fff\\n}\\n\\nbody {\\nbackground-color: black;\\ntext-align: center;\\npadding: 100px;\\n\\n}\\n\\n#app {\\nwidth: 300px;\\nheight: 400px;\\n/*可使margin自動抓一半，但需要有設定此元件大小*/\\nmargin: auto;\\n}\\n\\np {\\ncolor: #fff;\\ntext-align: right;\\nfont-size: 40px;\\n\\nheight: 60px;\\npadding: 5px;\\nmargin: 5px;\\n}\\n\\nbutton {\\n/* 一顆按鈕：寬70px + 邊寬5px = 75px */\\n/* 一排按鈕：75px * 4 = 300px */\\nwidth: 70px;\\nheight: 70px;\\n\\nborder-width: 5px;\\nborder-radius: 50%;\\nborder-color: black;\\n\\ncolor: #fff;\\nfont-size: 20px;\\n\\n/* 去除點擊時外圍的藍色框框，與border不同處於outline，border並不佔空間 */\\noutline: none;\\n}\\n\\n.bg-orange {\\nbackground-color: orange;\\n}\\n.bg-light {\\nbackground-color: #777;\\n}\\n.bg-gray {\\nbackground-color: #333;\\n}\\n\\n/* 以上為預設程式碼 */\\n\\n\\nbutton:active {\\ntransform: scale(0.9, 0.9);\\n\\n}\\n\\n/* .bg-orange:hover {#777\\n    background-color: #FFDAB9;\\n} */\\n\\n\\n/* .bg-light:hover {\\n    background-color: #aaa;\\n} */\\n\\n\\n/* .bg-gray:hover {\\n    background-color: #666;\\n} */\\n\u003c/style\u003e\\n\u003cscript\u003e\\nfunction htmlDecode(input) {\\nvar doc = new DOMParser().parseFromString(input, \\\"text/html\\\");\\nreturn doc.documentElement.textContent;\\n}\\n\\nDB.ready(function() {\\nvar pluginCode = htmlDecode(document.getElementById('pluginCode').innerHTML);\\nvar mainCode = htmlDecode(document.getElementById('mainCode').innerHTML);\\neval.call(window, pluginCode);\\neval.call(window, mainCode);\\n});\\n\u003c/script\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"\u003c!DOCTYPE html\u003e\u003chtml\u003e\u003chead\u003e\u003cmeta content=\\\"text/html; charset=UTF-8\\\" http-equiv=\\\"Content-Type\\\" /\u003e\u003c/head\u003e\u003cbody style=\\\"margin:0px;\\\"\u003e\u003ctextarea id=\\\"mainCode\\\" style=\\\"display: none;\\\"\u003e\\r\\n$(\u0026#39;button\u0026#39;).click(clicked)\\r\\nfunction clicked() {\\r\\n    //將點擊的按鈕資料存到變數\\r\\n    var char = $(this).text();\\r\\n    // console.log(char);\\r\\n\\r\\n    var result;\\r\\n    var screen_val = $(\u0026#39;p\u0026#39;).text();\\r\\n\\r\\n    if (char == \u0026#39;C\u0026#39;) {\\r\\n        result = \u0026#39;\u0026#39;;\\r\\n    } else if (char == \u0026#39;del\u0026#39;) {\\r\\n        result = screen_val.slice(0, screen_val.length - 1);\\r\\n    }\\r\\n    else if (char == \u0026#39;=\u0026#39;) {\\r\\n        try {\\r\\n            result = eval(screen_val);\\r\\n        } catch (e) {\\r\\n            $(\u0026#39;p\u0026#39;).text(\u0026#39;Error\u0026#39;);\\r\\n            alert(e)\\r\\n        }\\r\\n    } else {\\r\\n        result = screen_val + char;\\r\\n    }\\r\\n\\r\\n\\r\\n    $(\u0026#39;p\u0026#39;).text(result);\\r\\n}\u003c/textarea\u003e\u003ctextarea id=\\\"pluginCode\\\" style=\\\"display: none;\\\"\u003e\u003c/textarea\u003e\u003cscript\u003evar TOKEN = \\\"bul6jy3yuynpt0jm6agqq2890ief1m4z\\\",\\r\\n    PROJECT_ID = 'wdksq24z',\\r\\n    USER_ID = 12205,\\r\\n    USER_NAME = \\\"jayden0331\\\",\\r\\n    ENV = \\\"production\\\";\u003c/script\u003e\u003cscript src=\\\"https://cdn8.koding.school/assets/sandbox/web-5f989a47e78b4517afa433dda915acc1e4a87b3e353322afeaa11ba883ebe4d2.js\\\"\u003e\u003c/script\u003e\u003c!DOCTYPE html\u003e\\r\\n\u003chtml\u003e\\r\\n\u003chead\u003e\\r\\n\\t\u003ctitle\u003e計算機\u003c/title\u003e\\r\\n\\t\u003cscript src=\\\"https://code.jquery.com/jquery-3.3.1.min.js\\\"\u003e\u003c/script\u003e\\r\\n\u003c/head\u003e\\r\\n\u003cbody\u003e\\r\\n    \\r\\n    \u003cdiv id=\\\"app\\\"\u003e\\r\\n        \u003cp\u003e\u003c/p\u003e\\r\\n        \u003cbutton class=\\\"bg-light\\\"\u003eC\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-light\\\"\u003e(\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-light\\\"\u003e)\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-orange\\\"\u003e/\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e7\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e8\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e9\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-orange\\\"\u003e*\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e4\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e5\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e6\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-orange\\\"\u003e-\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e1\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e2\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e3\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-orange\\\"\u003e+\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003edel\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e0\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e.\u003c/button\u003e\\r\\n        \u003cbutton class=\\\"bg-gray\\\"\u003e=\u003c/button\u003e\\r\\n    \u003c/div\u003e\\r\\n    \\r\\n\u003c/body\u003e\\r\\n\u003c/html\u003e\u003cstyle\u003ebody {background-color: #fff}body {\\r\\n    background-color: black;\\r\\n    text-align: center;\\r\\n    padding: 100px;\\r\\n\\r\\n}\\r\\n\\r\\n#app {\\r\\n    width: 300px;\\r\\n    height: 400px;\\r\\n    /*可使margin自動抓一半，但需要有設定此元件大小*/\\r\\n    margin: auto;\\r\\n}\\r\\n\\r\\np {\\r\\n    color: #fff;\\r\\n    text-align: right;\\r\\n    font-size: 40px;\\r\\n    \\r\\n    height: 60px;\\r\\n    padding: 5px;\\r\\n    margin: 5px;\\r\\n}\\r\\n\\r\\nbutton {\\r\\n    /* 一顆按鈕：寬70px + 邊寬5px = 75px */\\r\\n    /* 一排按鈕：75px * 4 = 300px */\\r\\n    width: 70px;\\r\\n    height: 70px;\\r\\n\\r\\n    border-width: 5px;\\r\\n    border-radius: 50%;\\r\\n    border-color: black;\\r\\n\\r\\n    color: #fff;\\r\\n    font-size: 20px;\\r\\n\\r\\n    /* 去除點擊時外圍的藍色框框，與border不同處於outline，border並不佔空間 */\\r\\n    outline: none;\\r\\n}\\r\\n\\r\\n.bg-orange {\\r\\n    background-color: orange;\\r\\n}\\r\\n.bg-light {\\r\\n    background-color: #777;\\r\\n}\\r\\n.bg-gray {\\r\\n    background-color: #333;\\r\\n}\\r\\n\\r\\n/* 以上為預設程式碼 */\\r\\n\\r\\n\\r\\nbutton:active{\\r\\n    transform: scale(0.9, 0.9);\\r\\n\\r\\n}\\r\\n\\r\\n/* .bg-orange:hover {#777\\r\\n    background-color: #FFDAB9;\\r\\n} */\\r\\n\\r\\n\\r\\n/* .bg-light:hover {\\r\\n    background-color: #aaa;\\r\\n} */\\r\\n\\r\\n\\r\\n/* .bg-gray:hover {\\r\\n    background-color: #666;\\r\\n} */\\r\\n\u003c/style\u003e\u003cscript\u003efunction htmlDecode(input){\\r\\n  var doc = new DOMParser().parseFromString(input, \\\"text/html\\\");\\r\\n  return doc.documentElement.textContent;\\r\\n}\\r\\n\\r\\nDB.ready(function() {\\r\\n  var pluginCode = htmlDecode(document.getElementById('pluginCode').innerHTML);\\r\\n  var mainCode = htmlDecode(document.getElementById('mainCode').innerHTML);\\r\\n  eval.call(window, pluginCode);\\r\\n  eval.call(window, mainCode);\\r\\n});\u003c/script\u003e\u003c/body\u003e\u003c/html\u003e\",\"js\":\"// 創造一個函式指令 hello：\\nfunction hello () {\\n    // 讓網頁跳出文字訊息：\\n    alert('叩叮：\\\\n嗨你好～ 讓我們一起加油寫出漂漂亮亮的網頁唄！');\\n}\"}","created_at":"2020-09-14T12:59:34.530+08:00","updated_at":"2020-09-22T20:12:40.713+08:00","name":"=","language":"web","screenshot":{"url":"https://cdn8.koding.school/uploads/project/screenshot/191865/a8f1a45e1f47d7511b88f05958458495.jpg"},"parent_id":3,"plugin":"","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":45,"hashid":"2pdsd69w","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}