There are some things you should know before diving into the code.
Depending on in which section your cursor is, keyboard shortcuts and mouse buttons behave differently.
Preview section (left)
It follows the classic and simplified CAD camera buttons.
Considering the camera target the center position of the screen on the ground:
- Left click: interacts with UI (if any).
- Right click: rotates camera around the target.
- Scroll down/up: zooms in/out.
- Wheel button: pans camera.
There are no default keyboard shortcuts. However you can create your own with the behavior you want. We call this hotkeys and they are covered in one of the tutorials.
Remember also that F12 opens the Chrome debugger, that we talk about as well in one of the tutorials.
Code section (right)
It follows the common keyboard shortcuts for a programming language editor.
Copy & paste
- Ctrl+C: to copy the selected area or the entire row if nothing is selected
- Ctrl+V: to paste what has been copied
- Ctrl+V: to cut (copy & remove) the selected area or the entire row if nothing is selected
- Shift+Alt+⬇️/⬆️: to copy the rows selected and paste them into the row below/above
Redo, undo and save & autoformatting
- Ctrl+S: to save and update the changes (same as Save & Update)
- Ctrl+Z: to undo
- Ctrl+Shift+Z: to redo (same as Ctrl+Y)
- Shift+Alt+F: to autoformat
Find and replace
- Ctrl+G: to go to the number of row typed
- Ctrl+F: to find a word
- Ctrl+H: to find and replace a word
- Alt+C: to enable matching case
- Alt+W: to enable matching whole word
- Ctrl+': to comment (out) the entire row
- Shift+Alt+A: to comment (out) the area selected
Don't forget to check any open documentation available in JS.
Our tutorials require a very basic level of programming and we try to use simple and understandable functions for beginners. Even if you never programmed before or you forgot the programming lectures you attended years ago, don't worry, you will not have any problem. Otherwise, we'll be happy to help you to find suitable resources for you!
Code completion, or IntelliSense, is a coding aid that help you learn more about the code that you're using. Use the ctrl + space keys in the editor to bring up a small popup with function referenses. It will also show when you type on objects. So whenever you write a dot after an object, for example
sketch., you should see a list that helps you find relevant functions or properties regarding sketches.
To find out what is happening with your project, root out bugs and build better dynamic rules you need to have a strategy for debugging. The fastest way to get started with debugging in DynaMaker is to use the built in browser console. These are the 4 steps you should keep in mind for debugging:
- Open the browser console with F12 while on the page that you want to debug.
- Add a break point at a specific line to stop the code or write
debuggerin the DynaMaker editor.
- Update/refresh. When it stops at that line, you can hover over all the elements to get the states & values.
- Use the control buttons at the top right part of the window to step through the code and find out what values you might be missing.