actually, they are most likely using part of the new drag and drop API in HTML5. firefox and chrome both provide a `ev.originalEvent.dataTransfer` object as part of the DragEvent interface. additionally (and importantly), they allow the drag/drop to originate from outside of the browser.
37signals also announced drag and drop file upload today, for their Campfire app (web-based chat), but it supports Safari in addition to Chrome and Firefox (3.5, instead of 3.6 as required by Google):
http://productblog.37signals.com/products/2010/04/new-in-cam...
Does anyone have an idea as to how 37signals solved it differently, with more browser support?
It's great that they're supporting this, but the UI is unintuitive - you can only drag files onto the green box (which is ugly btw) but users will try to drag files onto the message textarea, which won't work. Even changing 'Drag files here' to 'Drag files into this box' will help.
I like how the screenshots show a typical webbrowsing session: your main browser hidden, only the gmail message compose window visible and neatly sized-down so there's space for the folder window on the left.
You know you can hit the little overlaid boxes with the arrow pointing to the upper right in the upper right of the compose screen to "pop-out" the new email composition into another, bare window, right?
On Linux (Gnome), you can drag and drop from the save dialog in the Take Screenshot app so you never actually have to save it. I just tested it with GMail and it works like a charm.
That's brilliant! It's such a simple feature, but such a huge step in UI magic.
I always hated those needless extra steps in screenshotting. And then two months later your Desktop is full of things you forgot to delete and you had to figure out why you had ever needed a screenshot of top in the first place...
"Insert > Screenshot" minimizes the Outlook window, lets you select a rectangular area to include in your screenshot (not necessarily the whole screen), and then automatically pastes that screenshot into your message.
Also, if you have OneNote running, at any time you can hit Windows+S to clip an area of your screen and copy to your clipboard. I use it all the time.
I don't think that addresses the essence of SlackerIII's comment. You still have to go through the tedium of launching an external program to take the screenshot, choosing a filename/save location, and then inserting/pasting into Gmail. See my comment (up) about Outlook 2010.
With the python FUSE bindings you could setup a .jpg file on your desktop that could dynamically change based on the contents of your clipboard (and could disappear when the contents aren't an image). It wouldn't be too much more than plugging a bunch of libraries together.
edit: (missed the mention of Outlook, guess you aren't able to run FUSE)
If you have Firefox, you can use the Screengrab! addon to copy the screenshot to the clipboard.
EDIT: Only webpage screenshot, not full desktop. Should be easy to implement an external (background) running program to copy to clipboard the screenshot, though.
Drag-and-drop is one of most over-rated features ever:
* It requires excess wrist motion to accomplish some which could be done in few keystrokes.
* Only in a few situation is it ever entirely clear what dragging and dropping will do.
* Outside of, again, a few situations, it is unclear which objects to drag and where to drop them. In anything but file manager, it becomes a frickin' game of Carmen San Diego.
Unfortunately, most web browsers and sites are impossible to navigate by keyboard. So, as you've already got your hand on the mouse and are using it to click links, I think this is actually one situation where it can be justified (unlike, for example, a text editor).
That is why the laptop keyboard/trackpad combo is actually far better than the desktop keyboard/mouse combo. My fingers never leave the asdf jkl; position when mousing around a site. Each finger and thumb gets about the same usage. These things matter a lot if you do a lot of computer interaction.
The vim plugin for firefox is another route that might be good if you were on a desktop machine - I plan to NEVER a desktop for default development again.
And dragging is still hard even if mouse/trackpad is immediately available; the trade-off is a dozen fine-motor motions for about one byte of information input to a computer. My ideal one rough motion = one byte of information to the machine. The only time I'd want to home-in on a target is playing a video game, not choosing a file whose name the machine already knows.
Hands, hands are important. Use your hands gently...
This "non-technical user" seems to be a beast similar to the boing-boing quote of William Gibson: "something the size of a baby hippo, the color of a week-old boiled potato, that lives by itself, in the dark, in a double-wide on the outskirts of Topeka. It's covered with eyes and it sweats constantly. The sweat runs into those eyes and makes them sting. It has no mouth... no genitals, and can only express its mute extremes of murderous rage and infantile desire by changing the channels on a universal remote."
see: http://www.boingboing.net/2010/04/02/why-i-wont-buy-an-ipad-...
This non-technical user does nothing and understands nothing. They have no fear of tenotinus since they won't be using any functionality for more than ten minutes.
Ummm... why? Why is it more awkward/clunky than with any other set of windows? Also, why so negative? If you don't like it, use the old way; it isn't like they removed that.
In Firefox 3.6, you can read files with a FileReader. There doesn't seem to be any global FileReader object in 5.0.342.9 beta (Ubuntu). The Gmail file drag and drop works fine, so I'm certain I'm using a supported Chrome version.
Is there any documentation for how the file reading works in Chrome? I would like to implement it in an application of mine that so far only works in Firefox 3.6.
Big woop. I've been doing this forever with the dragdropupload add-on. I do like the insert invitation feature though, and wish there was a better way to easily read through emails, archiving as I go, without being directed back to the inbox.
Sometimes in the past I've forgotten that GMail isn't drag and drop and tried to drag files in. Now it works. I feel as if this feature was developed to personally get me to out myself on my past habits.
this has been possible for a long time if the drop target is the input type="file" ... which can be styled to look like something intuitive.
It's funny that this sort of UI is finally coming to the web. I had sort of revamped my whole work flow to avoid it, partially due to using lots of web based apps and partially due to linux.
plupload by the makers of tinymce (http://www.plupload.com) Allows you to upload files using HTML5 Gears, Silverlight, Flash, BrowserPlus or normal forms, providing some unique features such as upload progress, image resizing and chunked uploads.
http://dev.w3.org/2006/webapi/FileAPI/