4 ms·

Show HN: Spongedown

64 points by ivanceras 9y ago

jbob2000 9y ago
This is cool, but why would I want to draw diagrams like this? There's a plethora of tools out there that make drawing diagrams pretty simple, why do I want to do it with text? I'd drive myself crazy - every time you change one character in the diagram, you have to shift all the other characters on the line. I don't mean to be condescending, but.. whyyy? It just seems so fragile to be doing complex diagrams in plain text like that.
- scardine 9y ago
  While ascii art is not easy to edit (it is simple enough for many uses) it shares all other advantages of readable plain text formats. I loved it.
  - gravypod 9y ago
    If you made a Spongedown vi/emacs/nano editor that had paint-like features (place speech bubble, place resistor, place trace, place line, etc) then this would become practical.
    - teddyh 9y ago
      Emacs: M-x artist-mode Shift-MouseButton2, select Drawing → Rectangle
- Jach 9y ago
  http://asciiflow.com/ http://asciiflow.com/ is invaluable for some pretty quick ASCII diagramming that I can paste into source code or chat or wherever later. But I like that they don't have a billion charting components, it keeps things simple, and if I want it to actually look nice for a presentation or long-living documentation I'm going to use a real charting/diagramming tool... svgbob is neat but I can't imagine a situation where I'd want an ASCII circuit diagram vs a shot of one from a tool like Eagle.
