First merry Christmas ;)

I am voluntarily duplicating issue http://drupal.org/node/650958 because I am struggling with having the module work and I think it is critical to get some explanations laid out to make this module further known and exposed.

I am willing to write a wiki page or some doc about it to help other people get it to work.

I think this module is a sleeper and should be much more known, helped and pushed up, it is a killer feature.
If we can have our content editors, using just a standard browser, drag and drop images and files into the text (in an editor) and have the image uploaded to a given repository associated with the node (token-node and filefield)., and the image ends up inserted into the editor and the other file types linked in the document ... WoW.
One of the last "incomprehensible" things for most "users" would be gone (I.e : "I need to upload beforehand, and then pick up the image in that box ?").

You have done an awesome job of bringing the functionality into Drupal.

This is what I did on a clean site:

- Enabled CCK-filefield and nothing else (well, administration menu too)
==> at that point and till a content with a supported cck field is created D&DU throws a warning repeatedly
- Created a new content type with a filefield, allowing unlimited repetition
- Got back to the content type and in the D&DU options I set up the filefield as drag and drop, at that point in time the outputs availiable are generic file, path to file and url to file
==> what does those settings truly means ? I can guess about path to and url to file but generic file ?

Then from a supported browser (for instance google chrome) I am able to drag and drop a file on the filefield area and have the file uploaded.

=> So basic functionality seems to work ok.

Now I enable the WYSIWYG module and associate tinyMCE with the filtered html filter.

Going back to my CCK type definition I still have the same output offered.

===> Drag and dropping on the editor frame does nothing (except put the "file:\\" url inside the editor like it does by default, but no upload and no linking)

Reading issue http://drupal.org/node/650958, I activated lightbox2
==> why is lightbox2 needed ? since it is a presentation module, or is it just to add the css tag it need to the inserted pictures ? For your information lightbox2 cause lots of trouble on many sites by the way by turning every links into "empty lightbox".... not a D&DU issue but good to know that it would be nice to NOT have to use it :)

I now have more possible outputs in the D&DU parameter box in the CCK type I created but it was of course still not working ;)

I also enable ImageCache and created a preset, and I got load of new options in the parameter box but I still could not D&D into my editor frame and get the "expected behavior".

Since the demo site is down at the moment I am not sure about that "expected behavior" though :).

It is a bit late here so, I'll go back to it with a clean head tomorrow, but I am willing to investigate and produce some working documentation if I can be helped to have that working.

Thanks a lot for your time on this module anyway and thanks for the support.

Comments

Annakan’s picture

Annakan commented

I made further tests and was able to get it working, with caveats.

I will had further informations soon, i need to do some more tests to isolate the "facts".

Annakan’s picture

Annakan commented

DndU => Drag aNd Drop Upload

PLEASE check your use one of the supported browser as indicated on the DnDU project page, you may want to avoid a browser supported through GEAR for testing because you'll then have to configure gear on the client and module site, something simple BUT another layer of complexity, always a BAD idea for testing. As of now : firefox 3.6 or a webkit browser : chrome or safari

Here is the minimal way I found of having DnDU working without wysiwig (to check you have it right)

  1. create a CCK content type or reuse one you already have
  2. add (or make sure you have) an Imagefield or Filefield (one of the supported DnDU CCK types whatever they are at the time you read this), make sure you allow the file type you want to upload
  3. Go back to the type definition (Edit type) and in the DnDU section select the above field (if you leave that section blanck DnDU is disabled
  4. DO NOT check the "Hide upload widget?" checkbox
  5. choose how you want file added though DnDU to be outputed when it make sense typically, it does in wysiwig use. When you uploaded a file you want it presented as and Icon linked to the file, a path to the file (relative to your sever installation) or an url to the file (absolute)
  6. Create a new content of this type
  7. expand if needed the field area you enable for updloading
  8. drag and drop on it a file allowed by your content type field
  9. watch the magic => the file is uploaded and added inside the field

Quirks you may want to know :

For now, when the cardinality of the DnDU widget is reached (if you for instance set the "repeat" property to the field to 1 or 2 and you already uploaded 1 or 2 files throuhg it), DnDU disable itself and so dropping a file will result in your browser interpreting it the way it does usually : display an image, open a video through the associated handler on your system, etc ...)

Annakan’s picture

Annakan commented

DndU => Drag aNd Drop Upload

PLEASE check your use one of the supported browser as indicated on the DnDU project page, you may want to avoid a browser supported through GEAR for testing because you'll then have to configure gear on the client and module site, something simple BUT another layer of complexity, always a BAD idea for testing. As of now : firefox 3.6 or a webkit browser : chrome or safari

