From 8576b1488977bcc97347d240a202f80cefc9f88b Mon Sep 17 00:00:00 2001 From: KazuyaMiayshita Date: Mon, 24 Feb 2020 20:09:33 +0900 Subject: [PATCH 1/2] =?UTF-8?q?=E3=82=AF=E3=83=AA=E3=83=83=E3=82=AF?= =?UTF-8?q?=E3=81=99=E3=82=8B=E3=81=A8=E5=88=86=E8=A3=82=E3=81=99=E3=82=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- dvd.js | 26 +++++++++++++++++++------- index.html | 16 +++++++++------- 2 files changed, 28 insertions(+), 14 deletions(-) diff --git a/dvd.js b/dvd.js index e574e30..b1aa99b 100644 --- a/dvd.js +++ b/dvd.js @@ -2,16 +2,22 @@ const dvdFieldDOM = document.getElementById("dvd-field"); class DVD { - constructor(dvdSvgDOM) { + constructor(dvdSvgDOM, x, y) { this.dom = dvdSvgDOM - this.coord = { x: 0, y: 0 } + this.coord = { x: x, y: y } this.speed = 0.26 this.rgbVec3 = [0, 0, 0] this.previousTime = 0 - this.dom.onclick = () => this.changeColor() - this.dom.ontouchstart = () => this.changeColor() + this.dom.onclick = () => { + this.changeColor(); + runDVD(x + 100, y); + } + this.dom.ontouchstart = () => { + this.changeColor() + runDVD(x + 100, y); + } this.changeColor() @@ -47,9 +53,15 @@ class DVD { } -function runDVD() { +function runDVD(x, y) { - const dvd = new DVD(document.getElementById("dvd")); + const template = document.querySelector("#dvd-template"); + const body = document.querySelector("body"); + const clone = document.importNode(template.content, true); + const svg = clone.querySelector(".dvd"); + console.log(svg); + body.appendChild(svg); + const dvd = new DVD(svg, x, y); function loop(dt) { dvd.update(dt) @@ -59,4 +71,4 @@ function runDVD() { } -runDVD() +runDVD(0, 0) diff --git a/index.html b/index.html index bfafbb7..4fb86a7 100644 --- a/index.html +++ b/index.html @@ -50,7 +50,7 @@ z-index: -1; } -svg#dvd { +svg.dvd { height: 102px; width: 208px; top: 0px; @@ -82,12 +82,14 @@

Serviver Agent

サバイバーエージェントはベンチャースピリットを持ったEitherT集団です
- - - - - - + From 361b4b582162505819f44de2feaf52ed2beb357c Mon Sep 17 00:00:00 2001 From: KazuyaMiayshita Date: Mon, 24 Feb 2020 20:32:00 +0900 Subject: [PATCH 2/2] =?UTF-8?q?=E3=81=93=E3=82=8C=E3=81=AF=E3=81=AA?= =?UTF-8?q?=E3=82=93=E3=81=8B2=E3=81=93=E3=81=BE=E3=81=A7=E3=81=97?= =?UTF-8?q?=E3=81=8BDVD=E3=81=8C=E5=A2=97=E3=81=88=E3=81=AA=E3=81=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- dvd.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/dvd.js b/dvd.js index b1aa99b..7ee9b27 100644 --- a/dvd.js +++ b/dvd.js @@ -12,11 +12,11 @@ class DVD { this.dom.onclick = () => { this.changeColor(); - runDVD(x + 100, y); + runDVD(dvdFieldDOM.clientWidth - this.dom.clientWidth - x, y); } this.dom.ontouchstart = () => { this.changeColor() - runDVD(x + 100, y); + runDVD(dvdFieldDOM.clientWidth - this.dom.clientWidth - x, y); } this.changeColor()