Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Image to base64 generator (readAsDataURL)

Threw this together before realizing images was coming to 1.4.

I suppose it could still be useful for building stories or supporting StoryIncludes without the Twine UI.  I'll have to try it and see if its compatible with the new changes.
<!DOCTYPE html>
<input type="File" id="image_file" accept="image/*">
<input type="button" value="import" onclick="importImageToData()"><br><br>
<script>
function importImageToData(){
var imageFile = document.getElementById("image_file").files[0];
var formatreader = new FileReader();
formatreader.onloadend = function(e){
console.log("file Loaded");
var imageData = e.target.result;
var viewdata = document.createElement("textarea");
var img = document.createElement("img");
img.src = viewdata.value = imageData;
document.body.appendChild(img);
document.body.appendChild(document.createElement("br"));
document.body.appendChild(viewdata);
viewdata.select();
}
formatreader.readAsDataURL(imageFile);
};
</script>

Comments

  • You can use this for other media assets, not just images, right?
  • I'm sure we could.  Strip out a few things, the accept attribute, thumbnail code. and use the textarea alone.  I forgot to mention that this is probably html5 level stuff so this may not work in certain browsers.

    I'm thinking about using this to embed jquery and other code-ish misc stuff.  I'm also wondering about the potential for use in obfuscation.
  • Hank wrote:

    I'm sure we could.  Strip out a few things, the accept attribute, thumbnail code. and use the textarea alone.  I forgot to mention that this is probably html5 level stuff so this may not work in certain browsers.


    This is really cool, but yeah, support is kind of limited right now.

    Hank wrote:

    I'm thinking about using this to embed jquery and other code-ish misc stuff.  I'm also wondering about the potential for use in obfuscation.


    Oh, definitely.  Minimize your "defrost" function and introduce some very basic encryption.  Even though it would be easy to break, the results would just be html and minified JavaScript.

    EDIT: Eep.  Sorry for the necro x.x
Sign In or Register to comment.