A tiny web app for drawing cross stitch patterns. Less than 100 lines of code with a little html, css, jquery, and an erb compiler. Play with it here.
- jQuery
- HTML5/CSS3
- Ruby 2.3.1
- Deployed with Github pages
Click on over to the app, then just start clicking around. Change your drawing color by clicking on the palette to the right. Made a mistake? That's okay, it happens. Clicking on an already-colored square will either update the square's color to your current drawing color, or — if the square's color and the drawing color are the same — turn the square white.
Yeah, well so is cross stitch
- I had a cross stitch project in mind and needed a tool to plan the layout.
- When I was 10, I tried to make my own cross stitch patterns in Excel, but Excel didn't have conditional formatting yet, so changing the color of every cell took 3+ clicks. I just wanted to build the thing that 10-year-old-me had wanted, and to make that kid proud.
- I wanted to see what I could build in <100 lines (without writing totally obtuse code)
- I'd build out an option to bulk-clear either by color or by selecting an area.
- I'd fix the cell resizing that happens on narrow screens.
- I'd add darker gridlines to demarcate rows and columns of 10 squares to facilitate with stitch counting.
- I'd develop an alphabet tool to allow a user to place letters rather than having to draw them by hand.