johnmclear / draw Goto Github PK
View Code? Open in Web Editor NEWThis project forked from byrichardpowell/draw
A real time collaborative drawing tool using nodejs, socket.io & paper.js
License: Apache License 2.0
This project forked from byrichardpowell/draw
A real time collaborative drawing tool using nodejs, socket.io & paper.js
License: Apache License 2.0
When accessing / one should be redirected to a random url like in etherpad in order to be able to easily share a sketch by copy/pasting the url.
If one user draws something and another joins, the newbie cannot see what his companion drawed before
Prolly part of a bigger re-factor that is required.
Too easy to be so destructive with one click. An "Are you sure? This will clear everyone's work." popup might be a solution.
Each sketch should have a unique id, enabling multiple sketches on the same server and easy collaboration by copy-pasting urls.
and init scripts and setup a git event to handle pull
http://draw.etherpad.org exists
Something like this could be an alternative: http://www.daviddurman.com/flexi-color-picker/ but the one from Etherpad is probably better.
Will be interesting to figure out how to handle opening a new window in the test framework.
If someone has a browser connected to the server and the server restarts (starts up), the client will not re-run the subscribe function causing it to try to access a paperjs project in a room that hasn't been created by the subscribe function yet. This will crash the server.
If person A selects a path, everyone else should be able to see that he has that path selected.
I'm waiting on this to hear back from the paperjs folks about setting custom selection colors instead of the default blue. That way we can show the selection in the color of the user who selected it (assuming we have artist colors as suggested in #60.
If you start a drawing on a desktop browser and then try to access it on an iPhone 5 with Safari Mobile, you can only view/draw on the top-left corner of the space.
There is no way to use double-touch to scroll or pinch-in / pinch-out. You are stuck seeing only a portion of the drawing space.
The README says:
See http://etherpad.org - Apache 2 License
But the LICENSE file is CCPL (Share Alike I assume??). Etherpad.org also has a CC BY-SA image at the bottom of it.
So to me, I see the LICENSE file and think it's some sort of CCPL. Then I visit Etherpad.org and see the BY-SA logo at the bottom, so I assume that EtherDraw is CCPL BY-SA also.
I hope that this explains my confusion.
This might be tricky if the client and server are not synced by path ID numbers. You can set unique names to paths, but I'm not sure if that gets exported in the JSON.
At the moment, Draw is already cool to use on an iPhone 5.
But some trouble
In Safari Mobile fullscreen/landscape mode, the Select button is stuck under the "out of fullscreen" button.
In Chrome, both Draw and Select are stuck under the fold, but you can reach them by double-touching the screen and scrolling down. (interestingly, there is then a blank space under the fold, stay blank, never refreshed, can't draw in it)
This may be a bug with the way IE 10 handles base64 encoded data. Further investigation is needed.
Some relevant information:
http://stackoverflow.com/questions/7405345/data-uri-scheme-and-internet-explorer-9-errors
User colors will not be forced in etherpad plugin, but initial color will be equivalent to the user's etherpad color.
Allow users to export a sketch in SVG / PNG
If you need to support Internet Explorer, you can fall back on jQuery.
http://zeptojs.com/#download
Is this intentional to leave out IE users for EtherDraw?
Periodically (or event driven) we should enforce a sync between the clients' and the server's copy of paper.
-Sometimes path strokes aren't sent to the server (drawn faster than 100ms I think) and others are sent that differ from the stroke seen by the author (some fast strokes will come out pointy instead of rounded cloud-like).
-It's possible for two clients to send updates to the server and have them received by the server in an unpredictable order causing the server to add them to its own copy of paper in an unpredictable order so the new project items could have differing IDs than what the clients think that they have.
This would be useful for any kind of transformations on already created paper items in the project such as #46 because we essentially select the object based on its ID. We would then need to add a simple token system to the server so that only one client can transform an object at a time.
When the server is syncing, we might want to pause sending out updates and queue them up. This probably wouldn't be an issue since the server's project is in memory and the exportJSON() function is really fast, but there may be a rare situation where the server is syncing and updates that aren't a part of the sync come through to the client before the sync does and the sync obliterates those updates by overwriting the client's canvas. Those updates would have to wait until the next sync to come back.
Thoughts on syncing server to clients?
bin/run.sh:14: echo "Please type 'Etherpad Lite rocks my socks' if you still want to start it as root"
settings.json.template:14: //IP and port which etherpad should bind at
settings.json.template:23: // so that the Etherpad server can access them
settings.json.template:51: "defaultPadText" : "Welcome to Etherpad Lite!\n\nThis pad text is synchronized as you type, so that everyone viewing this page sees the same text. This allows you to collaborate seamlessly on documents!\n\nGet involved with Etherpad at http:\/\/etherpad.org\n",
CONTRIBUTING.md:2:(Please talk to people on the mailing list before you change this page, see our section on [how to get in touch](https://github.com/ether/etherpad-lite#get-in-touch))
CONTRIBUTING.md:15:Also, keep it maintainable. We don't wanna end ob as the monster Etherpad was!
settings.json:14: //IP and port which etherpad should bind at
settings.json:23: // so that the Etherpad server can access them
settings.json:51: "defaultPadText" : "Welcome to Etherpad Lite!\n\nThis pad text is synchronized as you type, so that everyone viewing this page sees the same text. This allows you to collaborate seamlessly on documents!\n\nGet involved with Etherpad at http:\/\/etherpad.org\n",
Not sure how this will affect exporting SVG. Will be interesting to find out!
Not sure how this will affect exporting JSON either...
Speed knobs and smilie faces are the usal thing people try to draw, it might make sense to detect these types of shapes and perform some logic such as a warning or so
if you export from a smaller display/viewport, the exported data url only include the rendered part of the drawing.
= the drawing is clipped in comparison with the desktop version.
Make sense in term of export effectiveness (no server-side render, instant) but might trouble groups where users work with a variety of viewport sizes (most groups?).
(aside: love the data url way, no file to actually download then upload and then share is perfect for mobile devices)
Single objects and groups.
Why is this happening?
Before proceeding any further, we have to make sure @byrichardpowell accepts the Apache License
So that users can know how to run them. Just point your browser to your server's url/tests/frontend like:
http://localhost:3000/tests/frontend
Slow down in chrome, replicate using stress test tool
Need dependency check and startup scripts for Windows users.
/home/draw/draw/server.js:160
projects[room].project.activeLayer.remove();
^
TypeError: Cannot call method 'remove' of null
at Object.callback (/home/draw/draw/server.js:160:46)
at /home/draw/draw/node_modules/ueberDB/CloneAndAtomicLayer.js:100:17
at /home/draw/draw/node_modules/ueberDB/CacheAndBufferLayer.js:198:7
at exports.database.get (/home/draw/draw/node_modules/ueberDB/dirty_db.js:48:3)
at exports.database.get (/home/draw/draw/node_modules/ueberDB/CacheAndBufferLayer.js:171:20)
at doOperation [as operatorFunction] (/home/draw/draw/node_modules/ueberDB/CloneAndAtomicLayer.js:94:18)
at exports.channels.emit (/home/draw/draw/node_modules/ueberDB/node_modules/channels/channels.js:38:11)
at exports.database.get (/home/draw/draw/node_modules/ueberDB/CloneAndAtomicLayer.js:62:17)
at /home/draw/draw/server.js:155:10
at null.<anonymous> (/home/draw/draw/node_modules/ueberDB/dirty_db.js:42:5)
The current stroke is nice for artistic drawings but useless for sketches. At least a plain pencil should be added
I'm pretty sure that the Earth will blow up if two people try to move the same item/path at the same time.
One way to mitigate this is to implement an ownership token that's controlled serverside. Whose ever's click/drag message arrives at the server first should get the token and releases the token on mouseup (with a timeout failsafe). This would introduce a slight pause in moving an item as you wait for the server to say that it's okay to move.
Thoughts on the problem? Thoughts on server arbitrated ownership? Any better ideas?
As the name suggests, however this would not work well when draw is used as an Etherpad plugin (ep_draw) with two chat boxes (one for Etherpad and one in the ep_draw window). A simple URL boolean parameter for showing chatbox should make this work where the ep_draw would point to not showing the chatbox.
This is a bug with paperjs exportJSON(). See issue: paperjs/paper.js#215
events.js:72
throw er; // Unhandled 'error' event
Error: EMFILE, open 'var/dirty.db'
consistently crashes the server
Move artists into Etherpad Style user icon view
Move Invite some friends into some more central point with a close button
Make Opacity Slider actually change opacity
Remove text from opacity Slider
Make Clear button into icon (Trash maybe?)
Move Exports under an icon
Use jQuery Pep to make controls movable but keep opacity slider functionality, after this is done the color selector will need to be location aware so it
is always visible on screen
Instead of using shell scripts we should rely on node process management for safe run implementation
Hey there,
I'm just wondering if anyone has experienced a 502 Bad Gateway error after installing this plugin.
I openly admit that I have a total novice when it comes to etherpad, and using github as well, so I apologize in advance if I'm posing my question to the wrong area.
Any help or direction is appreciated!
Really weird one, can be replicated by stress testing
The current behavior for the brush is:
the fastest you draw, the bigger the brush size.
From my experience with a lot of non-pressure sensitive, pseudo-natural brushes tools, for example on iPad, it's the opposite of how most brushes (all?) works when they implement that dynamic size behavior.
You generally have a brush that is thin when drawing quickly, allowing for fast sketches, and that pseudo-leak paint when going slow, allowing for filling.
It kind-of mimics the behavior of a real brushes.
(I actually found myself trying to sketch fast several times, each time rediscovering that I'm supposed to go slow…)
You might want to consider reversing the behavior.
Since Jade is only used to assemble one static file, we should remove that dependency
Now the CSS and JS is clean, why not deliver minified JS? Also why not deliver CSS inline with HTML to save the HTTP request?
Useful for when someone is on a slow connection and is downloading a previously existing sketch from the server.
Reposition selected items by dragging the mouse.
On iPhone 5,
Load the page in portrait = toolbar is on the right.
go to landscape = toolbar go to the right.
go back to portrait = the toolbar is in the middle, overlapping the drawing
A button to clear the current canvas of all paths.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.