Skip to content

Translate "WeakRef and FinalizationRegistry" #491

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
diogoosz wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Translate "WeakRef and FinalizationRegistry" #491

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
406 changes: 203 additions & 203 deletions 1-js/99-js-misc/07-weakref-finalizationregistry/article.md
View file
Open in desktop

Large diffs are not rendered by default.

10 changes: 5 additions & 5 deletions 1-js/99-js-misc/07-weakref-finalizationregistry/weakref-dom.view/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,20 @@
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="index.css">
<title>WeakRef DOM Logger</title>
<title>Logger DOM com WeakRef</title>

@gabifs gabifs Nov 12, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Conteúdo agora está em português, mas <html lang="en"> (linha 2) não foi alterado. Leitores de tela/hifenização vão tratar o texto como inglês. Sugestão: <html lang="pt-BR">.

</head>

<body>

<div class="app">
<button class="start-messages">Start sending messages</button>
<button class="start-messages">Começar a enviar mensagens</button>
<div class="window">
<div class="window__header">
<p class="window__title">Messages:</p>
<button class="window__button">Close</button>
<p class="window__title">Mensagens:</p>
<button class="window__button">Fechar</button>
</div>
<div class="window__body">
No messages.
Nenhuma mensagem.
</div>
</div>
</div>
Expand Down
6 changes: 3 additions & 3 deletions 1-js/99-js-misc/07-weakref-finalizationregistry/weakref-dom.view/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ const startMessages = (element) => {
const timerId = setInterval(() => { // (6)
if (element.deref()) { // (7)
const payload = document.createElement("p");
payload.textContent = `Message: System status OK: ${new Date().toLocaleTimeString()}`;
payload.textContent = `Mensagem: Status do sistema OK: ${new Date().toLocaleTimeString()}`;
element.deref().append(payload);
} else { // (8)
alert("The element has been deleted."); // (9)
alert("O elemento foi excluído."); // (9)
clearInterval(timerId);
}
}, 1000);
};
};
14 changes: 7 additions & 7 deletions 1-js/99-js-misc/07-weakref-finalizationregistry/weakref-finalizationregistry.view/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,29 +4,29 @@
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="index.css">
<title>Photo Library Collage</title>
<title>Colagem da Biblioteca de Fotos</title>

@gabifs gabifs Nov 12, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mesmo caso: textos traduzidos, mas <html lang="en"> (linha 2) permanece. Sugestão: <html lang="pt-BR">.

</head>

<body>

