From 82271f1c173404d54c329de190439cf16044d21e Mon Sep 17 00:00:00 2001
From: cutls <web-pro@cutls.com>
Date: Wed, 6 May 2020 18:02:14 +0900
Subject: [PATCH] platform compat

---
 app/css/master.css                | 48 +++++++++++++++++++------------
 app/js/common/version.js          |  1 +
 app/js/ui/settings.js             |  1 +
 app/view/make/acct.sample.html    | 17 ++++++-----
 app/view/make/index.sample.html   | 14 ++++-----
 app/view/make/make.js             |  2 ++
 app/view/make/setting.sample.html | 35 +++++++++++-----------
 7 files changed, 69 insertions(+), 49 deletions(-)

diff --git a/app/css/master.css b/app/css/master.css
index 1122d77a..01745958 100644
--- a/app/css/master.css
+++ b/app/css/master.css
@@ -9,7 +9,9 @@ body {
 	height: 100vh;
 	color: var(--color);
 }
-.titlebar, .menubar-menu-container, .action-menu-item {
+.titlebar,
+.menubar-menu-container,
+.action-menu-item {
 	background-color: var(--notfbox) !important;
 	filter: brightness(110%) !important;
 	color: var(--color) !important;
@@ -25,10 +27,10 @@ body {
 	display: none;
 }
 .accessMark {
-    font-size: 12px;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
+	font-size: 12px;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
 	background-color: var(--emphasized);
 	padding-left: 5px;
 	padding-right: 5px;
@@ -519,18 +521,18 @@ textarea {
 	width: 300px;
 	max-width: 100%;
 	background-color: var(--box);
-  z-index: 501;
-  padding: 5px;
+	z-index: 501;
+	padding: 5px;
 }
 #pageSrcInput {
-  width: 160px;
+	width: 160px;
 }
 .voice {
 	clip: rect(1px, 1px, 1px, 1px);
-    position: absolute !important;
-    height: 1px;
-    width: 1px;
-    overflow: hidden;
+	position: absolute !important;
+	height: 1px;
+	width: 1px;
+	overflow: hidden;
 }
 
 @media (max-width: 500px) {
@@ -561,17 +563,14 @@ textarea {
 	font-family: 'Open Sans';
 	font-style: normal;
 	font-weight: 300;
-	src: local('Open Sans Light'), local('OpenSans-Light'),
-		url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UN_r8OUuhp.woff2) format('woff2');
-	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
-		U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+	src: local('Open Sans Light'), local('OpenSans-Light'), url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UN_r8OUuhp.woff2) format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 @font-face {
 	font-family: 'Material Icons';
 	font-style: normal;
 	font-weight: 400;
-	src: url(https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2)
-		format('woff2');
+	src: url(https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
 }
 .material-icons {
 	font-family: 'Material Icons';
@@ -588,3 +587,16 @@ textarea {
 	-webkit-font-feature-settings: 'liga';
 	-webkit-font-smoothing: antialiased;
 }
+.pwaView .pwa,
+.pwaView .mac,
+.pwaView .win {
+	display: none;
+}
+.win32 .mac,
+.linux .mac {
+	display: none;
+}
+.linux .win,
+.darwin .win {
+	display: none;
+}
diff --git a/app/js/common/version.js b/app/js/common/version.js
index 2ac8f6a3..f566575e 100644
--- a/app/js/common/version.js
+++ b/app/js/common/version.js
@@ -1,6 +1,7 @@
 //バージョンチェッカー
 function verck(ver, jp) {
 	console.log('%c Welcome😊 ' + ver, 'color: red;font-size:200%;')
+	$('body').addClass(localStorage.getItem('platform'))
 	var date = new Date()
 	var showVer = false
 	if (localStorage.getItem('ver') != ver && localStorage.getItem('winstore')) {
diff --git a/app/js/ui/settings.js b/app/js/ui/settings.js
index c8c981a1..ff554d10 100644
--- a/app/js/ui/settings.js
+++ b/app/js/ui/settings.js
@@ -766,6 +766,7 @@ window.onload = function () {
 	voiceSettingLoad()
 	oksload()
 	ctLoad()
+	$('body').addClass(localStorage.getItem('platform'))
 }
 //設定画面で未読マーカーは要らない
 function asReadEnd() {
diff --git a/app/view/make/acct.sample.html b/app/view/make/acct.sample.html
index a7a2d640..97285a3a 100644
--- a/app/view/make/acct.sample.html
+++ b/app/view/make/acct.sample.html
@@ -29,7 +29,7 @@
 		@@pwa@@
 	</head>
 
-	<body id="mainView">
+	<body id="mainView" class="@@pwaClass@@">
 		<script type="text/javascript" src="../../@@node_base@@/jquery/dist/jquery.js"></script>
 		<script type="text/javascript" src="../../js/platform/first.js"></script>
 		<script
@@ -63,12 +63,14 @@
 						<input type="text" id="url" style="width:70%" placeholder="ex)mstdn.jp" />
 						<div id="ins-suggest"></div>
 						<button class="btn waves-effect" onclick="instance()">Login</button><br />
-						@@codesetupwarn@@<br />
-						<label>
-							<input type="checkbox" class="filled-in" id="linux" />
-							<span>@@codesetup@@</span>
-						</label>
-						<br />
+						<div class="pwa">
+							@@codesetupwarn@@<br />
+							<label>
+								<input type="checkbox" class="filled-in" id="linux" />
+								<span>@@codesetup@@</span>
+							</label>
+							<br />
+						</div>
 						<label>
 							<input type="checkbox" class="filled-in" id="misskey" />
 							<span>@@thisismisskey@@</span> </label
@@ -144,5 +146,6 @@
 		<script type="text/javascript" src="../../js/login/instance.js"></script>
 		<script type="text/javascript" src="../../js/login/manager.js"></script>
 		<script type="text/javascript" src="../../js/tl/date.js"></script>
+		<script>$('body').addClass(localStorage.getItem('platform'))</script>
 	</body>
 </html>
diff --git a/app/view/make/index.sample.html b/app/view/make/index.sample.html
index 63876407..07a1cc3f 100644
--- a/app/view/make/index.sample.html
+++ b/app/view/make/index.sample.html
@@ -34,7 +34,7 @@
 		@@comment-end@@ @@pwa@@
 	</head>
 
-	<body>
+	<body class="@@pwaClass@@">
 		<script>
 			var ver = '@@versionLetter@@'
 			var gitHash = '@@gitHash@@'
@@ -356,7 +356,7 @@
 							<a class="waves-effect gray" id="cw" onclick="cw()" title="@@cwDes@@">CW</a>
 							<span
 								><span id="imgup"></span
-								><span id="imgsel"
+								><span id="imgsel" class="pwa"
 									><i
 										class="waves-effect material-icons gray"
 										onclick="fileselect()"
@@ -389,7 +389,7 @@
 							<span class=" sml mize"
 								><span>@@replyMode@@</span>: <span id="rec">@@no@@</span>/<span>@@temp@@</span>:
 								<span id="mec">@@nothing@@</span>
-								<a onclick="stamp()" class="pointer" title="@@stampWarn@@"
+								<a onclick="stamp()" class="pointer pwa" title="@@stampWarn@@"
 									>@@stamp@@: <span id="stamp">Off</span></a
 								>
 								/@@poll@@:<span id="pollsta">@@no@@</span>
@@ -444,7 +444,7 @@
 						<li>
 							<a onclick="nowplaying('spotify');">NowPlaying (Spotify)</a>
 						</li>
-						<li>
+						<li class="mac">
 							<a onclick="nowplaying('itunes');">NowPlaying (iTunes macOS)</a>
 						</li>
 						<li>
@@ -1604,7 +1604,7 @@
 					</div>
 				</div>
 			</div>
-			<a onclick="about()" class="nex waves-effect">
+			<a onclick="about()" class="nex waves-effect pwa">
 				<i class="material-icons" style="font-size: 1rem;">info</i>@@about@@ </a
 			>&nbsp;|&nbsp;
 			<a onclick="bottomReverse()" class="nex waves-effect">
@@ -1653,7 +1653,7 @@
 						<a href="setting.html" class="nex waves-effect">
 							<i class="material-icons nex" title="@@setting@@(Ctrl+Shift+S)">settings</i>
 						</a>
-						<a onclick="nano()" class="nex waves-effect">
+						<a onclick="nano()" class="nex waves-effect pwa">
 							<i class="material-icons" title="@@nanoDes@@TheDesk Nano" data-trans-title="nano_desp"
 								>remove_from_queue</i
 							>
@@ -1686,7 +1686,7 @@
 								>access_time</i
 							>
 						</a>
-						<a onclick="tips('memory')" class="nex waves-effect">
+						<a onclick="tips('memory')" class="nex waves-effect pwa">
 							<i class="material-icons nex" title="@@ramTips@@" data-trans-title="memory">memory</i>
 						</a>
 						<a onclick="tips('trend')" class="nex waves-effect imasonly" style="display:none;">
diff --git a/app/view/make/make.js b/app/view/make/make.js
index 2422bc1c..339ca45a 100644
--- a/app/view/make/make.js
+++ b/app/view/make/make.js
@@ -147,9 +147,11 @@ function main(ver, basefile, pwa) {
 				source = source.replace(/@@pwa@@/g, `<link rel="manifest" href="/manifest.json" />
 				<script>var pwa = true;"serviceWorker"in navigator&&navigator.serviceWorker.register("/sw.pwa.js").then(e=>{});</script>`)
 				source = source.replace(/@@node_base@@/g, 'dependencies')
+				source = source.replace(/@@pwaClass@@/g, 'pwaView')
 			} else {
 				source = source.replace(/@@pwa@@/g, '<script>var pwa = false;</script>')
 				source = source.replace(/@@node_base@@/g, 'node_modules')
+				source = source.replace(/@@pwaClass@@/g, '')
 			}
 			fs.writeFileSync(basefile + 'view/' + lang + '/' + pages[i], source)
 		}
diff --git a/app/view/make/setting.sample.html b/app/view/make/setting.sample.html
index 4e3cfd7d..327e7b4a 100644
--- a/app/view/make/setting.sample.html
+++ b/app/view/make/setting.sample.html
@@ -32,7 +32,7 @@
 	@@pwa@@
 </head>
 
-<body id="mainView" style="overflow-y:scroll">
+<body id="mainView" style="overflow-y:scroll" class="@@pwaClass@@">
 	<script type="text/javascript" src="../../@@node_base@@/jquery/dist/jquery.js"></script>
 	<script type="text/javascript" src="../../js/platform/first.js"></script>
 	<script type="text/javascript" src="../../@@node_base@@/materialize-css/dist/js/materialize.js"></script>
@@ -399,7 +399,7 @@
 					style="width:100%; max-width:200px; background-color:#1ed760;" id="spotify-disable"><i
 						class="fab fa-spotify left"></i>@@disconnect@@</a>
 				<h5>@@link@@(Last.fm)</h5>
-				@@lastFmWarn@@
+				@@lastFmWarn@@<br />
 				<input type="text" style="width:150px" id="lastFmUser">
 				<button onclick="lastFmSet()" class="btn waves-effect" style="width:100px;">@@set@@</button>
 				<h5>@@templateedit@@</h5>
@@ -407,8 +407,7 @@
 				<textarea id="np-temp" class="materialize-textarea" data-length="500">#NowPlaying {song} / {album} / {artist}
 {url}</textarea><br>
 				@@template1@@<br>
-				@@template2@@<br>
-				@@template3@@<br>
+				<span class="mac">>@@template2@@</span><br>
 				<button onclick="spotifySave()" class="btn waves-effect" style="width:100px;">@@set@@</button>
 				<h5>@@postartwork@@</h5>
 				<label>
@@ -421,19 +420,21 @@
 						value="no" />
 					<span>@@no@@</span>
 				</label>
-				<h5>@@searchArtwork@@</h5>
-				@@searchArtworkWarn@@<br />
-				<label>
-					<input class="with-gap" onchange="aMusicFlagSave()" name="amw" type="radio" id="amw_yes"
-						value="yes" />
-					<span>@@yes@@</span>
-				</label>
-				<label>
-					<input class="with-gap" onchange="aMusicFlagSave()" name="amw" type="radio" id="amw_no"
-						value="no" />
-					<span>@@no@@</span>
-				</label>
-				<br>
+				<div class="mac">
+					<h5>@@searchArtwork@@</h5>
+					@@searchArtworkWarn@@<br />
+					<label>
+						<input class="with-gap" onchange="aMusicFlagSave()" name="amw" type="radio" id="amw_yes"
+							value="yes" />
+						<span>@@yes@@</span>
+					</label>
+					<label>
+						<input class="with-gap" onchange="aMusicFlagSave()" name="amw" type="radio" id="amw_no"
+							value="no" />
+						<span>@@no@@</span>
+					</label>
+					<br>
+				</div>
 			</div>
 		</li>
 		<li>