Wrap up

docs/architecture_components.md

@@ -1,5 +1,6 @@
 ---
 title: "Components Architecture"
+sidebar_label: "Components"
 ---
 
 Home Assistant can be extended with **components**. Each component is responsible for a specific domain within Home Assistant. Components can listen for or trigger events, offer services, and maintain states. Components are written in Python and can do all the goodness that Python has to offer. Out of the box, Home Assistant offers a bunch of [built-in components](https://www.home-assistant.io/components/).

docs/architecture_hassio.md

@@ -1,13 +1,11 @@
 ---
 title: "Hass.io Architecture"
+sidebar_label: Hass.io
 ---
 
-<p class='img'>
-  <a href='/images/hassio/architecture.png'><img src='/images/hassio/architecture.png' alt='Architecture overview of Hass.io'></a>
-  Architecture overview of Hass.io
-</p>
+<img src='/img/en/architecture/hassio.png' alt='Architecture overview of Hass.io'>
 
-### Host Control (HC)
+## Host Control (HC)
 
 This is a daemon running on the host machine that allows the supervisor to control certain aspects of the host OS:
 
@@ -15,15 +13,15 @@ This is a daemon running on the host machine that allows the supervisor to contr
  - Manage network settings
  - Local updates
 
-### Host
+## Host
 
 Our pre-build images are based on [ResinOS]. Any Linux machine can be turned into a Hass.io host by running [the installer][linux].
 
-### Supervisor
+## Supervisor
 
 The supervisor offers an API to manage the host and running the Docker containers.
 
-### Configuration panel
+## Configuration panel
 
 The configuration panel lives inside the supervisor but is accessible via the Home Assistant user interface. The configuration panel allows the user to manage the installation.
 

docs/asyncio_101.md

@@ -8,6 +8,4 @@ If you are not familiar yet with asyncio, please watch the below video. It's a g
 <iframe width="560" height="315" src="https://www.youtube.com/embed/M-UcUs7IMIM" frameborder="0" allowfullscreen></iframe>
 </div>
 
-### [Next step: Categorizing Functions &raquo;](/developers/asyncio_categorizing_functions/)
-
 [rob]: https://github.com/rob-smallshire

docs/asyncio_categorizing_functions.md

@@ -15,11 +15,8 @@ Invoking a coroutine function will return a Generator object back, but will not
 To declare a function a coroutine, import the coroutine annotation from the asyncio package and annotate your function.
 
 ```python
-import asyncio
-
-@asyncio.coroutine
-def async_look_my_coroutine(target):
-    result = yield from entity.async_turn_on()
+async def async_look_my_coroutine(target):
+    result = await entity.async_turn_on()
     if result:
         print("hello {}".format(target))
 
@@ -68,5 +65,3 @@ There is no special annotation to mark functions as part of this category and ca
 These are all the functions that did not fit in the previous categories. These functions are either thread-safe or not considered safe to be run within the event loop. These are functions that use sleep, or perform I/O.
 
 There is no special annotation necessary to be considered part of this category.
-
-### [Next step: Working with Async »](/developers/asyncio_working_with_async/)

docs/asyncio_index.md

@@ -1,5 +1,6 @@
 ---
 title: "Asynchronous Programming"
+sidebar_label: Introduction
 ---
 
 On September 29, 2016 we released [Home Assistant 0.29][0.29] as part of our bi-weekly release schedule. This release introduced a complete overhaul of the core spearheaded by [Ben Bangert][ben].
@@ -14,7 +15,5 @@ For a task to be able to suspend itself, all code that it calls has to have this
 
 The backwards compatible API works by scheduling a task from a different thread and blocking that thread until the task has been processed by the event loop.
 
-### [Next step: asyncio 101 »](/developers/asyncio_101/)
-
 [0.29]: /blog/2016/09/29/async-sleepiq-emoncms-stocks/
 [ben]: https://github.com/bbangert/

docs/asyncio_misc.md

@@ -1,15 +0,0 @@
----
-title: "Miscellaneous Async"
----
-
-## What about ‘async’ and ‘await’ syntax?
-Python 3.5 introduced new syntax to formalize the asynchronous pattern. This is however not compatible with Python 3.4. The minimum required Python version for Home Assistant is based on the Python version shipped with Debian stable, which is currently 3.5.3.
-
-For more information, Brett Cannon wrote [an excellent breakdown][brett] on 'async' and 'await' syntax and how asynchronous programming works.
-
-## Acknowledgements
-
-Huge thanks to [Ben Bangert][ben] for starting the conversion of the core to async, guiding other contributors while taking their first steps with async programming and peer reviewing this documentation.
-
-[brett]: http://www.snarky.ca/how-the-heck-does-async-await-work-in-python-3-5
-[ben]: https://github.com/bbangert/

docs/asyncio_working_with_async.md

@@ -22,10 +22,7 @@ def setup(hass, config):
 Will turn into:
 
 ```python
-import asyncio
-
-@asyncio.coroutine
-def async_setup(hass, config):
+async def async_setup(hass, config):
     # Setup your component inside of the event loop.
 ```
 
@@ -41,11 +38,8 @@ setup_platform(hass, config, add_entities, discovery_info=None):
 Will turn into:
 
 ```python
-import asyncio
-
-@asyncio.coroutine
-def async_setup_platform(hass, config, async_add_entities,
-                         discovery_info=None):
+async def async_setup_platform(hass, config, async_add_entities,
+                               discovery_info=None):
     # Setup your platform inside of the event loop
 ```
 
@@ -65,13 +59,10 @@ class MyEntity(Entity):
 Will turn into:
 
 ```python
-import asyncio
-
 class MyEntity(Entity):
-    @asyncio.coroutine
-    def async_update(self):
+    async def async_update(self):
         """Retrieve latest state."""
-        self._state = yield from async_fetch_state()
+        self._state = await async_fetch_state()
 ```
 
 Make sure that all properties defined on your entity do not result in I/O being done. All data has to be fetched inside the update method and cached on the entity. This is because these properties are read from within the event loop and thus doing I/O will result in the core of Home Assistant waiting until your I/O is done.
@@ -115,7 +106,5 @@ Use this method if the function should be called but not get priority over alrea
 | Coroutine | Schedule for execution on the event loop.
 | Other functions | Schedule for execution in the thread pool.
 
-### [Next step: Miscellaneous »](/developers/asyncio_misc/)
-
 [dev-docs]: https://dev-docs.home-assistant.io/en/master/api/core.html
 [dev-docs-async]: https://dev-docs.home-assistant.io/en/dev/api/util.html#module-homeassistant.util.async

docs/building_integrations.md

@@ -1,5 +0,0 @@
----
-title: Building Integrations
----
-
-Intro on how to build integrations.

docs/development_101.md

@@ -4,7 +4,7 @@ title: "Development 101"
 
 The goal of development 101 is to get you familiar with the basics of developing for Home Assistant. Before we start, please make sure you familiarize yourself with the [architecture](architecture_index.md).
 
-To get our code running inside Home Assistant we're going to create a custom component. The first step is to locate your config folder. You can find the path to your config folder by opening the Home Assistant frontend, click on the <img src='/images/screenshots/developer-tool-about-icon.png' alt='service developer tool icon' class="no-shadow" height="38" />. It's the path after the text "Path to configuration.yaml".
+To get our code running inside Home Assistant we're going to create a custom component. The first step is to locate your config folder. You can find the path to your config folder by opening the Home Assistant frontend, click on the <img src='/img/dev-tools/about-icon.png' alt='service developer tool icon' class="inline" width="38" />. It's the path after the text "Path to configuration.yaml".
 
 Inside your configuration directory create a new folder called `custom_components`. It might be that one already exists, that's fine too. This is the folder that Home Assistant will look at when looking for custom code.
 
@@ -41,6 +41,6 @@ After running `hass`, we should see log entries stating that `hello_world` compo
 ```
 
 <img
-  src='/images/screenshots/hello-world-state-card.png'
+  src='/img/en/frontend/hello-world-state-card.png'
   alt='State card showing that Hello World component is working as intended.'
 />

docs/development_states.md

@@ -114,7 +114,7 @@ Now, when `text:` is missing from the config, Home Assistant will alert the user
 After a start or a restart of Home Assistant the component will be visible in the frontend if the `configuration.yaml` file is up-to-date.
 
 <p class='img'>
-<img src='/images/screenshots/create-component01.png' />
+<img src='/img/en/development/create-component01.png' />
 </p>
 
 In order to expose attributes for a platform, you will need to define a property called `device_state_attributes` on the entity class, which will return a dictionary of attributes:

docs/documentation_create_page.md

@@ -1,118 +0,0 @@
----
-title: "Create a new page"
----
-
-For a platform or component page, the fastest way is to make a copy of an existing page and edit it. The [Component overview](/components/) and the [Examples section](/cookbook/) are generated automatically, so there is no need to add a link to those pages.
-
-Please honor the [Standards](/developers/documentation/standards/) we have for the documentation.
-
-If you start from scratch with a page, you need to add a header. Different sections of the documentation may need different headers.
-
-```text
----
-title: "Awesome Sensor"
-
-
-
-
-
-
-
-ha_category: Sensor
----
-
-Content...Written in markdown.
-
-{% raw %}### Linkable Header %}{% endraw
-...
-```
-
-There are [pre-definied variables](https://jekyllrb.com/docs/variables/) available but usually, it's not necessary to use them when writing documentation.
-
-A couple of points to remember:
-
-- Document the needed steps to retrieve API keys or access token for the third party service or device if needed.
-- If you're adding a new component, for the `ha_release` part of the header, just increment of the current release. If the current release is 0.37, make `ha_release` 0.38. If it's 0.30 or 0.40 please quote it with `" "`.
-- `ha_category:` is needed to list the platform or component in the appropriate category on the website.
-
-### Configuration
-
-Every platform page should contain a configuration sample. This sample must contain only the **required** variables to make it easy to copy and paste it for users into their `configuration.yaml` file.
-
-The **Configuration Variables** section must use the {% raw %}`{% configuration %} ... {% endconfiguration %}`{% endraw %} tag.
-
-{% raw %}
-```text
-{% configuration %}
-api_key:
-
-  required: true
-  type: string
-name:
-
-  required: false
-  default: The default name to use in the frontend.
-  type: string
-monitored_conditions:
-
-  required: true
-  type: list
-  keys:
-    weather:
-
-    temperature:
-
-{% endconfiguration %}
-
-```
-{% endraw %}
-
-Available keys:
-
-- **`description:`**: That the variable is about.
-- **`required:`**: If the variable is required.
-```text
-required: true            #=> Required
-required: false           #=> Optional
-required: inclusive       #=> Inclusive
-required: exclusive       #=> Exclusive
-required: any string here #=> Any string here
-```
-- **`type:`**: The type of the variable. Allowed entries: `string`, `int`, `time`, `template` or `map`. For multiple possibilities use `[string, int]`. If you use `map` then you need to define `keys:` (see the [`template` sensor](/components/sensor.template/) for an example).
-- **`default:`**: The default value for the variable.
-
-### Embedding Code
-
-You can use the [default markdown syntax](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet#code) to generate syntax highlighted code. For inline code wrap your code in {% raw %}`{% endraw %}.
-
-When you're writing code that is to be executed on the terminal, prefix it with `$`.
-
-### Templates
-
-For the [configuration templating](/topics/templating/) is [Jinja](http://jinja.pocoo.org/) used. Check the [Documentation Standards](/developers/documentation/standards/) for further details.
-
-If you are don't escape templates then they will be rendered and appear blank on the website.
-
-### HTML
-
-The direct usage of HTML is supported but not recommended. The note boxes are an exception.
-
-```html
-Hello<br>
-World
-```
-
-### Images, icons, and logos
-
-The images which are displayed on the pages are stored in various directories according to their purpose. If you want to use a logo and placed `logo:` in the file header then this image should be stored in `source/images/supported_brands`. The background must be transparent.
-
-| Type         | Location                                      |
-| :----------- |:----------------------------------------------|
-| logos        | source/images/supported_brands                |
-| blog         | source/images/blog                            |
-| screenshots  | source/images/components                      |
-
-Not everything (product, component, etc.) should have a logo. To show something for internal parts of Home Assistant we are using the [Material Design Icons](https://materialdesignicons.com/).
-
-### Linking From The Sidebar
-If you are adding a new page that requires linking from the sidebar you need to edit the `docs_navigation.html` file in `home-assistant.github.io/source/_includes/asides/docs_navigation.html`.

docs/documentation_index.md

@@ -1,33 +0,0 @@
----
-title: "Documentation Home Assistant"
----
-
-The website you are reading now is the home of Home Assistant: [https://www.home-assistant.io](/). This is the place where we provide documentation and additional details about Home Assistant for end users and developers.
-
-home-assistant.io is built using [Jekyll](http://github.com/mojombo/jekyll) and [these available dependencies](https://pages.github.com/versions/). The pages are written in [markdown](http://daringfireball.net/projects/markdown/). To add a page, you don't need to know about HTML.
-
-You can use the "**Edit this page on GitHub**" link to edit pages without creating a fork. Keep in mind that you can't upload images while working this way.
-
-For larger changes, we suggest that you clone the website repository. This way, you can review your changes locally. The process for working on the website is no different from working on Home Assistant itself. You work on your change and propose it via a pull request.
-
-To test your changes locally, you need to install **Ruby** and its dependencies (gems):
-
-- [Install Ruby](https://www.ruby-lang.org/en/documentation/installation/) if you don't have it already. Ruby version 2.3.0 or higher is required.
-- Install `bundler`, a dependency manager for Ruby: `$ gem install bundler`
-- In your home-assistant.github.io root directory, run `$ bundle` to install the gems you need.
-
-Short cut for Fedora: `$ sudo dnf -y install gcc-c++ ruby ruby-devel rubygem-bundler rubygem-json && bundle`
-
-Then you can work on the documentation:
-
-- Fork home-assistant.io [git repository](https://github.com/home-assistant/home-assistant.github.io).
-- Create/edit/update a page in the directory `source/_components/` for your platform/component.
-- Test your changes to home-assistant.io locally: run `rake preview` and navigate to [http://127.0.0.1:4000](http://127.0.0.1:4000)
-- Create a Pull Request (PR) against the **next** branch of home-assistant.github.io if your documentation is a new feature, platform, or component.
-- Create a Pull Request (PR) against the **current** branch of home-assistant.github.io if you fix stuff, create Cookbook entries, or expand existing documentation.
-
-> It could be necessary that you run `rake generate` prior to `rake preview` for the very first preview.
-
-> Site generated by `rake` is only available locally. If you are developing on a headless machine use port forwarding:
-`ssh -L 4000:localhost:4000 user_on_headless_machine@ip_of_headless_machine`
-

docs/documentation_standards.md

@@ -1,114 +0,0 @@
----
-title: "Documentation Standards"
----
-
-To ensure that the documentation for Home Assistant is consistent and easy to follow for both novice and expert users, we ask that you follow a very strict set of standards for developing the documentation.
-
-## General Documentation
-
-* The language of the documentation should be American-English.
-* Don't put two spaces after a period and avoid the "Oxford comma".
-* Be objective and not gender favoring, polarizing, race related or religion inconsiderate.
-* The case of brand names, services, protocols, components, and platforms must match its respective counterpart. e.g., "Z-Wave" **not** "Zwave", "Z-wave", "Z Wave" or "ZWave". Also, "Input Select" **not** "input select" or "Input select".
-* All headings should use the {% raw %}`%}`{% endraw tag.
-
-## Component and Platform Pages
-
-* The **Configuration Variables** section must use the {% raw %}`{% configuration %}`{% endraw %} tag.
-* Configuration variables must document the requirement status.
-* Configuration variables must document the default value, if any.
-* Configuration variables must document the accepted value types.
-  * For configuration variables that accept multiple types, separate the types with a comma (i.e. `string, int`).
-* Use YAML sequence syntax in the sample code if it is supported.
-* All examples should be formatted to be included in `configuration.yaml` unless explicitly stated.
-  * Use capital letters and `_` to indicate that the value needs to be replaced. E.g., `api_key: YOUR_API_KEY` or `api_key: REPLACE_ME`.
-  * If you know that the API key or value contains [control characters](https://en.wikipedia.org/wiki/YAML#Syntax), e.g., `#`, `[`, `?`, etc., wrap it in quotes and add a note.
-* Component and platform names should be a link to their respective documentation pages.
-
-## Templates
-
-* All examples containing Jinja2 templates should be wrapped **outside** of the code markdown with the {% raw %}`{% raw %}`{% endraw %} tag.
-* Do not use `states.switch.source.state` in templates. Instead use `states()` and `is_state()`.
-* Use double quotes (`"`) for ([more information](#single-vs-double-quotation-marks)):
-  * `friendly_name`
-  * Single-line templates:
-    * `value_template`
-    * `level_template`
-    * `icon_template`
-    * Children of `data_template`
-* Use single quotes (`'`) for ([more information](#single-vs-double-quotation-marks):
-  * Strings inside of templates:
-    * States
-    * Entity IDs
-  * `unit_of_measurement`
-* No whitespace around pipe character (`|`) for Jinja2 filters.
-* Single whitespace after Jinja2 opening delimiters ({% raw %}`{{`{% endraw %}).
-* Single whitespace before Jinja2 closing delimiters ({% raw %}`}}`{% endraw %}).
-* Do not quote values for:
-  * `device_class`
-  * `platform`
-  * `condition`
-  * `service`
-
-## Renaming Pages
-
-It can happen that a component or platform is renamed, in this case the documentation needs to be updated as well. If you rename a page, add  `redirect_from:` to the file header and let it point to the old location/name of the page. Please consider to add details, like release number or old component/platform name, to the page in a [note](/developers/documentation/create_page/#html).
-
-```text
----
-...
-
----
-```
-
-Adding a redirect also applies if you move content around in the [documentation](/docs/).
-
-## Single vs. Double Quotation Marks
-
-Use single quotes (`'`) for strings inside of a template. It is more obvious to escape a single quote when necessary (i.e. `name` is a possessive noun), because the single quotes that wrap the string are closer in position to the apostrophe inside the string. Use double quotes (`"`) outside of a template (unless it is a multi-line template, in which case outside quotes are not required).
-
-### Examples
-
-#### Double Quotes Outside, Single Quotes Inside (Valid)
-
-{% raw %}
-```yaml
-automation:
-  ...
-  action:
-    - service: notify.notify
-      data_template:
-        message: "{% if trigger.to_state.name == 'Dale\'s Bedroom' %}Someone's in your base, killing your noobs!{% else %}It's just another door.{% endif %}"
-```
-{% endraw %}
-
-#### Single Quotes Outside, Double Quotes Inside (Invalid)
-
-{% raw %}
-```yaml
-automation:
-  ...
-  action:
-    - service: notify.notify
-      data_template:
-        message: '{% if trigger.to_state.name == "Dale's Bedroom" %}Someone's in your base, killing your noobs!{% else %}It's just another door.{% endif %}'
-```
-{% endraw %}
-
-#### Multi-Line Template (Valid)
-
-{% raw %}
-```yaml
-automation:
-  ...
-  action:
-    - service: notify.notify
-      data_template:
-        message: >-
-          {% if trigger.to_state.name == 'Dale\'s Bedroom' %}
-            Someone's in your base, killing your noobs!
-          {% else %}
-            It's just another door.
-          {% endif %}
-```
-{% endraw %}

docs/external_api_rest_python.md

@@ -1,5 +1,5 @@
 ---
-title: "Python bindings for the REST API"
+title: "REST API - Python bindings"
 ---
 
 See the [developer documentation][devdocs] for a full overview of the documentation. The rest of this page will contain examples on how to use it.

docs/hassio_addon_communication.md

@@ -9,7 +9,7 @@ There are different ways for communication between add-ons inside Hass.io.
 We use an internal network that allows to communicate with every add-on, even to/from Home Assistant, by using its name or alias. Only the add-ons which run on the host network are a bit limited. These can talk with all internal add-ons by their name but all other add-on can't address these add-on by name - using an alias works for both!
 
 Name/alias are used for communication inside Hass.io.
-The name is generated using the following format: `{REPO}_{SLUG}`, e.g., `local_xy` or `3283fh_myaddon`. In this example, `{SLUG}` is defined in an add-ons `config.json`. You can use this name also as DNS name but you need replace the `_` with `-` to have a valid hostname. If an add-on is installed locally, `{REPO}` will be `local`. If the add-on is installed from a Github repository, `{REPO}` is a hashed identifier generated from the GitHub repository's URL (ex: https://github.com/xy/my_hassio_addons). See [here](https://github.com/home-assistant/hassio/blob/587047f9d648b8491dc8eef17dc6777f81938bfd/hassio/addons/utils.py#L17) to understand how this identifier is generated. Note that this identifier is required in certain service calls that use the [Hass.io add-on API](hassio-addon-api). You can view the repository identifiers for all currently installed add-ons via a GET request to the hassio API `addons` endpoint.
+The name is generated using the following format: `{REPO}_{SLUG}`, e.g., `local_xy` or `3283fh_myaddon`. In this example, `{SLUG}` is defined in an add-ons `config.json`. You can use this name also as DNS name but you need replace the `_` with `-` to have a valid hostname. If an add-on is installed locally, `{REPO}` will be `local`. If the add-on is installed from a Github repository, `{REPO}` is a hashed identifier generated from the GitHub repository's URL (ex: https://github.com/xy/my_hassio_addons). See [here](https://github.com/home-assistant/hassio/blob/587047f9d648b8491dc8eef17dc6777f81938bfd/hassio/addons/utils.py#L17) to understand how this identifier is generated. Note that this identifier is required in certain service calls that use the [Hass.io add-on API][hassio-addon-api]. You can view the repository identifiers for all currently installed add-ons via a GET request to the hassio API `addons` endpoint.
 
 Use `hassio` for communication with the internal API.
 
@@ -27,7 +27,7 @@ We have severals services for Hass.io inside Home Assistant to run tasks. To sen
 
 To enables calls to the [Hass.io API][hassio-api], add `hassio_api: true` to `config.json` and read the environment variable `HASSIO_TOKEN`. Now you can use the API over the URL: `http://hassio/`. Use the `HASSIO_TOKEN` with header `X-HASSIO-KEY`.
 
-[hass-api]: /developers/rest_api/
-[hass-websocket]: /developers/websocket_api/
+[hass-api]: https://www.home-assistant.io/developers/rest_api/
+[hass-websocket]: https://www.home-assistant.io/developers/websocket_api/
 [hassio-api]: https://github.com/home-assistant/hassio/blob/master/API.md
 [hassio-addon-api]: https://github.com/home-assistant/hassio/blob/dev/API.md#restful-for-api-addons

docs/hassio_addon_index.md

@@ -1,15 +1,16 @@
 ---
 title: "Developing an add-on"
+sidebar_label: Introduction
 ---
 
 Add-ons for Hass.io allow the user to extend the functionality around Home Assistant. This can be running an application that Home Assistant can integrate with (like an MQTT broker) or to share the configuration via Samba for easy editing from other computers. Add-ons can be configured via the Hass.io panel in Home Assistant.
 
 Under the hood, add-ons are Docker images published in [Docker Hub](https://hub.docker.com/). Developers can create [GitHub](https://github.com) repositories that contain multiple references to add-ons for easy sharing with the community.
 
-1. [Tutorial: Making your first add-on](/developers/hassio/addon_tutorial/)
-1. [Configuration](/developers/hassio/addon_config/)
-1. [Communication](/developers/hassio/addon_communication/)
-1. [Local Testing](/developers/hassio/addon_testing/)
-1. [Publishing](/developers/hassio/addon_publishing/)
-1. [Presentation](/developers/hassio/addon_presentation/)
-1. [Repositories](/developers/hassio/addon_repository/)
+1. [Tutorial: Making your first add-on](hassio_addon_tutorial.md)
+1. [Configuration](hassio_addon_config.md)
+1. [Communication](hassio_addon_communication.md)
+1. [Local Testing](hassio_addon_testing.md)
+1. [Publishing](hassio_addon_publishing.md)
+1. [Presentation](hassio_addon_presentation.md)
+1. [Repositories](hassio_addon_repository.md)

docs/hassio_addon_testing.md

@@ -25,5 +25,5 @@ Create a new folder for data and add a test _options.json_ file. After that you
 
 All stdout and stderr are redirected to the Docker logs. The logs can be fetched from the add-on page inside the Hass.io panel in Home Assistant.
 
-[Samba add-on]: /addons/samba/
-[SSH add-on]: /addons/ssh/
+[Samba add-on]: https://www.home-assistant.io/addons/samba/
+[SSH add-on]: https://www.home-assistant.io/addons/ssh/

docs/hassio_addon_tutorial.md

@@ -10,21 +10,15 @@ For Samba, once you have enabled and started it, your Hass.io instance will show
 
 If you are on macOS and the folder is not showing up automatically, go to Finder and press CMD+K then enter 'smb://hassio.local'
 
-<p class='img'>
-<img src='/images/hassio/tutorial/samba.png' />
-With Samba add-on enabled, you can browse to your Hass.io server over the local network. It will contain an addons folder to store your local add-ons.
-</p>
+![Screenshot of Windows Explorer showing a folder on the Hass.io server](/img/en/hass.io/tutorial/samba.png)
 
 For SSH, you will have to install it. Before you can start it, you will have to have a private/public key pair and store your public key in the add-on config ([see docs for more info][ssh]). Once started, you can SSH to Hass.io and store your custom add-ons in "/addons".
 
-<p class='img'>
-<img src='/images/hassio/tutorial/ssh.png' />
-Once you SSH into your Hass.io box, you have access to your add-ons in "/addons".
-</p>
+![Screenshot of Putty connected to Hass.io](/img/en/hass.io/tutorial/ssh.png)
 
 Once you have located your add-on directory, it's time to get started!
 
-[ssh]: /addons/ssh/
+[ssh]: https://www.home-assistant.io/addons/ssh/
 
 ## Step 1: The basics
 
@@ -72,28 +66,19 @@ Now comes the fun part, time to open the Hass.io UI and install and run your add
  - Go to the Hass.io panel
  - On the top right click the shopping basket to go to the add-on store.
 
-<p class='img'>
-<img src='/images/hassio/screenshots/main_panel_addon_store.png' />
-From the Hass.io main panel open the add-on store.
-</p>
+![Screenshot of the Hass.io main panel](/img/en/hass.io/screenshots/main_panel_addon_store.png)
 
  - On the top right click the refresh button
  - You should now see a new card called "Local" that lists your add-on!
 
-<p class='img'>
-<img src='/images/hassio/screenshots/local_repository.png' />
-The Hass.io add-on store will list all available local add-ons.
-</p>
+![Screenshot of the local repository card](/img/en/hass.io/screenshots/local_repository.png)
 
  - Click on your add-on to go to the add-on details page.
  - Install your add-on
  - Start your add-on
  - Refresh the logs of your add-on, you should now see "Hello world!" in your logs.
 
-<p class='img'>
-<img src='/images/hassio/tutorial/addon_hello_world_logs.png' />
-The add-on will print Hello world to the logs and then quit.
-</p>
+![Screenshot of the add-on logs](/img/en/hass.io/tutorial/addon_hello_world_logs.png)
 
 ### I don't see my add-on?!
 
@@ -154,10 +139,7 @@ Since we updated the version number in our `config.json`, Home Assistant will sh
 
 Now navigate to [http://hassio.local:8000](http://hassio.local:8000) to see our server in action!
 
-<p class='img'>
-<img src='/images/hassio/tutorial/python3-http-server.png' />
-The Python 3 server will allow you to browse the /data folder.
-</p>
+![Screenshot of the file index served by the add-on](/img/en/hass.io/tutorial/python3-http-server.png)
 
 ## Bonus: Working with add-on options
 
@@ -192,9 +174,4 @@ Change the options and schema entries in your `config.json` with the following:
 }
 ```
 
-Refresh the add-on store and re-install your add-on. You will now see the options available in the add-on config screen. When you now go back to our Python 3 server and download `options.json`, you'll see the options you set.
-
- - [Learn more about the available schema options.](/hassio/addon_config/#options--schema)
- - [See how options.json can be used inside `run.sh`](https://github.com/home-assistant/hassio-addons/blob/master/mosquitto/run.sh#L4-L6)
-
-### [Next step: Add-on config reference &raquo;](/developers/hassio/addon_config/)
+Refresh the add-on store and re-install your add-on. You will now see the options available in the add-on config screen. When you now go back to our Python 3 server and download `options.json`, you'll see the options you set. [Example of how options.json can be used inside `run.sh`](https://github.com/home-assistant/hassio-addons/blob/master/mosquitto/run.sh#L4-L6)

docs/internationalization_translation.md

@@ -21,7 +21,7 @@ Some translation strings will contain special placeholders that will be replaced
 2. Stick to [Material Design guidelines](https://material.io/guidelines/style/writing.html).
 3. Don't translate or change proper nouns like `Home Assistant`, `Hass.io` or `Hue`.
 4. For a region specific translation, keys that will be the same as the base translation should be filled with `[VOID]`. These will be replaced during our translation build process.
-5. Translations under the `state_badge` keys will be used for the notification badge display. These translations should be short enough to fit in the badge label without overflowing. This can be tested in the Home Assistant UI either by editing the label text with your browsers development tools, or by using the States <img src='/images/screenshots/developer-tool-states-icon.png' alt='' class="no-shadow" height="38" /> developer tool in the Home Assistant UI. In the UI, enter a new entity ID (`device_tracker.test`), and enter the text you want to test in state.
+5. Translations under the `state_badge` keys will be used for the notification badge display. These translations should be short enough to fit in the badge label without overflowing. This can be tested in the Home Assistant UI either by editing the label text with your browsers development tools, or by using the States <img src='/img/dev-tools/states-icon.png' alt='states dev tool icon' class="inline" width="38" /> developer tool in the Home Assistant UI. In the UI, enter a new entity ID (`device_tracker.test`), and enter the text you want to test in state.
 6. If text will be duplicated across different translation keys, make use of the Lokalise key reference feature where possible. The base translation provides examples of this underneath the `states` translations. Please see the [Lokalise key referencing](https://docs.lokalise.co/article/KO5SZWLLsy-key-referencing) documentation for more details.
 
 ## Adding a new language

docs/releasing.md

@@ -64,4 +64,4 @@ Checkout the `master` branch and run `script/release` to publish the new release
 1. Create a pull request from the release branch to `master` with the upcoming release number as the title.
 1. Merge pull request (DO NOT SQUASH!). Use `Merge pull request`.
 1. Go to [releases](https://github.com/home-assistant/home-assistant/releases), click `Draft a new release` and tag a new release on the `master` branch. "Tag version" and "Release title" are the version number (`O.x` for major version, `0.x.y` for minor and bug fix releases). Release description is the text from PR. Press "Publish release" to finish the process.
-1. [Publish](/developers/releasing/#python-package-index) the new release on PyPI.
+1. Publish the new release on PyPI.

website/i18n/en.json

@@ -5,14 +5,15 @@
     "previous": "Previous",
     "tagline": "All you need to start developing for Home Assistant",
     "architecture_components": "Components Architecture",
+    "Components": "Components",
+    "architecture_hassio": "Hass.io Architecture",
+    "Hass.io": "Hass.io",
     "architecture_index": "Architecture",
     "Introduction": "Introduction",
     "asyncio_101": "Asyncio 101",
     "asyncio_categorizing_functions": "Categorizing Functions",
-    "asyncio_misc": "Miscellaneous Async",
+    "asyncio_index": "Asynchronous Programming",
     "asyncio_working_with_async": "Working with Async",
-    "asyncio": "asyncio",
-    "building_integrations": "Building Integrations",
     "creating_component_code_review": "Checklist for creating a component",
     "creating_component_deps_and_reqs": "Requirements & Dependencies",
     "creating_component_discovery": "Component Discovery",
@@ -39,10 +40,7 @@
     "development_submitting": "Submit your work",
     "development_testing": "Testing your code",
     "development_validation": "Validate the input",
-    "documentation_create_page": "Create a new page",
-    "documentation_index": "Documentation Home Assistant",
-    "documentation_standards": "Documentation Standards",
-    "external_api_rest_python": "Python bindings for the REST API",
+    "external_api_rest_python": "REST API - Python bindings",
     "external_api_rest": "RESTful API",
     "external_api_server_sent_events": "Server-sent events",
     "external_api_websocket": "WebSocket API",
@@ -53,13 +51,12 @@
     "frontend_index": "Frontend development",
     "hassio_addon_communication": "Add-On Communication",
     "hassio_addon_config": "Add-On Configuration",
-    "hassio_addon_development": "Developing an add-on",
+    "hassio_addon_index": "Developing an add-on",
     "hassio_addon_presentation": "Presenting your add-on",
     "hassio_addon_publishing": "Publishing your add-on",
     "hassio_addon_repository": "Create an add-on repository",
     "hassio_addon_testing": "Local add-on testing",
     "hassio_addon_tutorial": "Tutorial: Making your first add-on",
-    "hassio_architecture": "Hass.io Architecture",
     "hassio_debugging": "Debugging Hass.io",
     "index": "Developers",
     "intent_conversation": "Registering sentences",
@@ -76,16 +73,14 @@
     "Architecture": "Architecture",
     "Frontend": "Frontend",
     "Backend": "Backend",
-    "External APIs": "External APIs",
     "Misc": "Misc",
-    "Intents": "Intents",
     "Development": "Development",
     "Creating Platforms": "Creating Platforms",
     "Creating Components": "Creating Components",
     "External API": "External API",
     "Internationalization": "Internationalization",
-    "Hass.io": "Hass.io",
-    "Documentation": "Documentation",
+    "Intents": "Intents",
+    "asyncio": "asyncio",
     "Maintainer docs": "Maintainer docs"
   },
   "pages-strings": {

website/pages/en/index.js

@@ -40,19 +40,16 @@ const PopularTopicsSection = ({ language }) => (
         <div style={{ display: "flex", flexDirection: "column", maxWidth: 420 }}>
           <h2>Documentation Structure</h2>
           <p>
-            <b>Architecture.</b> Discusses the architecture of the various layers that make up Home Assistant.
+            <b>Architecture.</b> Explains various layers that make up Home Assistant.
           </p>
           <p>
-            <b>Frontend.</b> Discusses how to develop the user interface of Home Assistant.
+            <b>Frontend.</b> Explains how to develop the user interface of Home Assistant.
           </p>
           <p>
-            <b>Backend.</b> Discusses how to build new integrations for Home Assistant.
+            <b>Backend.</b> Explains how to build new integrations for Home Assistant.
           </p>
           <p>
-            <b>External APIs.</b> Documentation of the various APIs to extract data from Home Assistant.
-          </p>
-          <p>
-            <b>Misc.</b> Internationalization, asyncio, Hass.io, updating documentation.
+            <b>Misc.</b> External APIs, Internationalization, asyncio, Hass.io add-ons, updating documentation.
           </p>
         </div>
 
@@ -148,128 +145,21 @@ class HomeSplash extends React.Component {
   }
 }
 
-const Block = props => (
-  <Container
-    padding={['bottom', 'top']}
-    id={props.id}
-    background={props.background}>
-    <GridBlock align={props.blockAlign} contents={props.children} layout={props.layout} />
-  </Container>
-);
-
-const Features = props => (
-  <Block layout="fourColumn" blockAlign="center">
-    {[
-      {
-        title: 'Intents',
-        content: 'Build powerful voice interactions',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'top',
-      },
-      {
-        title: 'Frontend Panels',
-        content: 'Add a custom panel to control our component or provide rich user interface.',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'top',
-      },
-      {
-        title: 'Build powerful automations',
-        content: 'Use the power of Python to built any advanced automation that you can dream off.',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'top',
-      },
-      {
-        title: 'Websocket API',
-        content: 'Use the websocket API to get instantly notified of any change.',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'top',
-      },
-    ]}
-  </Block>
-);
-
-const FeatureCallout = props => (
-  <div
-    className="productShowcaseSection paddingBottom"
-    style={{textAlign: 'center'}}>
-    <h2>Feature Callout</h2>
-    <MarkdownBlock>These are features of this project</MarkdownBlock>
-  </div>
-);
-
-const LearnHow = props => (
-  <Block background="light">
-    {[
-      {
-        content: 'Talk about learning how to use this',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'right',
-        title: 'Learn How',
-      },
-    ]}
-  </Block>
-);
-
-const TryOut = props => (
-  <Block id="try">
-    {[
-      {
-        content: 'Talk about trying this out',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'left',
-        title: 'Try it Out',
-      },
-    ]}
-  </Block>
-);
-
-const Description = props => (
-  <Block background="dark">
-    {[
-      {
-        content: 'This is another description of how this project is useful',
-        image: imgUrl('logo-responsive.svg'),
-        imageAlign: 'right',
-        title: 'Description',
-      },
-    ]}
-  </Block>
-);
-
-
-const Showcase = props => {
-  if ((siteConfig.users || []).length === 0) {
-    return null;
-  }
-  const showcase = siteConfig.users
-    .filter(user => {
-      return user.pinned;
-    })
-    .map((user, i) => {
-      return (
-        <a href={user.infoLink} key={i}>
-          <img src={user.image} alt={user.caption} title={user.caption} />
-        </a>
-      );
-    });
-
-  return (
-    <div className="productShowcaseSection paddingBottom">
-      <h2>{"Who's Using This?"}</h2>
-      <p>This project is used by all these people</p>
-      <div className="logos">{showcase}</div>
-      <div className="more-users">
-        <a className="button" href={pageUrl('users.html', props.language)}>
-          More {siteConfig.title} Users
-        </a>
-      </div>
-    </div>
-  );
-};
 
 const IntroSection = ({ language }) => (
-  <div className="introSection">
+  <div className="videoSection">
     <Container>
+      <div style={{maxWidth: 600, margin: 'auto'}}>
+        <div className="videoWrapper">
+          <iframe
+            width="560"
+            height="315"
+            src="https://www.youtube.com/embed/Cfasc9EgbMU"
+            frameborder="0"
+            allowfullscreen
+          />
+        </div>
+      </div>
     </Container>
   </div>
 )
@@ -284,12 +174,6 @@ class Index extends React.Component {
         <div className="mainContainer indexPage">
         <PopularTopicsSection language={language} />
         <IntroSection language={language} />
-        {/* <Features />
-          <FeatureCallout />
-          <LearnHow />
-          <TryOut />
-          <Description />
-          <Showcase language={language} /> */}
         </div>
       </div>
     );

website/sidebars.json

@@ -2,13 +2,8 @@
   "Architecture": {
     "Architecture": [
       "architecture_index",
-      "architecture_components"
-    ],
-    "Intents": [
-      "intent_index",
-      "intent_firing",
-      "intent_handling",
-      "intent_conversation"
+      "architecture_components",
+      "architecture_hassio"
     ]
   },
   "Extending Frontend": {
@@ -21,9 +16,6 @@
     ]
   },
   "Extending HASS": {
-    "Introduction": [
-      "building_integrations"
-    ],
     "Development": [
       "development_index",
       "development_101",
@@ -57,17 +49,15 @@
       "creating_component_states"
     ]
   },
-  "External APIs": {
+  "Misc": {
+    "Introduction": [
+      "misc"
+    ],
     "External API": [
       "external_api_rest",
       "external_api_rest_python",
       "external_api_websocket",
       "external_api_server_sent_events"
-    ]
-  },
-  "Misc": {
-    "Introduction": [
-      "misc"
     ],
     "Internationalization": [
       "internationalization_index",
@@ -75,29 +65,30 @@
       "internationalization_custom_component_localization",
       "internationalization_translation"
     ],
+    "Intents": [
+      "intent_index",
+      "intent_firing",
+      "intent_handling",
+      "intent_conversation"
+    ],
     "asyncio": [
-      "asyncio",
+      "asyncio_index",
       "asyncio_101",
       "asyncio_categorizing_functions",
-      "asyncio_misc",
       "asyncio_working_with_async"
     ],
     "Hass.io": [
-      "hassio_addon_communication",
-      "hassio_addon_config",
-      "hassio_addon_development",
-      "hassio_addon_presentation",
-      "hassio_addon_publishing",
-      "hassio_addon_repository",
-      "hassio_addon_testing",
-      "hassio_addon_tutorial",
-      "hassio_architecture",
       "hassio_debugging"
     ],
-    "Documentation": [
-      "documentation_create_page",
-      "documentation_index",
-      "documentation_standards"
+    "Hass.io": [
+      "hassio_addon_index",
+      "hassio_addon_tutorial",
+      "hassio_addon_config",
+      "hassio_addon_communication",
+      "hassio_addon_testing",
+      "hassio_addon_publishing",
+      "hassio_addon_presentation",
+      "hassio_addon_repository"
     ],
     "Maintainer docs": [
       "maintenance",

website/siteConfig.js

@@ -38,8 +38,7 @@ const siteConfig = {
   headerLinks: [
     {doc: 'architecture_index', label: 'Architecture'},
     {doc: 'frontend_index', label: 'Frontend'},
-    {doc: 'building_integrations', label: 'Backend'},
-    {doc: 'external_api_rest', label: 'External APIs'},
+    {doc: 'development_index', label: 'Backend'},
     {doc: 'misc', label: 'Misc'},
   ],
 

website/static/css/custom.css

@@ -5,10 +5,36 @@
   color: rgb(33, 33, 33) !important;
 }
 
+.videoSection {
+  padding: 20px 0;
+}
+
+.videoWrapper {
+  position: relative;
+  padding-bottom: 56.25%; /* 16:9 */
+  height: 0;
+  margin-bottom: 25px;
+  background: #000;
+
+}
+
+.videoWrapper iframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+
 .introSection {
   padding-bottom: 20px;
 }
 
+img.inline {
+  display: inline-block;
+}
+
 
 @media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
 }