Update frontend build instructions

source/developers/frontend.markdown

@@ -39,19 +39,18 @@ $ script/setup
 
 ## {% linkable_title Development %}
 
-While you are developing, you need to have webpack running to have your JavaScript changes be made available.
+While you are developing, you need to have Rollup running to have your JavaScript changes be made available.
 
 ```bash
 $ cd homeassistant/components/frontend/www_static/home-assistant-polymer
 $ npm run js_dev
 ```
 
-The source code for the frontend can be found in two different directories:
+The source code for the frontend can be found in three different directories:
 
  - UI: `homeassistant/components/frontend/www_static/home-assistant-polymer/src/`
- - Core: `homeassistant/components/frontend/www_static/home-assistant-polymer/node_modules/home-assistant-js/src/`
+ - Core: `homeassistant/components/frontend/www_static/home-assistant-polymer/home-assistant-js/src/`
-
+ - Panels: `homeassistant/components/frontend/www_static/home-assistant-polymer/panels/`
-After your changes have been accepted into the home-assistant-js repository, you'll have to update Home Assistant Polymer to use the latest version of it. This can be done by updating `package.json`. Look for the line that contains home-assistant-js and update the SHA to the SHA of the last commit.
 
 # {% linkable_title Building the Polymer frontend %}
 
@@ -59,15 +58,10 @@ Building a new version of the frontend is as simple as running `script/build_fro
 
  * **home-assistant-polymer**: Install NPM dependencies.
  * **home-assistant-polymer**: start frontend build.
-   * Compile all used JavaScript to `_app_compiled.js`.
+   * Compile all used JavaScript.
    * Install Bower dependencies.
-   * Vulcanize all Webcomponents to `frontend.vulcan.html`.
+   * Vulcanize and minify the core and panel sources to build dir.
-   * Minify `frontend.vulcan.html` and save it as `frontend.html`.
  * Copy the webcomponents polyfill `webcomponents-lite.min.js` from **home-assistant-polymer** to `components/frontend/www_static/webcomponents-lite.min.js`.
- * Copy the final frontend build `frontend.html` from **home-assistant-polymer** to `components/frontend/www_static/frontend/`.
+ * Copy the final frontend build `frontend.html` and panel sources from **home-assistant-polymer** to `components/frontend/www_static/frontend/`.
- * Generate MD5 hash of `frontend.html` to signal caches to redownload the UI.
+ * Generate MD5 hashes of core and panel sources.
-
+ * Create gzip versions of all the sources.
-<p class='img'>
-<img src='/images/frontend/polymer-build-architecture.png' alt='Polymer build architecture diagram' />
-Polymer build architecture diagram
-</p>

source/developers/frontend_add_card.markdown

@@ -19,11 +19,10 @@ Sensors, when not [grouped](/components/group/), are shown as so-called badges o
 
 ![Badges in the frontend](/images/frontend/frontend-badges.png)
 
-The different badges are located in the file [`/src/components/entity/ha-state-label-badge.js`](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/components/entity/ha-state-label-badge.js).
+The different badges are located in the file [`/src/components/entity/ha-state-label-badge.html`](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/components/entity/ha-state-label-badge.html).
 
 Adding a custom card type can be done with a few simple steps. For this example we will add a new state card for the domain `camera`:
 
- 1. Add `'camera'` to the array `DOMAINS_WITH_CARD` in the file [/util/state-card-type.js](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/util/state-card-type.js#L3-L4).
+ 1. Add `'camera'` to the array `DOMAINS_WITH_CARD` in the file [/util/hass-util.html](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/util/hass-util.html#L11).
- 2. Create the files `state-card-camera.html` and `state-card-camera.js` in the folder [/state-summary/](https://github.com/home-assistant/home-assistant-polymer/tree/master/src/state-summary).
+ 2. Create the files `state-card-camera.html` in the folder [/state-summary/](https://github.com/home-assistant/home-assistant-polymer/tree/master/src/state-summary).
- 3. Add `require('./state-card-camera')` to [state-card-content.js](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/state-summary/state-card-content.js).
+ 4. Add `<link rel="import" href="state-card-camera.html">` to [state-card-content.html](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/state-summary/state-card-content.html).
- 4. Add `<link rel="import" href="state-card-camera.html">` to [state-card-content.html](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/state-summary/state-card-content.html).

source/developers/frontend_add_more_info.markdown

@@ -18,7 +18,6 @@ Whenever the user taps or clicks on one of the cards, a more info dialog will sh
 
 The instructions to add a more info dialog are very similar to adding a new card type. This example will add a new more info component for the domain `camera`:
 
- 1. Add `'camera'` to the array `DOMAINS_WITH_MORE_INFO` in the file [util/state-more-info-type.js](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/util/state-more-info-type.js#L1).
+ 1. Add `'camera'` to the array `DOMAINS_WITH_MORE_INFO` in the file [util/hass-util.html](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/util/hass-util.html#L24).
- 2. Create the files `more-info-camera.html` and `more-info-camera.js` in the folder [/more-infos](https://github.com/home-assistant/home-assistant-polymer/tree/master/src/more-infos).
+ 2. Create the files `more-info-camera.html` in the folder [/more-infos](https://github.com/home-assistant/home-assistant-polymer/tree/master/src/more-infos).
- 3. Add `require('./more-info-camera')` to [more-info-content.js](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/more-infos/more-info-content.js)
  4. Add `<link rel="import" href="more-info-camera.html">` to [more-info-content.html](https://github.com/home-assistant/home-assistant-polymer/blob/master/src/more-infos/more-info-content.html)