Skip to content
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.

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

canvas implementation #15

Merged
merged 17 commits into from
Oct 27, 2024
Merged

canvas implementation #15

merged 17 commits into from
Oct 27, 2024

Conversation

pgallino
Copy link
Collaborator

No description provided.

Manuel-Pol and others added 15 commits October 5, 2024 15:49
- Adjusted the canvas resize logic to ensure proportional scaling of elements when the window is resized or zoomed.
- Fixed issues with sidebars affecting canvas width and height dynamically using offsetWidth and offsetHeight.
- Corrected the edge connections between devices to update correctly when dragging and repositioning nodes.
- Improved viewport scaling to maintain element proportions during zooming or resizing events.
…evices

- Implemented save/load functionality, allowing the graph state to be saved as JSON and reloaded.
- Added save and load buttons to trigger the respective functionality.
- Adjusted the drawing logic for connections to ensure they don't overlap device icons.
- Connections now start and end at the edges of device icons instead of their center points.
.github/workflows/deploy.yml Outdated Show resolved Hide resolved
src/index.ejs Outdated
Comment on lines 12 to 13
<button id="save-button" class="save-button" title="Save">Save</button>
<button id="load-button" class="load-button" title="Load">Load</button>
Copy link
Owner

Choose a reason for hiding this comment

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

Let's change this to Guardar and Cargar

src/index.ejs Outdated
<div id="right-bar" class="right-bar">
<h2>Información</h2>
<div id="info-content">
<!-- Información dinámica sobre el conejo y los routers se mostrará aquí -->
Copy link
Owner

Choose a reason for hiding this comment

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

Let's change this comment to english

src/index.ts Outdated

// Add router button
leftBar.addButton(RouterSvg, () => {
AddRouter(ctx); // Esta es una función anónima que ejecuta AddRouter cuando se hace clic
Copy link
Owner

Choose a reason for hiding this comment

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

Let's change these comments to english

console.warn(`El dispositivo con ID ${n2Info.id} no existe en devices.`);
} else {
// Verificar si ya existe una arista entre estos dos dispositivos
for (const edge of this.edges.values()) {
Copy link
Owner

Choose a reason for hiding this comment

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

Let's mark this part for later refactoring. This for goes through ALL edges on the graph. It will probably bring performance issues in the future.

Comment on lines 139 to 140
newNode.sprite.x = nodeData.x;
newNode.sprite.y = nodeData.y;
Copy link
Owner

Choose a reason for hiding this comment

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

We should pass this as a constructor parameter.

src/utils.ts Outdated Show resolved Hide resolved
src/index.ts Outdated
Comment on lines 229 to 245
const input = document.createElement("input");
input.type = "file";
input.accept = ".json";

input.onchange = (event) => {
const file = (event.target as HTMLInputElement).files[0];
const reader = new FileReader();
reader.readAsText(file);

reader.onload = (readerEvent) => {
const jsonData = readerEvent.target.result as string;
loadGraph(jsonData, ctx); // Llama a la función loadGraph pasando el JSON y el contexto
};
};

input.click(); // Simula el click para abrir el cuadro de diálogo de selección de archivo
};
Copy link
Owner

Choose a reason for hiding this comment

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

The saveButton and loadButton not being simmetric smells. This should either go inside loadGraph, or we should take out the save-to-file logic inside saveGraph.

@MegaRedHand MegaRedHand merged commit a1855b3 into main Oct 27, 2024
2 checks passed
@MegaRedHand MegaRedHand deleted the canva-static-b branch October 27, 2024 00:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants