Drag/drop images on Linux produces "Unexpected Item"

[troytop]

When dragging/dropping a small PNG image file into a page (on Ubuntu 10.04 Nautilus 2.30.1 -> Firefox 14.0.1) I'm getting a resulting "1x2 Unexpected Item" object instead of the expected image.

JSON for Unexpected Item

{
  "type": "data",
  "id": "6c3eaff24da5a79d",
  "text": "Unexpected Item",
  "data": {
    "url": "",
    "types": {
      "0": "application/x-moz-file",
      "1": "text/x-moz-url",
      "2": "text/plain",
      "3": "Files"
    }
  }
}

[WardCunningham]

Regretfully the drop logic has to be specialized for every file type, every browser and every operating system. We'll be seeing unexpected items on drops until the the code is taught to expect every case.

Rather than simply refusing the drop, I capture information Ubuntu 10.04 Nautilus 2.30.1 -> Firefox 14.0.1 has offered. It doesn't look like much. If you're a coder and want to work this problem, I'm happy to help.

[WardCunningham]

The case analysis that I mentioned in the previous comment resides in the factory plugin. Scattered through the nested conditions you will find calls on "punt". Punt makes the "Unexpected Items" that you have encountered. The factory shouldn't punt.

I'd like to see some cooperation between the factory and the other plugins that it manufactures. For example, the current factory has code for translating .csv files that might be dropped. That should really be a data plugin responsibility. I'm imagining plugins register with the factory to have a chance at making sense of every drop. There is already some cooperation between the factory and other plugins. There needs to be more.

[StephanEggermont]

On OS-X 10.6.8 with Safari 5.1.7, it looks more like
{
"type": "data",
"id": "114a82cd2a8683f2",
"text": "Unexpected Item",
"data": {
"number": 4,
"url": "file://localhost/Users/stephan/Desktop/DSC_1577.jpg",
"types": [
"dyn.ah62d4rv4gk86rexmsv4u",
"dyn.ah62d4rv4gu8yc6durvwwaznwmuuha2pxsvw0e55bsmwca7d3sbwu",
"CorePasteboardFlavorType 0xC4706431",
"com.apple.finder.globalAnchorPointFlavor",
"text/uri-list",
"com.apple.finder.pasteboard.bnch",
"CorePasteboardFlavorType 0x6F726769",
"AppleCoreDragItemBounds",
"CorePasteboardFlavorType 0xC4697475",
"public.file-url",
"dyn.ah62d4rv4gk86rexuqu2u",
"Files",
"dyn.ah62d4rv4gk8086xhre",
"dyn.ah62d4rv4gu8y6y4grf0gn5xbrzw1gydcr7u1e3cytf2gn",
"CorePasteboardFlavorType 0x6675726C",
"CorePasteboardFlavorType 0xC46C6E6B",
"dyn.ah62d4rv4gk86rexqr3zu",
"CorePasteboardFlavorType 0xC469746E",
"dyn.ah62d4rv4gk86rexmsv1a"
]
}
},

The chrome version works though.

[WardCunningham]

It looks like the two systems don't even agree how to represent a list of types. One is a javascript object, the other a javascript array?

[rynomad]

I'm a novice developer (I know little more than Ruby parts of speech) but I'm running into this problem as well and plan on tackling it once I get a better grasp on both the language and the workings of SFW.

In the meantime, I found a workaround to get proper JSON images into my own wikis:
create an html file with a set of images you'd like to import and use html-json.rb (https://github.com/JoeBergin/Html-to-JSON-batch-converter). Copy the resulting JSON file into pages folder in SFW. create a link to it in your wiki and you should get a bunch of image objects that you can drag into the relevant pages.

I've also submitted a brief description of this workaround to the [[How to Wiki]] page on new.fed.wiki.org, though perhaps it would be better served as a screen cast detailing the process? I'd be happy to make one

