laserweb / laserweb4

Collaborative effort on the next version of LaserWeb / CNCWeb

LaserWeb (4.0.x)

This repository is a "development environment" - and no regular user would have to touch this at all (dont download the repo from here, use the Download links below)

Download

Releases are made available on https://github.com/LaserWeb/LaserWeb4-Binaries/

Documentation

For more documentation, go to the Wiki or our website https://laserweb.yurl.ch

Docker

• run image:

docker run -device=/dev/ttyUSB0 -p 8000:8000 joesantos/laserweb:latest

• connect to app: http://localhost:8000

Development

Docker user targets:

• dev
• test

You can run the dev version of the app in Docker using the commands below.

• build dev image:

docker build --target dev -t laserweb:dev .

• run image:

docker run -it -device=/dev/ttyUSB0 --rm -p 8000:8000 laserweb:dev

• connect to app: http://localhost:8000

To build the release version:

docker build -f Dockerfile.release -t laserweb:release .

Community

Please use the community forum on https://forum.makerforums.info/c/laserweb-cncweb for questions and support. Please only report confirmed bugs on the git Issues tab.

Supported firmwares

Note: Ever changing. See the Issues tab above for details.

Firmware	Supported	Raster Performance	CNC Support	Pull Requests Accepted
Grbl > v1.1f (ATmega328)	Yes	Good	Great	Yes - improvements
Grbl-Mega (ATmega2560)	Yes	Good	Great	Yes - improvements
Grbl-LPC (LPC176x)	Yes	Great	Great	Yes - improvements
Grbl_ESP32 (ESP32)	Yes	Great	Great	Yes - improvements
Smoothieware	Yes *	Okayish	Okayish	Yes - improvements
TinyG	Yes	Unknown	Good	Yes - improvements
Marlin	Yes	Unknown	No	Yes - improvements
MarlinKimbra	Yes	Unknown	No	Yes - improvements
Repetier	Yes	Unknown	No	Yes - improvements
RepRapFirmware	Yes	Unknown	Yes	Yes - improvements

• If fast raster engraving is important for you, we recommend replacing Smoothieware with grbl-LPC (https://github.com/cprezzi/grbl-LPC) which also runs on the LPC1769 based boards and performs much faster for laser raster applications.

Wishlist

If you want to contribute, below are long standing community-requested enhancements, that a) we don't have time to code or b) need extra skills

