網頁裝飾(1) | 程式專案 | 橘蘋學習平台

{"id":42553,"student_id":1440,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n\\t\u003ctitle\u003eDocument\u003c/title\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"\",\"js\":\"function get_attribute(node, attr, default_value) {\\n    return node.getAttribute(attr) || default_value;\\n}\\nfunction get_by_tagname(name) {\\n    return document.getElementsByTagName(name);\\n}\\nfunction get_config_option() {\\n    var scripts = get_by_tagname(\\\"script\\\"),\\n    script_len = scripts.length,\\n    script = scripts[script_len - 1];\\n    return {\\n        l: script_len,\\n        z: get_attribute(script, \\\"zIndex\\\", -1),\\n        o: get_attribute(script, \\\"opacity\\\", 0.5),\\n        c: get_attribute(script, \\\"color\\\", \\\"0,102,153\\\"),\\n        n: get_attribute(script, \\\"count\\\", 199)\\n    };\\n}\\nfunction set_canvas_size() {\\n    canvas_width = the_canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth,\\n    canvas_height = the_canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;\\n}\\n\\nfunction draw_canvas() {\\n    context.clearRect(0, 0, canvas_width, canvas_height);\\n    var e, i, d, x_dist, y_dist, dist;\\n    random_points.forEach(function(r, idx) {\\n        r.x += r.xa,\\n        r.y += r.ya,\\n        r.xa *= r.x \u003e canvas_width || r.x \u003c 0 ? -1: 1,\\n        r.ya *= r.y \u003e canvas_height || r.y \u003c 0 ? -1: 1,\\n        context.fillRect(r.x - 0.5, r.y - 0.5, 1, 1);\\n        for (i = idx + 1; i \u003c all_array.length; i++) {\\n            e = all_array[i];\\n            if (null !== e.x \u0026\u0026 null !== e.y) {\\n                x_dist = r.x - e.x;\\n                y_dist = r.y - e.y;\\n                dist = x_dist * x_dist + y_dist * y_dist;\\n\\n                dist \u003c e.max \u0026\u0026 (e === current_point \u0026\u0026 dist \u003e= e.max / 2 \u0026\u0026 (r.x -= 0.03 * x_dist, r.y -= 0.03 * y_dist),\\n                    d = (e.max - dist) / e.max,\\n                    context.beginPath(),\\n                    context.lineWidth = d / 2,\\n                    context.strokeStyle = \\\"rgba(\\\" + config.c + \\\",\\\" + (d + 0.2) + \\\")\\\",\\n                    context.moveTo(r.x, r.y),\\n                    context.lineTo(e.x, e.y),\\n                    context.stroke());\\n            }\\n        }\\n    }), frame_func(draw_canvas);\\n}\\nvar the_canvas = document.createElement(\\\"canvas\\\"),\\nconfig = get_config_option(),\\ncanvas_id = \\\"c_n\\\" + config.l,\\ncontext = the_canvas.getContext(\\\"2d\\\"), canvas_width, canvas_height,\\nframe_func = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(func) {\\n    window.setTimeout(func, 1000 / 40);\\n}, random = Math.random,\\ncurrent_point = {\\n    x: null,\\n    y: null,\\n    max: 20000\\n},\\nall_array;\\nthe_canvas.id = canvas_id;\\nthe_canvas.style.cssText = \\\"position:fixed;top:0;left:0;z-index:\\\" + config.z + \\\";opacity:\\\" + config.o;\\nget_by_tagname(\\\"body\\\")[0].appendChild(the_canvas);\\n\\nset_canvas_size();\\nwindow.onresize = set_canvas_size;\\nwindow.onmousemove = function(e) {\\n    e = e || window.event;\\n    current_point.x = e.clientX;\\n    current_point.y = e.clientY;\\n}, window.onmouseout = function() {\\n    current_point.x = null;\\n    current_point.y = null;\\n};\\nfor (var random_points = [], i = 0; config.n \u003e i; i++) {\\n    var x = random() * canvas_width,\\n    y = random() * canvas_height,\\n    xa = 2 * random() - 1,\\n    ya = 2 * random() - 1;\\n    random_points.push({\\n        x: x,\\n        y: y,\\n        xa: xa,\\n        ya: ya,\\n        max: 6000\\n    });\\n}\\nall_array = random_points.concat([current_point]);\\nsetTimeout(function() {\\n    draw_canvas();\\n}, 100);\"}","created_at":"2018-09-15T14:05:12.002+08:00","updated_at":"2019-11-09T21:23:24.059+08:00","name":"網頁裝飾(1)","language":"web","screenshot":{"url":"https://cdn7.koding.school/uploads/project/screenshot/42553/47c410ac3af47f681795580c5d2a7cc6.jpg"},"parent_id":null,"plugin":"","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":121,"hashid":"qmdsvped","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}