203 lines
7.4 KiB
HTML
203 lines
7.4 KiB
HTML
<link rel="import" href="../../bower_components/polymer/polymer.html">
|
|
|
|
<link rel="import" href="../../bower_components/iron-icons/iron-icons.html">
|
|
<link rel="import" href="../../bower_components/iron-ajax/iron-ajax.html">
|
|
|
|
<link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
|
|
|
|
<link rel="import" href="../../bower_components/paper-material/paper-material.html">
|
|
<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
|
|
<link rel="import" href="../../bower_components/paper-listbox/paper-listbox.html">
|
|
<link rel="import" href="../../bower_components/paper-menu/paper-menu.html">
|
|
<link rel="import" href="../../bower_components/paper-item/paper-item.html">
|
|
<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
|
|
|
|
<link rel="import" href="../../bower_components/strolch-wc-inspector/strolch-wc-inspector-menu.html">
|
|
|
|
<link rel="import" href="../behaviors/c-component-behavior.html">
|
|
<link rel="import" href="../styles/c-app-style.html">
|
|
|
|
<dom-module id="c-drawer">
|
|
<template>
|
|
<style is="custom-style" include="c-app-style">
|
|
:root {
|
|
}
|
|
|
|
app-drawer {
|
|
z-index: 10;
|
|
}
|
|
|
|
app-toolbar {
|
|
background-color: var(--app-primary-color);
|
|
color: var(--app-regular-highlight-fg-color);
|
|
}
|
|
|
|
paper-menu {
|
|
--paper-menu-selected-item: {
|
|
background-color: var(--app-light-highlight-bg-color);
|
|
};
|
|
--paper-menu-focused-item: {
|
|
background-color: var(--app-regular-highlight-bg-color);
|
|
};
|
|
}
|
|
|
|
paper-menu paper-item {
|
|
cursor: pointer;
|
|
}
|
|
|
|
paper-menu paper-item:hover {
|
|
background-color: var(--app-regular-highlight-bg-color);
|
|
}
|
|
|
|
.info-div {
|
|
display: block !important;
|
|
font-size: small;
|
|
color: darkgray;
|
|
}
|
|
|
|
.strolch {
|
|
color: #7f7f7f;
|
|
font-family: monospace;
|
|
font-weight: 600;
|
|
font-size: 30px;
|
|
text-shadow: 2px 2px 3px #7f7f7f;
|
|
margin: auto;
|
|
}
|
|
|
|
</style>
|
|
|
|
<app-drawer id="appDrawer">
|
|
|
|
<app-toolbar>
|
|
<paper-icon-button icon="menu" on-tap="closeDrawer"></paper-icon-button>
|
|
<div main-title>[[localize('appTitle')]]</div>
|
|
</app-toolbar>
|
|
|
|
<paper-menu id="menu" selected="{{page}}" attr-for-selected="id" on-tap="onMenuTap">
|
|
|
|
<paper-item id="shop-floor" class="menu-item">[[localize('shop-floor')]]</paper-item>
|
|
|
|
<template is="dom-if" if="[[hasPrivilege('li.strolch.report.ReportSearch')]]">
|
|
<paper-item id="reports" class="menu-item">[[localize('reports')]]</paper-item>
|
|
</template>
|
|
|
|
</paper-menu>
|
|
|
|
<template is="dom-if" if="[[hasRole('StrolchAdmin')]]">
|
|
<strolch-wc-inspector-menu selected-page="[[page]]"
|
|
on-menu-tap="onInspectorMenuTap"></strolch-wc-inspector-menu>
|
|
</template>
|
|
|
|
<paper-menu on-tap="onLogoutTapped">
|
|
<paper-item id="logout" class="menu-item">[[localize('logout')]]</paper-item>
|
|
</paper-menu>
|
|
|
|
<paper-material id="container" class="container info-div" elevation="0">
|
|
<p>[[userConfig.firstname]] [[userConfig.lastname]] / [[userConfig.username]]</p>
|
|
<p title="[[version.appVersion.scmRevision]]">[[version.appVersion.artifactVersion]]</p>
|
|
</paper-material>
|
|
|
|
<paper-material id="container" class="container" elevation="0">
|
|
<paper-dropdown-menu label="[[localize('language')]]">
|
|
<paper-listbox class="dropdown-content" selected="{{userLocale}}" attr-for-selected="data">
|
|
<paper-item data="de">Deutsch</paper-item>
|
|
<paper-item data="en">English</paper-item>
|
|
<paper-item data="fr">Français</paper-item>
|
|
</paper-listbox>
|
|
</paper-dropdown-menu>
|
|
</paper-material>
|
|
|
|
<paper-material id="container" class="container" elevation="0">
|
|
<p class="strolch">${appName}</p>
|
|
</paper-material>
|
|
</app-drawer>
|
|
|
|
<!-- Ajax requests -->
|
|
<iron-ajax id="ajaxPutLocale" content-type="application/json" handle-as="json" method="PUT"></iron-ajax>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
Polymer({
|
|
|
|
is: 'c-drawer',
|
|
|
|
behaviors: [
|
|
CustomComponentBehavior
|
|
],
|
|
|
|
properties: {
|
|
authTokenValid: {
|
|
type: Boolean
|
|
},
|
|
userConfig: {
|
|
type: Object,
|
|
observer: "userConfigChanged"
|
|
},
|
|
userLocale: {
|
|
type: String,
|
|
observer: "userLocaleChanged"
|
|
},
|
|
version: {
|
|
type: Object
|
|
}
|
|
},
|
|
|
|
observers: [],
|
|
|
|
listeners: {},
|
|
|
|
toggleDrawer: function () {
|
|
this.$$("#appDrawer").toggle();
|
|
},
|
|
closeDrawer: function () {
|
|
this.$$("#appDrawer").close();
|
|
},
|
|
|
|
onInspectorMenuTap: function (e) {
|
|
this.changePage(e.detail.target.id, false);
|
|
},
|
|
onMenuTap: function (e) {
|
|
this.changePage(e.detail.sourceEvent.target.id, false);
|
|
},
|
|
onLogoutTapped: function (e) {
|
|
this.fire('cx-logout');
|
|
},
|
|
|
|
userConfigChanged: function (newValue, oldValue) {
|
|
if (newValue != null) {
|
|
var userLocale = Strolch.getUserLocale();
|
|
if (userLocale !== newValue.locale) {
|
|
console.log("Updating server side locale for user " + newValue.username + " to " + userLocale);
|
|
newValue.locale = userLocale;
|
|
Strolch.setUserConfig(newValue);
|
|
this.$.ajaxPutLocale.url = this.baseRestPath + "/strolch/sessions/" + newValue.sessionId + "/locale/" + userLocale;
|
|
this.$.ajaxPutLocale.generateRequest();
|
|
}
|
|
|
|
this.userLocale = newValue.locale;
|
|
}
|
|
},
|
|
|
|
userLocaleChanged: function (newValue, oldValue) {
|
|
if (newValue && oldValue) {
|
|
console.log('User locale changed to ' + newValue);
|
|
this.$.ajaxPutLocale.generateRequest();
|
|
Strolch.setUserLocale(newValue);
|
|
window.location.reload();
|
|
} else if (this.userConfig == null && Strolch.getUserConfig() != null && Strolch.getUserConfig().locale !== newValue) {
|
|
this.userConfig = Strolch.getUserConfig();
|
|
this.userConfig.locale = newValue;
|
|
Strolch.setUserConfig(this.userConfig);
|
|
this.$.ajaxPutLocale.generateRequest();
|
|
}
|
|
},
|
|
|
|
/* Lifecycle */
|
|
});
|
|
|
|
</script>
|
|
|
|
</dom-module>
|