philstenning / madam3d Goto Github PK

View Code? Open in Web Editor NEW

10.0 2.0 0.0 13.06 MB

Manage 3D printer files from the browser.

Home Page: https://philstenning.github.io/madam3D/

Shell 0.01% HTML 0.10% CSS 2.62% TypeScript 10.46% G-code 86.50% JavaScript 0.31%

typescript nodejs stl-files vitejs react react-router react-three-fiber framer-motion 3d-models 3d-printing 3mf

madam3d's Introduction

MaDam3D

Manage your 3D printer files from your browser.

👉 GIVE IT A TRY 👈

MaDam3D is a project to view, manage, organize and share your .stl .3mf and .gcode files.

The idea was inspired by van_dam but uses only the web browser and its capabilities to do everything. You can clone and build this repo yourself, but it is the same version that is the current main branch.

The Client

You can try it out at madam3D but you will need a supported browser caniuse

This project is still very much a work in progress but the basic functionality exists.

How to use

Open the app in your browser and navigate to the folder page, from there you can add folders from your native file system.

When you add a folder it will recursively scan your drive from that point, so if you have a lot of nested files it might take some time

There are some folder/directories that can't be opened from the browser and this will differ depending from which os and browser you are using, on windows the c: or Program Files for example.

The app makes the assumption (at the moment) that each folder is a model, and the files within are its parts.

Folder Features:

Filter models with the search box at top of page.

Server

// TODO

Serves the client app and handles the sharing of your projects with others.

See the individual package readme.md files for how each package works.

Folder/App structure is as follows:

root/
 |── packages/
 |   └──  client/
 |   └── server/

Getting started

You will need Nodejs installed on your computer(it is built and tested with ^16).

To run this project locally, you will need pnpm to manage the dependencies/workspaces.

# install pnpm as a global dependency
npx pnpm add -g pnpm

# install the dependencies
pnpm i

# start the dev servers
# It will start the client and server apps.
pnpm dev

In your browser check:

http://localhost:3000 for the client

http://localhost:3001 for the server

The desktop app should start.

Testing

pnpm test

madam3d's People

Contributors

Stargazers

Watchers

madam3d's Issues

feature: Add link on item to open in the computers default app e.g. the slicer for a .stl file on folders Page

Add link on item to open in the computers default app e.g. the slicer for a .stl file.

Feature: add a button to remove root folder and all its siblings.

At the moment this needs to be done on a per folder basis, perhaps have a settings toggle to automatically remove siblings or not.

Click on label of another model deselects first model

When the first model is selected in the folders page and you click another label on another model it deselects the first models checkbox

Windows 11
Chrome 98

Folders:

Display model parts count on button.

Feature: add a notification on the model of the parts that have been selected.

On the folders page when a part is selected/checked a notification needs to be shown of the corresponding model.

Page scrolling with content

When the main div fills with content it causes the main ui to scroll so that you can no longer see any of the icons with out scrolling back up to the top of the page.

As this is a web app it needs to fix the main navigation/Ui to the top of the page.

Add the viewing of .gcode files in the app.

useEffect with no cleanup throws error.

Describe the bug
react_devtools_backend.js:4061 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
at Overlay (http://localhost:3000/src/components/stlCard/StlCard.tsx?t=1643883554678:65:3)
at div
at StlCard (http://localhost:3000/src/components/stlCard/StlCard.tsx?t=1643883554678:27:3)

To Reproduce
select a model
deselect that model