Images are 1st class citizens of TXP

gomedia · 2010-07-18 20:55:34

Gocom wrote:

If you set only one dimension, the browser will scale the image accordingly in correct aspect ratio.

Maybe, but if HTML <img width="x" height="y" /> is the same as <img height="y" /> then what’s the point of <txp:image width="0" />?

Are we making things too complicated? Why not have a TXP image attribute dimensions="0" and let the user use CSS to manipulate width/height?

Bloke · 2010-07-18 21:38:03

gomedia wrote:

if HTML <img width="x" height="y" /> is the same as <img height="y" />

It’s not… is it? <img width="x" height="y" /> means your image will appear x wide and y high. <img height="y" /> means your image will appear y high and take on the x dimension as stored in the database, potentially stretching/squashing the image. Adding width="0" means use ‘whatever x is necessary to avoid aspect ratio distortion’.

I can see a use for this if, say, you’ve uploaded a bunch of images and want to show a gallery via <txp:image_list />. You could fix the size of the images on the screen so when they view as a grid they are all nice and identical but that might distort some of them more than we cared — especially if they were a mix of portrait and landscape. Conversely, letting them be of any size at all might mean visual problems (especially if you have multiple people uploading pics and don’t want to impose too many restrictions). So perhaps you as designer might like to always ensure visitors see 4 images in each row of the grid. So you set width="100" height="0", your grid takes up 400 px (+padding/margin) but all images will retain their aspect ratio and be less distorted.

I think part of the reason I decided on a single size attribute in the first place over separate width and height was convenience; though the two outcomes are identical in terms of rendered markup, size="0" (a.k.a. dimensions="0") really did mean “shut up and let me do all the sizing myself”. With separate width and height you really do need to specify both (even if they are both 0) for any reasonable non-distorted output.

Being able to control image size through CSS is great if you want to use ems or %: I dunno as I’ve never done it. On the pixel front, what’s the difference between:

<txp:image class="pic" width="600" height="800" />

and

<txp:image class="pic" width="0" height="0" />
<style type="text/css">
.pic {
   width:600px;
   height:800px;
}
</style>

besides a lot more bytes to download? At least being able to specify your own width and height inline means you’re not forced to size them entirely with CSS or entirely from the database: you can mix and match whatever suits the application.

Last edited by Bloke (2010-07-18 21:40:19)

gomedia · 2010-07-18 21:52:01

Bloke wrote:

It’s not… is it? <img width="x" height="y" /> means your image will appear x wide and y high. <img height="y" /> means your image will appear y high and take on the x dimension as stored in the database, potentially stretching/squashing the image.

Er, I’m talking about rendered HTML code here – <img width="x" height="y" /> – so TXP & the database has already done its thing.

I can see a use for this if, say, you’ve uploaded a bunch of images and want to show a gallery via <txp:image_list />. You could fix the size of the images on the screen so when they view as a grid they are all nice and identical but that might distort some of them more than we cared — especially if they were a mix of portrait and landscape. Conversely, letting them be of any size at all might mean visual problems (especially if you have multiple people uploading pics and don’t want to impose too many restrictions). So perhaps you as designer might like to always ensure visitors see 4 images in each row of the grid. So you set width="100" height="0", your grid takes up 400 px (+padding/margin) but all images will retain their aspect ratio and be less distorted.

I’ve never done a gallery, so I’m happy to defer to your wisdom on this.

… “shut up and let me do all the sizing myself” …

That’s the goldfish I want!

uli · 2010-07-18 22:11:56

Bloke wrote:

Or have I got it wrong again?

No, this time it was me. At least a tad. (But then again the post with the tag’s terminology has vanished.)

What I actually mean: will users remember to use the zero for dimensions off or omit dimensions?
You’re right, auto is misleading. But I don’t care how you name it, for my part height="off" or height="omit" would be pretty memorable and unequivocally, but I’m afraid very few people will remember using the 0 in a place where the use of other numerals has a completely different meaning. They rather will take it literally and useit for obtaining zero-height images.

Bloke · 2010-07-18 22:42:22

gomedia wrote:

Er, I’m talking about rendered HTML code here – <img width="x" height="y" /> – so TXP & the database has already done its thing.

Right, gotcha. I see what you’re getting at. I’ll probably have to test this more thoroughly as I may be talking gibberish but my understanding was that if the <img> tag had a width and a height the browser displayed the image at those exact dimensions: if they happen to coincide with the dimensions of the actual image then it’s displayed pixel-perfect; otherwise it’s scaled / squashed / stretched to meet your demands.

If, however, only one of the dimensions is present in the <img> tag, the other is calculated by the browser to maintain aspect ratio. Here’s my reference test: upload a landscape picture of about 600 × 800px, create an article and set the article image to the ID of your image, then put this in the article Body, and view the output (both on-screen and HTML source):

<txp:article_image /> <!-- TXP actual full image size (TXP outputs width and height) -->
<txp:article_image width="0" height="0" /> <!-- No height/width. Create your own (default: actual image size) -->
<txp:article_image width="100" height="0" /> <!-- Fixed width: browser-controlled (or your own custom) height  -->
<txp:article_image width="0" height="100" /> <!-- Fixed height: browser-controlled (or custom) width -->
<txp:article_image width="100" /> <!-- Fixed width: TXP adds height="600" so the image is horizontally squashed -->
<txp:article_image height="100" /> <!-- Fixed height: TXP adds width="800" so the image is vertically squashed  -->
<txp:article_image width="80" height="100" /> <!-- Browser forced to render the image at these reduced dimensions -->

That gives a variety of different effects that I think make sense. If anyone disagrees let’s iron out the expected behaviour now.

uli wrote:

very few people will remember using the 0 in a place where the use of other numerals has a completely different meaning

Maybe. I was just trying to build some flexibility into it without introducing magic numbers that are more things people would have to remember. In TXP the convention is:

0=off
unset=default behaviour

and I figured that it was safe to use 0 in this context simply because I can’t see any reason for someone to go to the trouble of writing an image tag that didn’t display an image (i.e. willfully display an invisible image). Perhaps I’ve missed a use case somewhere…?

Gocom · 2010-07-18 23:29:17

Please, don’t change the 0 (false) to anything else. Every attribute in every tag should use same value for false. And as 0 is the standard used across programming languages, then it’s the best choise no matter what the attribute does.

Using yet different value makes it extremely hard to remember the values. And as a extra bonus, using 0 makes TXP source code smaller by couple bits than doing string comparisons.

Last edited by Gocom (2010-07-18 23:35:06)

maverick · 2010-07-19 17:46:43

I think I lean to keeping 0 (false) since everything else is.

My one immediate “but” thought is that txp tags are xhtml like (and have been promoted as such over the years). xhtml is supposed to be less programming language-like and more easy-to-read English like.

(Which I seriously doubt is much help to people who don’t find English easy to read).

In that sense, “off” and “on” are more english like than “0” and “1”.

Unless I’m confused (which could easily be the case), txp image height and width and css height and width are similar, related, interact with each other, but remain different creatures.

Tthe instinctive move from a uninformed user perspective is to approach them the same — both are dealing with an image, and with height and width. Which means that the expectation is “0” and “1” would function the same. Yet “0” functions differently. For non-programming designers and non-designers making their home website, using the programming paradigm seems unexpected/slightly disconcerting to the friendly xhtml paradigm.

However, for consistency sake, to make it function differently in the case would be even more disconcerting.

Gocom · 2010-07-19 19:30:17

maverick wrote:

My one immediate “but” thought is that txp tags are xhtml like (and have been promoted as such over the years). xhtml is supposed to be less programming language-like and more easy-to-read English like.

Yes, the tags indeed use XML like syntax, but the way the tags are used are far from HTML. Closer to progamming language that use XML like syntax than markup language.

Last edited by Gocom (2010-07-19 19:40:00)

uli · 2010-07-19 20:01:56

Sorry, guys, one last attempt. But then I’m off to save the planet (or do I want a Hummer beforehand?)

Bloke wrote:

I can’t see any reason for someone to go to the trouble of writing an image tag that didn’t display an image (i.e. willfully display an invisible image). Perhaps I’ve missed a use case somewhere…?

