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

wip

Browse source
This commit is contained in:
Renan LE CARO 2025-04-26 17:27:26 +02:00
parent d572467e99
commit bcf40fe667
14 changed files with 217 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

7
Readme.md
View file

@ -26,10 +26,12 @@ Break colourful bricks, catch bouncing coins and select powerful upgrades !
- missed challenges show as greyed out choices (with unlock condition).
- bigger "level X or Y cleared", continue to level X/Y as button
- make menu and score button more "button like" when you just installed the game.
-
- Can't press ? buttons in Creative Menu.
## Done
- hide any tooltip on page scroll
- added a "display level code" button in editor
- passive income : paddle transparent for a much shorter time
- better default value for mobile mode detection
@ -483,6 +485,7 @@ Break colourful bricks, catch bouncing coins and select powerful upgrades !
## UX / gameplay
- make menu and score button more "button like" when you just installed the game.
- chill game mode, to just relax your mind :
- no 7 levels limit
- no upgrades offered at the end of the level

57
dist/index.html vendored
View file

File diff suppressed because one or more lines are too long

10
src/game.less
View file

@ -450,7 +450,15 @@ h2.histogram-title strong {
user-select: none;
opacity: 1;
border: 1px solid white;
max-width: 300px;
&.desktop{
max-width: 300px;
}
&.mobile{
width: 95vw;
left:2.5vw;
}
}
#popup.history > div {

3
src/i18n/ar.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "إعادة تشغيل اللعبة",
"editor.editing.bigger": "زيادة حجم المستوى",
"editor.editing.color": "اختر لونًا من قائمة الألوان (بحد أقصى 5 لكل مستوى)",
"editor.editing.copied": "",
"editor.editing.copy": "نسخ رمز المستوى",
"editor.editing.copy_help": "ألصقه في قناة #levels في Discord الخاص بنا",
"editor.editing.credit": "الاعتمادات والمصدر",
@ -17,6 +18,8 @@
"editor.editing.rename": "اسم المستوى",
"editor.editing.rename_prompt": "الرجاء إدخال اسم جديد للمستوى",
"editor.editing.right": "حرك كل الطوب إلى اليمين",
"editor.editing.show_code": "",
"editor.editing.show_code_help": "",
"editor.editing.smaller": "تقليل حجم المستوى",
"editor.editing.title": "مستوى التحرير: {{name}}",
"editor.editing.up": "حرك كل الطوب لأعلى",

105
src/i18n/b71.babel
View file

@ -240,6 +240,41 @@
</translation>
</translations>
</concept_node>
<concept_node>
<name>copied</name>
<description/>
<comment/>
<translations>
<translation>
<language>ar-LB</language>
<approved>false</approved>
</translation>
<translation>
<language>de-DE</language>
<approved>false</approved>
</translation>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-CL</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-FR</language>
<approved>false</approved>
</translation>
<translation>
<language>ru-RU</language>
<approved>false</approved>
</translation>
<translation>
<language>tr-TR</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>copy</name>
<description/>
@ -660,6 +695,76 @@
</translation>
</translations>
</concept_node>
<concept_node>
<name>show_code</name>
<description/>
<comment/>
<translations>
<translation>
<language>ar-LB</language>
<approved>false</approved>
</translation>
<translation>
<language>de-DE</language>
<approved>false</approved>
</translation>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-CL</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-FR</language>
<approved>false</approved>
</translation>
<translation>
<language>ru-RU</language>
<approved>false</approved>
</translation>
<translation>
<language>tr-TR</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>show_code_help</name>
<description/>
<comment/>
<translations>
<translation>
<language>ar-LB</language>
<approved>false</approved>
</translation>
<translation>
<language>de-DE</language>
<approved>false</approved>
</translation>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-CL</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-FR</language>
<approved>false</approved>
</translation>
<translation>
<language>ru-RU</language>
<approved>false</approved>
</translation>
<translation>
<language>tr-TR</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>smaller</name>
<description/>

3
src/i18n/de.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "Spiel neustarten",
"editor.editing.bigger": "Level vergrößern",
"editor.editing.color": "Wähle eine Farbe aus der Farbliste (max. 5 pro Level)",
"editor.editing.copied": "",
"editor.editing.copy": "Levelcode kopieren",
"editor.editing.copy_help": "Teile ihn im Kanal #levels auf unserem Discord",
"editor.editing.credit": "Credits und Quellcode",
@ -17,6 +18,8 @@
"editor.editing.rename": "Levelname",
"editor.editing.rename_prompt": "Gib einen neuen Namen für das Level ein",
"editor.editing.right": "Bewege alle Steine nach rechts",
"editor.editing.show_code": "",
"editor.editing.show_code_help": "",
"editor.editing.smaller": "Level verkleinern",
"editor.editing.title": "Bearbeite Level: {{name}}",
"editor.editing.up": "Bewege alle Steine nach oben",

