What's the purpose of this Javascript variable? - javascript

What does this do, and why is it declared this way?
var shroom = 'data:image/gif;base64,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%3D%3D';

It represents a GIF image encoded in base 64.

http://en.wikipedia.org/wiki/Data_URI_scheme

It's a Data URI, which is a file encoded in a URL. More info can be found on wikipedia. Here's an online tool used to create them:
http://software.hixie.ch/utilities/cgi/data/data
I believe IE doesn't have total support for Data URIs, so they're not too commonly used. If IE did, though, they'd be great for icons and small graphics embedded right into style sheets.

Here is a link to encode base 64 with Javascript
Base 64 with Javascript

Related

storing images in xml file

I am new to XML. I have an XML document that I am inserting data manually. I wanted to know if it is possible to include an image in an XML file and not by using the file path. I have found something about encoding but I do not understand how this work and the option is not even available in the XML editor. After storing the images in the XML file, I will access it using javascript. Please provide further information on this matter.
An image is binary data, and the usual way to store binary data in an XML document is by encoding it in base64 (which turns it into ASCII characters). Libraries to convert from binary to base64, and back, are widely available, but the details depend very much on your programming environment. There are also online services where you can upload an image and get back its base64 representation: an example is here https://www.base64encode.net/base64-image-encoder

Office js Custom XML

I am trying to implement Custom XML parts feature in Office js.
While creating custom XML part in Excel, I am getting a GeneralException
while adding the XML part in workbook.
I am fetching data from excel having 5000 rows and 4 columns.
I am encoding the data using Base64 encoding and storing the data in a XML tag in the following format -
My encoded data.
Are there any size limitation while adding a custom XML part in the workbook ?Is there any specific behind this error?
Example:
Excel.run(function (ctx) {
var xmlObj = "<data>My encoded data.</data>";
var xmlPart = ctx.workbook.customXmlParts.add(xmlObj);
return ctx.sync();
});
Thanks for bringing this issue to our attention! I was able to repro the behavior on a blank workbook against excel.exe. It is due to a bug that we will try to fix in the nearest future. Sorry for the inconvenience. Please stay tuned for Excel updates.
There is no size limitation as such. I'd recommend the following:
Try with smaller number of rows.
Make sure the final XML is valid (you could use online validation tool to make sure there are no special characters, etc. that's giving the error). Ideally the API should tell you if the XML is invalid... but worth double-checking.
Is this happening only when you encode? Try using just regular string concatenation for the sake of testing.
Please let us know where it fails in above tests.

How can I pass binary-stream (read from a .jpg file, about 1M ) from firefox plugin to page-hosted javascript?

I'm work on a project recently, which need to pass a binary-stream from npapi plugin to javascript, I've tried following ways:
use NPN_InvokeDefault, i created a string variant which store the binary-stream, and invoke it to javascript, it failed. (i've tried to pass binary-stream read from XXX.txt file, it works!)
i tried to use NPN_NewStream, the example listed in http://www.terraluna.org/dgp/cvsweb/PluginSDK/Documentation/pi3.htm#npnnewstream workes, but the pic is loaded in a new browser tab, i don't know how to recieve it in javascript.
Is there any one have ever met similar problem before? or maybe npapi can't support such kind of data transfering?
looking forward to your suggestiongs, thanks a lot.
Unfortunately, NPAPI was never designed with this purpose in mind. There are a couple of ways you can do it, and none of them are really ideal:
You can create a javascript array and pass the data in small 1-4 byte chunks (this is really very inefficient)
You could create a webserver embedded in the plugin and request the data from there (I have done this and it can work quite well, but keep in mind that if you use this from an SSL website you'll get security warnings when the embedded webserver isn't SSL)
You can base64 encode the binary data and send it as a string.
Those are the ways I have seen it done. The reason you can't send the actual binary data directly as a string is that NPAPI requires string data to be UTF8, but if you base64 encode it then it works fine.
Sorry I can't give you a "happier" solution :-/

Can I use Javascript to split up an MP3 file into smaller MP3 files?

I am making a game using only HTML5 and Javascript. I want to take an MP3 file the user selects, and split into few second long chunks. Is it possible to do this in Javascript, and if so, how?
If you need a client side solution, but are not bound to Javascript, you may want to give Flash a try. There is many excellent solutions for editing in Flex/Actionscript. Here is one tutorial I came across after a quick google: http://scriptplayground.com/tutorials/as/Play-Sound-Samples-From-One-File-Using-ActionScript-3/
However, if you are dead set on using Javascript, try following these steps:
Check out this fiddle: http://jsfiddle.net/andrewodri/PKPD6/. It is using the HTML5 audio element to play a sound, but the interesting thing is that this data is encoded as a data URI. Whatever encoded data we throw at the source, it will be able to play.
Read up on the W3C File API specification, and especially the FileReader interface. The is support for this in Chrome and Firefox at least, although I am not too sure how comprehensive it is. You will notice that you are able to read the binary data into a data URI, which you can 1) manipulate as a string, and 2) send to the src attribute of the audio element.
This is going to be the hardest part... You can start by getting familiar with the structure of an MP3 file; ie. understanding how big the ID3 tag is and how to identify it, how big frames are and where you can chop them off, and how the file is closed. The will help you extract relevant information, but also figure out where you can start chopping. I put some references at the bottom. A lot of similar code has been created for this in Actionscript which may be a good reference.
If you have enough patience, you can do the following:
Retrieve the binary data of the uploaded file, and convert that into a data URI
Determine how big the ID3 tag is when encoded in base64 (base64 represents 6 bits with 1 character), and save that code to variable
Determine how big each audio frame is, and build an array of all the audio frames
Determine how the file is closed, and save that code into a variable
Stitch it all together however you like, with the ID3 at the front, your selected frames in the middle, and file closure code
Send it to the src attribute of the audio element
I would conclude by saying that it would be far, far easier to do this in Flash, or even to send it to the server as mentioned in other comments. But if you have the justification for doing it all in Javascript, this is definitely possible in most modern browsers.
Additional References:
http://www.html5rocks.com/en/tutorials/file/dndfiles/
http://www.mpgedit.org/mpgedit/mpeg_format/MP3Format.html
http://www.mpgedit.org/mpgedit/mpeg_format/mpeghdr.htm
http://www.aardwulf.com/tutor/base64/base64.pdf
http://en.wikibooks.org/wiki/Algorithm_Implementation/Miscellaneous/Base64

Is it possible to load image in byte array in javascript

is it possible to load an image in byte array in javascript instead of loading it to canvas?
I want to make an image editor in javascript webOS but I can't use toDataURl method of HTML 5 canvas because webOs don't support it ....
Javascript can only handle printable characters, so some binary values are invalid in Javascript. That being said, there are ways to encode or pack binary data using base64 or unicode. Unfortunately, I don't think there is a simple solution.

Categories