ZenPen | Hacker News Reader

ZenPen

zenpen.io

155 pointsnosecreek62 comments

JS runs on the links abundantly. You are not sanitizing your inputs, and this is why contenteditables are bad (click on the "this is not a bad idea at all" to see an alert box).

http://www.zenpen.io/index.html#4+IEgojgYAA=#FY0xDoMwDEVncgo...

Image loading events can trigger JS without interaction.

http://www.zenpen.io/index.html#4+IEgojgYAA=#4+LiBAKbAjsum8z...

Heya, creator checking in. Surprised this popped up on HN so soon after release (or at all). Although this is exactly the type of feedback I'm after.

I've started looking into scanning, and stripping js/malevolence from the content ... just haven't got around to implementing anything just yet.

That said, the project is only 2 days old, if anyone is interested in contributing its all open source: https://github.com/tholman/zenpen

Unfortunately, this problem that you are trying to solve has been tried numerous times and resulted in failure.

There's just too many inconsistencies in the way browsers allow loading of Javascript. Something that looks to a scanner as malevolent can actually turn up in the browser as something that ends up running.

So, unless you're somehow able to sandbox everything and able to stop causing the Javascript to poke out, it is incredibly difficult to scan for JS issues such as this one, especially when you're handling user-created HTML.

In fact, this is exactly the sort of problem why I created a Markdown no-nonsense editor instead (http://www.nimblenot.es/).

Ooh, These are good insights! (nimblenotes is great too!) Perhaps it would be possible for me to save the ZenPen output as markdown (compressed) and then re-assemble it into html on load... ideally avoiding sneaky man-edited html all together.

my first thought was "Cool! Damn, not markdown." Security issues aside I think you'd addressed the use case for the "common man" well. I (and I think many of the geeks here) would prefer a markdown variant though. No selecting and clicking to bold things, no reaching for the mouse, etc. That being said, a the ability to bold and italicize without leaving the keyboard are pretty standard text editor features at this point that ZenPen would do well to incorporate and the functionality would be reusable in a markdown variant too.

It looks like Ctrl+b and Ctrl+i work for bolding and italicizing.

Out of curiosity, why wouldn't it be enough to have a tag whitelist and filter out their attributes when reproducing the content ?

You might want to checkout the HTML sanitizer from the Caja project [1]. You'll need to build it with ant first, but it's pretty good and should be able to do what you want it to.

[1] http://code.google.com/p/google-caja/wiki/JsHtmlSanitizer

Nice!

A question to the creators if they are listening. What is this medium.com you say have inspired you? I followed the link but it asks permission to access to the list of my followers on twitter even before I can have the slightest idea of what it is. I checked the read more thing, but after an empty tagline it starts telling the story of guys I don't know, and I have no time reading their stories.

Hey! Thanks for the kind words. Medium is a neat blogging platform with a focus on good quality content, although it is currently in its early stages and invite only.

The main concept in medium thats inspired me here, is their wysiwyg style editor (https://medium.com/about/df8eac9f4a5e) over markdown... although mine is a tad more minimal, I'd be lying if I didn't say they had a big influence on ZenPen.

Thanks so much for the link, for some reason I couldn't find this link. I don't write write access on Medium; was wondering how their editor worked.

I am working on an open-source app inspired by medium. Hopefully this should be done in a week's time. Here is work in progress: http://i.imgur.com/ZYWRc8k.png

I'll also borrow your/medium's idea of showing the toolbar when text is selected.

I've come to really dislike websites and services that don't tell you what they're about straight away.

Compare to

http://www.jottit.com/

(a project of the late Aaron Swartz)

And http://throwww.com

(a project by me)

And http://gun.io/w/

(a project by me)

and http://litewrite.net/

(a project by @jancborchardt)

Hackers are picky! :)

I tried them all (including in other threads below) and litewrite was the only one that supported image drag and drop from the desktop! Wicked.

You can even resize! Awesome. And store your writings in owncloud. Ladies and gentlemen, this is how it should be done.

One minor nitpick: it would be perfect, if the text flowed properly around images. Currently images behave as thought they were each a single character. Also, not sure if it is multiplayer (like google docs), but I don't need that.

Thanks for the link!

Wohoo, glad you like it! Image drag&drop and more goodness implemented by the awesome @jorin-vogel.

It would be cool if you can submit the text flow issue (and any more suggestions you have) at http://github.com/litewrite/litewrite/issues Thanks!

Edit: Currently it doesn't support multiplayer, but we want to have public sharing in soon. Come contribute if you like. :)

Thanks for the shout-out man! Your LightWrite was (pretty obviously) a major inspiration for it.

You win in the taste department, IMO...

...or my editor, http://hallojs.org/

Does this allow hyperlinking? I guess not, and if so the front page is misleading since it gives the impression that one can put hyerlinked text. But seriously hyperlinking is not required..

Click the link icon in the upper left

I think he's referring to adding links when you're writing, much like you would bold, and italics. As it happens, its the first ticked I'd created in github - https://github.com/tholman/zenpen/issues/1

Yes, thats right. Thanks

Sorry if it seems misleading. The shared page here isn't actually the front page, but rather something little I show when the user clicks the little question mark on the bottom right... so the links where hacked in manually.

In retrospect, this wasn't the best idea, since the links also break the "quotation" functionality on the page. Lesson learned ;)

I like it, but I'm curious how long the links stay active for? As for feature requests, maybe make this an option (like pastebin does, with link expiration)?

Currently they last forever, since all the contents is stored in the url hash. I guess there is a possibility that will change, since it does have its length limitations.

I'm assuming the URL is supposed to automatically update to 'save' my changes, but it's not happening in my Firefox 18.0.1. Hmm, nor in IE9, although I notice the default text is completely different. Is there a save button I'm somehow not seeing?

Also in IE9 I get this JS error: SCRIPT438: Object doesn't support property or method 'atob' editor.js, line 161 character 3, which prevents any of the controls from functioning.

We actually made something similar sometime back - http://solitarydesigns.net/write/

Also planning on adding features like Save+Share, etc. soon (just not getting enough time).

It's also open sourced on github - https://github.com/kushsolitary/Write

I also made http://throwww.com a while back. It started as something similar to this but evolved into a simple blogging platform as people wanted more feature...

Oh nice, I really like this. Especially the transition between markdown, and the rendered text. Will be interested to see where you go with it :)

Ha amazing, I started a side project to solve the exact same problem a few months ago. Grats on actually shipping!

I didn't realize what this was at first. It's an edit in place javascript for a rather nice inline text editing.

You may want to make the minibar less intrusive, like Office. Right now, as I select lines as I read them, I end up formatting when I did not intend to. Office solves this by making the formatting bar appear up and to the left of the selection, and is transparent until you move into it.

This is fantastic! I teach classes and need a quick way to jot something onto the screen. The one piece that's really missing for me, or 2 pieces really, is the ability to make big headers and bulleted lists. If you could process Markdown in real-time (on Enter), that would be super!

A few comments about the text editor:

1. The first line, once selected, show the (b/i/") box too high up to be able to click. Need to let the pop-up-on-hilight change orientation based on position on browser.

2. Once clicked, the " makes the paragraph a quoted block. But there's no feature to unquote.

2. Click the " button again and it will unquote.

I like this a lot and might even use it myself. That said, the link generated is much too long for sharing, esp on Twitter, but probably anywhere. I'm guessing its a known issue though.

Yeah you're spot on. I'm trying to think of a way to solve this... but really trying to avoid having a back end/storing anything at all, though I'm not sure what else to do, if not through url's

If the url is less than 2000 characters, goo.gl (google's url shortner) will work, and that makes it much more sharable... but for bigger writings, I'm at a loss.

An export function would help here, but in the end, sharing from ZenPen.io would be preferable.

Open to any suggestions :)

if you want to store content in url, you'll hit limits sooner or later, unless writings are highly regular and can be compressed well.

it would be cool to get the following featured integrated:

+ headlines (H1, H2, H3,...) + wordcount at the bottom, i don´t understand / get the wordcount feature working yet. + shorter urls + hyperlinks

You almost completely described the github issues/features list :) - https://github.com/tholman/zenpen/issues?state=open

Love this.

And the word count target is the best thing I've seen all day. Lovely.

What exactly does the word count target actually do? I couldn't get it to do anything.

I liked the experience of this web app. It was very clean.

You set an amount of words you wish to reach, and a small progress bar appears on the right hand side, which slowly grows as you write more words... Although I'm just finding out now that it sometimes gets obscured by people's scroll bars, and is a little hidden.

My UX certainly needs a bit more thought here.

Oh. I see it now. That is really cool. Thanks!

Tool icons on the left need text (or at least a hover-over). Currently it's a complete mystery what they do, and users don't like clicking on mystery commands.

Work on the URL-s. Consider that I write a page on iPad, and just want to copy the link to my laptop. /r53etZ would be better then a 1 mile long URL.

Awesome! I put it in my Dropbox public folder. I can access it from anywhere and start writing.

I'm confused... why would you need dropbox for this? What exactly did you put in your dropbox folder?

This is very awesome! I actually wrote a couple of paragraphs upon first try, congrats!

This is neat. I'm interested to see where you go with this. Good job. :)

Emacs keybindings appear to be messed up: C-a, C-e, C-k, C-y.

I thought the "day/night" icon was a sideways smile face.

Great app. Kudos to you for open sourcing it! :)

What the world needs, another text editor. Thanks for your contribution to the betterment of computer science.

This sort of a snarky comment is absolutely uncalled for, especially when you are using a throwaway account. The real interactions that the OP is going through right now is valuable education.

Just what the world needs, another snarky comment about someone's project that puts it down.

as opposed to pen.io's PenZen? Seriously

>Founder of Pen.io.

Well, that explains it.

Why are you talking about your own creation in that detached sense?

Cos someone else built the current PenZen for the company as a side project, but we host it

Reply on news.ycombinator.com