Getting image dimensions via API

jogle · November 30, 2009

Is there a way to get the height and width of the re sized images via the API (1.2.2)?

I'm using javascript to pull a small or medium sized image and draw it to the page, but unless I can specify how large it is, I have to wait for it to load before continuing on with my script which resizes the iframe

smugmug.images.getInfo only returns the dimensions of the original image.

devbobo · November 30, 2009

G'day James,

We don't at the moment...but it sounds like something we can add for 1.2.3 and I think it will clean up the response format nicely.

Instead of this....

<?xml version="1.0" encoding="utf-8"?>
<rsp stat="ok">
  <method>smugmug.images.getInfo</method>
  <Image id="12345" Key="nrBE6" Caption="" Date="2008-02-05 15:52:56" FileName="IMG_1234.JPG" Format="JPG" Height="2304" Hidden="0" Keywords="" LargeURL="http://fred.smugmug.com/photos/12345_nrBE6-L.jpg" LastUpdated="2008-02-05 22:16:52" Latitude="-37.819706" Longitude="145.202974" MD5Sum="b1f26944e2fa6e20e88532e471239574" MediumURL="http://fred.smugmug.com/photos/12345_nrBE6-M.jpg" OriginalURL="http://fred.smugmug.com/photos/12345_nrBE6-O.jpg" Position="1" Serial="0" Size="7457753" SmallURL="http://fred.smugmug.com/photos/12345_nrBE6-S.jpg" ThumbURL="http://fred.smugmug.com/photos/12345_nrBE6-Th.jpg" TinyURL="http://fred.smugmug.com/photos/12345_nrBE6-Ti.jpg" Watermark="0" Width="3072" X2LargeURL="http://fred.smugmug.com/photos/12345_nrBE6-X2L.jpg" X3LargeURL="http://fred.smugmug.com/photos/12345_nrBE6-X3L.jpg" XLargeURL="http://fred.smugmug.com/photos/12345_nrBE6-XL.jpg">
    <Album id="1234" Key="xCXXu" URL="http://fred.smugmug.com/gallery/1234_xCXXu#12345_nrBE6"/>
  </Image>
</rsp>

have something like this...

<?xml version="1.0" encoding="utf-8"?>
<rsp stat="ok">
  <method>smugmug.images.getInfo</method>
  <Image id="12345" Key="nrBE6" Caption="" Date="2008-02-05 15:52:56" FileName="IMG_1234.JPG" Format="JPG" Hidden="0" Keywords="" LastUpdated="2008-02-05 22:16:52" Latitude="-37.819706" Longitude="145.202974" Position="1" Serial="0" Watermark="0">
    <Album id="1234" Key="xCXXu" URL="http://fred.smugmug.com/gallery/1234_xCXXu#12345_nrBE6"/>
    <ImageSizes>
      <ImageSize Name="Tiny" Height="100" Size=".." Width="100" URL="http://fred.smugmug.com/photos/12345_nrBE6-Ti.jpg">
      <ImageSize Name="Thumb" Height="150" Size=".." Width="150" URL="http://fred.smugmug.com/photos/12345_nrBE6-Th.jpg">
      <ImageSize Name="Small" Height=".." Size= ".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-S.jpg">
      <ImageSize Name="Medium" Height=".." Size=".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-M.jpg">
      <ImageSize Name="Large" Height=".." Size=".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-L.jpg">
      <ImageSize Name="XLarge" Height=".." Size=".." Width="" URL="http://fred.smugmug.com/photos/12345_nrBE6-XL.jpg">
      <ImageSize Name="X2Large" Height=".." Size=".." Width="" URL="http://fred.smugmug.com/photos/12345_nrBE6-X2L.jpg">
      <ImageSize Name="X3Large" Height=".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-X3L.jpg">
      <ImageSize Name="Original" Height="2304" MD5="b1f26944e2fa6e20e88532e471239574" Size="7457753" Width="3072" URL="http://fred.smugmug.com/photos/12345_nrBE6-O.jpg">
    </ImageSizes>
  </Image>
</rsp>

Until that happens, giving that we always create the display sizes based on a fixed ratio for the longest side of the image....it should be pretty easy to calculate on the fly. I don't have those values easily accessible atm, I'll post in a bit.

Cheers,

David

jogle · December 1, 2009

Thanks David,

That was my thought to work out the ratio based on the longest edge. It would fall down in the case that the original is smaller then the display size but I could check for that first.

I've got a work around now that I've found I can resize the iframe each time I change the 'img src=' by using an 'img onload=' event in the same tag

Would you also add it to the method smugmug.images.getURLs? It seems like theres a bit of overlap between them and I've been thinking of switching to getURLs as it's a bit leaner.

I would find it a bit easier to parse the json response if it was a little more like this but I could work with it the way you propose if that's more like the other methods in the api

<?xml version="1.0" encoding="utf-8"?>
<rsp stat="ok">
  <method>smugmug.images.getInfo</method>
  <Image id="12345" Key="nrBE6" Caption="" Date="2008-02-05 15:52:56" FileName="IMG_1234.JPG" Format="JPG" Hidden="0" Keywords="" LastUpdated="2008-02-05 22:16:52" Latitude="-37.819706" Longitude="145.202974" Position="1" Serial="0" Watermark="0">
    <Album id="1234" Key="xCXXu" URL="http://fred.smugmug.com/gallery/1234_xCXXu#12345_nrBE6"/>
    <ImageSizes>
      <Tiny>
         <Height="100" Size=".." Width="100" URL="http://fred.smugmug.com/photos/12345_nrBE6-Ti.jpg">
      </Tiny>
      <Thumb> 
         <Height="150" Size=".." Width="150" URL="http://fred.smugmug.com/photos/12345_nrBE6-Th.jpg">
      </Thumb> 
      <Small>
         <Height=".." Size= ".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-S.jpg">
      </Small>
      <Medium> 
         <Height=".." Size=".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-M.jpg">
      </Medium> 
      <Large>
         <Height=".." Size=".." Width=".." URL="http://fred.smugmug.com/photos/12345_nrBE6-L.jpg">
      </Large>
    </ImageSizes>
  </Image>
</rsp>

devbobo · December 1, 2009

On API 1.2.2 I have an Associative parameter for JSON/PHP responses that returns the results as an associative array instead of indexed.

In this case, I would likely return it something like...

...
"ImageSizes": {
"Tiny": {"Size": "Tiny", "Height": "100", "Size": "..", "Width": "100", "URL": "http://fred.smugmug.com/photos/12345_nrBE6-Ti.jpg"},
"Thumb": {"Size": "Thumb", "Height": "150", "Size": "..", "Width": "150", "URL": "http://fred.smugmug.com/photos/12345_nrBE6-Th.jpg"},
...

And yes, this would apply to smugmug.images.getInfo, smugmug.images.get and smugmug.images.getURLs.

jogle · December 1, 2009

Thanks David, that would be excellent.

Getting image dimensions via API

Comments