<dom-module id="butler-app">
    <link rel="import" href="butler-app-style.html">

    <template>
        <style include="butler-app-style"></style>
        <style>
            :host {
                display: block;
            }
        </style>

    <app-container>
        <!--selected="0"-->
        <iron-pages selected="2"> 
            <hello-view></hello-view>
            <start-view></start-view>
            <recording-view></recording-view>
            <response-view></response-view>
        </iron-pages>
    </app-container>

</template>

<script>
    Polymer({

        is: 'butler-app',
        
        listeners: {
            'nextView': '_showNextView',
            'resetViews': '_resetViews'
        },

        _showNextView: (event) => {
            const pages = document.querySelector('iron-pages')
            pages.selectNext()
        },

        _resetViews: (event) => {
            const pages = document.querySelector('iron-pages')
            pages.selectIndex(0)
        }

    });
</script>
</dom-module>
<dom-module id="butler-app">
    <link rel="import" href="butler-app-style.html">

    <template>
        <style include="butler-app-style"></style>
        <style>
            :host {
                display: block;
            }
        </style>

<app-container>
    <!--selected="0"-->
    <iron-pages selected="0">
        <hello-view></hello-view>
        <start-view></start-view>
        <recording-view></recording-view>
        <response-view></response-view>
    </iron-pages>
</app-container>

</template>

<script src="butler-app.js"></script>
</dom-module>
Set defautl view for development
Set defautl view for development