<div class="app">
<header class="header">
<h1 class="header-text">
Photo Library Collage
Colagem da Biblioteca de Fotos
</h1>
</header>
<div class="container">
<div class="item item--scrollable">
<!--Thumbnails-->
<!--Miniaturas-->
<div class="thumbnails-container"></div>
</div>
<div class="item">
<div>
<div class=actions>
<select class="select"></select>
<button class="btn btn--primary btn-create-collage"> Create collage </button>
<button class="btn btn--secondary btn-start-over"> Start over </button>
<button class="btn btn--success btn-download" onClick={downloadCollage}> Download </button>
<button class="btn btn--primary btn-create-collage"> Criar colagem </button>
<button class="btn btn--secondary btn-start-over"> Recomeçar </button>
<button class="btn btn--success btn-download" onClick={downloadCollage}> Baixar </button>
</div>
<div class="previewContainer">
<div class="spinnerContainer spinnerContainer--hidden">
Expand All @@ -36,7 +36,7 @@ <h1 class="header-text">
<canvas class="canvas"></canvas>
</div>
<div class="loggerContainer">
<p class="logger-title">Logger:</p>
<p class="logger-title">Log:</p>
</div>
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions 1-js/99-js-misc/07-weakref-finalizationregistry/weakref-finalizationregistry.view/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ const handleStateChange = (state) => {
downloadBtn.disabled = true;
previewContainerEl.classList.add("previewContainer--disabled");
spinnerContainerEl.classList.remove("spinnerContainer--hidden");
spinnerTextEl.innerText = "Loading...";
spinnerTextEl.innerText = "Carregando...";
canvasEl.classList.remove("canvas--ready");
} else if (!state.loading) {
selectEl.disabled = false;
Expand Down Expand Up @@ -203,7 +203,7 @@ const startOver = () => {
.querySelectorAll(".thumbnail-item--selected")
.forEach((item) => item.classList.remove("thumbnail-item--selected"));

loggerContainerEl.innerHTML = '<p class="logger-title">Logger:</p>';
loggerContainerEl.innerHTML = '<p class="logger-title">Log:</p>';
};

const downloadCollage = () => {
Expand Down
18 changes: 9 additions & 9 deletions 1-js/99-js-misc/07-weakref-finalizationregistry/weakref-finalizationregistry.view/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -218,13 +218,13 @@ export const CONSOLE_ERROR = [

// Layouts.
export const LAYOUT_4_COLUMNS = {
name: "Layout 4 columns",
name: "Layout de 4 colunas",
columns: 4,
itemWidth: 240,
itemHeight: 240,
};
export const LAYOUT_8_COLUMNS = {
name: "Layout 8 columns",
name: "Layout de 8 colunas",
columns: 8,
itemWidth: 240,
itemHeight: 240,
Expand All @@ -236,7 +236,7 @@ export const createImageFile = async (src) =>
const img = new Image();
img.src = src;
img.onload = () => resolve(img);
img.onerror = () => reject(new Error("Failed to construct image."));
img.onerror = () => reject(new Error("Falha ao criar a imagem."));
});

export const loadImage = async (url) => {
Expand All @@ -259,13 +259,13 @@ export const weakRefCache = (fetchImg) => {
if (cachedImg && !cachedImg.deref()) {
imgCache.delete(imgName);
console.log(
`%cCLEANED_IMAGE: Url: ${imgName}, Size: ${size}, Type: ${type}`,
`%cCLEANED_IMAGE: URL: ${imgName}, Tamanho: ${size}, Tipo: ${type}`,
CONSOLE_ERROR,
);

const logEl = document.createElement("div");
logEl.classList.add("logger-item", "logger--error");
logEl.innerHTML = `CLEANED_IMAGE: Url: ${imgName}, Size: ${size}, Type: ${type}`;
logEl.innerHTML = `CLEANED_IMAGE: URL: ${imgName}, Tamanho: ${size}, Tipo: ${type}`;

@gabifs gabifs Nov 12, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Log traduzido (Tamanho/Tipo) diverge das imagens do artigo (demo-03..08), que mostram Url: ..., Size: ..., Type: .... Considerar manter o formato original do log para casar com os screenshots, ou aceitar a divergência conscientemente.

loggerContainerEl.appendChild(logEl);
loggerContainerEl.scrollTop = loggerContainerEl.scrollHeight;
}
Expand All @@ -276,13 +276,13 @@ export const weakRefCache = (fetchImg) => {

if (cachedImg?.deref() !== undefined) {
console.log(
`%cCACHED_IMAGE: Url: ${imgName}, Size: ${cachedImg.size}, Type: ${cachedImg.type}`,
`%cCACHED_IMAGE: URL: ${imgName}, Tamanho: ${cachedImg.size}, Tipo: ${cachedImg.type}`,
CONSOLE_SUCCESS,
);

const logEl = document.createElement("div");
logEl.classList.add("logger-item", "logger--success");
logEl.innerHTML = `CACHED_IMAGE: Url: ${imgName}, Size: ${cachedImg.size}, Type: ${cachedImg.type}`;
logEl.innerHTML = `CACHED_IMAGE: URL: ${imgName}, Tamanho: ${cachedImg.size}, Tipo: ${cachedImg.type}`;
loggerContainerEl.appendChild(logEl);
loggerContainerEl.scrollTop = loggerContainerEl.scrollHeight;

Expand All @@ -291,13 +291,13 @@ export const weakRefCache = (fetchImg) => {

const newImg = await fetchImg(imgName);
console.log(
`%cFETCHED_IMAGE: Url: ${imgName}, Size: ${newImg.size}, Type: ${newImg.type}`,
`%cFETCHED_IMAGE: URL: ${imgName}, Tamanho: ${newImg.size}, Tipo: ${newImg.type}`,
CONSOLE_PRIMARY,
);

const logEl = document.createElement("div");
logEl.classList.add("logger-item", "logger--primary");
logEl.innerHTML = `FETCHED_IMAGE: Url: ${imgName}, Size: ${newImg.size}, Type: ${newImg.type}`;
logEl.innerHTML = `FETCHED_IMAGE: URL: ${imgName}, Tamanho: ${newImg.size}, Tipo: ${newImg.type}`;
loggerContainerEl.appendChild(logEl);
loggerContainerEl.scrollTop = loggerContainerEl.scrollHeight;

Expand Down