Author Topic: Banner- fit while maintaining proportions  (Read 3257 times)

mrticsay

  • Newbie
  • *
  • Posts: 21
    • View Profile
Banner- fit while maintaining proportions
« on: December 13, 2007, 06:48:56 PM »
Corey,

As I continue to look at expanding my use of TD features, I've taken on working with banner sets.  I've got some great ideas for using this feature.  The "problem" I have is that I don't want to have to worry about resizing all my photos/images and or worry about the size of cell they are used in.  The current options of 1) actual size, 2) stretch to fit and 3) defined size don't work for this.

I'd like an option that maintains the proportions of the original image but displays it in its entirety within the cell size.

Thanks,
Michael

tandemrx

  • Sr. Member
  • ****
  • Posts: 347
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #1 on: December 13, 2007, 09:10:28 PM »
what would you do if the image is bigger than your screen?

I think you need to set some parameter to control - otherwise a screen cannot accomodate every size option.

Not sure though as I haven't tried banners yet.

Seems to me like it would be best to edit each image so it fits a space you are wanting it to occupy, even if that means you just add some borders to the image (so you wouldn't have to stretch it out, but it would fit in the same space as a previous image).

It shouldn't take long to make a bunch of images the same size with an image editor.

mrticsay

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #2 on: December 13, 2007, 10:00:00 PM »
what would you do if the image is bigger than your screen?

I think you need to set some parameter to control - otherwise a screen cannot accomodate every size option.

Not sure though as I haven't tried banners yet.

Seems to me like it would be best to edit each image so it fits a space you are wanting it to occupy, even if that means you just add some borders to the image (so you wouldn't have to stretch it out, but it would fit in the same space as a previous image).

It shouldn't take long to make a bunch of images the same size with an image editor.

In the <img> tag, you can specify either the width or the height and the other side is automatically adjusted to maintain the proportions.  If you specify both the height and width, then the proportions are changed.  This can be done now in TD (and browser HTML in general).

When programming this, it would be relatively easy to determine the size/proportion for the cell that the image will be displayed in as well as the proportion of the image to be displayed.  You then use that information to determine whether the width or the height will be specified and then let the system figure out the rest (as it already does).

So, why would I edit all this when the system could figure it out.  And editing would only work for that specific case.  What happens when I add something to the screen, or use things in more than one layout, or have lots of images, or change the background color, etc.

Corey Cooper

  • Administrator
  • Hero Member
  • *****
  • Posts: 6216
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #3 on: December 14, 2007, 04:30:14 PM »
The problem lies on the way the TD constructs the layout.  Cells (or the HTML that defines cells) are not set with specific sizes, but rather made to fill the screen (using things like "width=100%").  Since cells are defined this way, the cell will take up only as much room as its contents need, and then IE will decide how to stretch the various cells on the screen such that the entire page uses up the entire window size (or screen size if in full-screen mode).

If a cell is empty, it will take up no space (or possibly just a few pixels in a particular direction - frankly I'm not sure how IE decides this).  For example, start up the TD and don't load a tournament.  You'll have basically no tournament settings and the default layout.  Go to the Tournament screen and press "1" to display the main page.  Notice the bottom and the bottom-right.  The bottom is the Prizes cell, but since there are no prizes defined, there is nothing in the cell, and it takes up only a pixel or two in height.  Because it is the only item in a row, IE still lays it out with the full width of the screen.  In the bottom-right is the Chips cell, but since there are no chips defined, the cell is also empty.  Notice that it is a few pixels taller (again, not sure why it's not 0 pixels tall, or why it's taller than the Prizes cell), and it is the width of the other items that are in the same column.

When you set a banner to "Stretch" mode, it sets the banner image's height and width to 100%.  This means however tall and wide the enclosing element is.  But since the enclosing element is also set to 100% height/width, we have a catch-22.  How tall and wide should the cell/image be?  Unfortunately, IE doesn't default to at least the actual size of the image, but instead it's as if the image is 0 pixels tall and wide.  That's why if you use the Stretch mode, you must define the height and width of the cell explicitly.  I believe this is documented in the user manual.

So basically you must tell the rendering engine how tall and wide to make the images.  If you want all of your banner images to fit into a specific cell, set the cell's height and width.  Then set each of the banners to Stretch mode.

mrticsay

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #4 on: December 14, 2007, 05:08:48 PM »
The problem lies on the way the TD constructs the layout.  Cells (or the HTML that defines cells) are not set with specific sizes, but rather made to fill the screen (using things like "width=100%").  Since cells are defined this way, the cell will take up only as much room as its contents need, and then IE will decide how to stretch the various cells on the screen such that the entire page uses up the entire window size (or screen size if in full-screen mode).

If a cell is empty, it will take up no space (or possibly just a few pixels in a particular direction - frankly I'm not sure how IE decides this).  For example, start up the TD and don't load a tournament.  You'll have basically no tournament settings and the default layout.  Go to the Tournament screen and press "1" to display the main page.  Notice the bottom and the bottom-right.  The bottom is the Prizes cell, but since there are no prizes defined, there is nothing in the cell, and it takes up only a pixel or two in height.  Because it is the only item in a row, IE still lays it out with the full width of the screen.  In the bottom-right is the Chips cell, but since there are no chips defined, the cell is also empty.  Notice that it is a few pixels taller (again, not sure why it's not 0 pixels tall, or why it's taller than the Prizes cell), and it is the width of the other items that are in the same column.

When you set a banner to "Stretch" mode, it sets the banner image's height and width to 100%.  This means however tall and wide the enclosing element is.  But since the enclosing element is also set to 100% height/width, we have a catch-22.  How tall and wide should the cell/image be?  Unfortunately, IE doesn't default to at least the actual size of the image, but instead it's as if the image is 0 pixels tall and wide.  That's why if you use the Stretch mode, you must define the height and width of the cell explicitly.  I believe this is documented in the user manual.

So basically you must tell the rendering engine how tall and wide to make the images.  If you want all of your banner images to fit into a specific cell, set the cell's height and width.  Then set each of the banners to Stretch mode.


Corey,

Thanks for the deailed explanation. 

I was hoping there was a way to query a cell's size to help in determining this.  It sounds like that's not the case.

The "problem" with specifying a fixed size cell and specifying stretch is that, if the proportions of the image are different than the cell, the image gets distorted.   If all the images were the same proportion, then I could make the cell the same proportion and things would be fine.  But, I know all images will not be the same unless I edit them all.

What I'd like to do is specify one of the dimensions that I know from the fixed cell size and let the other dimension be handled by the system.  For example, I modify the <img> tag when putting a picture in a cell to specify either "width=nnn" or "height=nnn" so that it fits in the cell.  The system adjust the photo so that dimension is that size and the other dimension is adjusted to maintain the proportions.

Of note, making this work is not a high priority for me.  I thought I had a really neat thing I could do using banners, but if I have to do lots of image editing, etc., I'll just pass.  And my use would be pure "fluff", it won't change anyone's ability to play the game or follow the structure.

Thanks!

Corey Cooper

  • Administrator
  • Hero Member
  • *****
  • Posts: 6216
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #5 on: December 17, 2007, 11:13:36 AM »
I had considered this when I was writing that last response, but decided you were ultimately asking something else.  I'll look into this - shouldn't be hard.

mrticsay

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #6 on: December 18, 2007, 01:10:09 PM »
I had considered this when I was writing that last response, but decided you were ultimately asking something else.  I'll look into this - shouldn't be hard.

Don't spend a lot of time on this unless you really want to...its not a desperate need for me.

What I could "live with" and might be easier to impment is:
1) a cell is given a fixed size (so it's size can be determined
2) banner items are given the property option of somthing like "size to fit, maintain proportion"

The system would then figure out how to adjust the photo to fit either by calculating and specifying both dimension, or calculating and specifying one dimension and letting the system handle the other.

Still, I've found a limitation to my use of this.  I'd like to have a banner of alternating images displaying throughout the tourney.  However, I also use screen sets to change what is being displayed (clock & blinds constant, other data alternating).  When I do this, with each screen change, the banner gets reset to the 1st image.  I kind of expected this would happen.  If there's not a way, and probably not without a lot of effort, to have a banner display rotate through everything while also rotating through screens (its been placed on each), then I'm unlikely to use this feature.  The alternating tournament display has become more valuable/useful than anything I might do with banners.

Corey Cooper

  • Administrator
  • Hero Member
  • *****
  • Posts: 6216
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #7 on: December 18, 2007, 02:38:58 PM »
Already done.  The Banner Sets dialog now allows you to set one dimension and leave the other blank.  The resulting image will have one dimension set to the size you specified, and the other dimension sized proportionally.

I realize the issue with banner sets resetting when screens change - it has always been an issue and I've always been aware of it.  But frankly, not a lot of people use the banners, or those that do don't change the screens, so it has never received much attention (and probably won't).

mrticsay

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Banner- fit while maintaining proportions
« Reply #8 on: December 18, 2007, 05:04:37 PM »
Already done.  The Banner Sets dialog now allows you to set one dimension and leave the other blank.  The resulting image will have one dimension set to the size you specified, and the other dimension sized proportionally.

I realize the issue with banner sets resetting when screens change - it has always been an issue and I've always been aware of it.  But frankly, not a lot of people use the banners, or those that do don't change the screens, so it has never received much attention (and probably won't).

THANKS...I'll look for it in the next release and let you know.

I understand about the screen changes...I'll look for a way to use the feature outside of those changes.