My notes while reading the source code from threejs Editor app, as I've been curious about :
- the editor architecture
- the undo/redo system
- the camera control behaviour & code
- the object transform gizmos behaviours & code
| // custom mapbopx-gl-draw mode that modifies draw_line_string | |
| // shows a center point, radius line, and circle polygon while drawing | |
| // forces draw.create on creation of second vertex | |
| import MapboxDraw from 'mapbox-gl-draw'; | |
| import numeral from 'numeral'; | |
| import lineDistance from 'npm:@turf/line-distance'; | |
| const RadiusMode = MapboxDraw.modes.draw_line_string; | 
| /* | |
| Example code: Detects a touch input which wakes up the esp32 from deepsleep. | |
| Then connects to a WiFi and post the touch event via MQTT. | |
| After finishing this the esp32 will go back to deppsleep. | |
| This whole process takes around 800ms to finish. | |
| author: @robertschnuell | |
| https://interaktives.design | 
| // custom mapbopx-gl-draw mode that modifies draw_line_string | |
| // shows a center point, radius line, and circle polygon while drawing | |
| // forces draw.create on creation of second vertex | |
| import MapboxDraw from 'mapbox-gl-draw'; | |
| import numeral from 'numeral'; | |
| import lineDistance from 'npm:@turf/line-distance'; | |
| const RadiusMode = MapboxDraw.modes.draw_line_string; | 
Watch a table for changes and push a notification with a payload describing the change.
In the Postgres shell:
-- Create the functions
| (function(){ | |
| var body = document.body; | |
| var snipe = function(e) { | |
| body.style.cursor = 'initial'; | |
| e.preventDefault(); | |
| e.target.parentNode.removeChild(e.target); | |
| body.removeEventListener('click', snipe, false); | |
| }; | |
| body.addEventListener('click', snipe, false); | |
| body.style.cursor = 'crosshair'; |