From 02b5057247447f83087dfc5a6adf37d7dd320e83 Mon Sep 17 00:00:00 2001 From: yuki540 Date: Fri, 20 Apr 2018 11:55:28 +0900 Subject: [PATCH 1/3] =?UTF-8?q?update:=20=E3=82=B9=E3=82=AD=E3=83=83?= =?UTF-8?q?=E3=83=97=E3=83=9C=E3=82=BF=E3=83=B3=E3=82=92=E3=83=9E=E3=83=BC?= =?UTF-8?q?=E3=82=AF=E3=82=A2=E3=83=83=E3=83=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/index.html | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/public/index.html b/public/index.html index aa10cd0..d5c3ad1 100644 --- a/public/index.html +++ b/public/index.html @@ -47,6 +47,8 @@
+ +
@@ -309,7 +311,7 @@
- +
@@ -341,7 +343,7 @@
- +
@@ -393,7 +395,7 @@
- +
From cabe6f9423457db09f5cc67a70f51bbeb6ef6eac Mon Sep 17 00:00:00 2001 From: yuki540 Date: Fri, 20 Apr 2018 11:56:04 +0900 Subject: [PATCH 2/3] =?UTF-8?q?add:=20=E3=82=B9=E3=82=AD=E3=83=83=E3=83=97?= =?UTF-8?q?=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=AE=E3=82=B9=E3=82=BF=E3=82=A4?= =?UTF-8?q?=E3=83=AB=E3=82=B7=E3=83=BC=E3=83=88=E3=82=92=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/scss/modules/_skip-button.scss | 71 ++++++++++++++++++++++++++++++ 1 file changed, 71 insertions(+) create mode 100644 src/scss/modules/_skip-button.scss diff --git a/src/scss/modules/_skip-button.scss b/src/scss/modules/_skip-button.scss new file mode 100644 index 0000000..cf8b5cc --- /dev/null +++ b/src/scss/modules/_skip-button.scss @@ -0,0 +1,71 @@ +@include pc-layout { + #skip-button { + position: absolute; + bottom: 50px; right: 0; + width: 160px; height: 60px; + background-color: $theme-mint; + border-top-left-radius: 5px; + border-bottom-left-radius: 5px; + font-size: 30px; + color: $theme-purple; + text-align: center; + line-height: 60px; + box-shadow: 0 0 5px rgba(0,0,0,0.6); + transform: translateX(100%); + transition: all 0.3s ease 0s; + border: none; + cursor: pointer; + z-index: 1001; + } +} +@include tablet-layout { + #skip-button { + position: absolute; + bottom: 50px; right: 0; + width: 160px; height: 60px; + background-color: $theme-mint; + border-top-left-radius: 5px; + border-bottom-left-radius: 5px; + font-size: 30px; + color: $theme-purple; + text-align: center; + line-height: 60px; + box-shadow: 0 0 5px rgba(0,0,0,0.6); + transform: translateX(100%); + transition: all 0.3s ease 0s; + cursor: pointer; + z-index: 1001; + } +} +@include sp-layout { + #skip-button { + position: absolute; + bottom: 50px; right: 0; + width: 100px; height: 45px; + background-color: $theme-mint; + border-top-left-radius: 5px; + border-bottom-left-radius: 5px; + font-size: 20px; + color: $theme-purple; + text-align: center; + line-height: 45px; + box-shadow: 0 0 5px rgba(0,0,0,0.6); + transform: translateX(100%); + transition: all 0.3s ease 0s; + cursor: pointer; + z-index: 1001; + } +} + +#skip-button:hover { + color: #fff; + background-color: $theme-pink; +} + +#skip-button[data-state="true"] { + transform: translateX(0%); +} + +#skip-button[data-state="false"] { + transform: translateX(100%); +} From 104f9bbb5654df34a95800506a8dcd39a5b145db Mon Sep 17 00:00:00 2001 From: yuki540 Date: Fri, 20 Apr 2018 11:56:49 +0900 Subject: [PATCH 3/3] =?UTF-8?q?update:=20=E3=82=B9=E3=82=AD=E3=83=83?= =?UTF-8?q?=E3=83=97=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=AE=E8=A1=A8=E7=A4=BA?= =?UTF-8?q?=E3=83=BB=E3=82=A2=E3=83=8B=E3=83=A1=E3=83=BC=E3=82=B7=E3=83=A7?= =?UTF-8?q?=E3=83=B3=E3=82=B9=E3=82=AD=E3=83=83=E3=83=97=E5=87=A6=E7=90=86?= =?UTF-8?q?=E3=82=92=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/scripts/app.js | 2 +- src/scripts/lib/util.js | 28 ++++++++++++++++++++++++++++ 2 files changed, 29 insertions(+), 1 deletion(-) diff --git a/src/scripts/app.js b/src/scripts/app.js index 0b73cdd..d44e636 100644 --- a/src/scripts/app.js +++ b/src/scripts/app.js @@ -1,5 +1,4 @@ import riot from 'riot' -import route from 'riot-route' import * as util from './lib/util' import preload_json from './config/preload' import history_json from './config/history' @@ -20,6 +19,7 @@ util.bindCloseBtn() util.startLoading(() => { util.preload(preload_json, () => { util.finLoad() + util.showSkipButton() }, data => {}) }) diff --git a/src/scripts/lib/util.js b/src/scripts/lib/util.js index 10a06d7..056e2b6 100644 --- a/src/scripts/lib/util.js +++ b/src/scripts/lib/util.js @@ -129,6 +129,34 @@ export const hiddenPage = () => { document.querySelector('.product-page').style.display = 'none' } +/** + * スキップボタンの表示 + */ +export const showSkipButton = () => { + const skip_button = document.getElementById('skip-button') + skip_button.setAttribute('data-state', 'true') + + /* click ---------------------------------------------------------------- */ + skip_button.addEventListener('click', e => { + e.target.setAttribute('data-state', 'false') + skipAnimation() + }) + + setTimeout(() => { skip_button.setAttribute('data-state', 'false') }, 5000) +} + +/** + * アニメーションをスキップ + */ +export const skipAnimation = () => { + if(load_view) root.removeChild(load_view) + if(gab_animation) root.removeChild(gab_animation) + if(calling) root.removeChild(calling) + if(end_animation) root.removeChild(end_animation) + + top_page.setAttribute('data-state', 'start') +} + /** * ロードの開始タイミングを取得 * @param fn : コールバック関数