mirrors/breakout71
1
0
Fork 0
mirror of https://gitlab.com/lecarore/breakout71.git synced 2025-04-21 12:36:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Automatic deploy 29017191

Browse source
This commit is contained in:
Renan LE CARO 2025-03-03 20:51:08 +01:00
parent 3ab3dc8c45
commit 7f001fb168
5 changed files with 41 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

2
Readme.md
View file

@ -157,6 +157,8 @@ The "engine" could be better
- enable export of gameplay capture in webview - enable export of gameplay capture in webview
- endgame histograms could work as filters, when you hover a bar, all other histograms would show the stats of those runs only, without changing reference of categories - endgame histograms could work as filters, when you hover a bar, all other histograms would show the stats of those runs only, without changing reference of categories
- sound when ball changes color - sound when ball changes color
- option : don't pause on mobile when lifting finger
- option : accelerated relative movements on mobile
There are many possible perks left to implement : There are many possible perks left to implement :

4
app/build.gradle.kts
View file

@ -11,8 +11,8 @@ android {
applicationId = "me.lecaro.breakout" applicationId = "me.lecaro.breakout"
minSdk = 21 minSdk = 21
targetSdk = 34 targetSdk = 34
versionCode = 29015398 versionCode = 29017191
versionName = "29015398" versionName = "29017191"
testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner" testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
vectorDrawables { vectorDrawables {
useSupportLibrary = true useSupportLibrary = true

32
app/src/main/assets/game.js
View file

@ -2227,16 +2227,18 @@ function drawBrick(ctx, color, borderColor, x, y) {
const can = document.createElement("canvas"); const can = document.createElement("canvas");
can.width = width; can.width = width;
can.height = height; can.height = height;
const bord = 4; const bord = 2;
const cornerRadius= 2
const canctx = can.getContext("2d"); const canctx = can.getContext("2d");
canctx.fillStyle = color; canctx.fillStyle = color;
canctx.fillRect(bord, bord, width - bord * 2, height - bord * 2);
canctx.strokeStyle = borderColor; canctx.strokeStyle = borderColor;
canctx.lineJoin = "round"; canctx.lineJoin = "round";
canctx.lineWidth = bord canctx.lineWidth = bord
canctx.strokeRect(bord / 2, bord / 2, width - bord, height - bord); roundRect(canctx,bord/2,bord/2, width-bord ,height-bord, cornerRadius)
canctx.fill();
canctx.stroke();
cachedGraphics[key] = can; cachedGraphics[key] = can;
} }
@ -2244,6 +2246,26 @@ function drawBrick(ctx, color, borderColor, x, y) {
// It's not easy to have a 1px gap between bricks without antialiasing // It's not easy to have a 1px gap between bricks without antialiasing
} }
function roundRect(
ctx,
x,
y,
width,
height,
radius ){
ctx.beginPath();
ctx.moveTo(x + radius, y);
ctx.lineTo(x + width - radius, y);
ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
ctx.lineTo(x + width, y + height - radius);
ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
ctx.lineTo(x + radius, y + height);
ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
ctx.lineTo(x, y + radius);
ctx.quadraticCurveTo(x, y, x + radius, y);
ctx.closePath();
}
function drawRedSquare(ctx, x, y, width, height) { function drawRedSquare(ctx, x, y, width, height) {
ctx.fillStyle = 'red' ctx.fillStyle = 'red'
ctx.fillRect(x, y, width, height); ctx.fillRect(x, y, width, height);
@ -2675,7 +2697,7 @@ const options = {
disabled: () => false disabled: () => false
}, },
pointerLock: { pointerLock: {
default: false, name: `Pointer lock`, default: false, name: `Mouse pointer lock`,
help: `Locks and hides the mouse cursor.`, help: `Locks and hides the mouse cursor.`,
disabled: () => !canvas.requestPointerLock disabled: () => !canvas.requestPointerLock
}, },

8
app/src/main/assets/index.html
View file

@ -9,16 +9,16 @@
<meta http-equiv="X-UA-Compatible" content="ie=edge" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Breakout 71</title> <title>Breakout 71</title>
<meta name="description" content="A breakout game with roguelite mechanics. Break bricks, catch coins, pick upgrades, repeat. Play for free on mobile and desktop."> <meta name="description" content="A breakout game with roguelite mechanics. Break bricks, catch coins, pick upgrades, repeat. Play for free on mobile and desktop.">
<link rel="stylesheet" href="style.css?v=29015398" /> <link rel="stylesheet" href="style.css?v=29017191" />
<link rel="icon" href="./icon.svg" /> <link rel="icon" href="./icon.svg" />
</head> </head>
<body> <body>
<button id="menu">☰<span> menu</span></button> <button id="menu">☰<span> menu</span></button>
<button id="score"></button> <button id="score"></button>
<canvas id="game"></canvas> <canvas id="game"></canvas>
<script>window.appVersion="?v=29015398".slice(3)</script> <script>window.appVersion="?v=29017191".slice(3)</script>
<script src="levels.js?v=29015398"></script> <script src="levels.js?v=29017191"></script>
<script src="game.js?v=29015398"></script> <script src="game.js?v=29017191"></script>
</body> </body>

8
app/src/main/assets/style.css
View file

@ -76,7 +76,7 @@ body.black_puck #menu {
.popup { .popup {
position: fixed; position: fixed;
inset: 0; inset: 0;
background: rgba(0, 0, 0, 0.95); background: rgba(0, 0, 0, 0.9);
z-index: 10; z-index: 10;
display: flex; display: flex;
overflow: auto; overflow: auto;
@ -132,10 +132,9 @@ body.black_puck #menu {
right: 0; right: 0;
width: 60px; width: 60px;
height: 60px; height: 60px;
background: none; background: transparent;
border: none; border: none;
cursor: pointer; cursor: pointer;
background: rgba(0, 0, 0, 0.2);
overflow: hidden; overflow: hidden;
} }
@ -145,10 +144,13 @@ body.black_puck #menu {
transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg);
font-size: 80px; font-size: 80px;
display: inline-block; display: inline-block;
top: 34px;
left: 26px;
} }
.popup button.close-modale:hover { .popup button.close-modale:hover {
font-weight: bold; font-weight: bold;
background: black;
} }
.popup > div > button[disabled] { .popup > div > button[disabled] {