adrien/quatuor
adrien/quatuor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

locking class & moving on matrix

Browse Source
This commit is contained in:
Adrien MALINGREY 2023-06-15 23:56:44 +02:00
parent ff20114a92
commit 70d8e6e0aa
5 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app.js
View File

@ -152,8 +152,6 @@ class MinoesTable {
} }
drawPiece(piece=this.piece, className=piece.className) { drawPiece(piece=this.piece, className=piece.className) {
if (piece.locked) className += " locked"
if (piece==this.piece && actionsQueue.length) className += " moving"
piece.minoesPosition[piece.facing] piece.minoesPosition[piece.facing]
.translate(piece.center) .translate(piece.center)
.forEach(minoPosition => { .forEach(minoPosition => {
@ -231,10 +229,12 @@ class Matrix extends MinoesTable {
this.drawPiece() this.drawPiece()
} }
drawPiece(piece=this.piece, className=piece.className + (piece.locked? " locked" : "")) { drawPiece(piece=this.piece, className=piece.className) {
super.drawPiece(this.ghost, "") super.drawPiece(this.ghost, "")
this.ghost = piece.ghost this.ghost = piece.ghost
super.drawPiece(this.ghost) super.drawPiece(this.ghost)
if (piece.locked) className += " locking"
if (piece==this.piece && actionsQueue.length) className += " moving"
super.drawPiece(piece, className) super.drawPiece(piece, className)
matrix.table.style.setProperty('--ghost-column', this.ghost.center.x) matrix.table.style.setProperty('--ghost-column', this.ghost.center.x)
matrix.table.style.setProperty('--ghost-row', this.ghost.center.y) matrix.table.style.setProperty('--ghost-row', this.ghost.center.y)

2
css/classic.css
View File

@ -81,7 +81,7 @@
border-bottom-color: #ad1936; border-bottom-color: #ad1936;
} }
.locked.mino { .locking.mino {
filter: saturate(50%) brightness(200%); filter: saturate(50%) brightness(200%);
box-shadow: -1px -1px 4px rgba(128, 128, 128, 25%), box-shadow: -1px -1px 4px rgba(128, 128, 128, 25%),
-1px 1px 4px rgba(128, 128, 128, 25%), -1px 1px 4px rgba(128, 128, 128, 25%),

6
css/electro.css
View File

@ -7,7 +7,7 @@ body {
background-color: rgba(37, 41, 45, 30%); background-color: rgba(37, 41, 45, 30%);
} }
.mino:not(.ghost):not(.locked) { .mino:not(.ghost):not(.locking) {
padding: 0; padding: 0;
position: relative; position: relative;
z-index: 0; z-index: 0;
@ -17,7 +17,7 @@ body {
1px 1px 4px rgba(128, 128, 128, 25%); 1px 1px 4px rgba(128, 128, 128, 25%);
} }
.mino:not(.ghost):not(.locked):before { .mino:not(.ghost):not(.locking):before {
content: ""; content: "";
position: absolute; position: absolute;
z-index: -1; z-index: -1;
@ -47,7 +47,7 @@ body {
1px 1px 4px rgba(242, 255, 255, 16%); 1px 1px 4px rgba(242, 255, 255, 16%);
} }
.locked.mino, .locking.mino,
.moving.mino { .moving.mino {
border-width: 1px; border-width: 1px;
background: rgba(186, 211, 255, 70%); background: rgba(186, 211, 255, 70%);

2
css/pop.css
View File

@ -51,7 +51,7 @@ body {
border-color: #ffadad; border-color: #ffadad;
} }
.locked.mino { .locking.mino {
border-color: white; border-color: white;
filter: blur(2px); filter: blur(2px);
} }

2
css/retro.css
View File

@ -108,7 +108,7 @@ td {
} }
} }
.locked.mino { .locking.mino {
animation: blinker 0.15s step-start infinite; animation: blinker 0.15s step-start infinite;
} }