Boilerplate change- Switch from using opacity and settimeout to using visibility and keyframe animation. #998

camelburrito · 2015-11-23T21:07:28Z

Switch from using opacity and settimeout
to using visibility and keyframe animation. #323
Detailed proposal can be viewed here:
https://docs.google.com/document/d/1gZFaKvcDffceJNaI3bYfuYPtYU5u2y6UhE5wBPTsJ9w

dvoytenko · 2015-11-24T16:11:26Z

src/styles.js

@@ -81,8 +82,11 @@ export function installStyles(doc, cssText, cb, opt_isRuntimeCss) {
 export function makeBodyVisible(doc) {
  let interval;
  const set = () => {
+
    if (doc.body) {
      doc.body.style.opacity = 1;


setStyle(doc.body, { opacity: 1, visibility: 'visible', animation: 'none' })

dont we want setStyles

dvoytenko · 2015-11-24T16:20:26Z

All looks great. Just few minor comments. One thing, though, please make the research/spec doc public and link it from the description of this PR.

dvoytenko · 2015-11-24T19:42:01Z

src/styles.js

@@ -82,7 +83,11 @@ export function makeBodyVisible(doc) {
  let interval;
  const set = () => {
    if (doc.body) {
-      doc.body.style.opacity = 1;
+      setStyle(doc.body, {


It should be setStyles (notice 's')

dvoytenko · 2015-11-24T19:43:22Z

LGTM once setStyles and tests are fixed.

jmadler · 2015-11-28T02:02:21Z

/cc @Meggin, @pbakaus

Will the validator be updated as well?

amphtml-team · 2015-11-28T19:00:30Z

Yes. We won't make the change public until the validator is deployed.
On Nov 27, 2015 6:02 PM, "Jordan M. Adler" notifications@github.com wrote:

/cc @Meggin https://github.com/Meggin, @pbakaus
https://github.com/pbakaus

Will the validator be updated as well?

—
Reply to this email directly or view it on GitHub
#998 (comment).

You received this message because you are subscribed to the Google Groups
"amphtml-eng-github" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to amphtml-eng-github+unsubscribe@google.com.
To post to this group, send email to amphtml-eng-github@google.com.
To view this discussion on the web visit
https://groups.google.com/a/google.com/d/msgid/amphtml-eng-github/ampproject/amphtml/pull/998/c160238038%40github.com
https://groups.google.com/a/google.com/d/msgid/amphtml-eng-github/ampproject/amphtml/pull/998/c160238038%40github.com?utm_medium=email&utm_source=footer
.

You received this message because you are subscribed to the Google Groups
"amphtml-eng" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to amphtml-eng+unsubscribe@google.com.
To post to this group, send email to amphtml-eng@google.com.
To view this discussion on the web visit
https://groups.google.com/a/google.com/d/msgid/amphtml-eng/ampproject/amphtml/pull/998/c160238038%40github.com
https://groups.google.com/a/google.com/d/msgid/amphtml-eng/ampproject/amphtml/pull/998/c160238038%40github.com?utm_medium=email&utm_source=footer
.

jmadler · 2015-11-30T16:27:54Z

You'll probably need to update the samples as well, so that they'll validate

amphtml-team · 2015-11-30T16:46:40Z

Will do
On Nov 30, 2015 8:28 AM, "Jordan M. Adler" notifications@github.com wrote:

You'll probably need to update the samples as well, so that they'll
validate

—
Reply to this email directly or view it on GitHub
#998 (comment).

You received this message because you are subscribed to the Google Groups
"amphtml-eng-github" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to amphtml-eng-github+unsubscribe@google.com.
To post to this group, send email to amphtml-eng-github@google.com.
To view this discussion on the web visit
https://groups.google.com/a/google.com/d/msgid/amphtml-eng-github/ampproject/amphtml/pull/998/c160679467%40github.com
https://groups.google.com/a/google.com/d/msgid/amphtml-eng-github/ampproject/amphtml/pull/998/c160679467%40github.com?utm_medium=email&utm_source=footer
.

You received this message because you are subscribed to the Google Groups
"amphtml-eng" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to amphtml-eng+unsubscribe@google.com.
To post to this group, send email to amphtml-eng@google.com.
To view this discussion on the web visit
https://groups.google.com/a/google.com/d/msgid/amphtml-eng/ampproject/amphtml/pull/998/c160679467%40github.com
https://groups.google.com/a/google.com/d/msgid/amphtml-eng/ampproject/amphtml/pull/998/c160679467%40github.com?utm_medium=email&utm_source=footer
.

dvoytenko · 2015-12-03T04:57:00Z

@sriramkrish85 This is ready to be merged. Right?

amphtml-team · 2015-12-03T07:01:33Z

Yes ,will have to update example files once validator is ready. Else they
will error out !
On Wed, Dec 2, 2015 at 8:57 PM Dima Voytenko notifications@github.com
wrote:

@sriramkrish85 https://github.com/sriramkrish85 This is ready to be
merged. Right?

—

Reply to this email directly or view it on GitHub
#998 (comment).

You received this message because you are subscribed to the Google Groups
"amphtml-eng-github" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to amphtml-eng-github+unsubscribe@google.com.
To post to this group, send email to amphtml-eng-github@google.com.
To view this discussion on the web visit
https://groups.google.com/a/google.com/d/msgid/amphtml-eng-github/ampproject/amphtml/pull/998/c161514138%40github.com
https://groups.google.com/a/google.com/d/msgid/amphtml-eng-github/ampproject/amphtml/pull/998/c161514138%40github.com?utm_medium=email&utm_source=footer
.

dvoytenko · 2015-12-03T07:41:43Z

Let's merge this PR. We will update examples and documentation once validator is ready.

Switch from using opacity and settimeout to using visibility and keyframe animation.

Support for Boilerplate change (Switch from using opacity and settimeout) using visibility and keyframe animation.

adactio · 2016-02-01T12:04:28Z

I'm not sure this issue should be closed as long as the documentation is still saying that the style with opacity:0 is required:

https://github.com/ampproject/amphtml
https://www.ampproject.org/docs/get_started/create/basic_markup.html

Or should another issue be opened for updating the docs?

jridgewell · 2016-02-02T17:49:59Z

@adactio: We still have #323 open until the doc updates are in.

camelburrito force-pushed the boilerplate branch from f8b0eb8 to 1ad79a1 Compare November 23, 2015 22:42

camelburrito added the NEEDS REVIEW label Nov 24, 2015

camelburrito assigned dvoytenko Nov 24, 2015

dvoytenko reviewed Nov 24, 2015
View reviewed changes

camelburrito force-pushed the boilerplate branch from 1ad79a1 to d1c7be7 Compare November 24, 2015 19:22

dvoytenko reviewed Nov 24, 2015
View reviewed changes

dvoytenko added LGTM and removed NEEDS REVIEW labels Nov 24, 2015

camelburrito force-pushed the boilerplate branch from d1c7be7 to 33dd16d Compare November 24, 2015 19:44

camelburrito force-pushed the boilerplate branch from 33dd16d to 903df8b Compare December 1, 2015 21:32

Boilerplate change-

82fc726

Switch from using opacity and settimeout to using visibility and keyframe animation.

camelburrito force-pushed the boilerplate branch from 903df8b to 82fc726 Compare December 3, 2015 22:27

camelburrito pushed a commit that referenced this pull request Dec 3, 2015

Merge pull request #998 from sriramkrish85/boilerplate

5a2457a

Support for Boilerplate change (Switch from using opacity and settimeout) using visibility and keyframe animation.

camelburrito merged commit 5a2457a into ampproject:master Dec 3, 2015

cramforce mentioned this pull request Jan 8, 2016

cdn.ampproject.org/v0.js requirement? ampproject/amp.dev#9

Closed

rudygalfi mentioned this pull request Jan 30, 2016

Change boilerplate bootstrap <style> to <script> #323

Closed

ChrisAntaki mentioned this pull request Mar 2, 2020

✨ SwG version 0.1.22.95 #27054

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Boilerplate change- Switch from using opacity and settimeout to using visibility and keyframe animation. #998

Boilerplate change- Switch from using opacity and settimeout to using visibility and keyframe animation. #998

camelburrito commented Nov 23, 2015

dvoytenko Nov 24, 2015

camelburrito Nov 24, 2015

erwinmombay Nov 24, 2015

dvoytenko commented Nov 24, 2015

dvoytenko Nov 24, 2015

dvoytenko commented Nov 24, 2015

jmadler commented Nov 28, 2015

amphtml-team commented Nov 28, 2015

jmadler commented Nov 30, 2015

amphtml-team commented Nov 30, 2015

dvoytenko commented Dec 3, 2015

amphtml-team commented Dec 3, 2015

dvoytenko commented Dec 3, 2015

adactio commented Feb 1, 2016

jridgewell commented Feb 2, 2016

Boilerplate change- Switch from using opacity and settimeout to using visibility and keyframe animation. #998

Boilerplate change- Switch from using opacity and settimeout to using visibility and keyframe animation. #998

Conversation

camelburrito commented Nov 23, 2015

dvoytenko Nov 24, 2015

Choose a reason for hiding this comment

camelburrito Nov 24, 2015

Choose a reason for hiding this comment

erwinmombay Nov 24, 2015

Choose a reason for hiding this comment

dvoytenko commented Nov 24, 2015

dvoytenko Nov 24, 2015

Choose a reason for hiding this comment

dvoytenko commented Nov 24, 2015

jmadler commented Nov 28, 2015

amphtml-team commented Nov 28, 2015

jmadler commented Nov 30, 2015

amphtml-team commented Nov 30, 2015

dvoytenko commented Dec 3, 2015

amphtml-team commented Dec 3, 2015

dvoytenko commented Dec 3, 2015

adactio commented Feb 1, 2016

jridgewell commented Feb 2, 2016