View: Fix layeredText offset

This commit is contained in:
LoveEevee 2018-11-21 13:50:48 +03:00
parent 3c701dc22e
commit 3a92a9c950
3 changed files with 30 additions and 26 deletions

View File

@ -617,7 +617,7 @@
ctx.scale(scale, 1) ctx.scale(scale, 1)
} }
ctx.font = config.fontSize + "px " + config.fontFamily ctx.font = config.fontSize + "px " + config.fontFamily
ctx.textBaseline = "top" ctx.textBaseline = config.baseline || "top"
ctx.textAlign = "center" ctx.textAlign = "center"
for(let layer of layers){ for(let layer of layers){
@ -803,15 +803,15 @@
ctx.lineWidth = 6 ctx.lineWidth = 6
ctx.beginPath() ctx.beginPath()
if(!config.side){ if(!config.side){
var textX = config.two ? 20 : 17 var textX = config.two ? 22 : 20
ctx.moveTo(48, 120) ctx.moveTo(48, 120)
ctx.arc(48, 48.5, 45, Math.PI * 0.58, Math.PI * 0.42) ctx.arc(48, 48.5, 45, Math.PI * 0.58, Math.PI * 0.42)
}else if(config.two){ }else if(config.two){
var textX = 70 var textX = 72
ctx.moveTo(56, 115) ctx.moveTo(56, 115)
ctx.arc(98, 48.5, 45, Math.PI * 0.75, Math.PI * 0.59) ctx.arc(98, 48.5, 45, Math.PI * 0.75, Math.PI * 0.59)
}else{ }else{
var textX = -33 var textX = -30
ctx.moveTo(39, 115) ctx.moveTo(39, 115)
ctx.arc(-2, 48.5, 45, Math.PI * 0.41, Math.PI * 0.25) ctx.arc(-2, 48.5, 45, Math.PI * 0.41, Math.PI * 0.25)
} }

View File

@ -372,7 +372,7 @@ class SongSelect{
var touch = true var touch = true
} }
if(this.state.screen === "song"){ if(this.state.screen === "song"){
if(mouse.x > 513 && mouse.y > 603){ if(mouse.x > 641 && mouse.y > 603){
this.toSession() this.toSession()
}else{ }else{
var moveBy = this.songSelMouse(mouse.x, mouse.y) var moveBy = this.songSelMouse(mouse.x, mouse.y)
@ -384,7 +384,7 @@ class SongSelect{
} }
}else if(this.state.screen === "difficulty"){ }else if(this.state.screen === "difficulty"){
var moveBy = this.diffSelMouse(mouse.x, mouse.y) var moveBy = this.diffSelMouse(mouse.x, mouse.y)
if(mouse.x < 55 || mouse.x > 967 || mouse.y < 40 || mouse.y > 540){ if(mouse.x < 183 || mouse.x > 1095 || mouse.y < 40 || mouse.y > 540){
this.toSongSelect() this.toSongSelect()
}else if(moveBy === 0){ }else if(moveBy === 0){
this.selectedDiff = 0 this.selectedDiff = 0
@ -406,7 +406,7 @@ class SongSelect{
var mouse = this.mouseOffset(event.offsetX, event.offsetY) var mouse = this.mouseOffset(event.offsetX, event.offsetY)
var moveTo = null var moveTo = null
if(this.state.screen === "song"){ if(this.state.screen === "song"){
if(mouse.x > 513 && mouse.y > 603){ if(mouse.x > 641 && mouse.y > 603){
moveTo = "session" moveTo = "session"
}else{ }else{
var moveTo = this.songSelMouse(mouse.x, mouse.y) var moveTo = this.songSelMouse(mouse.x, mouse.y)
@ -426,7 +426,7 @@ class SongSelect{
} }
mouseOffset(offsetX, offsetY){ mouseOffset(offsetX, offsetY){
return { return {
x: (offsetX * this.pixelRatio - this.winW / 2) / this.ratio + 1024 / 2, x: (offsetX * this.pixelRatio - this.winW / 2) / this.ratio + 1280 / 2,
y: (offsetY * this.pixelRatio - this.winH / 2) / this.ratio + 720 / 2 y: (offsetY * this.pixelRatio - this.winH / 2) / this.ratio + 720 / 2
} }
} }
@ -445,7 +445,7 @@ class SongSelect{
songSelMouse(x, y){ songSelMouse(x, y){
if(this.state.locked === 0 && this.songAsset.marginTop <= y && y <= this.songAsset.marginTop + this.songAsset.height){ if(this.state.locked === 0 && this.songAsset.marginTop <= y && y <= this.songAsset.marginTop + this.songAsset.height){
x -= 1024 / 2 x -= 1280 / 2
var dir = x > 0 ? 1 : -1 var dir = x > 0 ? 1 : -1
x = Math.abs(x) x = Math.abs(x)
var selectedWidth = this.songAsset.selectedWidth var selectedWidth = this.songAsset.selectedWidth
@ -463,10 +463,10 @@ class SongSelect{
} }
diffSelMouse(x, y){ diffSelMouse(x, y){
if(this.state.locked === 0){ if(this.state.locked === 0){
if(95 < x && x < 239 && 118 < y && y < 422){ if(223 < x && x < 367 && 118 < y && y < 422){
return Math.floor((x - 95) / ((239 - 95) / 2)) return Math.floor((x - 223) / ((367 - 223) / 2))
}else if(422 < x && x < 922 && 95 < y && y < 524){ }else if(550 < x && x < 1050 && 95 < y && y < 524){
var moveBy = Math.floor((x - 422) / ((922 - 422) / 5)) + this.diffOptions.length var moveBy = Math.floor((x - 550) / ((1050 - 550) / 5)) + this.diffOptions.length
var currentSong = this.songs[this.selectedSong] var currentSong = this.songs[this.selectedSong]
if(this.state.ura && moveBy === this.diffOptions + 3 || currentSong.stars[moveBy - this.diffOptions.length]){ if(this.state.ura && moveBy === this.diffOptions + 3 || currentSong.stars[moveBy - this.diffOptions.length]){
return moveBy return moveBy
@ -740,17 +740,20 @@ class SongSelect{
h: 38, h: 38,
id: id id: id
}, ctx => { }, ctx => {
var text = this.sessionText[id] this.draw.layeredText({
ctx.font = "28px " + this.font ctx: ctx,
ctx.textAlign = "center" text: this.sessionText[id],
ctx.textBaseline = "middle" fontSize: 28,
ctx.strokeStyle = "#000" fontFamily: this.font,
ctx.lineWidth = 8 x: w / 2,
ctx.lineJoin = "round" y: 38 / 2,
ctx.miterLimit = 1 width: w - 30,
ctx.strokeText(text, w / 2, 38 / 2) align: "center",
ctx.fillStyle = "#fff" baseline: "middle"
ctx.fillText(text, w / 2, 38 / 2) }, [
{outline: "#000", letterBorder: 8},
{fill: "#fff"}
])
}) })
} }

View File

@ -256,8 +256,9 @@
fontSize: 15, fontSize: 15,
fontFamily: this.font, fontFamily: this.font,
align: "center", align: "center",
baseline: "middle",
x: _x + _w / 2, x: _x + _w / 2,
y: _y + 3, y: _y + _h / 2,
width: 122 width: 122
}, [ }, [
{fill: "#fff"} {fill: "#fff"}
@ -1247,7 +1248,7 @@
var letterSpacing = fontSize * 0.67 var letterSpacing = fontSize * 0.67
var glyphW = 50 var glyphW = 50
var glyphH = 64 var glyphH = 64
var textX = 11 var textX = 5
var textY = 5 var textY = 5
var letterBorder = fontSize * 0.15 var letterBorder = fontSize * 0.15