From 7711befae07f313bbf901f5d95fdf04c928cce5e Mon Sep 17 00:00:00 2001 From: Paulus Schoutsen Date: Thu, 14 Apr 2022 09:15:33 -0700 Subject: [PATCH] Do not load youtube iframes until interaction (#22389) --- sass/custom/_paulus.scss | 16 ++++++++++++++++ source/_includes/javascripts/scripts.html | 4 +++- source/_integrations/alexa.intent.markdown | 8 +++----- source/_integrations/nest.markdown | 8 +++----- source/_integrations/owntracks.markdown | 4 +--- source/_integrations/person.markdown | 7 ++----- source/_integrations/rtsp_to_webrtc.markdown | 4 +--- source/_integrations/somfy.markdown | 4 +--- source/_integrations/tag.markdown | 10 +++------- .../_posts/2021-12-18-ios-multi-server.markdown | 4 +--- ...-12-21-android-december-2021-release.markdown | 4 +--- source/_posts/2021-12-21-stanford-genie.markdown | 4 +--- source/_posts/2021-12-23-the-open-home.markdown | 4 +--- ...rn-university-home-energy-management.markdown | 4 +--- source/conference/index.markdown | 6 ++---- source/dashboards/index.markdown | 4 +--- source/state-of-the-open-home/index.markdown | 4 +--- 17 files changed, 42 insertions(+), 57 deletions(-) diff --git a/sass/custom/_paulus.scss b/sass/custom/_paulus.scss index 9ec2d1b859f..a538243fe0a 100644 --- a/sass/custom/_paulus.scss +++ b/sass/custom/_paulus.scss @@ -536,6 +536,22 @@ div.note { } } +lite-youtube { + position: relative; + display: block; + padding-bottom: calc(100% / (16 / 9)); + background-color: rgba(0,0,0,.1); +} + +lite-youtube::before { + content: attr(videotitle) " video placeholder"; + color: rgba(0, 0, 0, 0.82); + text-align: center; + width: 100%; + position: absolute; + padding-top: calc(45% / (16 / 9)); +} + // Responsive YouTube embeds. // https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php .videoWrapper { diff --git a/source/_includes/javascripts/scripts.html b/source/_includes/javascripts/scripts.html index b99383fe56d..92a1615098c 100644 --- a/source/_includes/javascripts/scripts.html +++ b/source/_includes/javascripts/scripts.html @@ -5,7 +5,9 @@ g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js s.parentNode.insertBefore(g,s)}(document,'script')); - + + + diff --git a/source/_integrations/alexa.intent.markdown b/source/_integrations/alexa.intent.markdown index b0f63b88bd1..0ff352b50e3 100644 --- a/source/_integrations/alexa.intent.markdown +++ b/source/_integrations/alexa.intent.markdown @@ -11,9 +11,7 @@ ha_domain: alexa The built-in Alexa integration allows you to integrate Home Assistant into Alexa/Amazon Echo. This integration will allow you to query information and call services within Home Assistant by using your voice. Home Assistant offers no built-in sentences but offers a framework for you to define your own. -
- -
+ ### Requirements @@ -29,7 +27,7 @@ The built-in Alexa integration allows you to integrate Home Assistant into Alexa - Model to add: Custom - Name: HomeAssistantIntentsSkill (or whatever you want to call this skill) - Method to host: Provision your own - + You can use this [specially sized Home Assistant logo][large-icon] as the large icon and [this one][small-icon] as the small one. ### Create Your Lambda Function @@ -78,7 +76,7 @@ Next you need to create a Lambda function. - DEBUG *(optional)*: set to *True* to log debugging messages. - LONG_LIVED_ACCESS_TOKEN *(optional, not recommended)*: you will connect your Alexa Custom skill with your Home Assistant user account in the later steps, so that you don't need to use long-lived access token here. However, the access token you got from login flow is only valid for 30 minutes. It will be hard for you to test lambda function with the access token in test data. So for your convenience, you can remove the access token from the test data, [generate a long-lived access token][generate-long-lived-access-token] to put here, then the function will fall back to reading the token from environment variables. (tips: You did not enable the security storage for your environment variables, so your token saved here is not that safe. You should only use it for debugging and testing purpose. You should remove and delete the long-lived access token after you finish the debugging.) - Save your environmental variables by clicking the `Save` button. -- Next, copy the ARN displayed at the top of the page, which is the identity of this Lambda function. +- Next, copy the ARN displayed at the top of the page, which is the identity of this Lambda function. - Go back to your Alexa skill and go to the Custom->Endpoint menu option on the left. - Paste the ARN value in the "Default Region". Note: you will not be able to do this until you have completed the step above adding the Alexa Skills Kit trigger (done in the previous step) to the AWS Lambda Function. diff --git a/source/_integrations/nest.markdown b/source/_integrations/nest.markdown index 965238a7671..2b364a2e1d6 100644 --- a/source/_integrations/nest.markdown +++ b/source/_integrations/nest.markdown @@ -46,9 +46,7 @@ The Nest Smart Device Management (SDM) API **requires a US$5 fee**. ## Video Walkthrough -
- -
+ ## Device Access Registration @@ -476,7 +474,7 @@ This feature is enabled by the following permissions: - This most likely reason is the *OAuth Consent Screen* is set to *Testing* by default which expires the token after 7 days. - Follow the steps above to set it to *Production* to resolve this and reauthorize your integration one more time to get a new token. - You may also see this as the error message *invalid_grant: Token has been expired or revoked*. -- See [Google Identity: Refresh token expiration](https://developers.google.com/identity/protocols/oauth2#expiration) for more reasons on why your token may have expired. +- See [Google Identity: Refresh token expiration](https://developers.google.com/identity/protocols/oauth2#expiration) for more reasons on why your token may have expired. {% enddetails %} @@ -504,7 +502,7 @@ This feature is enabled by the following permissions: - You can see stats about your subscriber in the [Cloud Console](https://console.cloud.google.com/cloudpubsub/subscription/list) which includes counts of messages published by your devices, and how many have been acknowledged by your Home Assistant subscriber. You can also `View Messages` to see examples of published. Many old unacknowledged messages indicate the subscriber is not receiving the messages and working properly or not connected at all. -- To aid in diagnosing subscriber problems or camera stream issues it may help to turn up verbose logging by adding some or all of these to your `configuration.yaml` depending on where you are having trouble: +- To aid in diagnosing subscriber problems or camera stream issues it may help to turn up verbose logging by adding some or all of these to your `configuration.yaml` depending on where you are having trouble: ```yaml diff --git a/source/_integrations/owntracks.markdown b/source/_integrations/owntracks.markdown index 2f20dfdb1c9..bc27f4a46d5 100644 --- a/source/_integrations/owntracks.markdown +++ b/source/_integrations/owntracks.markdown @@ -16,9 +16,7 @@ ha_integration_type: integration By default the integration will listen for incoming messages from OwnTracks via HTTP. It will also listen for MQTT messages if Home Assistant is configured to use MQTT. When a location is submitted via HTTP, Home Assistant will return all [Persons](/integrations/person/)' last known locations and they will be displayed within the OwnTracks app. -
- -
+ ## Configuration diff --git a/source/_integrations/person.markdown b/source/_integrations/person.markdown index 2273a5d9ffe..899769b8276 100644 --- a/source/_integrations/person.markdown +++ b/source/_integrations/person.markdown @@ -93,12 +93,9 @@ If you change the YAML, you can reload it by calling the `person.reload` service ### Customizing the picture for a person -You can easily upload a picture in the frontend. Simply click on a person, select or drop an image in the input field, and then crop it. - -
- -
+You can easily upload a picture in the frontend. Simply click on a person, select or drop an image in the input field, and then crop it. + You can also do this using YAML. By following the instructions on the [customizing entities](/docs/configuration/customizing-devices#entity_picture) page, you can customize the picture used for a person entity in the `customize:` section of your configuration. For example: diff --git a/source/_integrations/rtsp_to_webrtc.markdown b/source/_integrations/rtsp_to_webrtc.markdown index d5fa6e8eb2e..9789b9f05c2 100644 --- a/source/_integrations/rtsp_to_webrtc.markdown +++ b/source/_integrations/rtsp_to_webrtc.markdown @@ -18,9 +18,7 @@ The RTSPtoWebRTC integration registers with [camera integration](/integrations/c The integration configuration requires the URL to your server (e.g. `http://example.com:8083`) and will automatically discover which type of server you have. -
- -
+ {% include integrations/config_flow.md %} diff --git a/source/_integrations/somfy.markdown b/source/_integrations/somfy.markdown index 12a0c96c976..7f3a6403cfa 100644 --- a/source/_integrations/somfy.markdown +++ b/source/_integrations/somfy.markdown @@ -24,9 +24,7 @@ The Somfy integration will allow users to integrate their Somfy devices into Hom Somfy is leveraging the new account linking service. This means that to set up Somfy, you only need to go to the integrations page and click on add new integration. -
- -
+ ## Installation with own developer account diff --git a/source/_integrations/tag.markdown b/source/_integrations/tag.markdown index 3cee9598e7d..3a55e27a68e 100644 --- a/source/_integrations/tag.markdown +++ b/source/_integrations/tag.markdown @@ -25,17 +25,13 @@ To make tags accessible to anyone in your house hold, there is also a [standalon The easiest way to get started with tags is to use NFC tags ([stickers](https://amzn.to/3bQU0nN), [cards](https://amzn.to/2RlqPzM)) with the official Home Assistant mobile apps. Once you have written a card, hover it with your phone to scan it. -
- -
+
Only iPhone XS, XR and iPhone 11 or later support background NFC tag reading.
-
- -
+ ## Managing tags @@ -92,7 +88,7 @@ automation: {% endraw %} To find your scanner's device ID, open Developer tools -> Events -> Listen to events and subscribe to `tag_scanned`. -Then scan a tag on the reader and note down the `device_id` from the `data` section. +Then scan a tag on the reader and note down the `device_id` from the `data` section. ## Printing tags diff --git a/source/_posts/2021-12-18-ios-multi-server.markdown b/source/_posts/2021-12-18-ios-multi-server.markdown index 22c24c5e928..654524282aa 100644 --- a/source/_posts/2021-12-18-ios-multi-server.markdown +++ b/source/_posts/2021-12-18-ios-multi-server.markdown @@ -17,6 +17,4 @@ Today we're releasing Home Assistant companion app for iOS 2021.12. The big new At the State of the Open Home I gave a quick demo, which I have embedded below: -
- -
+ diff --git a/source/_posts/2021-12-21-android-december-2021-release.markdown b/source/_posts/2021-12-21-android-december-2021-release.markdown index 4c22fd01110..b2de7d191dc 100644 --- a/source/_posts/2021-12-21-android-december-2021-release.markdown +++ b/source/_posts/2021-12-21-android-december-2021-release.markdown @@ -97,9 +97,7 @@ Screenshot of Media Player Widget Big thank you to everyone involved. Please keep those bug reports and feature requests coming! Be sure to watch the State of the Open Home address for what to expect in 2022 and a live demo of some of the features above! -
- -
+ ## Changelog diff --git a/source/_posts/2021-12-21-stanford-genie.markdown b/source/_posts/2021-12-21-stanford-genie.markdown index b44814dd4fa..0ada07c7bd1 100644 --- a/source/_posts/2021-12-21-stanford-genie.markdown +++ b/source/_posts/2021-12-21-stanford-genie.markdown @@ -13,9 +13,7 @@ Last week we hosted the [State of the Open Home](/state-of-the-open-home/) and i Genie is an open, privacy-preserving virtual assistant by [Stanford OVAL](https://oval.cs.stanford.edu/). During the impressive demo they showed it's latest capabilities. The demos run on a Baidu speaker with custom firmware and on a Pi Zero. In both cases it connects to the Genie server running as an official Home Assistant add-on to do it's magic. -
- -
+ Genie is the successor to the Almond project. With the help of various grants and sponsors Stanford is working on making Genie ready for general use. diff --git a/source/_posts/2021-12-23-the-open-home.markdown b/source/_posts/2021-12-23-the-open-home.markdown index 410328f5388..b595e58a5cc 100644 --- a/source/_posts/2021-12-23-the-open-home.markdown +++ b/source/_posts/2021-12-23-the-open-home.markdown @@ -43,6 +43,4 @@ As we install more and more devices in our home, durability is becoming more and At the State of the Open Home, we presented our vision and how we, together with our friends from open source and academia, are working towards achieving it. -
- -
+ diff --git a/source/_posts/2021-12-28-northeastern-university-home-energy-management.markdown b/source/_posts/2021-12-28-northeastern-university-home-energy-management.markdown index 430a82408b1..c428251fdf9 100644 --- a/source/_posts/2021-12-28-northeastern-university-home-energy-management.markdown +++ b/source/_posts/2021-12-28-northeastern-university-home-energy-management.markdown @@ -13,9 +13,7 @@ Two weeks ago we hosted the [State of the Open Home](/state-of-the-open-home/). They presented about their research into lowering grid demand by reducing thermostat temperatures. They want to learn when and why a reduced temperature is too uncomfortable causing tenants to become thermally frustrated and reverting the reduction. -
- -
+ With Home Assistant we want every home to be about [privacy, choice and durability](/blog/2021/12/23/the-open-home/) and it's how we built Home Assistant. Because we believe in choice, all data in Home Assistant is accessible and one can extend or built on top of our platform. diff --git a/source/conference/index.markdown b/source/conference/index.markdown index 651b5619abe..af2f50f5868 100644 --- a/source/conference/index.markdown +++ b/source/conference/index.markdown @@ -17,13 +17,11 @@ Paulus Schoutsen, the founder of Home Assistant, will give the opening and closi After the talks, attendees will be able to join various sessions about different topics like automations, Lovelace and Q&A with Home Assistant developers. -## Watch it back +## Watching the conference The conference is over! All talks have been [published online on YouTube](https://www.youtube.com/playlist?list=PLKsVm4cWHDQDGRXnybFUOLlcDWPsroGGB) and are also embedded below: -
- -
+ ## Keynotes & Talks schedule diff --git a/source/dashboards/index.markdown b/source/dashboards/index.markdown index 63526f9f56f..4e25f8765c1 100644 --- a/source/dashboards/index.markdown +++ b/source/dashboards/index.markdown @@ -16,9 +16,7 @@ Home Assistant dashboards are a fast, customizable and powerful way for users to To start, go to the Home Assistant Overview page, click on the three dots at the top right of the screen and select 'Edit Dashboard'. Then click on the blue '+ Add Card' icon at the bottom right and select a card to add. -
- -
+ To try it yourself, check out [the demo](https://demo.home-assistant.io). diff --git a/source/state-of-the-open-home/index.markdown b/source/state-of-the-open-home/index.markdown index f48dd5cc895..11eb7e47af9 100644 --- a/source/state-of-the-open-home/index.markdown +++ b/source/state-of-the-open-home/index.markdown @@ -6,9 +6,7 @@ description: December 11, 2021 we will host the State of the Open Home. og_image: /images/state-of-the-open-home/social.png --- -
- -
+ The State of the Open Home took place on December 11, 2021. Watch the recording of the event above. The following blog posts have been published based on State of the Open Home presentations: