106

Update Jul 2015:

The author is not able to update anymore. Use Freehand Circles Drawing Tool instead.



Important:


All SE sites (with one exception - see below) are now supported. Please upgrade to the latest version to enjoy this wonderful new feature!

A special thank you to Jacob Jernigan for donating space and bandwidth to host the images generated by this script.

Please make sure you update to the latest version as soon as possible.

v1.2 Update - what's new:
- Images are now stored on permanent server
- All StackExchange sites are now supported (Ask Ubuntu is technically supported but has CSS issues)

v1.1 Update - what's new:
- Fixed bug where answer would have long blank section
- Added new color and brush settings
- Images must be clicked on first to activate tools
- Added support for annotating images when composing an answer / question
- Fixed fkey bug

Screenshot / Code Snippet

http://fhc.quickmediasolutions.com/image/905708658.png

Also, you can find an old video demonstrating its use here.

About

I humbly present to you one of the most remarkable accomplishments: a UserScript that makes drawing Freehand Circles™ extremely easy!

You can install this UserScript in your browser. After installation, you will be able to draw freehand circles freely on any image in a post! But that's not all - you can also save the changes you've made merely by clicking the 'save' button.

You can find some technical details here.

License

The MIT License

Download

http://files.quickmediasolutions.com/userscripts/circles.user.js

Platform

Any browser that can run / install UserScripts.

Contact

I can be reached at admin@quickmediasolutions.com.

Code

JavaScript on the client side, PHP on the server

60
  • 3
    Note that to be really effective you should have edit privileges on the site in question, else you still enter the regular edit queue.
    – jcolebrand
    Mar 2 '11 at 23:54
  • @dra: That's a good point! But it'll still work as expected in that case. Mar 2 '11 at 23:55
  • 16
    What soulless monster downvotes this?
    – Pekka
    Mar 2 '11 at 23:57
  • That's what I say! Mar 2 '11 at 23:58
  • 2
    -1: No images for us to FHC-vandalize.
    – Shog9
    Mar 3 '11 at 0:26
  • @Shog9: No problem... just add one somewhere like the formatting sandbox. Mar 3 '11 at 0:30
  • What happens to the original image?
    – jjnguy
    Mar 3 '11 at 0:44
  • 2
    @jjnguy: Nothing... they vanish forever :P Actually, they get replaced with the modified one. They'll still show in the revision list. Mar 3 '11 at 0:59
  • 4
    This post will overflow with upvotes
    – juan
    Mar 3 '11 at 2:01
  • 3
    If you lack inspiration on stuff to FHC, google "people of wal mart"
    – Tim Post
    Mar 3 '11 at 2:18
  • 1
    You can contact me also George, depending on your needs I could probably help you out.
    – Josh
    Mar 3 '11 at 13:39
  • 9
    The requested URL /userscripts/circles.user.js was not found on this server.
    – Basilevs
    Oct 19 '13 at 5:01
  • 2
    I think this post will need to simply become historical. I don't have the time to maintain the script anymore and it never really served a tangibly practical purpose. Mar 19 '14 at 15:20
  • 1
    @Mew: I'll let you know if I'm able to find it. Aug 16 '14 at 21:41
  • 3
    @Mew I finally found it and posted it here: gist.github.com/nathan-osman/620001a7b0084d154093 Dec 24 '14 at 19:12

11 Answers 11

24

Here's a sandbox. Go nuts, you crazy kids.

enter image description here enter image description here enter image description here

3
  • OMG, this is great!
    – juan
    Mar 3 '11 at 2:01
  • 11
    that bunny is great! Mar 3 '11 at 15:14
  • 1
    How much time does this supposed to take ? It;'s taking pretty long fore me...
    – user21593
    Sep 4 '13 at 15:21
11

Nice, but: you're not using the SE provided Imgur account?

But then you're basically introducing image rot?

For free accounts:

How long do you keep the images?

As long as images are getting at least 1 view every 3 months, they will stick around forever. After that, your image may be removed to create more space for newer images.

(Note that a view is a request by a browser that is not using an image from its cache. Imgur tells browsers to cache a full year. I doubt Google indexing will keep refreshing the view count? Of course, unless edited by the OP within the grace period, the post revision history will still refer to the first image, which is probably hosted on the SE provided account.)

7
  • Good point. The perfect solution for this would be for the system to use SO's imgur account...
    – Pekka
    Mar 4 '11 at 10:06
  • @Pekka: That's impossible, I'm afraid... since the images are uploaded with a separate PHP script. Unless I'm missing something. Mar 4 '11 at 16:48
  • @George yeah, I feared as much. Too bad
    – Pekka
    Mar 4 '11 at 16:49
  • 1
    I think you're assuming images made with this should be archived forever...
    – mmyers
    Mar 5 '11 at 5:24
  • True, @mmyers, but I think the original images should be preserved. Like I wrote: the revision history will show the author's original image if someone else added freehand circles at a later time. But even then: not too nice if a post shows no image at all without going into the revision history?
    – Arjan
    Mar 5 '11 at 9:12
  • @Pekka, @Arjan: This is no longer a problem. See the update above. Mar 25 '11 at 3:33
  • @NathanOsman I still don't understand why do you refrain from using StackExchange imgur storage. Once the server you use is down, all the images will be gone. Nov 20 '14 at 15:02
6

I can't make this extension to work: is it outdated?

6
  • The server-side of the script is currently broken. There is an attempt to bring it back up, so I will post details here as I have them. Apr 2 '12 at 17:22
  • @GeorgeEdison such a pity, it was awesome! And for the first time I was using it for something useful :)
    – clabacchio
    Apr 2 '12 at 17:54
  • 2
    @George Yeah--I loaded it and it gives me There was an error retrieving the new image URL. :( Apr 5 '12 at 5:04
  • 1
    @Manishearth: Don't worry, it may return soon. Apr 5 '12 at 16:23
  • Hey George, I'm assuming this is still broken? It looks like an awesome script, in fact, I'm surprised SE hasn't taken this and made it an actual feature. How cool! ..... Uncaught ReferenceError: Attacklab is not defined how-to-run-nodejs-on-linux-platform (1):17 Failed to load resource http://fhc.quickmediasolutions.com/process.php
    – jmort253
    Dec 16 '12 at 19:24
  • @Manishearth You may be interested in this: stackapps.com/q/6353/26088 Jun 20 '15 at 22:01
5

There you have it, the George Edison Free Hand Circle Badge!

I promised him I'd suggest a badge if he pulled this off.

enter image description here

Here's the badge:

enter image description here

5
  • 10
    @George - I didn't have many options ...
    – Tim Post
    Mar 3 '11 at 2:40
  • You do now. Apr 24 '11 at 19:46
  • @TimPost if you want, I can jQuery that badge for :P Apr 5 '12 at 16:29
  • @Manishearth $('#badge').freeHandCircle(point1, point2, point3, point4, color, text, callback()) Could it be so easy? I smell an ego stroking userscript coming on!!
    – Tim Post
    Apr 6 '12 at 7:24
  • @TimPost Made a (simple) badge. I personally prefer $(".badge").attr("contenteditable",true).attr("href","").attr("name","") and then use Paint ;-) Apr 6 '12 at 7:56
5

After a day's testing (and my first real-world use!) I can see the need for three features that would be really great to have:

  • An eraser — might be half-way easy to implement? I don't know.

  • A reset button next to the "Save" button.

  • Maybe a very small text link pointing to the original image underneath the edited image?

  • One bug: If you leave the image's canvas while pressing the mouse button, and release the button outside the canvas, the script will not recognize that drawing has ended. The next time you mouse over the image, it will go on drawing. No idea whether anything can be done about that — maybe end drawing mode if the mouse cursor leaves the canvas?

9
  • @Pekka: Good idea. An undo button would be pretty easy - a reset button even easier. As for the original image... wouldn't that be in the revision history? Mar 3 '11 at 23:21
  • @George it would, but depending on how, where and for what this is going to be used, there may be the need for users to quickly get hold of an image without having to go through the revision history (like in order to sketch an alternative suggestion).
    – Pekka
    Mar 3 '11 at 23:25
  • @Pekka: I see what you're saying... but getting previous revisions using the API for every answer on the page would be very expensive. Mar 3 '11 at 23:26
  • @George but would the previous image's URL not be available from fetching it before it was drawn on, and re-inserting into the updated post? (Mind you, despite understanding the basic concept I'm still largely ignorant of how this works, so this is just me speculating)
    – Pekka
    Mar 3 '11 at 23:43
  • @Pekka: Are you asking if it would be possible to view the previous version of the image before you save your changes? That would be possible and pretty easy. Mar 3 '11 at 23:43
  • @George no, I mean when the new, drawn-on image is saved, adding a tiny, tiny link to the original image (which usually is on imgur) underneath the end result so people can more easily copy it (and paste it into their answer, and draw on it).
    – Pekka
    Mar 3 '11 at 23:48
  • @George added one bug report.
    – Pekka
    Mar 3 '11 at 23:54
  • 1
    @Pekka: Thanks! That's exactly what I'll do - if the mouse leaves the canvas, it'll end drawing operations. That's a cinch to add. Mar 4 '11 at 0:08
  • @Pekka: I implemented two of your suggestions (the one with the mouse leaving the canvas and the reset button). Simply use the same link in the question above to update. Mar 4 '11 at 23:18
1

No f****ing way.

This is brilliant. And the auto-save-to-imgur-and-replace-the-link-thingy is genius.

enter image description here

Community canvas: (note the current limitation that an image can be edited only once) enter image description here

7
  • I knew it would get people excited! And it's so simple to use too! Mar 2 '11 at 23:55
  • @George, I'm getting this error when trying to edit the above image - "There was an error retrieving the imgur.com URL."
    – jjnguy
    Mar 3 '11 at 0:39
  • @jjnguy: Unfortunately, it has come to my attention that the same image cannot be edited twice. I'm working on that, but in the meantime, feel free to post your own image and try it. Mar 3 '11 at 0:42
  • @jjnguy: Never mind. It's fixed now! Mar 3 '11 at 1:38
  • @George, is this meant to work on stackapps? It only works on MSO for me.
    – Jonathan.
    Mar 6 '11 at 14:45
  • @Jonathan: Only meant for Meta. Mar 6 '11 at 20:34
  • @George, oh right just wondered how people were drawing here,btw it goes without saying that this script is bloody amazing :)
    – Jonathan.
    Mar 6 '11 at 20:45
1

Bug:

If an SE dialog pops up (vote to close/flag/&c), the script kicks in and blocks clicking.

enter image description here

Clicking just puts it into FHC draw mode.

Test case: https://meta.stackoverflow.com/questions/128528/benefactor-badge-awarded-twice

0

Add your circle around the painted pixel and (400,400), and the second one around the first one, and so on -- how many can we fit?

7
  • This alone will use up my API requests :( Mar 3 '11 at 2:30
  • @George, is that what "There was an error retrieving revision content." means?
    – Nick T
    Mar 3 '11 at 2:52
  • @Nick: Hmmm... that means there was an error getting the latest revision for the post. I'll see if I can reproduce that. Mar 3 '11 at 6:30
  • @Nick: Yup, I can reproduce... looking into it now. Mar 3 '11 at 6:34
  • Ooops... now the post got rolled back. Sigh... Mar 3 '11 at 6:56
  • 2
    Are those boobs?
    – juan
    Mar 3 '11 at 23:46
  • @Juan No it's mesmerizing glasses.
    – HoLyVieR
    Mar 4 '11 at 0:05
0

Is there some image service/URL thing where you can get a blank canvas to then draw on it, a-la Placekitten (but without the ugly cats)?

http://placekitten.com/500/100

5
  • 1
    Well, Placekitten without the ugly cats would probably be placehold.it
    – Matt Gibson
    Mar 3 '11 at 22:12
  • (I'm getting an "Access Restricted" for that image, and the entire placekitten.com website. The page source has an odd iframe, referring to http://anti-virus.cloudflare.com. That company apparently also protects against hotlinking, which seems to be odd for this very service. I can still get there using Web Sniffer and then get totally different HTML. Maybe my IP has been blocked due to the above hotlinking? Odd!)
    – Arjan
    Mar 4 '11 at 16:54
  • @Arjan: You won't now... :) Mar 5 '11 at 0:03
  • (I got a blank page yesterday, @George, but now I get a virus warning. It's telling me "This IP address has been seen posting comment or blog spam", while earlier I guessed it was caused by some blocking I do myself, or by using a non-compatible browser or OS. I don't think I like that "This website is participating in a project to stop attacks and educate visitors with infected computers about how they can clean up their machines" if it is indeed throwing false positives. Right now, the scary cat bothers me more! ;-) But I'll investigate later...)
    – Arjan
    Mar 5 '11 at 9:25
  • @Arjan: I'm not responsible for either of those domains. Mar 5 '11 at 17:43
0

Apparently we're now obliged to submit all our screen grabs in 3D, and to assist with this our FHC should also be 3D:

3... 2... 1... until George Edison's FHC script gets 3D effects

That would make this truly rainbow unicorn awesome or something ;)

1
0

Bug Report

If you try to flag a question with an image, and the window overlaps with the image, the flag popup is unable to be navigated.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .