W3C home > Mailing lists > Public > www-style@w3.org > June 2011

Re: [css3-images] linear-gradient keywords and angles are opposite

From: Alan Gresley <alan@css-class.com>
Date: Fri, 10 Jun 2011 06:17:21 +1000
Message-ID: <4DF12A51.4060804@css-class.com>
To: Brian Manthos <brianman@microsoft.com>
CC: Brad Kemper <brad.kemper@gmail.com>, fantasai <fantasai.lists@inkedblade.net>, Sylvain Galineau <sylvaing@microsoft.com>, "www-style@w3.org" <www-style@w3.org>
On 10/06/2011 3:33 AM, Brian Manthos wrote:
> Brad Kemper
>> [mailto:brad.kemper@gmail.com] Sent: Thursday, June 09, 2011 10:06
>> AM To: Brian Manthos Cc: fantasai; Sylvain Galineau;

[snip since the embedding of the thread went crazy. Brian, what email 
client do you use?]

http://lists.w3.org/Archives/Public/www-style/2011Jun/0255.html

>>> If you want it to mean "coming from<keyword>" then the angles
>>> should  behave the same way.
>>
>>
>> Is there evidence that this is a major confusion point that needs
>> fixing? The issue is that you and at least a few others
>> intuitively take 'left' to mean "leftwards" instead of "from left",
>> correct?
>>
>> If this really is a big issue, we could change 'left' (etc.) to
>> 'from left' (etc.) or 'towards right' (etc.). This would be OK with
>> me, even though I'd rather not. At least that way, authors could
>> write multiple versions of the declarations to handle the syntax
>> changes between versions (as they do now, when including
>> '-webkit-gradient' and IE's 'filter' property for simple horizontal
>> or vertical gradients).
>
>
> Yes, "from<keyword>" would be better than what we have today (in
> either draft) because then angles and keywords wouldn't be opposite
> from each other.


I like the keyword being from the start of the linear-gradient. Also, 
tying angle to keywords is not really the best idea. Here is a test 
(view in Safari or Chrome 12).

http://css-class.com/test/css/3/transforms/perspective-basics.htm

Imagine if a transition or animation had this,

@keyframes foo {
     0%   { transform: rotateX(-45deg) }
     100% { transform: rotateX(-135deg) } /* rotated 90deg anticlockwise */

or this.

@keyframes bar {
     0%   { transform: rotateX(-45deg) }
     100% { transform: rotateX(225deg) } /* rotated 270deg clockwise */

Where is top or bottom?

Return to the test page and press '200' followed by 'TL' (for 
transform-origin: top left;).

Where is top or left?

See the part about orientation below.


> The cleaner fix is to just recognize that it's far simpler to
> consistently use the first parameter to specify the direction of a
> vector along the gradient line.  Angles already match this model.
> The keywords are currently backwards relative to this model.
>
> For keywords that model would map to: "left" ->  "leftwards" "right"
> ->  "rightwards" "top" ->  "topwards" "bottom" ->  "bottomwards"
>
>> From there you might decide to switch to "upwards" and "downwards".
>> You then might decide that "upwards" and "downwards" don't need
>> "wards" for clarity, since they already define direction.  If you
>> then decide to remove it for all of them you get...
> "left" = "direction of gradient is right to left" "right" =
> "direction of gradient is left to right" "up" = "direction of
> gradient is from bottom to top" "down" = "direction of gradient is
> from top to bottom"
>
> And thus, finally, the root cause of the problem is obvious:  The
> spec as currently authored decided to choose "left/right the start
> location" instead of "left/right the direction".


Having it begin at the start is correct. Please viewport this test in IE10.

http://css-class.com/test/css/bidi/kanji-test-linear-gradient-media.htm

Resize the viewport either wider or narrower than 800px. Disregarding 
the issue with how long a gradient is, does this show that left can also 
be confused with top? Also consider how much worst this is in Mongolian 
vertical writing mode. At least start never changes.


> Again, all of this leads to "use keyword to define the endpoint
> rather than the startpoint" and the spec becomes self-consistent and
> straightforward to everyone that doesn't insert "comes from" whenever
> they read a document with the word "left" or "right" in it.
>
> -Brian


Does anyone know why 0 degree is north or why 12 o,clock is also 0 
o'clock. Also why does degrees increase by going clockwise and why do 
maps have north towards the top. These conventions are thousand of years 
old and it has helped sea navigators to sail in many directions while 
not getting lost.

21st Century. I have done some animations where I have said that I have 
become lost in X, Y, Z space. What happens is that I lose my 
orientation. I don't know what is left, top, right, or bottom nor do I 
know my X, Y and Z. Through trail and error, I usually work out the 
correct orientation. Bidirection and writing-mode is simple in comparison.

Something to reflect on when thinking of navigators and why we have 
conventions.

              0
(-45deg) 9am | 3pm (45deg)
            \ | /
              X     <---- sundial in northern hemisphere

            \ | /
           - sun -  <---- at 12 o'clock midday, right (east) to left (west)
            / | \

              X     <---- sundial in southern hemisphere
            / | \
  (45deg) 9am | 3pm (-45deg)
              0



-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/
Received on Thursday, 9 June 2011 20:17:50 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:41 GMT