3
src/i18n/en.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "Restart game",
"editor.editing.bigger": "Increase level size",
"editor.editing.color": "Pick a color in the color list (max 5 per level)",
"editor.editing.copied": "Level code copied",
"editor.editing.copy": "Copy level code",
"editor.editing.copy_help": "Paste it in the #levels channel in our discord",
"editor.editing.credit": "Credits and source",
@ -17,6 +18,8 @@
"editor.editing.rename": "Level name",
"editor.editing.rename_prompt": "Please enter a new name for the level",
"editor.editing.right": "Move all bricks to the right",
"editor.editing.show_code": "Show level code",
"editor.editing.show_code_help": "You can then copy it manually",
"editor.editing.smaller": "Decrease level size",
"editor.editing.title": "Editing level : {{name}}",
"editor.editing.up": "Move up all the bricks",

3
src/i18n/es.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "Empezar una nueva partida",
"editor.editing.bigger": "Aumentar el tamaño del nivel",
"editor.editing.color": "Elige un color de la lista de colores (máximo 5 por nivel)",
"editor.editing.copied": "",
"editor.editing.copy": "Copiar código de nivel",
"editor.editing.copy_help": "Pégalo en el canal #levels en nuestro discord",
"editor.editing.credit": "Créditos y fuente",
@ -17,6 +18,8 @@
"editor.editing.rename": "Nombre del nivel",
"editor.editing.rename_prompt": "Por favor, introduzca un nuevo nombre para el nivel",
"editor.editing.right": "Mueve todos los ladrillos hacia la derecha",
"editor.editing.show_code": "",
"editor.editing.show_code_help": "",
"editor.editing.smaller": "Disminuir el tamaño del nivel",
"editor.editing.title": "Nivel de edición: {{name}}",
"editor.editing.up": "Mueve todos los ladrillos hacia arriba",

3
src/i18n/fr.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "Commencer une nouvelle partie",
"editor.editing.bigger": "Augmenter la taille du niveau",
"editor.editing.color": "Choisissez une couleur dans la liste des couleurs (max 5 par niveau)",
"editor.editing.copied": "",
"editor.editing.copy": "Copier le code du niveau",
"editor.editing.copy_help": "Collez-le dans le canal #levels de notre discord",
"editor.editing.credit": "Crédits et source",
@ -17,6 +18,8 @@
"editor.editing.rename": "Nom du niveau",
"editor.editing.rename_prompt": "Veuillez saisir un nouveau nom pour le niveau",
"editor.editing.right": "Déplacer toutes les briques vers la droite",
"editor.editing.show_code": "",
"editor.editing.show_code_help": "",
"editor.editing.smaller": "Diminuer la taille du niveau",
"editor.editing.title": "Niveau d'édition : {{name}}",
"editor.editing.up": "Déplacez toutes les briques",

3
src/i18n/ru.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "Перезапустите игру",
"editor.editing.bigger": "Увеличить размер уровня",
"editor.editing.color": "Выберите цвет из списка цветов (максимум 5 на уровень)",
"editor.editing.copied": "",
"editor.editing.copy": "Скопировать код уровня",
"editor.editing.copy_help": "Вставьте его в канал #levels в нашем Discord",
"editor.editing.credit": "Кредиты и источник",
@ -17,6 +18,8 @@
"editor.editing.rename": "Название уровня",
"editor.editing.rename_prompt": "Введите новое название уровня.",
"editor.editing.right": "Переместите все кирпичи вправо.",
"editor.editing.show_code": "",
"editor.editing.show_code_help": "",
"editor.editing.smaller": "Уменьшить размер уровня",
"editor.editing.title": "Уровень редактирования: {{name}}",
"editor.editing.up": "Поднимите все кирпичи.",

3
src/i18n/tr.json
View file

