- From: CSS Meeting Bot via GitHub <sysbot+gh@w3.org>
- Date: Wed, 02 Aug 2017 15:38:44 +0000
- To: public-css-archive@w3.org
The CSS Working Group just discussed `step function parameter names`, and agreed to the following resolutions:
* `RESOLVED: Use steps() function with the <integer> being number of visible frames during the animation duration`
<details><summary>The full IRC log of that discussion</summary>
<tantek> topic: step function parameter names<br>
<tantek> TabAtkins: strong objection to anything that resembles sizing or alignment keywords<br>
<tantek> TabAtkins: they are extremely confusing<br>
<tantek> TabAtkins: we have start and end already<br>
<tantek> TabAtkins: imply dropping start or end step<br>
<tantek> TabAtkins: we should come up with two keywords that fit that model<br>
<tantek> astearns: one of the reasons I proposed both and neither<br>
<tantek> Florian: it depends what what the step is, flat or verticle<br>
<tantek> TabAtkins: flat<br>
<tantek> fantasai: vertical<br>
<tantek> s/verticle/vertical<br>
<tantek> TabAtkins: I think for most authors the intuitive model is number of values received<br>
<fantasai> ScribeNick: fantasai<br>
<fantasai> birtles: If you have say, steps(2, start)<br>
<fantasai> birtles: this is what you see as the timing function<br>
<fantasai> birtles: If you're repeating this, you just see those two values, but if you apply this to a transition, you will see the pictures before and after the timing function<br>
<fantasai> TabAtkins: The starting frame there isn't included in the value<br>
<fantasai> birtles: But as an author you're seeing all three values<br>
<fantasai> TabAtkins: if ou say I want transition to last 1s, and steps(2) and the time of the steps don't last .5s each, then it's bad<br>
<fantasai> birtles: I disagree<br>
<fantasai> birtles: We've already resolved we're sticking with steps() and the number is the number of jumps<br>
<fantasai> https://github.com/w3c/csswg-drafts/issues/1301#issuecomment-310571203<br>
<fantasai> TabAtkins: The argument from RachelNabors is that you can't accurately time a tansition or animation that during the preiod shows both the start and end value<br>
<fantasai> TabAtkins: because right now you have to, during the transition, either the starting value is not shown and you jump immediately or<br>
<fantasai> TabAtkins: During a single transition, if you want to see both start and end there, which is a use case RachelNabors brought up, you have to do some non-intuitive duration-manipulation to make it show correctly<br>
<fantasai> TabAtkins: If you want a 3-step frame-based cartoon that lasts 3s then...<br>
<fantasai> birtles: We're talking cross-purposes<br>
<fantasai> birtles: We're all agreeing that this timing function exists<br>
<fantasai> birtles: we're just talking about the syntax for it<br>
<fantasai> birtles: We went over the number of steps this morning<br>
<fantasai> birtles: and resolved on that aspect<br>
<fantasai> dino: I think we agree that there are three steps there, if we're going up a staircase, there are three steps there.<br>
<fantasai> fantasai: We're off-topic, the topic is the name of the keywords not the syntax of the function overall. That was resolved already.<br>
<fantasai> TabAtkins: I object to that<br>
<fantasai> fantasai: oesn't matter, you're off-topic<br>
<fantasai> TabAtkins: There are 4 things being shown !<br>
<fantasai> dino: 4 things shown is 3 steps<br>
<fantasai> TabAtkins: You're thinking about the wrong things.<br>
<fantasai> [rehash of arguments]<br>
<fantasai> TabAtkins: I'm representing RachelNabors, nobody else is!<br>
<fantasai> birtles: I presented the arguments on both sides, and explained why I think that the steps() syntax is the right way to go<br>
<fantasai> birtles: Didn't go with frames() for two reasons<br>
<fantasai> birtles: First is, it's less appropriate for contexts outside of looping animations<br>
<fantasai> birtles: transitions and gradients being examples<br>
<fantasai> birtles [gives more specific examples]<br>
<fantasai> birtles: The other concern was discoverability<br>
<fantasai> birtles: If you start with steps() and it's not quite right, then can't discover frames() behavior by adjusting arguments, and also need to change how you count<br>
<fantasai> birtles: or vice versa<br>
<fantasai> fremy: Your problem is that you count 3 here, what if instead we count 4, but keep it in the steps() function<br>
<fantasai> TabAtkins: If the third one was steps(4, something) and the fourth one was steps(2, somethingelse) then it's fine.<br>
<fantasai> fremy: So you don't object to using steps(), just object to using 3.<br>
<dbaron> dino: So you're counting the number of places you put your foot rather than the number of times you go up.<br>
<fantasai> TabAtkins: Want it to be number of things you see<br>
<fantasai> gregwhitworth: Rachel does say that she's fine to re-use steps().<br>
<ericwilligers> +q<br>
<fantasai> birtles: The tricky bit is that in the first two cases, which we have right now, it just so happens that the number of values you see also matches the number of jumps<br>
<fantasai> birtles: That's why that happens to be okay<br>
<fantasai> birtles: But that's only true when your'e repeating<br>
<fantasai> birtles: If you're transitioning or using animation-fill-mode, then you see more<br>
<fantasai> TabAtkins: But that's not part of the duration<br>
<fantasai> dino: Tab only cases where yo put your foot between the start and the end, doesn't care about what's before or after the start/end<br>
<fantasai> ericwilligers: If we go with wher eyou put your foot, then the bottom left would be steps(4, neither) and the bottom right would be steps(2, both)<br>
<dbaron> referring to the diagram in https://github.com/w3c/csswg-drafts/issues/1301#issuecomment-310571203<br>
<fantasai> TabAtkins: Your'e showing neither start nor end during the duration<br>
<gregwhitworth> ^ for reference - here is the comment where RachelNabors<br>
<fantasai> TabAtkins: I think it would be better to have drop-* keywords or something<br>
<gregwhitworth> ^ says that: https://github.com/w3c/csswg-drafts/issues/1301#issuecomment-299749586<br>
<fantasai> TabAtkins: but then you'd have to ...<br>
<fantasai> [mumbling in the corner]<br>
<fantasai> dbaron: I think start and end makde a lot of sense for step-start and step-end<br>
<fantasai> [but maybe less so here]<br>
<TabAtkins> TabAtkins: I agree. They are the correct start/end pairs for single steps.<br>
<fantasai> astearns: So I've heard people say they don't like the idea of having the bottom left be steps(4) and the bototm right be steps(2), but does anyone object to the idea of counting places to put your foot?<br>
<fantasai> TabAtkins: The other people talking about other interpolation stuffs also want 4 and 2<br>
<fantasai> TabAtkins: So I think they're intuitive on their own<br>
<fantasai> birtles: This is a frame based animation here<br>
<fantasai> birtles projects a demo<br>
<fantasai> birtles writes<br>
<fantasai> animation: slide 3s infinite steps(10, start)<br>
<fantasai> birtles: You see you miss frame 1<br>
<birtles> http://slides.com/birtles/browser-animation-2017/live#/3/2<br>
<fantasai> birtles: If I s/start/end, I start at 1, but don't se 10<br>
<fantasai> birtles: If I say frames(11), then I get all the 10 frames<br>
<fantasai> birtles: But to get this effect, I have to change the number<br>
<fantasai> ...<br>
<fantasai> birtles: If you're switching between the two, then you have to change the number<br>
<fantasai> dbaron: Seems like we have one solution that isn't drawing strong objections from people<br>
<fantasai> dbaron: which is to use the steps() function with two new keywords, and count the number of places you put your foot<br>
<fantasai> Bert: Referring back, if you count the number of intermediate steps, there's only 9 intermediate steps<br>
<fantasai> Bert: Some variations, you only see those 9 steps, the first and last are outside the animation itself<br>
<fantasai> [everybody picks a number to shout]<br>
<fantasai> TabAtkins: Using values 10 11 or 9 with some yet-undecided set of keywords, using steps() function name, seems to be drawing least objections.<br>
<fantasai> TabAtkins: Anyone object to that, assuming good keyword names<br>
<fantasai> dbaron: We need to find names that work with the numbers<br>
<fantasai> astearns: Any objections to this proposal?<br>
<dbaron> github: https://github.com/w3c/csswg-drafts/issues/1301<br>
<fantasai> astearns: So we'll add to this morning's resolution that we'll use steps() function with numbers that count the place where you put your foot<br>
<fantasai> astearns: I'm concerned that this will prove confusing<br>
<fantasai> Bert: If you allow 11 here, then 1 makes no sense<br>
<fantasai> Bert: then why not lower the number, and say it's the number of intermediate values<br>
<fantasai> ...<br>
<fantasai> dbaron: Bert is concerned about the allowed range of integers, which will vary depending on the keyword<br>
<dbaron> 1- for the existing keywords, and 0- and 2- for the new keywords<br>
<fantasai> RESOLVED: Use steps() function with the <integer> being number of visible frames during the animation duration<br>
<fantasai> astearns: What should the keywords be<br>
<fantasai> fantasai: If we were starting from scratch I have an ida<br>
<dbaron> fantasai: ... we'd use the same kind of: fill, start-fill, end-fill, and ... we have this concept of fill.<br>
<TabAtkins> dbaron, actually I think the "intermediates only" is also 1+, not 0+. You need to have at least one "intermediate" value to show!<br>
<TabAtkins> dbaron, so the frames() use-case is 2+, the rest are 1+.<br>
<fantasai> fill-start, fill-end, fill-between, fill-evenly<br>
<fantasai> just like alignment<br>
<dbaron> TabAtkins, actually, maybe the new ones are both 2+<br>
<fantasai> fill is time that's filled by a frame<br>
<TabAtkins> dbaron: Nah, "intermediate only" is fine to be 1 - it shows only the 50% value during the animation.<br>
<fantasai> TabAtkins: I'd be ok with 4 new keywords to make a set<br>
<fantasai> s/dbaron:/dbaron,/<br>
<fantasai> TabAtkins: rather than adding to start+end<br>
<fantasai> astearns: What if keywords were talking about where to jump<br>
<dbaron> astearns: You could have the keywords say where you jump. So you have steps(3, start), steps(3, end), steps(4, neither), or steps(2, both).<br>
<fantasai> fremy: 4th one is intermediate only, only shows intermediate only<br>
<fantasai> fremy: 3rd one includes ...<br>
<fantasai> fremy: open set and closed set<br>
<fantasai> fremy: intermediate and<br>
<fantasai> TabAtkins: intermediate is over the desired spelling level<br>
<fantasai> dino: Anyone wants 4th one?<br>
<fantasai> TabAtkins: Yes, definitely have requests for that<br>
<dbaron> Florian: _|¯<br>
<fantasai> TabAtkins: esp for gradients<br>
<Florian> steps(4, _-¯) steps(2, -)<br>
<TabAtkins> linear-gradient(red 20%, steps(5, middle-only), blue 80%) <= 5 color stripes between the red and the blue<br>
<fantasai> fantasai: So both and neither was ...? No, it's really confusing.<br>
<fantasai> TabAtkins: As dbaron was saying, the start/end keywords make sense for the step-* keywords but not so much for the steps() function<br>
<dbaron> Just as long as we don't use steps() and stairs() with two different meanings...<br>
<SimonSapin> steps("▁▃▅▆▇███")<br>
<fantasai> Florian: We do both and neither<br>
<dbaron> Tab: show-end, show-start, show-both, show-neither<br>
<fantasai> fremy: So both is show both start and end, and neither is ..<br>
<fantasai> TabAtkins: No, that's backwards<br>
<fantasai> TabAtkins: because of the way start and end are defined<br>
<fantasai> fremy: screw it, we should do it this way around anyway<br>
<fantasai> TabAtkins: that's okay if we have a prefix, like show-start or<br>
<dbaron> (insert my previous line here)<br>
<fantasai> astearns: So show-end is the same as start<br>
<birtles> steps(4, frames)? (Not sure about the fourth option)<br>
<fantasai> TabAtkins: if we do show keywords we do it this way, if we do drop kewyrods we can match start/end<br>
<fantasai> TabAtkins: But it also was pointed out that drop has some weird impliciations of dropping a frame<br>
<fantasai> TabAtkins: show-* doesn't have that problem or one of adding a frame<br>
<fantasai> dbaron: stripes? :)<br>
<dbaron> (somebody said before me that frames was for animations and the other one was for gradients)<br>
<fantasai> birtles: steps(4, frames) steps(2, stripes)<br>
<fantasai> dbaron: though they all give stripes, just a different set of stripes<br>
<fantasai> fantasai: Oh, I like that Bert. That's better than using start/end with opposite meanings<br>
<melanierichards> +1 to Bert's idea<br>
<Bert> (Putting it on the record: just thinking aloud, but how about: step(n [, show-first || show-last]?) )<br>
<fantasai> although I'd still have both keyword, because it's easier to type<br>
<dbaron> actually 0 does work as the number for the fourth option<br>
<fantasai> and also, how do you get the 4th variant?<br>
<fantasai> Rossen and Tab discuss some examples<br>
<fantasai> TabAtkins: Let's go back to thread with what we've concluded and ask for help<br>
<fantasai> astearns: maybe we should open a new issue<br>
<fantasai> astearns: OK, let's close this issue and open a new one on the new keywords<br>
<TabAtkins> Bert, can't do that one unfortunately, because the "no keyword" case (steps(3)) already means steps(3, start). :(<br>
<TabAtkins> s/steps(3, start)/steps(3, end)/<br>
<fantasai> https://github.com/w3c/csswg-drafts/issues/1609<br>
<fantasai> we could do 1609 but ppl might be fried<br>
<fantasai> sorry https://github.com/w3c/csswg-drafts/issues/951<br>
<fantasai> https://github.com/w3c/csswg-drafts/issues/951#issuecomment-316535854<br>
</details>
--
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1301#issuecomment-319710740 using your GitHub account
Received on Wednesday, 2 August 2017 15:38:45 UTC