Multiplayer Drawing Canvas
Multi-person Drawing Canvas
This canvas is multiplayer so anyone can change this screen. I was 'inspired' by Reddit's r/place which was a social experiment hosted on April 1st, 2017. It was a giant canvas where each person could change the color of one pixel, with a cooldown of 5 minutes.
In this version that I made, there is a 80 by 45 pixel space, and no cooldown time, so you can change as many pixels as you would like. You could even possibly make a bot to draw pixels for you.
How Do I Use This?
To use this canvas, all you need to do is to click on whichever pixel you would like to change, and press the key corresponding to the color you would like.
Colors:
- Red - 1
- Orange - 2
- Yellow - 3
- Green - 4
- Light-Green - 5
- Light-Blue - 6
- Medium-Blue - 7
- Blue - 8
- Purple - 9
- Magenta-Red - 0
- Black - Minus Sign
- White - Equal Sign
I used Node.JS and 2 frameworks, Express.JS for sending files, and Socket.IO for real-time web connections.
An upvote if you enjoyed it would be appreciated
Please let me know how it is and give me feedback
Thank you for trying this out!
My eyes... Good job on making this. But it will make my eyes explode.
@CodeABC123 lol thanks
incredible job! love the concept
@MrEconomical thanks lol
Hey i want to make a mobile compatible version but I can't find the specific part of the code that assigns each number its color. (my idea is to add a little tool bar at the bottom with color buttons you can click and use)
var hue = screen[i][j][0] + ','; var sat = screen[i][j][1] + '%,'; var lig = screen[i][j][2] + '%'; ctx.fillStyle = 'hsl(' + hue + sat + lig + ')';
orange taking over
This is really cool and fun! :)
@ChezTacoz thank you!
what happened to it?
@TaylorLiang oh that sucks. Someone either has a really weird screen or they bypassed the safeguard I put up to stop incorrect data because I had a console.log() there. I just fixed it. That sucks that everyone's creations disappeared :(
neat
Why is it just showing a black screen for me?
@SilentShadowBla You might have clicked or interacted with the screen before the page was fully loaded. Have you tried reloading it or opening it in another tab?
yes i have must be my computer's problem or something, whatever, looking at the images in the comments, I say you did an amzing job! @SpicedSpices
Black doesn't work :(
Great site, otherwise.
「戸惑う言葉 与えられても 自分の心 ただ上の空 もし私から 動くのならば すべて変えるのなら 黒にする」
what does this mean lol
@SixBeeps
@LiamDonohue Google it
Cool! (I made the HI with the yellow BG)
@DeBeast591 Nice! Thanks for using it :)
@kaldisberzins This might of happened if you clicked or responded to the webpage before the screen loaded. Maybe trying it again or reloading it might help
LMFO
This is awesome!
@gameplayrawesom Thanks!
I was very bored lmao
@ItsYeBoiJ Thats insane! lmao how do you have the time to do that
@SpicedSpices IM VERY BORED