yuuki/taiko-web
1
0
Fork 0
mirror of https://github.com/yuukiwww/taiko-web.git synced 2024-09-30 21:29:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

Improve gamepad layout window

Browse Source
This commit is contained in:
LoveEevee 2019-04-16 22:48:21 +03:00
parent f05b2518f3
commit f5d4c6bce5
4 changed files with 32 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
public/src/css/view.css
View File

@ -164,7 +164,8 @@ kbd{
} }
.view-content:not(:hover) .setting-box.selected .setting-name, .view-content:not(:hover) .setting-box.selected .setting-name,
.view-outer:not(.settings-outer) .setting-box.selected .setting-name, .view-outer:not(.settings-outer) .setting-box.selected .setting-name,
.setting-box:hover .setting-name{ .setting-box:hover .setting-name,
.setting-box:hover #gamepad-value{
color: #fff; color: #fff;
z-index: 0; z-index: 0;
} }
@ -210,15 +211,19 @@ kbd{
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 550px; width: 574px;
height: 417px; height: 428px;
max-height: calc(100vh - 14em + 88px);
}
#settings-gamepad .setting-box{
height: auto;
} }
#gamepad-bg{ #gamepad-bg{
position: relative; position: relative;
width: 550px; width: 550px;
height: 317px; height: 317px;
max-height: none; max-height: none;
background-repeat: none; background-repeat: no-repeat;
text-align: center; text-align: center;
font-size: 1.4em; font-size: 1.4em;
cursor: pointer; cursor: pointer;
@ -230,6 +235,13 @@ kbd{
width: 282px; width: 282px;
height: 131px; height: 131px;
background-position: 0 -318px; background-position: 0 -318px;
background-repeat: none; background-repeat: no-repeat;
pointer-events: none; pointer-events: none;
} }
#gamepad-value{
position: relative;
margin-top: 1em;
}
#gamepad-value::before{
left: auto;
}

12
public/src/js/settings.js
View File

@ -227,8 +227,8 @@ class SettingsView{
this.gamepadTitle = this.gamepadSettings.getElementsByClassName("view-title")[0] this.gamepadTitle = this.gamepadSettings.getElementsByClassName("view-title")[0]
this.gamepadEndButton = this.gamepadSettings.getElementsByClassName("view-end-button")[0] this.gamepadEndButton = this.gamepadSettings.getElementsByClassName("view-end-button")[0]
this.addTouch(this.gamepadEndButton, event => this.gamepadBack(true)) this.addTouch(this.gamepadEndButton, event => this.gamepadBack(true))
this.gamepadBg = document.getElementById("gamepad-bg") this.gamepadBox = this.gamepadSettings.getElementsByClassName("setting-box")[0]
this.addTouch(this.gamepadBg, event => this.gamepadSet(1)) this.addTouch(this.gamepadBox, event => this.gamepadSet(1))
this.gamepadButtons = document.getElementById("gamepad-buttons") this.gamepadButtons = document.getElementById("gamepad-buttons")
this.gamepadValue = document.getElementById("gamepad-value") this.gamepadValue = document.getElementById("gamepad-value")
@ -425,7 +425,9 @@ class SettingsView{
assets.sounds["se_ka"].play() assets.sounds["se_ka"].play()
} }
var opt = current.options[this.gamepadSelected] var opt = current.options[this.gamepadSelected]
this.gamepadValue.innerText = strings.settings[selected.id][opt] var value = strings.settings[selected.id][opt]
this.gamepadValue.innerText = value
this.gamepadValue.setAttribute("alt", value)
this.gamepadButtons.style.backgroundPosition = "0 " + (-318 - 132 * this.gamepadSelected) + "px" this.gamepadButtons.style.backgroundPosition = "0 " + (-318 - 132 * this.gamepadSelected) + "px"
this.gamepadSettings.style.display = "block" this.gamepadSettings.style.display = "block"
} }
@ -513,14 +515,14 @@ class SettingsView{
} }
this.removeTouch(this.gamepadSettings) this.removeTouch(this.gamepadSettings)
this.removeTouch(this.gamepadEndButton) this.removeTouch(this.gamepadEndButton)
this.removeTouch(this.gamepadBg) this.removeTouch(this.gamepadBox)
delete this.tutorialTitle delete this.tutorialTitle
delete this.endButton delete this.endButton
delete this.items delete this.items
delete this.gamepadSettings delete this.gamepadSettings
delete this.gamepadTitle delete this.gamepadTitle
delete this.gamepadEndButton delete this.gamepadEndButton
delete this.gamepadBg delete this.gamepadBox
delete this.gamepadButtons delete this.gamepadButtons
delete this.gamepadValue delete this.gamepadValue
if(this.resolution !== settings.getItem("resolution")){ if(this.resolution !== settings.getItem("resolution")){

10
public/src/views/settings.html
View File

@ -9,9 +9,13 @@
<div class="view-outer shadow-outer" id="settings-gamepad"> <div class="view-outer shadow-outer" id="settings-gamepad">
<div class="view"> <div class="view">
<div class="view-title stroke-sub"></div> <div class="view-title stroke-sub"></div>
<div id="gamepad-bg" class="view-content"> <div class="view-content">
<span id="gamepad-value"></span> <div class="setting-box">
<div id="gamepad-buttons"></div> <div id="gamepad-bg">
<div id="gamepad-value" class="stroke-sub"></div>
<div id="gamepad-buttons"></div>
</div>
</div>
</div> </div>
<div class="view-end-button taibtn stroke-sub selected"></div> <div class="view-end-button taibtn stroke-sub selected"></div>
</div> </div>

2
public/src/views/tutorial.html
View File

@ -1,6 +1,6 @@
<div class="view-outer"> <div class="view-outer">
<div class="view"> <div class="view">
<div class="view-title" class="stroke-sub"></div> <div class="view-title stroke-sub"></div>
<div class="view-content"></div> <div class="view-content"></div>
<div class="view-end-button taibtn stroke-sub selected"></div> <div class="view-end-button taibtn stroke-sub selected"></div>
</div> </div>