@ -5,6 +5,7 @@
"confirmRestart.yes": "Oyunu yeniden başlat",
"editor.editing.bigger": "Seviye boyutunu artır",
"editor.editing.color": "Renk listesinden bir renk seçin (seviye başına en fazla 5)",
"editor.editing.copied": "",
"editor.editing.copy": "Kopyalama seviyesi kodu",
"editor.editing.copy_help": "Bunu Discord'umuzdaki #levels kanalına yapıştırın",
"editor.editing.credit": "Krediler ve kaynak",
@ -17,6 +18,8 @@
"editor.editing.rename": "Seviye Adı",
"editor.editing.rename_prompt": "Lütfen seviye için yeni bir ad girin",
"editor.editing.right": "Tüm tuğlaları sağa taşı",
"editor.editing.show_code": "",
"editor.editing.show_code_help": "",
"editor.editing.smaller": "Seviye boyutunu azalt",
"editor.editing.title": "Düzenleme düzeyi : {{name}}",
"editor.editing.up": "Tüm tuğlaları yukarı taşı",

27
src/levelEditor.ts
View file

@ -14,6 +14,7 @@ import {
MAX_LEVEL_SIZE,
MIN_LEVEL_SIZE,
} from "./pure_functions";
import {toast} from "./toast";
const palette = _palette as Palette;
@ -146,6 +147,11 @@ export async function editRawLevelList(nth: number, color = "W") {
value: "copy",
help: t("editor.editing.copy_help"),
},
{
text: t("editor.editing.show_code"),
value: "show_code",
help: t("editor.editing.show_code_help"),
},
{
text: t("editor.editing.bigger"),
value: "size:+1",
@ -228,7 +234,7 @@ export async function editRawLevelList(nth: number, color = "W") {
});
return;
}
if (action === "copy") {
if (action === "copy" || action ==='show_code') {
let text =
"```\n[" +
(level.name || "unnamed level")?.replace(/\[|\]/gi, " ") +
@ -241,7 +247,24 @@ export async function editRawLevelList(nth: number, color = "W") {
"\n[" +
(level.credit?.replace(/\[|\]/gi, " ") || "Missing credits") +
"]\n```";
navigator.clipboard.writeText(text);
if (action === "copy") {
try{
await navigator.clipboard.writeText(text);
toast(t('editor.editing.copied'))
}catch (e){
if('message' in e) {
toast(e.message)
}
}
}else{
await asyncAlert({
title:t('editor.editing.show_code'),
content:[`
<pre>${text}</pre>
`]
})
}
// return
}
if (action === "rename") {

3
src/level_editor/levels_editor.tsx
View file

@ -1,5 +1,4 @@
import { Level, Palette, RawLevel } from "../types";
import _backgrounds from "../data/backgrounds.json";
import { Palette, RawLevel } from "../types";
import _palette from "../data/palette.json";
import { createRoot } from "react-dom/client";
import { useEffect, useState } from "react";

9
src/tooltip.ts
View file

@ -14,7 +14,9 @@ export function hideAnyTooltip() {
const tooltip = document.getElementById("tooltip") as HTMLDivElement;
function setupMobileTooltips(tooltip: HTMLDivElement) {
tooltip.className='mobile'
function openTooltip(e: Event) {
hideAnyTooltip()
const hovering = e.target as HTMLElement;
if (!hovering?.hasAttribute("data-help-content")) {
return;
@ -23,8 +25,9 @@ function setupMobileTooltips(tooltip: HTMLDivElement) {
e.preventDefault();
tooltip.innerHTML = hovering.getAttribute("data-help-content") || "";
tooltip.style.display = "";
const { left, top, height } = hovering.getBoundingClientRect();
tooltip.style.transform = `translate(${left}px,${top}px) translate(${left > window.innerWidth / 2 ? "-100%" : "0"},${top > window.innerHeight / 3 ? "-100%" : height + "px"})`;
const { top } = hovering.getBoundingClientRect();
tooltip.style.transform = `translate(0,${top}px) translate(0,-100%)`;
}
document.body.addEventListener("touchstart", openTooltip, true);
@ -43,6 +46,7 @@ function setupMobileTooltips(tooltip: HTMLDivElement) {
document.body.addEventListener("touchend", closeTooltip, true);
document.body.addEventListener("mouseup", closeTooltip, true);
document.addEventListener("scroll", hideAnyTooltip);
function ignoreClick(e: Event) {
const hovering = e.target as HTMLElement;
@ -58,6 +62,7 @@ function setupMobileTooltips(tooltip: HTMLDivElement) {
}
function setupDesktopTooltips(tooltip: HTMLDivElement) {
tooltip.className='desktop'
function updateTooltipPosition(e: { clientX: number; clientY: number }) {
tooltip.style.transform = `translate(${e.clientX}px,${e.clientY}px) translate(${e.clientX > window.innerWidth / 2 ? "-100%" : "0"},${e.clientY > (window.innerHeight * 2) / 3 ? "-100%" : "20px"})`;
}