Releases: Laaouatni/gcode.js
Canvas Simulator
I will add details in the future...
save all created G0/G1 in a array on ParentClass
- we need to implement this:
- when the user calls a class by using
new
(for examplenew G0({});
) - then we need to push the chosen class inside an array (that need to be inside Parent Class)
- the array needs to not be reset, but have always its values (for solving this we can use a
static
variable)
- when the user calls a class by using
why do we need to create this array?
this array is needed because in the future we can use it to make a simulator (with native canvas APIs, or CSS libraries)
in the end, we can have in the array something like this:
// [{...}, {...}, {...}, {...}]
that we can iterate on it with for loop or something similar to create something more interesting:
array.forEach(obj => console.log(obj.x););
also Make sure other methods are inside separate files if you can (not important, but if you can is better)
add `vite.js` library in our `index.html`
add vite.js to the example HTML project
MoveTo() method
-
a new method needs to be created called
moveTo()
-
moveTo()
get as paramters:-
an object of some data (similar to CSS):
-
left
orright
:- this need to be similar to how the
position
CSS property work in CSS language (but in javascript) - change Position on X axis:
left
add the number as value to the current X positionright
subtract the number as value to the current X position
- if there are 2 contrasting keywords such as
{left: 10, right: 20}
:- ✅we must take the last key into consideration
- ❌without using the first (as happens in the CSS language)
- this need to be similar to how the
-
top
orbottom
:- this need to be similar to how the
position
CSS property work in CSS language (but in javascript) - change Position on Y axis:
bottom
add the number as value to the current X positiontop
subtract the number as value to the current X position
- if there are 2 contrasting keywords such as
{top: 10, bottom: 20}
:- ✅we must take the last key into consideration
- ❌without using the first (as happens in the CSS language)
- this need to be similar to how the
-
-
why we want to use the CSS naming convention in our project?
this is because it will make the program easier to understand for who know already CSS.
also the concept of last get used, is calledSpecificy
in CSS (you can search about it in MDN)
try create a separate class for the specificy logic.
⚠️ for now make this onlyrelative
but in the future, maybe we can useabsolute
if we createG54
class (but isn't in the plan for now)
- for implementing relatively
Z
position moving:- use a key in the object called
zIndex
that seems more readible to me. - same logic as the previous ones, but zIndex don't have constrasting keywords (so it will be easy to implement)
- use a key in the object called
-
all the files should be tested
- at least for now with
console.log()
s manually
then I think we can usevitest
orjest
external library to test (but is not planned at least at the moment)
- at least for now with
-
the tests need to have also a
for
loop testing for themoveTo()
method -
also put a boolean var that if is
true
then it make the tests start, or if arefalse
to not start
X, Y, Z with Previous Coordinate
-
in this project we need to use
class();
, so it will not be repetitive and also customizable -
the code needs to be split into other files, so every file does one thing or has one
class()
-
the program needs to have some CNC Gcode commands like:
G0
G1
-
syntax needs to be like this:
new G1()
;
-
the Gcode class command (like
G0
orG1
) needs to get these parameters:- X coordinate
- Y coordinate
- Z coordinate
-
not all parameters are necessary:
- for example, I can give the X and Y values, but not the Z value (if I only need 2d moves).
-
the order of parameters isn't important
- this means that the user doesn't need to write always with
X, Y, and Z
order.- this is the following order of parameters to support:
-
X, "", ""
-
X, Y, ""
-
X, Y, Z
-
Y, "", ""
-
Y, X, ""
-
Y, X, Z
-
Y, Z, X
-
Y, Z, ""
-
Z, "", ""
-
Z, X, ""
-
Z, X, Y
-
Z, Y, X
-
Z, Y, ""
-
- this is the following order of parameters to support:
- this means that the user doesn't need to write always with
-
if a coordinate isn't defined:
- then we need to set that "X or Y or Z" to the "previous value" that was written by the user
- if the previous value there isn't:
- then we will set that value to ZERO (0)
-
every time that we get the code from our API we need to set the last position X or Y or Z to the last value written by the user.
-
getCode()
need to return a string like this:G1 X10 Y20 Z0
- here the order is important!
- the user can use the order that he wants, but the script needs to return the correct order.
- here the order is important!