Skip to content

Make in-view center point CSS pixel aware #1319

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Oct 19, 2018
Merged

Make in-view center point CSS pixel aware #1319

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
e66f3b2
in-view center point: drop unnecessary grouping
andreastt Oct 18, 2018
5870628
in-view center point: divide by 2.0 instead of multiply
andreastt Oct 18, 2018
a9f876d
terminology: define division
andreastt Oct 18, 2018
07cb9d7
terminology: describe min/max as functions, not shorthands
andreastt Oct 18, 2018
7674631
terminology: define mathematical function floor()
andreastt Oct 18, 2018
2467630
in-view center point: floor coordinates
andreastt Oct 18, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
54 changes: 31 additions & 23 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -708,18 +708,26 @@ <h3>Extensions</h3>
<section>
<h2>Terminology</h2>

<p>In equations, all numbers are integers,
addition is represented by “+”,
subtraction is represented by “−”,
and bitwise OR by “|”.
The characters “(” and “)” are used to provide logical grouping in these contexts.

<p>The shorthand
<dfn>min</dfn>(<var>value</var>, <var>value</var>[, <var>value</var>])
returns the smallest item of two or more values.
Conversely, the shorthand
<dfn>max</dfn>(<var>value</var>, <var>value</var>[, <var>value</var>])
returns the largest item of two or more values.
<p>
In equations, all numbers are integers,
addition is represented by “+”,
subtraction by “−”,
division by “÷”,
and bitwise OR by “|”.
The characters “(” and “)” are used to provide logical grouping in these contexts.

<p>
The mathematical function
<dfn>min</dfn>(<var>value</var>, <var>value</var>[, <var>value</var>])
returns the smallest item of two or more values.
Conversely, the function
<dfn>max</dfn>(<var>value</var>, <var>value</var>[, <var>value</var>])
returns the largest item of two or more values.

<p>
The mathematical function <dfn>floor</dfn>(<var>value</var>)
produces the largest integer, closest to positive infinity,
that is not larger than <var>value</var>.

<p>A <dfn data-lt=uuid>Universally Unique IDentifier (UUID)</dfn> is
a 128 bits long URN that requires no central registration process. [[!RFC4122]].
Expand Down Expand Up @@ -4501,28 +4509,28 @@ <h3>Element Interactability</h3>
returned by calling <a>getClientRects</a> on <a><var>element</var></a>.

<li><p>Let <var>left</var> be
(<a>max</a>(0, <a>min</a>(<a>x coordinate</a>,
<a>x coordinate</a> + <a>width dimension</a>))).
<a>max</a>(0, <a>min</a>(<a>x coordinate</a>,
<a>x coordinate</a> + <a>width dimension</a>)).

<li><p>Let <var>right</var> be
(<a>min</a>(<a>innerWidth</a>,
<a>min</a>(<a>innerWidth</a>,
<a>max</a>(<a>x coordinate</a>,
<a>x coordinate</a> + <a>width dimension</a>))).
<a>x coordinate</a> + <a>width dimension</a>)).

<li><p>Let <var>top</var> be
(<a>max</a>(0, <a>min</a>(<a>y coordinate</a>,
<a>y coordinate</a> + <a>height dimension</a>))).
<a>max</a>(0, <a>min</a>(<a>y coordinate</a>,
<a>y coordinate</a> + <a>height dimension</a>)).

<li><p>Let <var>bottom</var> be
(<a>min</a>(<a>innerHeight</a>,
<a>min</a>(<a>innerHeight</a>,
<a>max</a>(<a>y coordinate</a>,
<a>y coordinate</a> + <a>height dimension</a>))).
<a>y coordinate</a> + <a>height dimension</a>)).

<li><p>Let <var>x</var> be (0.5 × (<var>left</var> + <var>right</var>)).
<li><p>Let <var>x</var> be <a>floor</a>((<var>left</var> + <var>right</var>) ÷ 2.0).

<li><p>Let <var>y</var> be (0.5 × (<var>top</var> + <var>bottom</var>)).
<li><p>Let <var>y</var> be <a>floor</a>((<var>top</var> + <var>bottom</var>) ÷ 2.0).

<li><p>Return <var>x</var> and <var>y</var> as a pair.
<li><p>Return the pair of (<var>x</var>, <var>y</var>).
</ol>

<p>An <a>element</a> is <dfn>in view</dfn>
Expand Down