This is not the point. It’s not the point if there really is a use case or if someone only thinks he’s re-invented an image preloader. The point is to create a user interface that is generally unambiguous:

If we leave everything as it is now, width="1" would have the meaning of “turn on the use of image size values” plus “image-width is 1px”. That’s neither unambiguous nor does it mean “turn on the use of image size values”.

And it’s not Textpattern, intermingling numerals and booleans is not Textpattern, as far as I remember there’s nothing else than booleans wherever booleans are used.
Jukka, I agree that 0 is widespread used for off and thus it’s actually clear and unambiguous. I’m just in favor of not applying it exactly at a point where other numerals are used with different meanings. Textpattern is use_width="0" (or just a simple omit_width).

Bloke · 2010-07-19 22:48:41

uli wrote:

If we leave everything as it is now, width="1" would have the meaning of “turn on the use of image size values” plus “image-width is 1px”.

I totally get where you’re coming from. And if Textbook indicated that the attribute type was boolean I’d agree 100%. But the attribute type is going to be integer and it will state something like:

width: manually specify the width= HTML attribute in the <img> tag. Omit it to use the width stored in the database, or set it to 0 to remove the attribute entirely from your markup

That’s fairly unambiguous in my book, but it can probably be improved.

as far as I remember there’s nothing else than booleans wherever booleans are used.

… except the widespread limit attribute (also of type integer). Specifying a limit of 0 doesn’t mean “show me no results” it means “show me all results” (i.e. no limit). I see the limit attribute in the same bracket as the width/height here. Why would you go to the trouble of specifying a tag to display something and then say “…but don’t get any rows from the database”? (EDIT: incidentally, a different use case from pgonly="1"!)

Hence, TXP has assigned a special meaning to the ‘0’ case. In theory, it should be limit="all" or limit="none", limit="9999" or, as Adi pointed out earlier, something like limit="-1". I guess we have to draw the line somewhere and decide which is less confusing for users:

to remember to set it to some arbitrarily defined English word, which may differ from tag to tag
to use the well-defined (if slightly programmery) semantics of 0’ to do something slightly different from its boolean counterpart when attributes are of type Integer?

As you can probably tell I’m in camp #2 but then I’m a self-confessed geek.

Last edited by Bloke (2010-07-19 22:55:24)

uli · 2010-07-19 23:26:20

I’ve self-selected adhesive across my mouth :))

Gocom · 2010-07-19 23:26:28

More aliases? Conditional to every tag? Lol. I’m not giving away my true/false & 1/0.

Bloke wrote:

… except the widespread limit attribute (also of type integer). Specifying a limit of 0 doesn’t mean “show me no results” it means “show me all results” (i.e. no limit).

Well, I personally have always read the 0 as false. Meaning that limit="0" translates into limit is false. It showing all makes sense, and I really can’t think any TXP tag that doesn’t use 0 as false.

Last edited by Gocom (2010-07-19 23:27:04)

Textpattern CMS

Textpattern CMS support forum

#85 2010-07-18 20:55:34

Re: Images are 1st class citizens of TXP

#86 2010-07-18 21:38:03

Re: Images are 1st class citizens of TXP

#87 2010-07-18 21:52:01

Re: Images are 1st class citizens of TXP

#88 2010-07-18 22:11:56

Re: Images are 1st class citizens of TXP

#89 2010-07-18 22:42:22

Re: Images are 1st class citizens of TXP

#90 2010-07-18 23:29:17

Re: Images are 1st class citizens of TXP

#91 2010-07-19 17:46:43

Re: Images are 1st class citizens of TXP

#92 2010-07-19 19:30:17

Re: Images are 1st class citizens of TXP

#93 2010-07-19 20:01:56

Re: Images are 1st class citizens of TXP

#94 2010-07-19 22:48:41

Re: Images are 1st class citizens of TXP

#95 2010-07-19 23:26:20

Re: Images are 1st class citizens of TXP

#96 2010-07-19 23:26:28

Re: Images are 1st class citizens of TXP

Board footer