I'm running Ubuntu 12.04 + Firefox and a lot of the drag-n-drop/plugin functionalities don't work quite right at the moment, so until I progress further away from padawan and closer to jedi master so as to fix the underlying code I'm just figuring out how to do things manually... I'd be happy to document these workarounds as I find them; Thoughts/requests?

Sorry if I've rambled a bit outside the scope of the OP. Really love this project btw, I'm finding a lot of cool use cases. Thanks to everybody for their work.

[WardCunningham]

@rynomad you are very resourceful. Thank you for pointing out this rather circuitous path to posting images. I've hung on to the data-url base64 image encoding because it preserves exactly the sharing semantics of federated wiki. Eventually we must move past it because it can be slooow.

Another alternative is available to you if you are willing to write your own json for pages as you are when you run a batch converter. You can use traditional image urls in image items rather than the data-urls. This can be much faster but, of course, you have to store your pictures somewhere other than the page json.

I did receive your [[How to Wiki]] revision. I'll add it to my developer focused list of Obscure Workarounds. Thanks.

If you'd like to help me make drag-and-drop work better, you can find the code that is giving up now in the Factory plugin. A good approach would be to put lots of console.log statements into it and see what Ubuntu/Firefox is sending into wiki.

[rynomad]

Thanks for the pointer! I've found the problem and a possible solution...

Problem: upon drop, the factory checks for dt.types: "text/uri-list" or "text/x-moz-url" (found in safari and firefox respectively) and then starts treating the datatransfer like a federated-wiki url (I think). When that doesn't work, it punts.

Possible solution: add another condition in the if statement above to check if dt.types 'Files' exists. It does, so it passes on into file reader and the image is uploaded. This is working swell for my setup, though I wonder if it wouldn't be better/cleaner for drop logic to be handled by switch/case rather than nested if statements, especially as we start handling more objects and dealing with more browser/OS combos. Newbie thought, I'm sure.

Note: I still can't get drag and drop to work between tabs in firefox: tooled around with it for a while, not sure if this is another browser/OS issue or if it's just not part of the code yet. It seems to almost work, but even though there’s a 'Files' type when I drag from say, facebook, dt.file reads null. Though I do get a url to the file, I don't know how to turn that url into a file that I can feed filereader. ( xmlhttprequest looked promising, but I'm really in over my head at this point... maybe if I sleep on it).

If my solution sounds like it won't break something, let me know and I'll learn enough about git to do a pull request.

PS Thanks for the link to Obscure workarounds. Would it be appropriate to submit future hacks there, or should I just post on the issue threads here on github? I don't want to be spamming your wiki, though at the same time one of my favorite things about this project is that it really seems like it can be developed from the inside out, organically.

Cheers.

[WardCunningham]

If you have the image drag-and-drop working then send me a pull request. Its easier for me to review if you don't put too much together in one request.

I'd like to distribute the case analysis across all the plugins that might be created with a drop. I haven't worked how this would happen. Probably drop handlers would be provided by each plugin. These would bid for the right to handle any given drop.

Note that in most browsers dragging a tab is different than dragging a url out of the location field within some tab.

Why don't you fork my ObscureWorkarounds page into a wiki of your own. Then send me the location and I'll add it to sites I watch with the Activity plugin.

[rynomad]

Done and done. Interesting concept for the drop logic, waaay over my head, but good thought-food.

thanks for the heads up on tab vs url. What I've been trying to do is drag an image from some website (eg the logo from wikipedia). I tried dragging the url but of course that's just another unexpected item. though that point did help me wrap my head around the federated link workaround, so thanks!

I followed your advice and forked ObscureWorkarounds, but it'll be a minute before I can send you a location; my setup is a bit of a hack running off my laptop. I'll be in touch once I get my dedicated server/DynDNS all squared away.

[WardCunningham]

Yes, we don't yet handle image drags from the browser. I drag images from the browser to the desktop and then from the desktop to wiki. While on the desktop I usually tweak them up a little too. Its a compulsion.