From 2397877959cc8b22da8a4647a513cd43717c5e6c Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Wed, 22 Feb 2017 03:13:19 +0900
Subject: [PATCH] Clean up

---
 gulpfile.ts                  |  6 +----
 src/web/app/base.pug         |  4 ++--
 src/web/app/boot.js          |  2 +-
 src/web/app/client/script.js | 46 +++++++++++++++++++-----------------
 src/web/app/init.css         | 24 +++++++++----------
 5 files changed, 40 insertions(+), 42 deletions(-)

diff --git a/gulpfile.ts b/gulpfile.ts
index 30812bead..c32bad544 100644
--- a/gulpfile.ts
+++ b/gulpfile.ts
@@ -174,11 +174,7 @@ gulp.task('build:client:scripts', () => new Promise(async (ok) => {
 			.pipe(babel({
 				presets: ['es2015']
 			}))
-			.pipe(uglify({
-				mangle: {
-					toplevel: true
-				}
-			}));
+			.pipe(uglify());
 	}
 
 	es.merge(
diff --git a/src/web/app/base.pug b/src/web/app/base.pug
index 805feaee6..e65726fba 100644
--- a/src/web/app/base.pug
+++ b/src/web/app/base.pug
@@ -16,8 +16,8 @@ html(lang='ja', dir='ltr')
 		block head
 
 	body
-		noscript: div: p JavaScriptを有効にしてください
-		div#init: p
+		noscript: p JavaScriptを有効にしてください
+		div#ini: p
 			span .
 			span .
 			span .
diff --git a/src/web/app/boot.js b/src/web/app/boot.js
index 06e457e2b..6399accd3 100644
--- a/src/web/app/boot.js
+++ b/src/web/app/boot.js
@@ -94,7 +94,7 @@ module.exports = callback => {
 
 		mixins(me);
 
-		const init = document.getElementById('init');
+		const init = document.getElementById('ini');
 		init.parentNode.removeChild(init);
 
 		const app = document.createElement('div');
diff --git a/src/web/app/client/script.js b/src/web/app/client/script.js
index 880500eb1..c04919806 100644
--- a/src/web/app/client/script.js
+++ b/src/web/app/client/script.js
@@ -1,26 +1,28 @@
-const head = document.getElementsByTagName('head')[0];
-const ua = navigator.userAgent.toLowerCase();
-const isMobile = /mobile|iphone|ipad|android/.test(ua);
+(() => {
+	const head = document.getElementsByTagName('head')[0];
+	const ua = navigator.userAgent.toLowerCase();
+	const isMobile = /mobile|iphone|ipad|android/.test(ua);
 
-isMobile ? mountMobile() : mountDesktop();
+	isMobile ? mountMobile() : mountDesktop();
 
-function mountDesktop() {
-	const script = document.createElement('script');
-	script.setAttribute('src', '/_/resources/desktop/script.js');
-	script.setAttribute('async', 'true');
-	script.setAttribute('defer', 'true');
-	head.appendChild(script);
-}
+	function mountDesktop() {
+		const script = document.createElement('script');
+		script.setAttribute('src', '/_/resources/desktop/script.js');
+		script.setAttribute('async', 'true');
+		script.setAttribute('defer', 'true');
+		head.appendChild(script);
+	}
 
-function mountMobile() {
-	const meta = document.createElement('meta');
-	meta.setAttribute('name', 'viewport');
-	meta.setAttribute('content', 'width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no');
-	head.appendChild(meta);
+	function mountMobile() {
+		const meta = document.createElement('meta');
+		meta.setAttribute('name', 'viewport');
+		meta.setAttribute('content', 'width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no');
+		head.appendChild(meta);
 
-	const script = document.createElement('script');
-	script.setAttribute('src', '/_/resources/mobile/script.js');
-	script.setAttribute('async', 'true');
-	script.setAttribute('defer', 'true');
-	head.appendChild(script);
-}
+		const script = document.createElement('script');
+		script.setAttribute('src', '/_/resources/mobile/script.js');
+		script.setAttribute('async', 'true');
+		script.setAttribute('defer', 'true');
+		head.appendChild(script);
+	}
+})();
diff --git a/src/web/app/init.css b/src/web/app/init.css
index 2a277a9c8..c92f30b44 100644
--- a/src/web/app/init.css
+++ b/src/web/app/init.css
@@ -4,9 +4,9 @@ html {
 	font-family: sans-serif;
 }
 
-body > noscript > div {
+body > noscript {
 	position: fixed;
-	z-index: 32768;
+	z-index: 2;
 	top: 0;
 	left: 0;
 	width: 100%;
@@ -14,16 +14,16 @@ body > noscript > div {
 	text-align: center;
 	background: #fff;
 }
-	body > noscript > div > p {
+	body > noscript > p {
 		display: block;
 		margin: 32px;
 		font-size: 2em;
 		color: #555;
 	}
 
-#init {
+#ini {
 	position: fixed;
-	z-index: 16384;
+	z-index: 1;
 	top: 0;
 	left: 0;
 	width: 100%;
@@ -32,27 +32,27 @@ body > noscript > div {
 	background: #fff;
 	cursor: wait;
 }
-	#init > p {
+	#ini > p {
 		display: block;
 		user-select: none;
 		margin: 32px;
 		font-size: 4em;
 		color: #555;
 	}
-		#init > p > span {
-			animation: init 1.4s infinite ease-in-out both;
+		#ini > p > span {
+			animation: ini 1.4s infinite ease-in-out both;
 		}
-		#init > p > span:nth-child(1) {
+		#ini > p > span:nth-child(1) {
 			animation-delay: 0s;
 		}
-		#init > p > span:nth-child(2) {
+		#ini > p > span:nth-child(2) {
 			animation-delay: 0.16s;
 		}
-		#init > p > span:nth-child(3) {
+		#ini > p > span:nth-child(3) {
 			animation-delay: 0.32s;
 		}
 
-@keyframes init {
+@keyframes ini {
 	0%, 80%, 100% {
 		opacity: 1;
 	}