- ivanceras 9y ago
  This is inspired by my first project when I was still a student(2002's). One of my professor wanted to have an application that does a question and answer test for his electric/electronic class. He wanted to fit on a floppy disk, and can be distributed to all of his students. The questionnaires was then encoded in plain text and I made a parser to go through each of the questions and their corresponding choices/answer. I skipped on questions that has diagrams and figures, since the program will only run on the terminal and I don't know any simple document formats at that time.
- fimdomeio 9y ago
  I do ascii diagrams all the time. I use Monodraw for that. From a design point of view the restrictions it imposes also create a consistent look and feel. Everything is aligned to a grid, boxes arrows, text. I never lose any time trying to make things look good as I would with another tool. Also there's the added bonus that since I'm the only one using it amongst the people I work with. When anyone sees it they know... it's a technical drawing from that guy.
- yoz-y 9y ago
  I could understand this as an interchange format. However for it to be really useful it should be accompanied by a GUI tool that allows you to only draw diagrams which are unambiguously representable as ASCII. Then you could use the tool to draw comfortably and only use the text as an evergreen format.
simlevesque 9y ago
Takes 10 seconds to load on a Xeon...
bobinatorino 9y ago
Really, really, slow. Crashed my computer. Interesting idea, though.
- ivanceras 9y ago
  I've really wanted to put up a server to the rendering api on the server side, but I don't have to resources for it yet, so I leverage on doing the rendering on the client side.
  - nicoritschel 9y ago
    Probably a great candidate for some FAAS (AWS Lamda, Google Cloud Functions)
  - peternicky 9y ago
    When you say "resources", do you mean money or time?
    - ivanceras 9y ago
      money
exikyut 9y ago
I get Uncaught RangeError: Maximum call stack size exceeded after about 30 seconds.
Ezhik 9y ago
Really don't find ASCII -> Diagrams very useful, but I'm surprised this is the first time I've seen inline CSV rendering like that.
- ivanceras 9y ago
  The csv rendering isn't a standard in markdown, but I just think it would be nicer to have it render same as the table, since csv is a readable plain text format.
- notheguyouthink 9y ago
  I like them personally (ASCII Diagrams), but creating them is very difficult. I'm rarely concerned with getting them to other formats, my goal when creating them was a text representation. I use Monodraw to draw mine, fwiw. It also outputs images/svg/etc if you like.
lonesword 9y ago
Does not look good on mobile browser
tenryuu 9y ago
Unsure what you did wrong, but this took about a minute to process the panel on the right, before firefox crashed, taking the whole system with it. Had to hard reset on from the physical button From my phone camera; https://my.mixtape.moe/rkoydo.jpg https://my.mixtape.moe/rkoydo.jpg
- segf4ult 9y ago
  This also crashed firefox on Linux for me.
  - ivanceras 9y ago
    I also experience crashes from time to time. The project is compiled into webassembly(wasm), and I think the wasm has yet to be tested more with bigger code base.
    - tenryuu 9y ago
      Might be that the version of firefox I was using (since it's a lab machine) is outdated. Wasm is right now bleeding edge technology, so it's going to be a bit of a weird side for a while as machines are updated for compatibility
      - ivanceras 9y ago
        Yeah, I'm guessing that too. When I load the page in firefox my new ubuntu 16 machine randomly freezes, had to reset and update the drivers suspecting it was some hardware/driver issue. However, chrome is working pretty well.
- mishoo 9y ago
  +1, but I tried patiently to move the mouse over the X (close tab button) and clicked a few times... one minute later it closed and I got away without a hard reset.
xnxn 9y ago
I liked this a lot. It was fun pasting some of my diagrams in to see how svgbob rendered them. I think I still prefer a monospaced font in the SVG (but that's easy to do with CSS).
- ivanceras 9y ago
  The shapes on the svg is adjusted to fit with source diagrams I've found anywhere online. If you have some interesting diagrams that are a bit off on the render, please don't hesitate to show it, or file a bug on the github repo.
wjvdhoek 9y ago
This is awesome, great job!
deleted 9y ago
[deleted]

64 points by ivanceras 9y ago

jbob2000 9y ago

This is cool, but why would I want to draw diagrams like this? There's a plethora of tools out there that make drawing diagrams pretty simple, why do I want to do it with text? I'd drive myself crazy - every time you change one character in the diagram, you have to shift all the other characters on the line. I don't mean to be condescending, but.. whyyy? It just seems so fragile to be doing complex diagrams in plain text like that.

scardine 9y ago
While ascii art is not easy to edit (it is simple enough for many uses) it shares all other advantages of readable plain text formats. I loved it.
- gravypod 9y ago
  If you made a Spongedown vi/emacs/nano editor that had paint-like features (place speech bubble, place resistor, place trace, place line, etc) then this would become practical.
  - teddyh 9y ago
    Emacs: M-x artist-mode Shift-MouseButton2, select Drawing → Rectangle
Jach 9y ago
http://asciiflow.com/ http://asciiflow.com/ is invaluable for some pretty quick ASCII diagramming that I can paste into source code or chat or wherever later. But I like that they don't have a billion charting components, it keeps things simple, and if I want it to actually look nice for a presentation or long-living documentation I'm going to use a real charting/diagramming tool... svgbob is neat but I can't imagine a situation where I'd want an ASCII circuit diagram vs a shot of one from a tool like Eagle.
ivanceras 9y ago
This is inspired by my first project when I was still a student(2002's). One of my professor wanted to have an application that does a question and answer test for his electric/electronic class. He wanted to fit on a floppy disk, and can be distributed to all of his students. The questionnaires was then encoded in plain text and I made a parser to go through each of the questions and their corresponding choices/answer. I skipped on questions that has diagrams and figures, since the program will only run on the terminal and I don't know any simple document formats at that time.
fimdomeio 9y ago
I do ascii diagrams all the time. I use Monodraw for that. From a design point of view the restrictions it imposes also create a consistent look and feel. Everything is aligned to a grid, boxes arrows, text. I never lose any time trying to make things look good as I would with another tool. Also there's the added bonus that since I'm the only one using it amongst the people I work with. When anyone sees it they know... it's a technical drawing from that guy.
yoz-y 9y ago
I could understand this as an interchange format. However for it to be really useful it should be accompanied by a GUI tool that allows you to only draw diagrams which are unambiguously representable as ASCII. Then you could use the tool to draw comfortably and only use the text as an evergreen format.

simlevesque 9y ago

Takes 10 seconds to load on a Xeon...

bobinatorino 9y ago

Really, really, slow. Crashed my computer. Interesting idea, though.

ivanceras 9y ago
I've really wanted to put up a server to the rendering api on the server side, but I don't have to resources for it yet, so I leverage on doing the rendering on the client side.
- nicoritschel 9y ago
  Probably a great candidate for some FAAS (AWS Lamda, Google Cloud Functions)
- peternicky 9y ago
  When you say "resources", do you mean money or time?
  - ivanceras 9y ago
    money

exikyut 9y ago

I get Uncaught RangeError: Maximum call stack size exceeded after about 30 seconds.

Ezhik 9y ago

Really don't find ASCII -> Diagrams very useful, but I'm surprised this is the first time I've seen inline CSV rendering like that.

ivanceras 9y ago
The csv rendering isn't a standard in markdown, but I just think it would be nicer to have it render same as the table, since csv is a readable plain text format.
notheguyouthink 9y ago
I like them personally (ASCII Diagrams), but creating them is very difficult. I'm rarely concerned with getting them to other formats, my goal when creating them was a text representation. I use Monodraw to draw mine, fwiw. It also outputs images/svg/etc if you like.

lonesword 9y ago

Does not look good on mobile browser

tenryuu 9y ago

Unsure what you did wrong, but this took about a minute to process the panel on the right, before firefox crashed, taking the whole system with it. Had to hard reset on from the physical button From my phone camera; https://my.mixtape.moe/rkoydo.jpg https://my.mixtape.moe/rkoydo.jpg

segf4ult 9y ago
This also crashed firefox on Linux for me.
- ivanceras 9y ago
  I also experience crashes from time to time. The project is compiled into webassembly(wasm), and I think the wasm has yet to be tested more with bigger code base.
  - tenryuu 9y ago
    Might be that the version of firefox I was using (since it's a lab machine) is outdated. Wasm is right now bleeding edge technology, so it's going to be a bit of a weird side for a while as machines are updated for compatibility
    - ivanceras 9y ago
      Yeah, I'm guessing that too. When I load the page in firefox my new ubuntu 16 machine randomly freezes, had to reset and update the drivers suspecting it was some hardware/driver issue. However, chrome is working pretty well.
mishoo 9y ago
+1, but I tried patiently to move the mouse over the X (close tab button) and clicked a few times... one minute later it closed and I got away without a hard reset.

xnxn 9y ago

I liked this a lot. It was fun pasting some of my diagrams in to see how svgbob rendered them. I think I still prefer a monospaced font in the SVG (but that's easy to do with CSS).

ivanceras 9y ago
The shapes on the svg is adjusted to fit with source diagrams I've found anywhere online. If you have some interesting diagrams that are a bit off on the render, please don't hesitate to show it, or file a bug on the github repo.

wjvdhoek 9y ago

This is awesome, great job!

deleted 9y ago

[deleted]