Squio.blog

Tagged: ajax Toggle Comment Threads | Keyboard Shortcuts

• 

  Joe 17:33 on August 25, 2006 Permalink
  Tags: ajax, HTTP 1.1, smarter solution   

  Remotely extracting image thumbnails with Binary-Ajax 

  Now retrieving binary data through XHR is possible, I started working on a proof of concept: a remote Exif data loader.

  The idea is simple: if you have your original digicam photos online, just bulk downloaded from the camera, you only have very non-descriptive names for reference. Was that one interesting image called IMG_1234.jpg, or was that the blurry one and are you looking for IMG_2345.jpg? Your only option seems to download the whole blob, easily several MBytes per image for contemporary multi Mega Pixel camera.

  Now there is hope for a smarter solution.
  Most digicam images have embedded meta data in the Exif format, often including a nice little thumbnail.

  Wouldn’t it be nice to retrieve this embedded data over the network to preview a photo by thumbnail?

  I haven been working on this problem and have a proof of concept ready, coded as Greasemonkey user script for Firefox (1.5 and 2.0).

  From a very high level the working principle is:

  (More …)

  Tweet This Delicious Reddit This Post Stumble This Post

  Squio.blog » Binary Ajax: EXIF Thumbnail Fetcher is discussing. Toggle Comments

   
• 

  Joe 17:13 on August 24, 2006 Permalink
  Tags: ajax, Marcus Granado   

  Retrieving binary data with XMLHttpRequest, again 

  A few months ago I concluded that it is simply not possible to download binary files for Ajax purposes, at least not with Firefox (see Retrieving binary data with XMLHttpRequest).

  Last Monday, Marcus Granado posted “Downloading Binary Streams with Javascript XMLHttpRequest“, where he demonstrates that it is possible to get a binary clean stream through XMLHtttpRequest.
  It boils down to using the right Charset in with the proprietary overrideMimeType() function. Read his post to see how.

  In one word: Wow! This opens up a whole lot of new applications, for instance with Greasemonkey scripts.

  I’m glad I have been proven wrong!

  Update: this does not work for me as is…

  What happens is that all bytes above 127 (decimal) are returned as a really big value. The solution, however, appears to be very simple:

  var filestream = load_url(url);
  var c = filestream.charCodeAt(x);
  if (c > 255) c -= 63232;

  Apparently, the extra high value is not caused by extra bytes being gobbled up, but constructed on the fly. Luckily this is done in such a deterministic way.

  I’m working with javascript in a UTF-8 page context and, although I have experimented with some other character sets for the page, this made no difference. I’m using Firefox 1.5.0.6, Mac OSX right now.

  I’m really interested in other users’ experiences. Please share them via the feedback form!

  firefoxajaxXMLHttpRequestbinary

  Tweet This Delicious Reddit This Post Stumble This Post

  Joe, einar, and Squio.blog » Remotely extracting image thumbnails with Binary-Ajax are discussing. Toggle Comments

   
  • 

    einar 09:58 on December 6, 2006 Permalink

    I think you didn’t read the article to the end. The example he gives for getting the bytes shows you to do this:

    var abyte = filestream.charCodeAt(x) & 0xff;

    Which is the same as your if (c > 255) c -= 63232; but cleaner and more understandable.

  • 

    Joe 09:09 on December 7, 2006 Permalink

    @Einar – yes, you’re right. I somehow missed this, could have saved me some trouble ;-(

• 

  Joe 15:38 on July 27, 2006 Permalink
  Tags: ajax, DOM ( 2 ), Flickr ( 3 ), yahoo ( 7 )   

  Keeping up with change 

  Greasemonkey is a great tool for changing a web page, just after it has been loaded. But this does not work for all those Ajaxified web 2.0 pages, where content is loaded on the fly.

  There is a solution, though: just listen for DOM events which modify the page’s content. Keep up with the DOM changes so to say!

  Background

  In the days before Flickr was acquired by Yahoo, I made a Greasemonkey user script: Flickr – Link Original Image that inserts direct links to the original uploaded photos on top of thumbnails. This worked fine, by parsing the DOM just after page load and looking for every occurrence of photo thumbnails.

  Now, after the recent relaunch of Flickr with dynamic Ajax loading, this script fails for those dynamically inserted thumbnails. Simply because they do not exist in the DOM when the page completes loading.

  Solution

  DOM level 2 specifies a couple of Mutation events. Now I register an event handler for the relevant events and take action whenever an image gets inserted, removed or moved around.

  (More …)

  Tweet This Delicious Reddit This Post Stumble This Post

   
• 

  Joe 12:37 on April 25, 2006 Permalink
  Tags: ajax, HTTP ( 3 )   

  Retrieving binary data with XMLHttpRequest 

  Using XMLHttpRequest to fetch binary data from a HTTP source is “problematic”, as you can find with a simple websearch.

  But what exactly means “problematic” in this context?

  I gave it a try with Firefox and found out that every byte above 0x7f is translated into 0xfd. In other words: Plain old ASCII is left alone, everything above it results in a fixed value of 0xfd. Guess this has to do with the stream being interpreted as UTF-8 text…

  A hex dump of a binary range [00 .. ff], retrieved through XMLHttpRequest:

  joe$ od -t x1 -v xhrsweep.bin 
  0000000    00  01  02  03  04  05  06  07  08  09  0a  0b  0c  0d  0e  0f
  0000020    10  11  12  13  14  15  16  17  18  19  1a  1b  1c  1d  1e  1f
  0000040    20  21  22  23  24  25  26  27  28  29  2a  2b  2c  2d  2e  2f
  0000060    30  31  32  33  34  35  36  37  38  39  3a  3b  3c  3d  3e  3f
  0000100    40  41  42  43  44  45  46  47  48  49  4a  4b  4c  4d  4e  4f
  0000120    50  51  52  53  54  55  56  57  58  59  5a  5b  5c  5d  5e  5f
  0000140    60  61  62  63  64  65  66  67  68  69  6a  6b  6c  6d  6e  6f
  0000160    70  71  72  73  74  75  76  77  78  79  7a  7b  7c  7d  7e  7f
  0000200    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000220    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000240    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000260    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000300    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000320    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000340    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000360    fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd  fd
  0000400

  firefoxajaxXMLHttpRequesttest

  Tweet This Delicious Reddit This Post Stumble This Post

  Squio.blog » Retrieving binary data with XMLHttpRequest, again is discussing. Toggle Comments