Contenttools.js image upload hook

Hello everyone,

I want to use “contenttools.js” for my project since it looks really nice and works well with what I need.
The only problem is that I want to add a hook so I can upload images into the page with kcfinder or elFinder.

The author of contenttools has a example which “fakes” the images.
Link to the code is here.

I would like to be able to have a input box there that returns the image after it is selected or get a iframe in the modal.
Hopefully somebody can help me.

Best regards,
Wouter.

http://getcontenttools.com/tutorials/handling-image-uploads has all of the js info you’ll need, they suggest using xhr2 for file upload which works like this.

input.addEventListener('change', function(event) {
  var file = input.files[0];
  if (!file) return;

  var formData = new FormData();
  formData.append('image', file, file.name);

  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/upload-image', true);
  xhr.send(formData);
});

The JS library offers you a strategy for the server, but not code. You might need to follow up in the relevant channel for the server-side technology you are using for help with that side of things.

Heej mark,

Thanks for the reply, while am at work now I was thinking about trying to use the event listener to open the dialog which kcfinder offers.

In theory if coded correct I should be able to get window open when I click on the upload button which would let me select a file from the server and pass it trough to the system.

And when saving the image file (after the upload action) I should have the url from the server correctly and be able to save it.

Kcfinder offers a javascript integration so I only need to connect those dots and I’m set to go.

Need to figure this out tomorrow so I will be back.

Best regards.

I don’t think you want to use kcfinder, follow the example that contenttools gives for the upload.
It’s the server side implementation of receiving the image, storing it and returning the url / dimensions which is the missing piece.

Had a nice conversation on Skype with the author and he was suprissed how easy it was to implement what I ectually wanted.

Here is the link to the fix.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.