Split language and tutorial, add gamepad settings

This commit is contained in:
LoveEevee 2019-04-16 21:06:41 +03:00
parent a4d938e888
commit f05b2518f3
26 changed files with 1036 additions and 835 deletions

View File

@ -19,3 +19,7 @@
.settings-outer{
background-image: url("bg_settings.png");
}
#gamepad-bg,
#gamepad-buttons{
background-image: url("settings_gamepad.png");
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 490 B

View File

@ -23,117 +23,6 @@
left: 0;
z-index: -1;
}
#tutorial-outer{
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
position: absolute;
width: 100%;
height: 100%;
}
#tutorial{
background: rgb(246, 234, 212);
color: black;
border: 0.25em black solid;
border-radius: 0.5em;
width: 800px;
padding: 1em;
margin: 1em;
font-size: 21px;
position: relative;
}
.touch-enabled #tutorial{
font-size: 3vmin;
}
#tutorial-title{
z-index: 1;
position: absolute;
color: white;
top: -0.7em;
font-size: 1.65em;
}
#tutorial-content{
margin: 0.7em 0;
overflow-y: auto;
max-height: calc(100vh - 14em);
}
kbd{
font-family: inherit;
padding: 0.1em 0.6em;
border: 1px solid #ccc;
font-size: 0.6em;
background-color: #f7f7f7;
color: #333;
box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
border-radius: 3px;
display: inline-block;
text-shadow: 0 1px 0 #fff;
line-height: 1.4;
white-space: nowrap;
}
.taibtn{
display: inline-block;
background: #f6ead4;
padding: 0.4em 0.4em;
border-radius: 0.5em;
border: 0.1em rgba(218, 205, 178, 1) solid;
cursor: pointer;
font-size: 1.4em;
box-sizing: border-box;
color: #555;
text-align: center;
}
#tutorial-end-button{
float: right;
padding: 0.4em 1.5em;
font-weight: bold;
border-color: #000;
color: #000;
}
.taibtn:hover,
.taibtn.selected,
#tutorial-end-button:hover,
#tutorial-end-button.selected{
position: relative;
z-index: 1;
color: #fff;
background: #ffb547;
border-color: #fff;
}
.taibtn::before{
padding-left: inherit;
}
#about-link-btns{
float: left;
display: flex;
}
#about-link-btns .taibtn{
margin-right: 0.4em;
}
#diag-txt textarea,
#diag-txt iframe{
width: 100%;
height: 5em;
font-size: inherit;
resize: none;
word-break: break-all;
margin-bottom: 1em;
background: #fff;
border: 1px solid #a9a9a9;
user-select: all;
}
.text-warn{
color: #d00;
}
.link-btn a{
color: inherit;
text-decoration: none;
pointer-events: none;
}
.nowrap{
white-space: nowrap;
}
#session-invite{
width: 100%;
height: 1.9em;
@ -149,78 +38,6 @@ kbd{
cursor: text;
overflow: hidden;
}
@keyframes border-pulse{
0%{border-color: #ff0}
50%{border-color: rgba(255, 255, 0, 0)}
100%{border-color: #ff0}
}
@keyframes border-pulse2{
0%{border-color: #e29e06}
50%{border-color: rgba(226, 158, 6, 0)}
100%{border-color: #e29e06}
}
.settings-outer{
background-size: 50vh;
}
.setting-box{
display: flex;
height: 2em;
margin-top: 1.2em;
border: 0.25em solid #000;
border-radius: 0.5em;
padding: 0.3em;
outline: none;
color: #000;
cursor: pointer;
}
.setting-box:first-child{
margin-top: 0;
}
.settings-outer #tutorial-content:not(:hover) .setting-box.selected,
#tutorial-outer:not(.settings-outer) .setting-box.selected,
.setting-box:hover{
background: #ffb547;
animation: 2s linear border-pulse infinite;
}
.bold-fonts .setting-box{
line-height: 1em;
}
.setting-name{
position: relative;
width: 50%;
padding: 0.3em;
font-size: 1.3em;
box-sizing: border-box;
}
#tutorial-content:not(:hover) .setting-box.selected .setting-name,
#tutorial-outer:not(.settings-outer) .setting-box.selected .setting-name,
.setting-box:hover .setting-name{
color: #fff;
z-index: 0;
}
.setting-name::before{
padding-left: 0.3em;
}
.setting-value{
display: flex;
background: #fff;
width: 50%;
border-radius: 0.2em;
padding: 0.5em;
box-sizing: border-box;
}
.setting-value.selected{
width: calc(50% + 0.2em);
margin: -0.1em;
border: 0.2em solid #e29e06;
padding: 0.4em;
animation: 2s linear border-pulse2 infinite;
}
.setting-value>div{
padding: 0 0.4em;
overflow: hidden;
text-overflow: ellipsis;
}
@keyframes bgscroll{
from{
background-position: 0 top;

235
public/src/css/view.css Normal file
View File

@ -0,0 +1,235 @@
.view-outer{
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
position: absolute;
width: 100%;
height: 100%;
}
.view{
background: rgb(246, 234, 212);
color: black;
border: 0.25em black solid;
border-radius: 0.5em;
width: 800px;
padding: 1em;
margin: 1em;
font-size: 21px;
position: relative;
}
.touch-enabled .view{
font-size: 3vmin;
}
.view-title{
z-index: 1;
position: absolute;
color: white;
top: -0.7em;
font-size: 1.65em;
}
.view-content{
margin: 0.7em 0;
overflow-y: auto;
max-height: calc(100vh - 14em);
}
kbd{
font-family: inherit;
padding: 0.1em 0.6em;
border: 1px solid #ccc;
font-size: 0.6em;
background-color: #f7f7f7;
color: #333;
box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
border-radius: 3px;
display: inline-block;
text-shadow: 0 1px 0 #fff;
line-height: 1.4;
white-space: nowrap;
}
.taibtn{
display: inline-block;
background: #f6ead4;
padding: 0.4em 0.4em;
border-radius: 0.5em;
border: 0.1em rgba(218, 205, 178, 1) solid;
cursor: pointer;
font-size: 1.4em;
box-sizing: border-box;
color: #555;
text-align: center;
}
.view-end-button{
float: right;
padding: 0.4em 1.5em;
font-weight: bold;
border-color: #000;
color: #000;
z-index: 1;
}
.taibtn:hover,
.taibtn.selected,
.view-end-button:hover,
.view-end-button.selected{
position: relative;
color: #fff;
background: #ffb547;
border-color: #fff;
}
.taibtn::before,
.view-end-button::before{
display: none;
}
.taibtn:hover::before,
.taibtn.selected::before,
.view-end-button:hover::before,
.view-end-button.selected::before{
display: block
}
.taibtn::before{
padding-left: inherit;
}
.left-buttons{
float: left;
display: flex;
}
.left-buttons .taibtn{
margin-right: 0.4em;
}
#diag-txt textarea,
#diag-txt iframe{
width: 100%;
height: 5em;
font-size: inherit;
resize: none;
word-break: break-all;
margin-bottom: 1em;
background: #fff;
border: 1px solid #a9a9a9;
user-select: all;
}
.text-warn{
color: #d00;
}
.link-btn a{
color: inherit;
text-decoration: none;
pointer-events: none;
}
.nowrap{
white-space: nowrap;
}
@keyframes border-pulse{
0%{border-color: #ff0}
50%{border-color: rgba(255, 255, 0, 0)}
100%{border-color: #ff0}
}
@keyframes border-pulse2{
0%{border-color: #e29e06}
50%{border-color: rgba(226, 158, 6, 0)}
100%{border-color: #e29e06}
}
.settings-outer{
background-size: 50vh;
}
.setting-box{
display: flex;
height: 2em;
margin-top: 1.2em;
border: 0.25em solid #000;
border-radius: 0.5em;
padding: 0.3em;
outline: none;
color: #000;
cursor: pointer;
}
.setting-box:first-child{
margin-top: 0;
}
.settings-outer .view-content:not(:hover) .setting-box.selected,
.view-outer:not(.settings-outer) .setting-box.selected,
.setting-box:hover{
background: #ffb547;
animation: 2s linear border-pulse infinite;
}
.bold-fonts .setting-box{
line-height: 1em;
}
.setting-name{
position: relative;
width: 50%;
padding: 0.3em;
font-size: 1.3em;
box-sizing: border-box;
}
.view-content:not(:hover) .setting-box.selected .setting-name,
.view-outer:not(.settings-outer) .setting-box.selected .setting-name,
.setting-box:hover .setting-name{
color: #fff;
z-index: 0;
}
.setting-name::before{
padding-left: 0.3em;
}
.setting-value{
display: flex;
background: #fff;
width: 50%;
border-radius: 0.2em;
padding: 0.5em;
box-sizing: border-box;
}
.setting-value.selected{
width: calc(50% + 0.2em);
margin: -0.1em;
border: 0.2em solid #e29e06;
padding: 0.4em;
animation: 2s linear border-pulse2 infinite;
}
.setting-value>div{
padding: 0 0.4em;
overflow: hidden;
text-overflow: ellipsis;
}
.shadow-outer{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 1;
}
#settings-gamepad{
display: none;
}
#settings-gamepad .view{
position: absolute;
margin: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 550px;
height: 417px;
}
#gamepad-bg{
position: relative;
width: 550px;
height: 317px;
max-height: none;
background-repeat: none;
text-align: center;
font-size: 1.4em;
cursor: pointer;
}
#gamepad-buttons{
position: absolute;
left: 141px;
top: 120px;
width: 282px;
height: 131px;
background-position: 0 -318px;
background-repeat: none;
pointer-events: none;
}

View File

@ -4,20 +4,20 @@
loader.changePage("about", true)
cancelTouch = false
this.endButton = document.getElementById("tutorial-end-button")
this.endButton = this.getElement("view-end-button")
this.diagTxt = document.getElementById("diag-txt")
this.version = document.getElementById("version-link").href
this.tutorialOuter = document.getElementById("tutorial-outer")
this.tutorialOuter = this.getElement("view-outer")
if(touchEnabled){
this.tutorialOuter.classList.add("touch-enabled")
}
this.linkIssues = document.getElementById("link-issues")
this.linkEmail = document.getElementById("link-email")
var tutorialTitle = document.getElementById("tutorial-title")
var tutorialTitle = this.getElement("view-title")
tutorialTitle.innerText = strings.aboutSimulator
tutorialTitle.setAttribute("alt", strings.aboutSimulator)
var tutorialContent = document.getElementById("tutorial-content")
var tutorialContent = this.getElement("view-content")
strings.about.bugReporting.forEach(string => {
tutorialContent.appendChild(document.createTextNode(string))
tutorialContent.appendChild(document.createElement("br"))
@ -32,20 +32,18 @@
var versionUrl = gameConfig._version.url
this.getLink(this.linkIssues).href = versionUrl + "issues"
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = {
confirm: ["enter", " ", kbdSettings.don_l[0], kbdSettings.don_r[0]],
previous: ["arrowleft", "arrowup", kbdSettings.ka_l[0]],
next: ["arrowright", "arrowdown", kbdSettings.ka_r[0]],
back: ["backspace", "escape"]
}
pageEvents.add(this.linkIssues, ["click", "touchend"], this.linkButton.bind(this))
pageEvents.add(this.linkEmail, ["click", "touchend"], this.linkButton.bind(this))
pageEvents.add(this.endButton, ["mousedown", "touchstart"], this.onEnd.bind(this))
pageEvents.keyAdd(this, "all", "down", this.keyEvent.bind(this))
this.items = [this.linkIssues, this.linkEmail, this.endButton]
this.selected = 2
this.keyboard = new Keyboard({
confirm: ["enter", "space", "don_l", "don_r"],
previous: ["left", "up", "ka_l"],
next: ["right", "down", "ka_r"],
back: ["escape"]
}, this.keyPressed.bind(this))
this.gamepad = new Gamepad({
"confirm": ["b", "ls", "rs"],
"previous": ["u", "l", "lb", "lt", "lsu", "lsl"],
@ -55,19 +53,8 @@
pageEvents.send("about", this.addDiag())
}
keyEvent(event){
if(event.keyCode === 27 || event.keyCode === 8 || event.keyCode === 9){
// Escape, Backspace, Tab
event.preventDefault()
}
if(!event.repeat){
for(var i in this.kbd){
if(this.kbd[i].indexOf(event.key.toLowerCase()) !== -1){
this.keyPressed(true, i)
break
}
}
}
getElement(name){
return loader.screen.getElementsByClassName(name)[0]
}
keyPressed(pressed, name){
if(!pressed){
@ -215,6 +202,7 @@
}
clean(){
cancelTouch = true
this.keyboard.clean()
this.gamepad.clean()
pageEvents.remove(this.linkIssues, ["click", "touchend"])
pageEvents.remove(this.linkEmail, ["click", "touchend"])

View File

@ -7,6 +7,7 @@ var assets = {
"scoresheet.js",
"songselect.js",
"keyboard.js",
"gameinput.js",
"game.js",
"controller.js",
"circle.js",
@ -36,7 +37,8 @@ var assets = {
"loadsong.css",
"game.css",
"debug.css",
"songbg.css"
"songbg.css",
"view.css"
],
"assetsCss": [
"fonts/fonts.css",
@ -79,7 +81,8 @@ var assets = {
"results_flowers.png",
"results_mikoshi.png",
"results_tetsuohana.png",
"results_tetsuohana2.png"
"results_tetsuohana2.png",
"settings_gamepad.png"
],
"audioSfx": [
"se_cancel.wav",

View File

@ -28,7 +28,7 @@ class Controller{
this.game = new Game(this, this.selectedSong, this.parsedSongData)
this.view = new View(this)
this.mekadon = new Mekadon(this, this.game)
this.keyboard = new Keyboard(this)
this.keyboard = new GameInput(this)
this.playedSounds = {}
}
@ -210,11 +210,8 @@ class Controller{
getKeys(){
return this.keyboard.getKeys()
}
setKey(keyCode, down, ms){
return this.keyboard.setKey(keyCode, down, ms)
}
getBindings(){
return this.keyboard.getBindings()
setKey(pressed, name, ms){
return this.keyboard.setKey(pressed, name, ms)
}
getElapsedTime(){
return this.game.elapsedTime

View File

@ -202,11 +202,10 @@ class Debug{
this.controller.autoPlayEnabled = this.autoplayCheckbox.checked
if(!this.controller.autoPlayEnabled){
var keyboard = debugObj.controller.keyboard
var kbd = keyboard.getBindings()
keyboard.setKey(kbd.don_l, false)
keyboard.setKey(kbd.don_r, false)
keyboard.setKey(kbd.ka_l, false)
keyboard.setKey(kbd.ka_r, false)
keyboard.setKey(false, "don_l")
keyboard.setKey(false, "don_r")
keyboard.setKey(false, "ka_l")
keyboard.setKey(false, "ka_r")
}
}
}

View File

@ -254,29 +254,28 @@ class Game{
return
}
var keys = this.controller.getKeys()
var kbd = this.controller.getBindings()
var don_l = keys[kbd["don_l"]] && !this.controller.isWaiting(kbd["don_l"], "score")
var don_r = keys[kbd["don_r"]] && !this.controller.isWaiting(kbd["don_r"], "score")
var ka_l = keys[kbd["ka_l"]] && !this.controller.isWaiting(kbd["ka_l"], "score")
var ka_r = keys[kbd["ka_r"]] && !this.controller.isWaiting(kbd["ka_r"], "score")
var don_l = keys["don_l"] && !this.controller.isWaiting("don_l", "score")
var don_r = keys["don_r"] && !this.controller.isWaiting("don_r", "score")
var ka_l = keys["ka_l"] && !this.controller.isWaiting("ka_l", "score")
var ka_r = keys["ka_r"] && !this.controller.isWaiting("ka_r", "score")
var checkDon = () => {
if(don_l && don_r){
this.checkKey([kbd["don_l"], kbd["don_r"]], circle, "daiDon")
this.checkKey(["don_l", "don_r"], circle, "daiDon")
}else if(don_l){
this.checkKey([kbd["don_l"]], circle, "don")
this.checkKey(["don_l"], circle, "don")
}else if(don_r){
this.checkKey([kbd["don_r"]], circle, "don")
this.checkKey(["don_r"], circle, "don")
}
}
var checkKa = () => {
if(ka_l && ka_r){
this.checkKey([kbd["ka_l"], kbd["ka_r"]], circle, "daiKa")
this.checkKey(["ka_l", "ka_r"], circle, "daiKa")
}else if(ka_l){
this.checkKey([kbd["ka_l"]], circle, "ka")
this.checkKey(["ka_l"], circle, "ka")
}else if(ka_r){
this.checkKey([kbd["ka_r"]], circle, "ka")
this.checkKey(["ka_r"], circle, "ka")
}
}
var keyTime = this.controller.getKeyTime()

247
public/src/js/gameinput.js Normal file
View File

@ -0,0 +1,247 @@
class GameInput{
constructor(controller){
this.controller = controller
this.game = this.controller.game
this.keyboard = new Keyboard({
ka_l: ["ka_l"],
don_l: ["don_l"],
don_r: ["don_r"],
ka_r: ["ka_r"],
pause: ["q", "esc"],
back: ["backspace"],
previous: ["left", "up"],
next: ["right", "down"],
confirm: ["enter", "space"]
}, this.keyPress.bind(this))
this.keys = {}
this.waitKeyupScore = {}
this.waitKeyupSound = {}
this.waitKeyupMenu = {}
this.keyTime = {
"don": -Infinity,
"ka": -Infinity
}
this.keyboardEvents = 0
var layout = settings.getItem("gamepadLayout")
if(layout === "b"){
var gameBtn = {
don_l: ["d", "r", "ls"],
don_r: ["a", "x", "rs"],
ka_l: ["u", "l", "lb", "lt"],
ka_r: ["b", "y", "rb", "rt"]
}
}else if(layout === "c"){
var gameBtn = {
don_l: ["d", "l", "ls"],
don_r: ["a", "b", "rs"],
ka_l: ["u", "r", "lb", "lt"],
ka_r: ["x", "y", "rb", "rt"]
}
}else{
var gameBtn = {
don_l: ["u", "d", "l", "r", "ls"],
don_r: ["a", "b", "x", "y", "rs"],
ka_l: ["lb", "lt"],
ka_r: ["rb", "rt"]
}
}
this.gamepad = new Gamepad(gameBtn)
this.gamepadInterval = setInterval(this.gamepadKeys.bind(this), 1000 / 60 / 2)
this.gamepadMenu = new Gamepad({
cancel: ["a"],
confirm: ["b", "ls", "rs"],
previous: ["u", "l", "lb", "lt", "lsu", "lsl"],
next: ["d", "r", "rb", "rt", "lsd", "lsr"],
pause: ["start"]
})
if(controller.multiplayer === 1){
pageEvents.add(window, "beforeunload", event => {
if(p2.otherConnected){
pageEvents.send("p2-abandoned", event)
}
})
}
}
keyPress(pressed, name){
if(!this.controller.autoPlayEnabled || this.game.isPaused() || name !== "don_l" && name !== "don_r" && name !== "ka_l" && name !== "ka_r"){
this.setKey(pressed, name, this.game.getAccurateTime())
}
}
checkGameKeys(){
if(this.controller.autoPlayEnabled){
this.checkKeySound("don_l", "don")
this.checkKeySound("don_r", "don")
this.checkKeySound("ka_l", "ka")
this.checkKeySound("ka_r", "ka")
}
}
gamepadKeys(){
if(!this.game.isPaused() && !this.controller.autoPlayEnabled){
this.gamepad.play((pressed, name) => {
if(pressed){
if(this.keys[name]){
this.setKey(false, name)
}
this.setKey(true, name, this.game.getAccurateTime())
}else{
this.setKey(false, name)
}
})
}
}
checkMenuKeys(){
if(!this.controller.multiplayer && !this.locked){
var moveMenu = 0
var ms = this.game.getAccurateTime()
this.gamepadMenu.play((pressed, name) => {
if(pressed){
if(this.game.isPaused()){
if(name === "cancel"){
this.locked = true
return setTimeout(() => {
this.controller.togglePause()
this.locked = false
}, 200)
}
}
if(this.keys[name]){
this.setKey(false, name)
}
this.setKey(true, name, ms)
}else{
this.setKey(false, name)
}
})
this.checkKey("pause", "menu", () => {
this.controller.togglePause()
for(var key in this.keyTime){
this.keys[key] = null
this.keyTime[key] = -Infinity
}
})
var moveMenuMinus = () => {
moveMenu = -1
}
var moveMenuPlus = () => {
moveMenu = 1
}
var moveMenuConfirm = () => {
if(this.game.isPaused()){
this.locked = true
setTimeout(() => {
this.controller.view.pauseConfirm()
this.locked = false
}, 200)
}
}
this.checkKey("previous", "menu", moveMenuMinus)
this.checkKey("ka_l", "menu", moveMenuMinus)
this.checkKey("next", "menu", moveMenuPlus)
this.checkKey("ka_r", "menu", moveMenuPlus)
this.checkKey("confirm", "menu", moveMenuConfirm)
this.checkKey("don_l", "menu", moveMenuConfirm)
this.checkKey("don_r", "menu", moveMenuConfirm)
if(moveMenu && this.game.isPaused()){
assets.sounds["se_ka"].play()
this.controller.view.pauseMove(moveMenu)
}
}
if(this.controller.multiplayer !== 2){
this.checkKey("back", "menu", () => {
if(this.controller.multiplayer === 1 && p2.otherConnected){
p2.send("gameend")
pageEvents.send("p2-abandoned")
}
this.controller.togglePause()
this.controller.songSelection()
})
}
}
checkKey(name, type, callback){
if(this.keys[name] && !this.isWaiting(name, type)){
this.waitForKeyup(name, type)
callback()
}
}
checkKeySound(name, sound){
this.checkKey(name, "sound", () => {
var circles = this.controller.getCircles()
var circle = circles[this.controller.getCurrentCircle()]
var currentTime = this.keyTime[name]
this.keyTime[sound] = currentTime
if(circle && !circle.isPlayed){
if(circle.type === "balloon"){
if(sound === "don" && circle.requiredHits - circle.timesHit <= 1){
this.controller.playSound("se_balloon")
return
}
}
}
this.controller.playSound("neiro_1_" + sound)
})
}
getKeys(){
return this.keys
}
setKey(pressed, name, ms){
if(pressed){
this.keys[name] = true
this.waitKeyupScore[name] = false
this.waitKeyupSound[name] = false
this.waitKeyupMenu[name] = false
if(this.game.isPaused()){
return
}
this.keyTime[name] = ms
if(name == "don_l" || name == "don_r"){
this.checkKeySound(name, "don")
this.keyboardEvents++
}else if(name == "ka_l" || name == "ka_r"){
this.checkKeySound(name, "ka")
this.keyboardEvents++
}
}else{
this.keys[name] = false
this.waitKeyupScore[name] = false
this.waitKeyupSound[name] = false
this.waitKeyupMenu[name] = false
}
}
isWaiting(name, type){
if(type === "score"){
return this.waitKeyupScore[name]
}else if(type === "sound"){
return this.waitKeyupSound[name]
}else if(type === "menu"){
return this.waitKeyupMenu[name]
}
}
waitForKeyup(name, type){
if(!this.keys[name]){
return
}
if(type === "score"){
this.waitKeyupScore[name] = true
}else if(type === "sound"){
this.waitKeyupSound[name] = true
}else if(type === "menu"){
this.waitKeyupMenu[name] = true
}
}
getKeyTime(){
return this.keyTime
}
clean(){
this.keyboard.clean()
this.gamepad.clean()
this.gamepadMenu.clean()
clearInterval(this.gamepadInterval)
if(this.controller.multiplayer === 1){
pageEvents.remove(window, "beforeunload")
}
}
}

View File

@ -1,6 +1,7 @@
class Gamepad{
constructor(bindings, callback){
this.bindings = bindings
this.callback = !!callback
this.b = {
"a": 0,
"b": 1,
@ -87,6 +88,9 @@ class Gamepad{
for(var name in bindings[bind]){
var bindName = bindings[bind][name]
this.checkButton(gamepads, this.b[bindName], bind, callback, force[bindName])
if(!this.b){
return
}
}
}
break
@ -136,6 +140,11 @@ class Gamepad{
}
}
clean(){
if(this.callback){
clearInterval(this.interval)
}
delete this.bindings
delete this.b
delete this.btn
}
}

View File

@ -1,266 +1,105 @@
class Keyboard{
constructor(controller){
this.controller = controller
this.game = this.controller.game
constructor(bindings, callback){
this.bindings = bindings
this.callback = callback
this.wildcard = false
this.substitute = {
"up": "arrowup",
"right": "arrowright",
"down": "arrowdown",
"left": "arrowleft",
"space": " ",
"esc": "escape",
"ctrl": "control",
"altgr": "altgraph"
}
this.btn = {}
this.update()
pageEvents.keyAdd(this, "all", "both", this.keyEvent.bind(this))
pageEvents.blurAdd(this, this.blurEvent.bind(this))
}
update(){
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = {
"ka_l": kbdSettings.ka_l[0],
"don_l": kbdSettings.don_l[0],
"don_r": kbdSettings.don_r[0],
"ka_r": kbdSettings.ka_r[0],
"pause": "q",
"back": "backspace",
"previous": "arrowleft",
"next": "arrowright",
"confirm": "enter"
}
this.kbdAlias = {
"pause": ["escape"],
"previous": ["arrowup"],
"next": ["arrowdown"],
"confirm": [" "]
}
this.keys = {}
this.waitKeyupScore = {}
this.waitKeyupSound = {}
this.waitKeyupMenu = {}
this.keyTime = {
"don": -Infinity,
"ka": -Infinity
}
this.keyboardEvents = 0
var gameBtn = {}
gameBtn[this.kbd["don_l"]] = ["u", "d", "l", "r", "ls"]
gameBtn[this.kbd["don_r"]] = ["a", "b", "x", "y", "rs"]
gameBtn[this.kbd["ka_l"]] = ["lb", "lt"]
gameBtn[this.kbd["ka_r"]] = ["rb", "rt"]
this.gamepad = new Gamepad(gameBtn)
this.gamepadInterval = setInterval(this.gamepadKeys.bind(this), 1000 / 60 / 2)
var menuBtn = {
"cancel": ["a"],
}
menuBtn[this.kbd["confirm"]] = ["b", "ls", "rs"]
menuBtn[this.kbd["previous"]] = ["u", "l", "lb", "lt", "lsu", "lsl"],
menuBtn[this.kbd["next"]] = ["d", "r", "rb", "rt", "lsd", "lsr"]
menuBtn[this.kbd["pause"]] = ["start"]
this.gamepadMenu = new Gamepad(menuBtn)
this.kbdSearch = {}
for(var name in this.kbdAlias){
var list = this.kbdAlias[name]
for(var i in list){
this.kbdSearch[list[i]] = this.kbd[name]
var drumKeys = {}
for(var name in kbdSettings){
var keys = kbdSettings[name]
for(var i in keys){
drumKeys[keys[i]] = name
}
}
for(var name in this.kbd){
this.kbdSearch[this.kbd[name]] = this.kbd[name]
this.kbd = {}
for(var name in this.bindings){
var keys = this.bindings[name]
for(var i in keys){
var key = keys[i]
if(key in drumKeys){
continue
}
pageEvents.keyAdd(this, "all", "both", event => {
if(event.keyCode === 27 || event.keyCode === 8 || event.keyCode === 9){
// Escape, Backspace, Tab
if(key in kbdSettings){
var keyArray = kbdSettings[key]
for(var j in keyArray){
key = keyArray[j]
if(!(key in this.kbd)){
this.kbd[key] = name
}
}
}else{
if(key in this.substitute){
key = this.substitute[key]
}
if(!(key in this.kbd)){
if(key === "wildcard"){
this.wildcard = true
}
this.kbd[key] = name
}
}
}
}
}
keyEvent(event){
var key = event.key.toLowerCase()
if(key === "escape" || key === "backspace" || key === "tab"){
event.preventDefault()
}
var key = this.kbdSearch[event.key.toLowerCase()]
if(key && !event.repeat && this.buttonEnabled(key)){
var ms = this.game.getAccurateTime()
this.setKey(key, event.type === "keydown", ms)
if(event.type === "keydown"){
this.keyboardEvents++
}
}
})
if(controller.multiplayer === 1){
pageEvents.add(window, "beforeunload", event => {
if(p2.otherConnected){
pageEvents.send("p2-abandoned", event)
}
})
}
}
getBindings(){
return this.kbd
}
buttonEnabled(keyCode){
if(this.controller.autoPlayEnabled){
switch(keyCode){
case this.kbd["don_l"]:
case this.kbd["don_r"]:
case this.kbd["ka_l"]:
case this.kbd["ka_r"]:
return false
}
}
return true
}
checkGameKeys(){
if(this.controller.autoPlayEnabled){
this.checkKeySound(this.kbd["don_l"], "don")
this.checkKeySound(this.kbd["don_r"], "don")
this.checkKeySound(this.kbd["ka_l"], "ka")
this.checkKeySound(this.kbd["ka_r"], "ka")
}
}
gamepadKeys(){
if(!this.game.isPaused() && !this.controller.autoPlayEnabled){
this.gamepad.play((pressed, keyCode) => {
if(!event.repeat){
var pressed = event.type === "keydown"
if(pressed){
if(this.keys[keyCode]){
this.setKey(keyCode, false)
}
this.setKey(keyCode, true, this.game.getAccurateTime())
this.btn[key] = true
}else{
this.setKey(keyCode, false)
}
})
}
}
checkMenuKeys(){
if(!this.controller.multiplayer && !this.locked){
var moveMenu = 0
var ms = this.game.getAccurateTime()
this.gamepadMenu.play((pressed, keyCode) => {
if(pressed){
if(this.game.isPaused()){
if(keyCode === "cancel"){
this.locked = true
return setTimeout(() => {
this.controller.togglePause()
this.locked = false
}, 200)
}
}
if(this.keys[keyCode]){
this.setKey(keyCode, false)
}
this.setKey(keyCode, true, ms)
}else{
this.setKey(keyCode, false)
}
})
this.checkKey(this.kbd["pause"], "menu", () => {
this.controller.togglePause()
for(var key in this.keyTime){
this.keys[key] = null
this.keyTime[key] = -Infinity
}
})
var moveMenuMinus = () => {
moveMenu = -1
}
var moveMenuPlus = () => {
moveMenu = 1
}
var moveMenuConfirm = () => {
if(this.game.isPaused()){
this.locked = true
setTimeout(() => {
this.controller.view.pauseConfirm()
this.locked = false
}, 200)
}
}
this.checkKey(this.kbd["previous"], "menu", moveMenuMinus)
this.checkKey(this.kbd["ka_l"], "menu", moveMenuMinus)
this.checkKey(this.kbd["next"], "menu", moveMenuPlus)
this.checkKey(this.kbd["ka_r"], "menu", moveMenuPlus)
this.checkKey(this.kbd["confirm"], "menu", moveMenuConfirm)
this.checkKey(this.kbd["don_l"], "menu", moveMenuConfirm)
this.checkKey(this.kbd["don_r"], "menu", moveMenuConfirm)
if(moveMenu && this.game.isPaused()){
assets.sounds["se_ka"].play()
this.controller.view.pauseMove(moveMenu)
}
}
if(this.controller.multiplayer !== 2){
this.checkKey(this.kbd["back"], "menu", () => {
if(this.controller.multiplayer === 1 && p2.otherConnected){
p2.send("gameend")
pageEvents.send("p2-abandoned")
}
this.controller.togglePause()
this.controller.songSelection()
})
}
}
checkKey(keyCode, type, callback){
if(this.keys[keyCode] && !this.isWaiting(keyCode, type)){
this.waitForKeyup(keyCode, type)
callback()
}
}
checkKeySound(keyCode, sound){
this.checkKey(keyCode, "sound", () => {
var circles = this.controller.getCircles()
var circle = circles[this.controller.getCurrentCircle()]
var currentTime = this.keyTime[keyCode]
this.keyTime[sound] = currentTime
if(circle && !circle.isPlayed){
if(circle.type === "balloon"){
if(sound === "don" && circle.requiredHits - circle.timesHit <= 1){
this.controller.playSound("se_balloon")
delete this.btn[key]
if(key in this.kbd){
for(var i in this.btn){
if(this.kbd[i] === this.kbd[key]){
return
}
}
}
this.controller.playSound("neiro_1_" + sound)
})
}
getKeys(){
return this.keys
}
setKey(keyCode, down, ms){
if(down){
this.keys[keyCode] = true
if(this.game.isPaused()){
return
}
this.keyTime[keyCode] = ms
if(keyCode == this.kbd.don_l || keyCode == this.kbd.don_r){
this.checkKeySound(keyCode, "don")
}else if(keyCode == this.kbd.ka_l || keyCode == this.kbd.ka_r){
this.checkKeySound(keyCode, "ka")
}
}else{
this.keys[keyCode] = false
this.waitKeyupScore[keyCode] = false
this.waitKeyupSound[keyCode] = false
this.waitKeyupMenu[keyCode] = false
if(key in this.kbd){
this.callback(pressed, this.kbd[key], event)
}else if(this.wildcard){
this.callback(pressed, this.kbd["wildcard"], event)
}
}
isWaiting(keyCode, type){
if(type === "score"){
return this.waitKeyupScore[keyCode]
}else if(type === "sound"){
return this.waitKeyupSound[keyCode]
}else if(type === "menu"){
return this.waitKeyupMenu[keyCode]
}
blurEvent(){
for(var key in this.btn){
if(this.btn[key]){
delete this.btn[key]
var name = this.kbd[key] || (this.wildcard ? "wildcard" : false)
if(name){
this.callback(false, name)
}
}
waitForKeyup(keyCode, type){
if(!this.keys[keyCode]){
return
}
if(type === "score"){
this.waitKeyupScore[keyCode] = true
}else if(type === "sound"){
this.waitKeyupSound[keyCode] = true
}else if(type === "menu"){
this.waitKeyupMenu[keyCode] = true
}
}
getKeyTime(){
return this.keyTime
}
clean(){
pageEvents.keyRemove(this, "all")
clearInterval(this.gamepadInterval)
if(this.controller.multiplayer === 1){
pageEvents.remove(window, "beforeunload")
}
pageEvents.blurRemove(this)
delete this.bindings
delete this.callback
delete this.kbd
delete this.btn
}
}

View File

@ -50,7 +50,6 @@ class Mekadon{
}
}
playNow(circle, score, dai, reverse){
var kbd = this.controller.getBindings()
var type = circle.type
var keyDai = false
var playDai = !dai || dai === 2
@ -70,20 +69,20 @@ class Mekadon{
}
}
if(type === "daiDon" && playDai){
this.setKey(kbd["don_l"], ms)
this.setKey(kbd["don_r"], ms)
this.setKey("don_l", ms)
this.setKey("don_r", ms)
this.lr = false
keyDai = true
}else if(type === "don" || type === "daiDon" || drumrollNotes && score !== 2){
this.setKey(this.lr ? kbd["don_l"] : kbd["don_r"], ms)
this.setKey(this.lr ? "don_l" : "don_r", ms)
this.lr = !this.lr
}else if(type === "daiKa" && playDai){
this.setKey(kbd["ka_l"], ms)
this.setKey(kbd["ka_r"], ms)
this.setKey("ka_l", ms)
this.setKey("ka_r", ms)
this.lr = false
keyDai = true
}else if(type === "ka" || type === "daiKa" || drumrollNotes){
this.setKey(this.lr ? kbd["ka_l"] : kbd["ka_r"], ms)
this.setKey(this.lr ? "ka_l" : "ka_r", ms)
this.lr = !this.lr
}
if(type === "balloon"){
@ -110,8 +109,7 @@ class Mekadon{
getMS(){
return this.controller.getElapsedTime()
}
setKey(keyCode, ms){
this.controller.setKey(keyCode, false)
this.controller.setKey(keyCode, true, ms)
setKey(name, ms){
this.controller.setKey(true, name, ms)
}
}

View File

@ -3,10 +3,12 @@ class PageEvents{
this.allEvents = new Map()
this.keyListeners = new Map()
this.mouseListeners = new Map()
this.blurListeners = new Map()
this.lastKeyEvent = -Infinity
this.add(window, "keydown", this.keyEvent.bind(this))
this.add(window, "keyup", this.keyEvent.bind(this))
this.add(window, "mousemove", this.mouseEvent.bind(this))
this.add(window, "blur", this.blurEvent.bind(this))
this.kbd = []
}
add(target, type, callback){
@ -142,6 +144,15 @@ class PageEvents{
mouseRemove(target){
this.mouseListeners.delete(target)
}
blurEvent(event){
this.blurListeners.forEach(callback => callback(event))
}
blurAdd(target, callback){
this.blurListeners.set(target, callback)
}
blurRemove(target){
this.blurListeners.delete(target)
}
getMouse(){
return this.lastMouse
}
@ -149,12 +160,13 @@ class PageEvents{
dispatchEvent(new CustomEvent(name, {detail: detail}))
}
setKbd(){
this.kbd = []
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = [
kbdSettings.ka_l[0],
kbdSettings.don_l[0],
kbdSettings.don_r[0],
kbdSettings.ka_r[0]
]
for(var name in kbdSettings){
var keys = kbdSettings[name]
for(var i in keys){
this.kbd.push(keys[i])
}
}
}
}

View File

@ -31,13 +31,12 @@ class Scoresheet{
this.draw = new CanvasDraw()
this.canvasCache = new CanvasCache()
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = {
confirm: ["enter", " ", "escape", "backspace", kbdSettings.don_l[0], kbdSettings.don_r[0]]
}
this.keyboard = new Keyboard({
confirm: ["enter", "space", "esc", "don_l", "don_r"]
}, this.keyDown.bind(this))
this.gamepad = new Gamepad({
confirm: ["a", "b", "start", "ls", "rs"]
})
}, this.keyDown.bind(this))
this.difficulty = {
"easy": 0,
@ -76,22 +75,8 @@ class Scoresheet{
touchEvents: controller.view.touchEvents
})
}
keyDown(event, key){
if(!key){
if(event.repeat){
return
}
for(var i in this.kbd){
if(this.kbd[i].indexOf(event.key.toLowerCase()) !== -1){
key = i
break
}
}
}
if(event && event.keyCode === 27 || event.keyCode === 8 || event.keyCode === 9){
event.preventDefault()
}
if(key === "confirm"){
keyDown(pressed){
if(pressed && this.redrawing){
this.toNext()
}
}
@ -140,7 +125,6 @@ class Scoresheet{
this.winW = null
this.winH = null
pageEvents.keyAdd(this, "all", "down", this.keyDown.bind(this))
pageEvents.add(this.canvas, ["mousedown", "touchstart"], this.mouseDown.bind(this))
if(!this.multiplayer){
@ -180,12 +164,6 @@ class Scoresheet{
}
var ms = this.getMS()
this.gamepad.play((pressed, keyCode) => {
if(pressed){
this.keyDown(false, keyCode)
}
})
if(!this.redrawRunning){
return
}
@ -864,12 +842,13 @@ class Scoresheet{
}
clean(){
this.keyboard.clean()
this.gamepad.clean()
this.draw.clean()
this.canvasCache.clean()
assets.sounds["bgm_result"].stop()
snd.buffer.loadSettings()
this.redrawRunning = false
pageEvents.keyRemove(this, "all")
pageEvents.remove(this.canvas, ["mousedown", "touchstart"])
if(this.multiplayer !== 2 && this.touchEnabled){
pageEvents.remove(document.getElementById("touch-full-btn"), "touchend")

View File

@ -2,13 +2,13 @@ class Session{
constructor(touchEnabled){
this.touchEnabled = touchEnabled
loader.changePage("session", true)
this.endButton = document.getElementById("tutorial-end-button")
this.endButton = this.getElement("view-end-button")
if(touchEnabled){
document.getElementById("tutorial-outer").classList.add("touch-enabled")
this.getElement("view-outer").classList.add("touch-enabled")
}
this.sessionInvite = document.getElementById("session-invite")
var tutorialTitle = document.getElementById("tutorial-title")
var tutorialTitle = this.getElement("view-title")
tutorialTitle.innerText = strings.session.multiplayerSession
tutorialTitle.setAttribute("alt", strings.session.multiplayerSession)
this.sessionInvite.parentNode.insertBefore(document.createTextNode(strings.session.linkTutorial), this.sessionInvite)
@ -16,11 +16,12 @@ class Session{
this.endButton.setAttribute("alt", strings.session.cancel)
pageEvents.add(window, ["mousedown", "touchstart"], this.mouseDown.bind(this))
pageEvents.keyOnce(this, 27, "down").then(this.onEnd.bind(this))
this.keyboard = new Keyboard({
confirm: ["esc"]
}, this.keyPress.bind(this))
this.gamepad = new Gamepad({
"confirm": ["start", "b", "ls", "rs"]
}, this.onEnd.bind(this))
confirm: ["start", "b", "ls", "rs"]
}, this.keyPress.bind(this))
p2.hashLock = true
pageEvents.add(p2, "message", response => {
@ -29,13 +30,16 @@ class Session{
p2.hash(response.value)
}else if(response.type === "songsel"){
p2.clearMessage("users")
this.onEnd(false, true)
this.onEnd(true)
pageEvents.send("session-start", "host")
}
})
p2.send("invite")
pageEvents.send("session")
}
getElement(name){
return loader.screen.getElementsByClassName(name)[0]
}
mouseDown(event){
if(event.type === "mousedown" && event.which !== 1){
return
@ -50,7 +54,12 @@ class Session{
this.onEnd()
}
}
onEnd(event, fromP2){
keyPress(pressed){
if(pressed){
this.onEnd()
}
}
onEnd(fromP2){
if(!p2.session){
p2.send("leave")
p2.hash("")
@ -59,9 +68,6 @@ class Session{
}else if(!fromP2){
return p2.send("songsel")
}
if(event && event.type === "keydown"){
event.preventDefault()
}
this.clean()
assets.sounds["se_don"].play()
setTimeout(() => {
@ -69,9 +75,9 @@ class Session{
}, 500)
}
clean(){
this.keyboard.clean()
this.gamepad.clean()
pageEvents.remove(window, ["mousedown", "touchstart"])
pageEvents.keyRemove(this, 27)
pageEvents.remove(p2, "message")
delete this.endButton
delete this.sessionInvite

View File

@ -28,6 +28,12 @@ class Settings{
ka_r: ["k"]
},
touch: false
},
gamepadLayout: {
type: "gamepad",
options: ["a", "b", "c"],
default: "a",
gamepad: true
}
}
@ -42,7 +48,7 @@ class Settings{
this.storage[i] = null
}
}else if(i in storage){
if(current.type === "select" && current.options.indexOf(storage[i]) === -1){
if((current.type === "select" || current.type === "gamepad") && current.options.indexOf(storage[i]) === -1){
this.storage[i] = null
}else if(current.type === "keyboard"){
var obj = {}
@ -116,29 +122,50 @@ class Settings{
}
class SettingsView{
constructor(touchEnabled, tutorial){
constructor(touchEnabled, tutorial, songId){
this.touchEnabled = touchEnabled
this.tutorial = tutorial
if(!tutorial){
this.songId = songId
loader.changePage("settings", tutorial)
assets.sounds["bgm_settings"].playLoop(0.1, false, 0, 1.392, 26.992)
this.defaultButton = document.getElementById("settings-default")
}else if(touchEnabled){
document.getElementById("tutorial-outer").classList.add("settings-outer")
}
if(touchEnabled){
document.getElementById("tutorial-outer").classList.add("touch-enabled")
this.getElement("view-outer").classList.add("touch-enabled")
}
var gamepadEnabled = false
if("getGamepads" in navigator){
var gamepads = navigator.getGamepads()
for(var i = 0; i < gamepads.length; i++){
if(gamepads[i]){
gamepadEnabled = true
break
}
}
}
this.mode = "settings"
this.tutorialTitle = document.getElementById("tutorial-title")
this.endButton = document.getElementById("tutorial-end-button")
if(!tutorial){
this.setStrings()
}
this.keyboard = new Keyboard({
"confirm": ["enter", "space", "don_l", "don_r"],
"up": ["up"],
"previous": ["left", "ka_l"],
"next": ["right", "down", "ka_r"],
"back": ["esc"],
"other": ["wildcard"]
}, this.keyPressed.bind(this))
this.gamepad = new Gamepad({
"confirm": ["b", "ls", "rs"],
"up": ["u", "lsu"],
"previous": ["l", "lb", "lt", "lsl"],
"next": ["d", "r", "rb", "rt", "lsd", "lsr"],
"back": ["start", "a"]
}, this.keyPressed.bind(this))
this.viewTitle = this.getElement("view-title")
this.endButton = this.getElement("view-end-button")
this.resolution = settings.getItem("resolution")
var content = document.getElementById("tutorial-content")
var content = this.getElement("view-content")
this.items = []
this.selected = tutorial ? 1 : 0
for(let i in settings.items){
@ -146,6 +173,7 @@ class SettingsView{
if(
!touchEnabled && current.touch === true ||
touchEnabled && current.touch === false ||
!gamepadEnabled && current.gamepad === true ||
tutorial && current.type !== "language"
){
continue
@ -166,12 +194,7 @@ class SettingsView{
if(this.items.length === this.selected){
settingBox.classList.add("selected")
}
pageEvents.add(settingBox, ["mousedown", "touchstart"], event => {
if(event.type !== "mousedown" || event.which === 1){
event.preventDefault()
this.setValue(i)
}
})
this.addTouch(settingBox, event => this.setValue(i))
this.items.push({
id: i,
settingBox: settingBox,
@ -179,58 +202,82 @@ class SettingsView{
valueDiv: valueDiv
})
}
if(!tutorial){
if(tutorial){
this.defaultButton.style.display = "none"
this.endButton.classList.add("selected")
}else{
this.items.push({
id: "default",
settingBox: this.defaultButton
})
pageEvents.add(this.defaultButton, ["mousedown", "touchstart"], this.defaultSettings.bind(this))
this.addTouch(this.defaultButton, this.defaultSettings.bind(this))
}
this.items.push({
id: "back",
settingBox: this.endButton
})
this.addTouch(this.endButton, this.onEnd.bind(this))
this.gamepadSettings = document.getElementById("settings-gamepad")
this.addTouch(this.gamepadSettings, event => {
if(event.target === event.currentTarget){
this.gamepadBack()
}
})
this.gamepadTitle = this.gamepadSettings.getElementsByClassName("view-title")[0]
this.gamepadEndButton = this.gamepadSettings.getElementsByClassName("view-end-button")[0]
this.addTouch(this.gamepadEndButton, event => this.gamepadBack(true))
this.gamepadBg = document.getElementById("gamepad-bg")
this.addTouch(this.gamepadBg, event => this.gamepadSet(1))
this.gamepadButtons = document.getElementById("gamepad-buttons")
this.gamepadValue = document.getElementById("gamepad-value")
this.setStrings()
this.setKbd()
pageEvents.add(this.endButton, ["mousedown", "touchstart"], this.onEnd.bind(this))
pageEvents.keyAdd(this, "all", "down", this.keyEvent.bind(this))
this.gamepad = new Gamepad({
"confirm": ["b", "ls", "rs"],
"up": ["u", "lsu"],
"previous": ["l", "lb", "lt", "lsl"],
"next": ["d", "r", "rb", "rt", "lsd", "lsr"],
"back": ["start", "a"]
}, this.keyPressed.bind(this))
if(!tutorial){
pageEvents.send("settings")
}
getElement(name){
return loader.screen.getElementsByClassName(name)[0]
}
setKbd(){
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = {
"confirm": ["enter", " ", kbdSettings.don_l[0], kbdSettings.don_r[0]],
"up": ["arrowup"],
"previous": ["arrowleft", kbdSettings.ka_l[0]],
"next": ["arrowright", "arrowdown", kbdSettings.ka_r[0]],
"back": ["backspace", "escape"]
addTouch(element, callback){
pageEvents.add(element, ["mousedown", "touchstart"], event => {
if(event.type === "touchstart"){
event.preventDefault()
this.touched = true
}else if(event.which !== 1){
return
}else{
this.touched = false
}
callback(event)
})
}
removeTouch(element){
pageEvents.remove(element, ["mousedown", "touchstart"])
}
getValue(name, valueDiv){
var current = settings.items[name]
var value = settings.getItem(name)
if(current.type === "language"){
value = allStrings[value].name + " (" + value + ")"
}else if(current.type === "select"){
}else if(current.type === "select" || current.type === "gamepad"){
value = strings.settings[name][value]
}else if(current.type === "toggle"){
value = value ? strings.settings.on : strings.settings.off
}else if(current.type === "keyboard"){
valueDiv.innerHTML = ""
for(var i in value){
var key = document.createElement("div")
key.style.color = i === "ka_l" || i === "ka_r" ? "#009aa5" : "#ef2c10"
key.innerText = value[i][0].toUpperCase()
valueDiv.appendChild(key)
var keyDiv = document.createElement("div")
keyDiv.style.color = i === "ka_l" || i === "ka_r" ? "#009aa5" : "#ef2c10"
var key = value[i][0]
for(var j in this.keyboard.substitute){
if(this.keyboard.substitute[j] === key){
key = j
break
}
}
keyDiv.innerText = key.toUpperCase()
valueDiv.appendChild(keyDiv)
}
return
}
@ -264,6 +311,12 @@ class SettingsView{
this.keyboardSet()
assets.sounds["se_don"].play()
return
}else if(current.type === "gamepad"){
this.mode = "gamepad"
this.gamepadSelected = current.options.indexOf(value)
this.gamepadSet()
assets.sounds["se_don"].play()
return
}
settings.setItem(name, value)
this.getValue(name, this.items[this.selected].valueDiv)
@ -272,37 +325,11 @@ class SettingsView{
this.setLang(allStrings[value])
}
}
keyEvent(event){
if(event.keyCode === 27 || event.keyCode === 8 || event.keyCode === 9){
// Escape, Backspace, Tab
event.preventDefault()
}
if(!event.repeat){
for(var i in this.kbd){
if(this.kbd[i].indexOf(event.key.toLowerCase()) !== -1){
if(this.mode !== "keyboard" || i === "back"){
this.keyPressed(true, i)
return
}
}
}
if(this.mode === "keyboard"){
event.preventDefault()
var currentKey = event.key.toLowerCase()
for(var i in this.keyboardKeys){
if(this.keyboardKeys[i][0] === currentKey || !currentKey){
return
}
}
this.keyboardKeys[this.keyboardCurrent] = [currentKey]
this.keyboardSet()
}
}
}
keyPressed(pressed, name){
keyPressed(pressed, name, event){
if(!pressed){
return
}
this.touched = false
var selected = this.items[this.selected]
if(this.mode === "settings"){
if(name === "confirm"){
@ -325,9 +352,30 @@ class SettingsView{
}else if(name === "back"){
this.onEnd()
}
}else if(this.mode === "gamepad"){
if(name === "confirm"){
this.gamepadBack(true)
}else if(name === "up" || name === "previous" || name === "next"){
this.gamepadSet(name === "next" ? 1 : -1)
}else if(name === "back"){
this.gamepadBack()
}
}else if(this.mode === "keyboard"){
if(name === "back"){
this.keyboardBack(selected)
assets.sounds["se_cancel"].play()
}else{
event.preventDefault()
var currentKey = event.key.toLowerCase()
for(var i in this.keyboardKeys){
if(this.keyboardKeys[i][0] === currentKey || !currentKey){
return
}
}
var current = this.keyboardCurrent
assets.sounds[current === "ka_l" || current === "ka_r" ? "se_ka" : "se_don"].play()
this.keyboardKeys[current] = [currentKey]
this.keyboardSet()
}
}
}
@ -336,21 +384,28 @@ class SettingsView{
var current = settings.items[selected.id]
selected.valueDiv.innerHTML = ""
for(var i in current.default){
var key = document.createElement("div")
key.style.color = i === "ka_l" || i === "ka_r" ? "#009aa5" : "#ef2c10"
var keyDiv = document.createElement("div")
keyDiv.style.color = i === "ka_l" || i === "ka_r" ? "#009aa5" : "#ef2c10"
if(this.keyboardKeys[i]){
key.innerText = this.keyboardKeys[i][0].toUpperCase()
selected.valueDiv.appendChild(key)
var key = this.keyboardKeys[i][0]
for(var j in this.keyboard.substitute){
if(this.keyboard.substitute[j] === key){
key = j
break
}
}
keyDiv.innerText = key.toUpperCase()
selected.valueDiv.appendChild(keyDiv)
}else{
key.innerText = "[" + strings.settings[selected.id][i] + "]"
selected.valueDiv.appendChild(key)
keyDiv.innerText = "[" + strings.settings[selected.id][i] + "]"
selected.valueDiv.appendChild(keyDiv)
this.keyboardCurrent = i
return
}
}
settings.setItem(selected.id, this.keyboardKeys)
this.keyboardBack(selected)
this.setKbd()
this.keyboard.update()
pageEvents.setKbd()
}
keyboardBack(selected){
@ -359,10 +414,38 @@ class SettingsView{
selected.valueDiv.classList.remove("selected")
this.getValue(selected.id, selected.valueDiv)
}
defaultSettings(event){
if(event && event.type === "touchstart"){
event.preventDefault()
gamepadSet(diff){
if(this.mode !== "gamepad"){
return
}
var selected = this.items[this.selected]
var current = settings.items[selected.id]
if(diff){
this.gamepadSelected = this.mod(current.options.length, this.gamepadSelected + diff)
assets.sounds["se_ka"].play()
}
var opt = current.options[this.gamepadSelected]
this.gamepadValue.innerText = strings.settings[selected.id][opt]
this.gamepadButtons.style.backgroundPosition = "0 " + (-318 - 132 * this.gamepadSelected) + "px"
this.gamepadSettings.style.display = "block"
}
gamepadBack(save){
if(this.mode !== "gamepad"){
return
}
if(save){
var selected = this.items[this.selected]
var current = settings.items[selected.id]
settings.setItem(selected.id, current.options[this.gamepadSelected])
this.getValue(selected.id, selected.valueDiv)
assets.sounds["se_don"].play()
}else{
assets.sounds["se_cancel"].play()
}
this.gamepadSettings.style.display = ""
this.mode = "settings"
}
defaultSettings(){
if(this.mode === "keyboard"){
this.keyboardBack(this.items[this.selected])
}
@ -370,27 +453,19 @@ class SettingsView{
settings.setItem(i, null)
}
this.setLang(allStrings[settings.getItem("language")])
this.setKbd()
this.keyboard.update()
pageEvents.setKbd()
assets.sounds["se_don"].play()
}
onEnd(event){
if(this.tutorial){
this.clean()
return this.tutorial.onEnd(event)
}
var touched = false
if(event){
if(event.type === "touchstart"){
event.preventDefault()
touched = true
}else if(event.which !== 1){
return
}
}
onEnd(){
this.clean()
assets.sounds["se_don"].play()
setTimeout(() => {
new SongSelect("settings", false, touched)
if(this.tutorial && !this.touched){
new Tutorial(false, this.songId)
}else{
new SongSelect(this.tutorial ? false : "settings", false, this.touched, this.songId)
}
}, 500)
}
setLang(lang){
@ -410,33 +485,44 @@ class SettingsView{
this.setStrings()
}
setStrings(){
if(this.tutorial){
this.tutorial.setStrings()
}else{
this.tutorialTitle.innerText = strings.gameSettings
this.tutorialTitle.setAttribute("alt", strings.gameSettings)
this.defaultButton.innerText = strings.settings.default
this.defaultButton.setAttribute("alt", strings.settings.default)
this.viewTitle.innerText = strings.gameSettings
this.viewTitle.setAttribute("alt", strings.gameSettings)
this.endButton.innerText = strings.settings.ok
this.endButton.setAttribute("alt", strings.settings.ok)
this.gamepadTitle.innerText = strings.settings.gamepadLayout.name
this.gamepadTitle.setAttribute("alt", strings.settings.gamepadLayout.name)
this.gamepadEndButton.innerText = strings.settings.ok
this.gamepadEndButton.setAttribute("alt", strings.settings.ok)
if(!this.tutorial){
this.defaultButton.innerText = strings.settings.default
this.defaultButton.setAttribute("alt", strings.settings.default)
}
}
mod(length, index){
return ((index % length) + length) % length
}
clean(){
this.keyboard.clean()
this.gamepad.clean()
assets.sounds["bgm_settings"].stop()
pageEvents.keyRemove(this, "all")
for(var i in this.items){
pageEvents.remove(this.items[i].settingBox, ["mousedown", "touchstart"])
this.removeTouch(this.items[i].settingBox)
}
if(this.defaultButton){
delete this.defaultButton
}
this.removeTouch(this.gamepadSettings)
this.removeTouch(this.gamepadEndButton)
this.removeTouch(this.gamepadBg)
delete this.tutorialTitle
delete this.endButton
delete this.items
delete this.gamepadSettings
delete this.gamepadTitle
delete this.gamepadEndButton
delete this.gamepadBg
delete this.gamepadButtons
delete this.gamepadValue
if(this.resolution !== settings.getItem("resolution")){
for(var i in assets.image){
if(i === "touch_drum" || i.startsWith("bg_song_") || i.startsWith("bg_stage_") || i.startsWith("bg_don_")){

View File

@ -289,16 +289,17 @@ class SongSelect{
this.startPreview(true)
this.pressedKeys = {}
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = {
confirm: ["enter", " ", kbdSettings.don_l[0], kbdSettings.don_r[0]],
this.keyboard = new Keyboard({
confirm: ["enter", "space", "don_l", "don_r"],
back: ["escape"],
left: ["arrowleft", kbdSettings.ka_l[0]],
right: ["arrowright", kbdSettings.ka_r[0]],
up: ["arrowup"],
down: ["arrowdown"],
session: ["backspace"]
}
left: ["left", "ka_l"],
right: ["right", "ka_r"],
up: ["up"],
down: ["down"],
session: ["backspace"],
ctrl: ["ctrl"],
shift: ["shift"]
}, this.keyPress.bind(this))
this.gamepad = new Gamepad({
confirm: ["b", "start", "ls", "rs"],
back: ["a"],
@ -309,13 +310,12 @@ class SongSelect{
session: ["back"],
ctrl: ["y"],
shift: ["x"]
})
}, this.keyPress.bind(this))
if(!assets.customSongs){
this.startP2()
}
pageEvents.keyAdd(this, "all", "down", this.keyDown.bind(this))
pageEvents.add(loader.screen, "mousemove", this.mouseMove.bind(this))
pageEvents.add(loader.screen, "mouseleave", () => {
this.state.moveHover = null
@ -341,61 +341,47 @@ class SongSelect{
}
}
keyDown(event, key){
if(key){
var modifiers = {
shift: this.pressedKeys["shift"],
ctrl: this.pressedKeys["ctrl"]
keyPress(pressed, name, event){
if(pressed){
if(!this.pressedKeys[name]){
this.pressedKeys[name] = this.getMS() + 300
}
}else{
var modifiers = {
shift: event.shiftKey,
ctrl: event.ctrlKey
}
for(var i in this.kbd){
if(this.kbd[i].indexOf(event.key.toLowerCase()) !== -1){
key = i
break
}
}
}
if(key === "ctrl" || key === "shift" || !this.redrawRunning){
this.pressedKeys[name] = 0
return
}
if(event && (event.keyCode === 27 || event.keyCode === 8 || event.keyCode === 9)){
// Escape, Backspace, Tab
event.preventDefault()
if(name === "ctrl" || name === "shift" || !this.redrawRunning){
return
}
if(this.state.screen === "song"){
if(key === "confirm"){
if(name === "confirm"){
this.toSelectDifficulty()
}else if(key === "back"){
}else if(name === "back"){
this.toTitleScreen()
}else if(key === "session"){
}else if(name === "session"){
this.toSession()
}else if(key === "left"){
}else if(name === "left"){
this.moveToSong(-1)
}else if(key === "right"){
}else if(name === "right"){
this.moveToSong(1)
}
}else if(this.state.screen === "difficulty"){
if(key === "confirm"){
if(name === "confirm"){
if(this.selectedDiff === 0){
this.toSongSelect()
}else if(this.selectedDiff === 1){
this.toOptions(1)
}else{
this.toLoadSong(this.selectedDiff - this.diffOptions.length, modifiers.shift, modifiers.ctrl)
this.toLoadSong(this.selectedDiff - this.diffOptions.length, this.pressedKeys["shift"], this.pressedKeys["ctrl"])
}
}else if(key === "back" || key === "session"){
}else if(name === "back" || name === "session"){
this.toSongSelect()
}else if(key === "left"){
}else if(name === "left"){
this.moveToDiff(-1)
}else if(key === "right"){
}else if(name === "right"){
this.moveToDiff(1)
}else if(this.selectedDiff === 1 && (key === "up" || key === "down")){
this.toOptions(key === "up" ? -1 : 1)
}else if(this.selectedDiff === 1 && (name === "up" || name === "down")){
this.toOptions(name === "up" ? -1 : 1)
}
}
}
@ -781,20 +767,10 @@ class SongSelect{
requestAnimationFrame(this.redrawBind)
var ms = this.getMS()
this.gamepad.play((pressed, keyCode) => {
if(pressed){
if(!this.pressedKeys[keyCode]){
this.pressedKeys[keyCode] = ms + 300
this.keyDown(false, keyCode)
}
}else{
this.pressedKeys[keyCode] = 0
}
})
for(var key in this.pressedKeys){
if(this.pressedKeys[key]){
if(ms >= this.pressedKeys[key] + 50){
this.keyDown(false, key)
this.keyPress(true, key)
this.pressedKeys[key] = ms
}
}
@ -1957,6 +1933,8 @@ class SongSelect{
}
clean(){
this.keyboard.clean()
this.gamepad.clean()
this.clearHash()
this.draw.clean()
this.songTitleCache.clean()
@ -1979,7 +1957,6 @@ class SongSelect{
song.preview_sound.clean()
}
})
pageEvents.keyRemove(this, "all")
pageEvents.remove(loader.screen, ["mousemove", "mouseleave", "mousedown", "touchstart"])
pageEvents.remove(this.canvas, "touchend")
pageEvents.remove(p2, "message")

View File

@ -120,6 +120,12 @@
don_r: "面(右)",
ka_r: "ふち(右)"
},
gamepadLayout: {
name: "そうさタイプ設定",
a: "タイプA",
b: "タイプB",
c: "タイプC"
},
on: "オン",
off: "オフ",
default: "既定値にリセット",
@ -254,6 +260,12 @@ function StringsEn(){
don_r: "Right Surface",
ka_r: "Right Rim"
},
gamepadLayout: {
name: "Gamepad Layout",
a: "Type A",
b: "Type B",
c: "Type C"
},
on: "On",
off: "Off",
default: "Reset to Defaults",
@ -383,10 +395,16 @@ function StringsCn(){
},
keyboardSettings: {
name: "键盘设置",
ka_l: "Left Rim",
don_l: "Left Surface",
don_r: "Right Surface",
ka_r: "Right Rim"
ka_l: "边缘(左)",
don_l: "表面(左)",
don_r: "表面(右)",
ka_r: "边缘(右)"
},
gamepadLayout: {
name: "操作类型设定",
a: "类型A",
b: "类型B",
c: "类型C"
},
on: "开",
off: "关",
@ -517,10 +535,16 @@ function StringsTw(){
},
keyboardSettings: {
name: "鍵盤設置",
ka_l: "Left Rim",
don_l: "Left Surface",
don_r: "Right Surface",
ka_r: "Right Rim"
ka_l: "邊緣(左)",
don_l: "表面(左)",
don_r: "表面(右)",
ka_r: "邊緣(右)"
},
gamepadLayout: {
name: "操作類型設定",
a: "類型A",
b: "類型B",
c: "類型C"
},
on: "開",
off: "關",
@ -651,10 +675,16 @@ function StringsKo(){
},
keyboardSettings: {
name: "키보드 설정",
ka_l: "Left Rim",
don_l: "Left Surface",
don_r: "Right Surface",
ka_r: "Right Rim"
ka_l: "가장자리 (왼쪽)",
don_l: "표면 (왼쪽)",
don_r: "표면 (오른쪽)",
ka_r: "가장자리 (오른쪽)"
},
gamepadLayout: {
name: "조작 타입 설정",
a: "타입 A",
b: "타입 B",
c: "타입 C"
},
on: "온",
off: "오프",

View File

@ -17,24 +17,26 @@ class Titlescreen{
if(localStorage.getItem("tutorial") === "true"){
new SongSelect(false, false, this.touched, this.songId)
}else{
new Tutorial(false, this.songId)
new SettingsView(false, true, this.songId)
}
}else{
pageEvents.keyAdd(this, "all", "down", this.keyDown.bind(this))
pageEvents.add(this.titleScreen, ["mousedown", "touchstart"], this.onPressed.bind(this))
pageEvents.add(this.titleScreen, ["mousedown", "touchstart"], event => {
if(event.type === "touchstart"){
event.preventDefault()
this.touched = true
}else if(event.type === "mousedown" && event.which !== 1){
return
}
this.onPressed(true)
})
assets.sounds["v_title"].play()
var kbdSettings = settings.getItem("keyboardSettings")
this.kbd = {
confirm: ["enter", " ", kbdSettings.don_l[0], kbdSettings.don_r[0]]
}
this.keyboard = new Keyboard({
confirm: ["enter", "space", "don_l", "don_r"]
}, this.onPressed.bind(this))
this.gamepad = new Gamepad({
confirm: ["a", "b", "x", "y", "start", "ls", "rs"]
}, pressed => {
if(pressed){
this.onPressed()
}
})
}, this.onPressed.bind(this))
if(p2.session){
pageEvents.add(p2, "message", response => {
if(response.type === "songsel"){
@ -46,36 +48,14 @@ class Titlescreen{
}
}
keyDown(event, key){
if(!key){
if(event.repeat || event.target === this.langDropdown){
return
}
for(var i in this.kbd){
if(this.kbd[i].indexOf(event.key.toLowerCase()) !== -1){
key = i
break
}
}
}
if(key === "confirm"){
this.onPressed()
}
}
onPressed(event){
if(event){
if(event.type === "touchstart"){
event.preventDefault()
this.touched = true
}else if(event.type === "mousedown" && event.which !== 1){
return
}
}
onPressed(pressed, name){
if(pressed){
this.titleScreen.style.cursor = "auto"
this.clean()
assets.sounds["se_don"].play()
this.goNext()
}
}
goNext(fromP2){
if(p2.session && !fromP2){
p2.send("songsel")
@ -89,7 +69,7 @@ class Titlescreen{
}, 500)
}else{
setTimeout(() => {
new Tutorial(false, this.songId, this.touched)
new SettingsView(this.touched, true, this.songId)
}, 500)
}
}
@ -109,10 +89,10 @@ class Titlescreen{
this.logo.updateSubtitle()
}
clean(){
this.keyboard.clean()
this.gamepad.clean()
this.logo.clean()
assets.sounds["v_title"].stop()
pageEvents.keyRemove(this, "all")
pageEvents.remove(this.titleScreen, ["mousedown", "touchstart"])
delete this.titleScreen
delete this.proceed

View File

@ -1,34 +1,37 @@
class Tutorial{
constructor(fromSongSel, songId, touchEnabled){
constructor(fromSongSel, songId){
this.fromSongSel = fromSongSel
this.songId = songId
this.touchEnabled = touchEnabled
loader.changePage("tutorial", fromSongSel || !touchEnabled)
loader.changePage("tutorial", true)
assets.sounds["bgm_setsume"].playLoop(0.1, false, 0, 1.054, 16.054)
this.endButton = document.getElementById("tutorial-end-button")
this.endButton = this.getElement("view-end-button")
this.tutorialTitle = document.getElementById("tutorial-title")
this.tutorialTitle = this.getElement("view-title")
this.tutorialDiv = document.createElement("div")
document.getElementById("tutorial-content").appendChild(this.tutorialDiv)
this.getElement("view-content").appendChild(this.tutorialDiv)
this.setStrings()
if(fromSongSel){
pageEvents.add(this.endButton, ["mousedown", "touchstart"], this.onEnd.bind(this))
pageEvents.keyAdd(this, "all", "down", event => {
if(event.keyCode === 13 || event.keyCode === 27 || event.keyCode === 8){
// Enter, Esc, Backspace
this.onEnd.bind(this)
pageEvents.add(this.endButton, ["mousedown", "touchstart"], event => {
if(event.type === "touchstart"){
event.preventDefault()
this.touched = true
}else if(event.type === "mousedown" && event.which !== 1){
return
}
this.onEnd(true)
})
this.gamepad = new Gamepad({
"confirm": ["start", "b", "ls", "rs"]
this.keyboard = new Keyboard({
confirm: ["enter", "space", "esc", "don_l", "don_r"]
}, this.onEnd.bind(this))
}else{
new SettingsView(touchEnabled, this)
}
this.gamepad = new Gamepad({
confirm: ["start", "b", "ls", "rs"]
}, this.onEnd.bind(this))
pageEvents.send("tutorial")
}
getElement(name){
return loader.screen.getElementsByClassName(name)[0]
}
insertText(text, parent){
parent.appendChild(document.createTextNode(text))
}
@ -37,43 +40,30 @@ class Tutorial{
kbd.innerText = key
parent.appendChild(kbd)
}
onEnd(event){
var touched = false
if(event){
if(event.type === "touchstart"){
event.preventDefault()
touched = true
}else if(event.which !== 1){
return
}
}
onEnd(pressed, name){
if(pressed){
this.clean()
assets.sounds["se_don"].play()
localStorage.setItem("tutorial", "true")
setTimeout(() => {
new SongSelect(this.fromSongSel ? "tutorial" : false, false, touched, this.songId)
new SongSelect(this.fromSongSel ? "tutorial" : false, false, this.touched, this.songId)
}, 500)
}
setStrings(){
if(!this.fromSongSel && this.touchEnabled){
this.tutorialTitle.innerText = strings.gameSettings
this.tutorialTitle.setAttribute("alt", strings.gameSettings)
this.endButton.innerText = strings.settings.ok
this.endButton.setAttribute("alt", strings.settings.ok)
return
}
setStrings(){
this.tutorialTitle.innerText = strings.howToPlay
this.tutorialTitle.setAttribute("alt", strings.howToPlay)
this.endButton.innerText = strings.tutorial.ok
this.endButton.setAttribute("alt", strings.tutorial.ok)
this.tutorialDiv.innerHTML = ""
var kbdSettings = settings.getItem("keyboardSettings")
var pauseKey = pageEvents.kbd.indexOf("q") === -1 ? "Q" : "ESC"
var keys = [
kbdSettings.don_l[0].toUpperCase(),
kbdSettings.don_r[0].toUpperCase(),
kbdSettings.ka_l[0].toUpperCase(),
kbdSettings.ka_r[0].toUpperCase(),
"Q", "SHIFT", "CTRL"
pauseKey, "SHIFT", "CTRL"
]
var keyIndex = 0
strings.tutorial.basics.forEach(string => {
@ -105,11 +95,9 @@ class Tutorial{
this.tutorialDiv.appendChild(par)
}
clean(){
if(this.fromSongSel){
this.keyboard.clean()
this.gamepad.clean()
pageEvents.remove(this.endButton, ["mousedown", "touchstart"])
pageEvents.keyRemove(this, "all")
}
assets.sounds["bgm_setsume"].stop()
delete this.tutorialTitle
delete this.endButton

View File

@ -830,11 +830,10 @@
)
// Taiko pressed keys
var kbd = this.controller.getBindings()
var keys = ["ka_l", "ka_r", "don_l", "don_r"]
for(var i = 0; i < keys.length; i++){
var keyMS = ms - keyTime[kbd[keys[i]]]
var keyMS = ms - keyTime[keys[i]]
if(keyMS < 130){
if(keyMS > 70 && !this.touchEnabled){
ctx.globalAlpha = this.draw.easeOut(1 - (keyMS - 70) / 60)
@ -1769,11 +1768,10 @@
}
touchNote(note){
var keyboard = this.controller.keyboard
var kbd = keyboard.getBindings()
var ms = this.controller.game.getAccurateTime()
this.touch = ms
keyboard.setKey(kbd[note], false)
keyboard.setKey(kbd[note], true, ms)
keyboard.setKey(false, note)
keyboard.setKey(true, note, ms)
}
mod(length, index){
return ((index % length) + length) % length

View File

@ -1,9 +1,9 @@
<div id="tutorial-outer">
<div id="tutorial">
<div id="tutorial-title" class="stroke-sub"></div>
<div id="tutorial-content"></div>
<div class="view-outer">
<div class="view">
<div class="view-title stroke-sub"></div>
<div class="view-content"></div>
<div id="diag-txt"></div>
<div id="about-link-btns">
<div class="left-buttons">
<div id="link-issues" class="taibtn stroke-sub link-btn" alt="Issues">
<a target="_blank">Issues</a>
</div>
@ -11,6 +11,6 @@
<a href="mailto:taiko@bui.pm">taiko@bui.pm</a>
</div>
</div>
<div id="tutorial-end-button" class="taibtn stroke-sub selected"></div>
<div class="view-end-button taibtn stroke-sub selected"></div>
</div>
</div>

View File

@ -1,9 +1,9 @@
<div id="tutorial-outer">
<div id="tutorial">
<div id="tutorial-title" class="stroke-sub"></div>
<div id="tutorial-content">
<div class="view-outer">
<div class="view">
<div class="view-title stroke-sub"></div>
<div class="view-content">
<div id="session-invite"></div>
</div>
<div id="tutorial-end-button" class="taibtn stroke-sub"></div>
<div class="view-end-button taibtn stroke-sub"></div>
</div>
</div>

View File

@ -1,10 +1,20 @@
<div id="tutorial-outer" class="settings-outer">
<div id="tutorial">
<div id="tutorial-title" class="stroke-sub"></div>
<div id="tutorial-content"></div>
<div id="about-link-btns">
<div class="view-outer settings-outer">
<div class="view">
<div class="view-title stroke-sub"></div>
<div class="view-content"></div>
<div class="left-buttons">
<div id="settings-default" class="taibtn stroke-sub"></div>
</div>
<div id="tutorial-end-button" class="taibtn stroke-sub"></div>
<div class="view-end-button taibtn stroke-sub"></div>
<div class="view-outer shadow-outer" id="settings-gamepad">
<div class="view">
<div class="view-title stroke-sub"></div>
<div id="gamepad-bg" class="view-content">
<span id="gamepad-value"></span>
<div id="gamepad-buttons"></div>
</div>
<div class="view-end-button taibtn stroke-sub selected"></div>
</div>
</div>
</div>
</div>

View File

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