Comment preview, only 32 months late!
Ever since I started this blog, people have been complaining, quite rightly, about the dumb comment box, which was tiny and had no preview feature.
Blog comment boxes are generally unsuitable for posting really big comments, because it’s painful to edit a lot of text in even a large preview box, and because if something times out or otherwise dies when you click “submit”, you can easily end up losing everything you wrote. But there’s a large grey area between “quick one-liner” comments, small enough that you could dash them off via SMS if you had to, and “comments you obviously have to write in a text editor”. Numerous people found themselves lost in this grey area, and many comments were hideously maimed.
I presumed it would be difficult for me to fix this, and back-burnered the problem for years on end. (I also hand-corrected comments that were screwed up because the author couldn’t preview them. It was the least I could do.)
As it turns out, though, it’s piss-easy to give a Blogsome blog a proper JavaScript live comment preview. All you have to do is paste some stuff into one of the template files.
So now, at long last, there’s a proper comment preview on How To Spot A Psychopath. Do tell me if it doesn’t work properly in whatever browser you’re running; I’ve only checked it in Firefox, Chrome and IE6 on Windows.
(Bonus points if you have to tell me via e-mail, because the preview box screws up your browser so badly that you now can’t post a comment at all! Oh, and because the preview is done in JavaScript, it of course won’t work if you have JavaScript disabled or blocked, or if you’re using some antediluvian/mobile-phone/C64 browser that doesn’t support JavaScript at all.)
Yes, I am suitably embarrassed about not having taken the five minutes to do this at some previous point in the last two and a half years.
(I still have the silly CAPTCHA thing, where if you’re not logged in you’re told to fill out the CAPCTHA to post your comment, and then you discover that you actually can’t comment at all unless you’re logged in, and further discover that the CAPTCHA disappears entirely once you are logged in. I consider this slight imperfection in my blog to be evidence of its hand-crafted nature, and may take another two and a half years to fix it.)
I'm running Opera 9.64, and the fancy preview thingy looks fine to me.
And for giggles (or googles), here's a link.
Ah, very nice. An elegant solution, if a long time coming. Cheers, Dan!
Comment by j — July 7, 2009 @ 12:52 pm
Great, just when I have installed a bookmarklet to deal with tiny comment boxes. Literally two or three hours ago.
Oh well, anyone who is interested in making life easier can follow the link for more goodies you didn't know you needed.
And the preview is neat. (I might even enable JavaScript for the site!)
Comment by magetoo — July 7, 2009 @ 2:21 pm
Firefox 3.5 (with TraceMonkey!) on Mac - a-ok.
Ironic how I sorta had to type the above sentence without actually knowing it was ok, and instead using it as my test sentence.
I'm just going to keep on typing because this is actually sort of amusing.
Hmm.
Comment by evilspoons — July 7, 2009 @ 3:16 pm
.enod lleW .melborp oN .enif skroW !taerG
Comment by iworm — July 7, 2009 @ 4:44 pm
Ohh, nice!
I just have to try it out!
Turns out it works just as well in both Firefox and Konqueror under Linux.
Thanks!
(And, by the way, thanks for all the editing in the past! Hopefully it won't be needed anymore.)
Comment by Popup — July 7, 2009 @ 5:01 pm
So far it seems to work just fine under Maxthon, which is bloody obscure. I mean, as far as I can tell it works just ti*$^@#@&$--***NO CARRIER
Comment by Red October — July 7, 2009 @ 5:03 pm
OK I type:
This previews normal
and I get:
This previews bold
and/but (please delete one) the preview looks nice and bold
Comment by Jono4174 — July 7, 2009 @ 5:14 pm
That should read
OK I type
Comment by Jono4174 — July 7, 2009 @ 5:17 pm
Take 3
the preview shows the mangled HTML code how I wanted you to see it (with slash b and so on), but it disappears once posted.
So no more tutorials:
A- they are boring
B- you probably know more that me anyways
Comment by Jono4174 — July 7, 2009 @ 5:28 pm
Another Opera 9.64 user here (on Windows, FWIW), and it appears to be working fine. If I can be bothered, I may even boot into Ubuntu and try Opera there, too. Just for laughs, I'll try it later from my phone using Opera Mini 4.1.
Comment by Chazzozz — July 7, 2009 @ 5:34 pm
Yes, there can probably be many differences between what you see in the preview and what actually gets posted when you click "Say It!", for the same reason that people's comments were mangled before when they contained a not-quite-closed link or something so everything after the link got turned into a description for the link, which now went nowhere, etc.
All of that will still happen, because the same thing is still happening when you click the submit button; Wordpress "corrects" your comment to prevent unclosed tags from rampaging down the page, and so on, and it's not very good at DWIM.
The preview doesn't do that; as far as I can see, it just lets the browser render your broken or unfinished HTML as it would if the code were part of a static page.
If you're not deliberately trying to make mangled HTML for demonstration purposes, though, the preview ought to be close enough to WYSIWYG for government work.
Comment by Daniel Rutter — July 7, 2009 @ 7:28 pm
Degraded gracefully here to old version without j/s support.
Comment by Shivoa — July 7, 2009 @ 8:09 pm
this is A TEST
Comment by Simulant — July 7, 2009 @ 8:53 pm
I really didn't
meanintend to click "Say It!" Sorry.Comment by Simulant — July 7, 2009 @ 8:59 pm
Testing, testing, one two three. I am a chunky monkey from Funky Town.
Comment by Alex Whiteside — July 7, 2009 @ 10:10 pm
Sending from Safari 4 on OS X (which has the built-in abilty to resize text boxes). Works fine.
Comment by Johnny Wallflower — July 7, 2009 @ 10:50 pm
Since other people have done a fine job of testing, I won't have to.
So I shall not.
Ignore this post, please.
Comment by RichVR — July 8, 2009 @ 12:38 am
So nobody else has tried using HTML entities yet.
========
If you want to make some text bold, write this:
<b>This text will be bold</b>
and it will appear like this:
This text will be bold
========
Well it looks fine in preview. Lets see how it does going live.
Comment by jnz — July 8, 2009 @ 2:18 am
The preview doesn't work on IE for Windows mobile... but it looks like I can still comment!
Comment by rodenti — July 8, 2009 @ 8:30 am
Testing in Opera 10 Alpha on OS X. Looks good so far.
Comment by topdeck — July 8, 2009 @ 9:07 am
Humph... new fangled whiz-bang gadgetry...who needs it I say? I long for the old days when we posted comments in binary! Dang new fangled widgets!
01010111011001010010000001101000011000010110010000100000011101000110111100100000011101110110000101101100011010110010000001110101011100000110100001101001011011000110110000100000011101000110111100100000011000010110111001100100001000000110011001110010011011110110110100100000011100110110001101101000011011110110111101101100001000000111010001101111011011110010111000100000010010010110111000100000011101000110100001100101001000000111001101101110011011110111011100101110
Seriously though, it's so much nicer than the old ways... but I will miss the automatic editing service you used to provide.
Comment by Stark — July 8, 2009 @ 9:34 am
Hmmm... long binary strings do not seem to play nice. Sorry.....
Comment by Stark — July 8, 2009 @ 9:35 am
This is from Opera Mini 4.2 (a minor step later then I originally thought) on my phone. Preview isn't immediately useful because clicking in the textbox opens a new screen for entering text. Let's see what happens when I go back...
(closes screen...) (opens screen...)
When I close the screen I still don't see the preview, which is odd 'cause Opera Mini normally handles Javascript fine.
Let's try some HTML.
Comment by Chazzozz — July 8, 2009 @ 9:55 am
@Stark
Your binary is still readable, it just disappears off the edge of the screen and results in a (gasp!) horizontal scroll bar.
BTW...was that "uphill both ways"? ;-)
Comment by Chazzozz — July 8, 2009 @ 10:00 am
Luxury!
Comment by phrantic — July 8, 2009 @ 10:33 am
I'm currently testing the comment preview in my Android-based T-Mobile G1, in the third-party (but still Chromium-based) Steel browser. Small screen resolution and large comment-box awkwardness aside, live preview works perfectly.
Comment by n17ikh — July 8, 2009 @ 3:55 pm
Now I'm testing it in the Chrome/Webkit native Android browser. Seems to work fine, HTML and all.
Comment by n17ikh — July 8, 2009 @ 4:01 pm
Tant va la cruche à l'eau qu'à la fin le captcha me les brise.
Comment by jmguazzo — July 9, 2009 @ 1:12 am
Well, if I knew it was gonna be that kind of party, I woulda҉ stuck my ҉ d҉ck in th ҉OH MY G҉D҉҉҉҉҉҉҉҉
Comment by Daniel Rutter — July 9, 2009 @ 5:14 am
*Jumps on bandwagon*
Yup, it works.
Comment by TwoHedWlf — July 9, 2009 @ 5:49 am
This is a post from 1.5.0.7 (what can I say, I can't find a theme I like in 2 or 3....) on linux
Comment by pywaket — July 9, 2009 @ 6:11 am
Testes testes testes... 1,2,3. Is this thing on? *Tap* *Tap* *Tap*
Well this seems to work reasonably. After that mangled posting I made a few of days ago, I for one appreciate the ability to fix the postings I put up once every 4 years.
P.S. Thanks Dan!
Comment by Bob M — July 9, 2009 @ 9:16 am
@ Chazzoz - Indeed, both ways!
And just for good measure :
01000111011001010111010000100000011011110110
01100110011001100001001001110010000001101101
01111001001000000110110001100001011101110110
1110001000010000110100001010
Comment by Stark — July 10, 2009 @ 4:18 am
Heh. Binary is so 0011000100110000 minutes ago. Let's try an 8-bit encoding instead:
436F6D6D656E74207370616D2100
Or, for the ham radio enthusiasts out there:
-- --- .-. . -.-. --- -- -- . -. - ... .--. .- --
(Gee, the preview works really well. I was able to spot and correct errors straight away. Nice.)
Comment by Chazzozz — July 10, 2009 @ 11:54 am
... .--. .- -- --..-- / ... .--. .- -- --..-- / -... . .- -. ... --..-- / ... .--. .- -- / .- -. -.. / ... .--. .- -- .-.-.-
Comment by RichVR — July 10, 2009 @ 2:50 pm
No new posts from Dan for a few days is not entirely unusual, but no new TWEETS from Dan makes me wonder if there's been some kind of accident.
Comment by phrantic — July 10, 2009 @ 7:27 pm
Nah, I'm sure he's just busy assembling his new PC.
I'm looking forwards to reading all about it, as soon as he's managed to put it all together. (I'm sure it's just a matter of minutes while he manages to figure out why the sata cable is two cm too short, how to fit an metric screw in a UNC hole, and how to silence the fans without overheating the graphics card.)
Comment by Popup — July 11, 2009 @ 12:04 am
Yeah, fiddling with the new PC (about which I did just tweet!). I've only made it fail to POST once so far, which is a bit disappointing. Must have lost my touch.
I can, however, reveal my results so far in the only benchmark that could possibly matter to anyone: With a spot of overclocking, a Core i7 920 is about 5.7 times as fast for distributed.net's OGR calculator than was my old 2-core Athlon. Hence, a sudden leap in my OGR stats.
(Do feel free to make my stats go nuts by all telling dnetc.exe, if you run it, that your e-mail address is dan@dansdata.com!)
Comment by Daniel Rutter — July 11, 2009 @ 1:15 am
.. / -.. --- -. .----. - / .-.. .. -.- . / ... .--. .- --
Comment by Stark — July 11, 2009 @ 2:48 am
However...SSBkbyBsaWtlIGVuY29kaW5nIHNjaGVtZXMhDQo=
Exactly what encoding scheme that is, is an exercise for you, the geeks like me! :)
Comment by Stark — July 11, 2009 @ 2:51 am
Seems to work here (Firefox 3.0 on Lenny).
It causes an amount of CPU usage that's discernible if one is actively looking at a system monitor applet at the time, so it might cause perf issues on an extremely old system, but I'm writing this on midrange 2005 hardware (albeit, with added RAM) without maxing anything out, so it's clearly not a very big deal.
The more likely compatibility problem someone could run into is a tiny screen (say, on a mobile device) that can't show the textarea and the preview at the same time. But I suspect that's unavoidable, and they can always scroll.
Comment by Jonadab — July 13, 2009 @ 4:34 am