Add support for Binary upload (reference to #68)

[abozas]

Hi, Looking for binary upload in base64 in JSON Editor, I checked the following issue : https://github.com/jdorn/json-editor/issues/68

Still, in the last distribution, I did not see a reference about media binaryEncoding in base64.

I tried the following code in demo page : http://rawgit.com/jdorn/json-editor/master/demo.html

{
    "title": "Article Illustration (small)",
    "type": "string",
    "media": {
        "binaryEncoding": "base64",
        "type": "image/png"
    }
}

But no file selection seems to appear. Is that normal or did I miss anything ?

Thanks in advance for your answers,

Alex

[jdorn]

An image upload editor was never implemented. After starting on #68, I realized that the image uploader would take a lot longer than the other parts of the issue, so I just did the rest of the stuff and closed it.

I still want to add and image uploader in the future, but I'm not sure when I'll have time to implement it. MDN has a relevant example that makes it seem not that bad. https://developer.mozilla.org/en-US/docs/Web/API/FileReader.readAsDataURL

[jdorn]

I just implemented a file upload editor, so this should work now. The value will be the entire data URI and not just the base64 part.

[abraae]

This works well for us except for one thing - we need the file name as well as the data. Could you suggest the most elegant/correct way to achieve that? We are happy to do quite a bit of work ourselves to make it happen, just not sure exactly how we should be doing it.

For example one option might be:

• define an new format (for type=string) of "fileNamePlusData"
• create a new file upload editor editor that packs the file name + base64 data into the field

[jdorn]

The easiest way to implement this would be to add a include_filename option to the existing file upload editor. When the flag is set, instead of storing just the data URI, prepend the filename first. So, you would store something like this:

my-filename.png:data:image/png;base64,[...]

The only problem is this is a non-standard format, so you'll have to manually split the filename and data URI before using.

If you get this working and submit a pull request, I'll merge it into master.

[abraae]

great, so just to clarify that would be like this?

{
    "title": "Article Illustration (small)",
    "type": "string",
    "media": {
        "binaryEncoding": "base64",
        "type": "image/png",
        "include_filename": true
    }
}

It'll be a little while before someone works on this but we'll submit a pull request once we're done.

[jdorn]

I would put it in "options" instead of "media". I try to keep all non-standard keywords in "options" so the rest of it is valid JSON Schema.

{
    "title": "Article Illustration (small)",
    "type": "string",
    "media": {
        "binaryEncoding": "base64",
        "type": "image/png"
    },
    "options": {
        "include_filename": true
    }
}
``

[blurymind]

was this option ever added?