@cuba-platform/front-generator/lib/generators/polymer2/app/template/src/${project_namespace}-locale-select.html

CUBA Platform front-end clients generator

<%  const className = genClassName('LocaleSelect'); %>
<link rel="import" href="../bower_components/polymer/polymer.html">

<link rel="import" href="shared-styles.html">

<dom-module id="<%= project.namespace %>-locale-select">
  <template>
    <style include="shared-styles"></style>
    <style>
      :host {
        display: block;
      }
    </style>
    <% if (project.locales) { %>
    <vaadin-radio-group selected="[[locale]]" on-selected-changed="_changeLocale">
      <% project.locales.forEach(function(locale){%>
        <vaadin-radio-button name="<%= locale.code %>"><%= locale.caption %></vaadin-radio-button>
      <%}); %>
    </vaadin-radio-group>
    <% } %>
  </template>
  <script>
    {
      /**
       * @extends {Polymer.Element}
       */
      class <%= className %> extends Polymer.Element {
        static get is() {
          return '<%= project.namespace %>-locale-select';
        }

        static get properties() {
          return {
            locale: {
              type: String,
              value: function () {
                return cuba.getApp().locale;
              }
            }
          }
        }

        _changeLocale(event) {
          cuba.getApp().locale = event.detail.value;
        }
      }

      customElements.define(<%= className %>.is, <%= className %>);
    }
  </script>
</dom-module>