Here is the minimal way I found of having DnDU working WITH WYSIWYG (to check you have it right)

  1. Enable the WYSIWIG(http://drupal.org/project/wysiwyg) module
  2. Configure the WYSIWIG module as per its documentation
  3. create a CCK content type or reuse one you already have
  4. add (or make sure you have) an Imagefield or Filefield (one of the supported DnDU CCK types whatever they are at the time you read this), make sure you allow the file type you want to upload
  5. Make sure you have a text area with WYSIWYG enabled : ie :either the "body" field enable or another Text field enabled WITH "filtered text" enabled in the "Text processing " section
  6. if it is the case choose "full HTML" for now as the default "input filter", to avoid your inserted image to be filtered out on display. You can, and MUST, use a more secure filter later on of course.
  7. Check you can create such content type and add an image the "regular" way and have it displayed, just to be sure you WYSIWIG configuration or input filter configuration is ok
  8. Go back to the type definition (Edit type) and in the DnDU section select the upload field (if you leave that section blanck DnDU is disabled
  9. You CAN check the "Hide upload widget?" checkbox if you want but be to test it might be better not to
  10. Choose how you want file added though DnDU to be outputted in the WYSIWYG widget : When you have uploaded a file, do you want it presented as and Icon linked to the file, a path to the file (relative to your sever installation) or an url to the file (absolute), to have it inserted as an image inside the wysiwyg widget read below
  11. Create a new content of this type
  12. drag and drop a file allowed by your content type field ON the WYSIWYG area
  13. watch the magic => the file is uploaded and added inside the field as the kind of output you choose before

Quirks you may want to know :

  • For now, when the cardinality of the DnDU widget is reached (if you for instance set the "repeat" property to the field to 1 or 2 and you already uploaded 1 or 2 files through it), DnDU disable itself and so dropping a file will result in your browser interpreting it the way it does usually : display an image, open a video through the associated handler on your system, etc ...)
  • If you remove the link from the WYSIWYG area it will NOT be removed from the upload field (and so it can man you reached the max repeat value of your field and have the behavior expected above
  • if you remove a file from you upload field the link will stay in the WYSIWYG area, being of course invalid

how to have an uploaded image inlined and displayed inside the WYSIWYG area

  1. Install and activate the IMAGECACHE(http://drupal.org/project/imagecache) module
  2. Create a new IMAGECACHE present doing whatever you want, even nothing (scale 100%)
  3. Go back to you DnDU enable, CCK type definition
  4. In the DnDU configuration area you can NOW choose and output that goes though the IMAGECACHE preset your created, with option to link to the node, the image , and such. Pick one of those
  5. create a new content of this type, or edit one
  6. Drag And Drop a image on the WYSIWYG area
  7. The image is uploaded and inserted inline inside the proper <img> tags, you can see it in the editor. And if you let the upload field visible you will see it added there also, the link in the editor point to it
deciphered’s picture

deciphered
Primary language English
Location Ballarat, Victoria, Australia
commented

Hi Annakan,

Thanks for the time you've put into this. I will give this a read over and try to determine what could be interpreted as issues to be fixed and what is instructional content. I am clearly to distanced to realize how much is involved in setting up this module, as for me I can get it working in seconds with no problems.

Once I have looked through this all I would be more than happy to work with you on making some simple foolproof instructions to be provided via the module README.txt and a doco page linked from the project page.

Cheers,
Deciphered.

Annakan’s picture

Annakan commented

No problem, I planned to come back to the instruction myself to read them again with a "cold" eye.

I like to use by beginner eyes for such things because clearly, after a while it is hard to see what can puzzle a new or even envision what kind of weird assumption one can make, believe me I had weird ones :)

No problem with helping write such a doc, would be a pleasure.

hixster’s picture

hixster commented

Hi Annakan,

Can you provide clarification on how DnDU integrates with the WYSIWYG - from your instructions in post #3 it is not clear how just by enabling a filefield to accept uploads , the image makes its way into the WYSIWYG editor. I can't see any difference in the configuration between #2 and #3?

Choose how you want file added though DnDU to be outputted in the WYSIWYG widget : When you have uploaded a file, do you want it presented as and Icon linked to the file, a path to the file (relative to your sever installation) or an url to the file (absolute), to have it inserted as an image inside the wysiwyg widget read below
Create a new content of this type
drag and drop a file allowed by your content type field ON the WYSIWYG area
watch the magic => the file is uploaded and added inside the field as the kind of output you choose before

I have set up DnDU and it works for a filefield, but dragging files into the WYSIWYG text area does nothing?