• GCODE Optimiser - to cut down on G0 moves (something like http://parano.github.io/GeneticAlgorithm-TSP/)
• Implement "Raster > TSP-Vector" operation
• More Controllers! Help us implement more firmwares (improve TinyG add Marlin/Repetier, etc)
• WebGL Transformation Filters to use Webcam to setup stock
• Automate Electron Builds for all platforms

How to contribute ?

Details on https://github.com/LaserWeb/LaserWeb4/wiki/How-to-Contribute

laserweb4's Issues

Settings tab: Input too small

Laser beam dia input-add-on takes up too much space, can't type into beam dia:

Swop all checkboxes for toggles

I love the toggles @jorgerobles used in settings

Any chance we can use them everywhere, for instance the checkboxes in CAM too?

ES2015 vs ES5

I am opening this issue to continue the discussion from LaserWeb/deprecated-LaserWeb3#97.

Since we're starting a new version of LaserWeb, I feel it's important we discuss a few options so we do not end up having to rewrite parts of the code in the future again.

So for some context, ES2015 is the new version of JS that was published and is starting to be supported my the major browsers. It brings some significant changes from previous JS, the ones I find more important to writing complex apps are modules and classes. I think LaserWeb codebase would greatly benefit from using the new module system. It basically allows each file to declare and explicitly import its dependencies which makes the code much easier to reason about.

I am suggesting we adopt this standard. It's already 1 year old so it's not like it was just released. While it's not the most well supported standard now, but it will in a couple of months once people start upgrading to newer browser versions. We can use a ES6 to ES5 JS compiler like Babel until that happens. It generates code that works under all browsers.

@arthurwolf brought the point that it will drive contributors away. Due to cleaner architecture and syntax, people used to pretty much every other programming language than front-end JS will feel more at home and since code will be much easier to reason about people will understand the code faster and contribute more. Besides most JS devs are already used to the export/import pattern from Node.

Aside from modules, classes would also help. The model that @lautr3k is proposing is using class inheritance under the hood anyway, but instead of being explicitly specified in the code it's using jQuery helper methods. It's not the most easy to understand model, I've had to reach out for the jQuery docs multiple times to understand what it really does.

I've pushed the first version of the conversion to es6 branch at: https://github.com/openhardwarecoza/LaserWeb4/tree/es6

@lautr3k The only real change I had to do from your architecture was to get rid of the dependency on the lw.get_module from the dock code and replace it with pub/sub pattern. That way the dock code does not depend directly on its parent, but the other way around.

Let me know what you guys think. If you still feel ES5 is the way to go then I will get rid of this branch, but if you agree it's the best way to future-proof LaserWeb code, then we can decide on the best way to generate the ES5 from ES6 to make it the least intrusive way on development possible.

By the way, I've not coded JS in years, so it's possible I might have messed up something.

Alternative to node-serialport

Investigate https://www.npmjs.com/package/browser-serialport

or

https://developer.chrome.com/apps/app_serial

Duplication: backend

Hi @tbfleming - just playing advocate here, but @lautr3k asked me on Hangouts today:

He is concerned that we are duplicating efforts on the base/backend - as per the original plan - Sebastien wanted to prepare a good modular base to avoid, as he puts it, "same problemes as lw1-3, when you build a house, you do not start with the roof"

On the other hand, we really dont want to loose your interest in the project, especially on the CAM front

So, allow me to open this quick issue to discuss this, so the two most important people on the project, Todd and Seb, agree on the way forward. At this point the project is bigger than me (:

Pass depth increment on Laser cut operation

For diode Laser mostly a depth increment option should be added.

Setup: Missing dependencies

'npm start' fails with a couple dependencies

react-addons-shallow-compare
unicode

Needed to install both before webpack built the bundle. Assume missing from package.json

Import not honoring path size

Not sure if this is a parser issue

Imported 2 100x100mm squares files , one from illustrator and another from inskscape

Setting SVG per inch changed accordingly

Illustrator 72 per inch will load as 100.35x100.35
Inkscape 90 per inch will load as 99.75x99.75

100x100squareinkscape.svg.txt
100x100 square.svg.txt

Job order sequence

I assume the current order is based on the order i drag the path. Is/will it possible then to reorder/add a path in the middle ?

gcodeMoveUnits?

@jorgerobles Are there any controllers which use mm/s for F instead of mm/min?

CAM: Tree Based

Opening issue to track progress on cam-rewrite by @tbfleming

Machine Profiles

Long requested functionality: Saved machine profiles / Material database

Also, this can be used to attract sponsors by including premade profiles, profiles can include customised functionality

[Question] Sequential job processing

It comes from a little problem I had this evening. A malformed gcode spoiled all the work, rendering the cut useless (break in the middle of the work). What would be the best solution?

I think the LW4 workflow does this already, but just to be sure @tbfleming, @openhardwarecoza
I would wish to select the order the jobs are applied, So create one job for a engraving a shape and other to cut after (an outer shape), and then another job for another shape engrave and cut, and so on.

I could not imagine any other way to do, maybe select all the vectors you want to engrave and use the "create jobs invidually for the (outermost?) selected objects" button. What do you think?

self = this?

@lautr3k I'm looking at the com code, and part way through the bind_model method, you assign self=this, and then (inconsistently) use it. Is there any particular reason for using "self", or is it just a stylistic thing?

UI Design Challenges

There are things that make it challenging to design a UI which is easy on new users, but flexible for experienced users. We need ideas.

Let's start with a big challenge: there's a many-to-many relationship between CAD objects and CAM operations.

• For new users and quick operations, it'd be nice to load a drawing, select an operation type, fill in some values, and hit go.
• For slightly more complex operations, it'd be nice to select some objects on the canvas, select an operation type, fill in some values, and hit go.
• In both cases, it should be obvious how to edit things.
• At the extreme end:
  • Multiple operations, each operation has multiple objects
  • Need an obvious way to:
    • Create operations
    • Add objects to operations
    • Reorder operations
    • Enable, disable operations
    • Remove objects from operations. Want to avoid making the user delete operations when objects change.
    • All without creating a UI which is imposing on new users
    • Preferably without any kind of context switch (e.g. an easy tab vs. an advanced tab or the awful Wizard dialogs that Microsoft once promoted)
• It'd be nice to be able to present the CAD object tree, CAM operation list, operation parameter values, and the explanation diagram all on a single screen.
  • These all relate to each other
  • Modal dialogs are painful on experienced users
  • May need to do some kind of progressive disclosure, but that can backfire badly and become annoying.

Data versioning mechanism

Cite from #49:

We need some data versioning mechanism (data as settings, machines, materials, operations) as I've encountered localstored data is not valid as We make improvements on the code.

It could be as easy as a version flag on each data stores, or as complex as use JSON Schema, to check the validity of stored data and prune/migrate if needed.

this comes as the new pxperinch broke the localstored settings. Now is not important, because We are in early stage development, but could be a real issue when introducing a new feature in the future "golden build"

Operations: Drop area is inside scrollable area

The drop target scrolls off screen with a long operation, might be best to place it in another seperator between the document tree and operations so its always visible?

List of OSX features not working

As i test and use LW4 im not sure if the issues are all related or not so i will list here and update accordingly if needed.

V-carve Generation crashes the browser
Clicking path directly on the grid does not select it

Knockout: "Uncaught Error: You cannot apply bindings multiple times to the same element."

When I call knockout's ko.applyBindings(), I get this error: Uncaught Error: You cannot apply bindings multiple times to the same element.

I think this means we'll need to re-think how knockout gets used, assuming I'm understanding KO right, otherwise we will only be able to use it in the com module, nowhere else.

My knockout code:
function materialType(mtName) {
this.materialName = mtName;
};

    function materialViewModel(){
            this.materialList = ko.observableArray([new materialType("")]);

            this.addMaterial = function() {
                    this.materialList.push(new materialType(""));
            };
    };

[...]
bind_model: function() {
ko.applyBindings(new materialViewModel() );
},

LW4 broken

./src/reducers/machine-profiles.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../data/lw.machines/machine-profiles.json

Operations: Accordian style?

I little niggle I personally experience with the operations component:
If I drag a new job down, it get appended to the bottom, so
a) If any operations are already expanded the user will always first need to scroll
b) the user also always has to click the expand button (since there are always unvalued inputs to fill in)

Wouldnt it be better to adopt an accordian style (expanding one operation collapses the others?) and then when dragging in a new job, default it to expanded (which collapses the others in the accordian, and thus saving the user a scroll and a click?)

porting / contribution lead / guidance

@lautr3k @tbfleming is the backend solid enough yet? I have contributors itching to start working on the new code especially now that is compliant, and its React based, and its not a mess anymore (:

@jorgerobles especially wants to dig in

Even me, I'm sitting here not sure where/how to start

Can you writeup a basic "how to" to get us all going ?

Show indicator of gcode generation in progress

Currently i dont see and indicator running. Generated some Vcarve gcode and thought the browser crashed as it took some time to generate

Material database

Referred by #31, I open this issue to get further detail.

Proposal: This would affect two sections

• On Settings: The Edit Material Database needs some space on screen. I don't know if We go for a modal, or go for a whole new section without workspace area. Anyways could show an editable datagrid (excel like... http://adazzle.github.io/react-data-grid/index.html) that displays the Name of the material, an Operation profile tag (Cut, Engrave, etc) and then the Operation Speed, Operation Intensity, Operation Passes, and maybe some more I don't know 😄

• On CAM: There would be a wizard icon next to the operation selector, and launch some modal that allows you to select the material/operation tag. Then the operation settings will be overriden, like the way described on Machine Profiles, allowing to tweak for the experts and so on.

@openhardwarecoza, @tbfleming any thoughts about this?

Option in setup/settings to choose between mm/s and mm/min

Its simple math but have the option to choose either make it more comfortable

Scaling changes origin point

Place a path into some coordinates. Scale it and see the coordinates change as the scaling seem to be to the center. Should it be like this or scale to the origin point?

http://recordit.co/YdiBxdHIer

[Wish] CAM: Vector Shape infill

Hi, I found that for filled vector shapes could be nice to turn vector to raster, o maybe an infill algorithm choosing density and patterns, like 3d printer infills, if possible.

Settings Panel number input bugs

This shows me doing the following:

• Entering 200 into Machine Width. Result is 2.
• Entering .1 into Laser Beam Diameter. Result is 1.

I suspect the first problem may because of DOM changes near the input control. The second problem is a React bug; I fixed this problem in the CAM pane today. See NumberInput in components/operation.js for the fix.

Build process

Um.. I get an error if I run npm install. Does it need an npm install?

npm ERR! install Couldn't read dependencies
npm ERR! Linux 3.16.0-4-amd64
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install"
npm ERR! node v4.4.7
npm ERR! npm v2.15.8
npm ERR! path /home/richard/Documents/LaserWeb4/package.json
npm ERR! code ENOPACKAGEJSON
npm ERR! errno -2
npm ERR! syscall open

npm ERR! package.json ENOENT: no such file or directory, open '/home/richard/Documents/LaserWeb4/package.json'
npm ERR! package.json This is most likely not a problem with npm itself.
npm ERR! package.json npm can't find a package.json file in your current directory.

DXF Support

Port DXF support from LW3 - however that relied heavily on threejs to split circles/arcs/etc into polylines, so ... probably a hard one
That import lib (three-dxf from https://github.com/gdsestimating/three-dxf) did a fantastic job though... every file we could throw at it worked. Except "lines" dxf wasnt autoclosed. And splines wasnt supported. That was about it

UI: Macro Panel

Action: Port / Rewrite functionality from LW3

Present Source: https://github.com/LaserWeb/LaserWeb3/blob/master/public/js/macros.js

Desired result: Popup Makro panel with programmable Gcode macros

Backend Rewrite

So this issue is for us to keep track of the daunting undertaking of @lautr3k and also requested by @tritao - to modularise LaserWeb (:

var laserweb = {}; laserweb.add('raster');

Rotary Axis support using true A axis

@tbfleming , @openhardwarecoza asked me to open this issue here in LW4. From the sounds of things, there is no too too much left to do to implement it, just some trig functions for the A values. I would love to have a working rotary axis solution, there are so many project I want to create that require a working rotary axis. I have already built an inexpensive but well built rotary axis setup, just need the firmware to run it now. I will be pushing the fundraising for your K40, I am sure you would love to be able to use a rotary with yours ;)

Load, save entire app state

It'd be nice for users to be able to save everything, including the CAM pane. @jorgerobles since you're already handling load/save of settings and machine profiles, want to do this?

UI: Command history

Action: Port / Rewrite functionality from LW3

Present Source:
https://github.com/LaserWeb/LaserWeb3/blob/master/public/lib/jquery/jquery-input-history.min.js and https://github.com/LaserWeb/LaserWeb3/blob/master/public/js/main.js#L219-L225

Desired result: Command console: Press up/down to access previously sent commands. Gets stored in Localstorage for reuse

Supported hardware

Just a comment, I think we should aim for the same support as LW3, at a minimum. Personally, I'll do my best to support grbl, and I'll occasionally be able to test smoothie.

[Workspace] 3d glitches and misbehaviors

Hi, I've detected some glitches on 3d rendering, on window resizing (appears a black refresh).
Also, the trackball events are not confined over the canvas, so, clicking some element (document tree, for example) makes camera to change position (Ugh!)

I've tracked issue up to http://stackoverflow.com/questions/13670886/allow-mouse-control-of-three-js-scene-only-when-mouse-is-over-canvas,
Digging into code I've got dead end on components/workspace.js::80

CNC CAM Operation - Drill options

Holes seem to be one of the weak links in many of the freely available CAM packages. Would love to see the ability to peck drill as well as spiral cut holes in an efficient manner.

Mark Moissette's STL parser and viewer

See https://plus.google.com/u/0/112899217323877236232/posts/VR7yA4Zte1N

We might move from THREE to

• https://github.com/regl-project/regl
• https://github.com/mathisonian/react-regl this is little more than a demo
• Mark's new parser and viewer

Error 404 on OS terminal OSX

After executing the the app i get the following and repeats every couple of minutes
Error 404: { [Error: ENOENT: no such file or directory, open '/Users/ayahni/LaserWeb4/server/../app/inform']
errno: -2,
code: 'ENOENT',
syscall: 'open',
path: '/Users/ayahni/LaserWeb4/server/../app/inform' }

Ive gone from a clean install and folder, but cant find the location the error refers to. Windows install is fine for me

This does not prevent me from connecting and interacting with the board.

Vector Layout packer: Integrate SVGNEST's geometryutils functions

A big badass herd of <:unicorn:/> from hell.

This feature should should be composed by:

• auto layout elements (or groups), for fitting the best on the work area (with gutter parameters, optionally)
• detect colinear vectors and compute only one resulting vector to gcode (two identical rectangles put one next the other should render one trace for the overlapping edges.)

Operation still present after deleting path

Should the operation still be present after deleting the path?

http://recordit.co/WJi7Mtc3pm

Integrate rasterizer module

Integrate https://github.com/LaserWeb/lw.Rasterizer.js

Serial interface refresh will not display newly connected device

If i start the server and load the interface before connecting the device pressing the refresh icon will not load the device until you refresh the browser or the SD card is mounted

Identify already added paths to operations on the grid

Once the path is added and multiple path are on the list, there needs to be a ways that the user can click the path and get the selection shown on the grid. Unless the user names each path which already gets read from the file buts highly unlikely the user will.

do

gitignore missing dist?

Not sure, but I just commited some code (git add -A as usual lazynss) and the /dist/ files got included.
Shouldnt dist be gitignored?

Laser cut cam: Solves path too much

Case in point: test file: http://vignette2.wikia.nocookie.net/simpsons/images/e/e7/Homer_Simpson.svg/revision/latest?cb=20150412145104

LW4 (right) misses the inside lines, LW3 (left) handled them

UI: Webcam Support

Action: Port / Rewrite functionality from LW3 + Enhancement

Present Source: https://github.com/LaserWeb/LaserWeb3/blob/master/public/js/viewer.js#L40-L81 and https://github.com/LaserWeb/LaserWeb3/blob/master/public/js/viewer.js#L434-L490

Desired result: Top down bed view to line up operations, but also investigate functionality with USB microscope webcams for edge detections / stock sizing / zero point finding

SVG Parser: Port @lautr3k 's parser from LW3:Optimisation branch

Not sure the reason nor the difference but some open for me some dont.

CUT LETRAS does not open.svg.txt
color boxes does not open.svg.txt
A does open.svg.txt

Item bubble size/coordinates not respecting resolution

Using chrome on a 2880x1800 display. Zooming does not fix it either

http://recordit.co/tqpSODf0zG