345 lines
13 KiB
HTML
345 lines
13 KiB
HTML
<link rel="import" href="../polymer/polymer.html">
|
|
|
|
<link rel="import" href="../iron-ajax/iron-ajax.html">
|
|
<link rel="import" href="../iron-pages/iron-pages.html">
|
|
<link rel="import" href="../iron-icon/iron-icon.html">
|
|
<link rel="import" href="../iron-icons/iron-icons.html">
|
|
<link rel="import" href="../iron-icons/av-icons.html">
|
|
|
|
<link rel="import" href="../paper-styles/color.html">
|
|
|
|
<link rel="import" href="../paper-material/paper-material.html">
|
|
<link rel="import" href="../paper-dialog/paper-dialog.html">
|
|
<link rel="import" href="../paper-button/paper-button.html">
|
|
<link rel="import" href="../paper-icon-button/paper-icon-button.html">
|
|
|
|
<link rel="import" href="../paper-dropdown-menu/paper-dropdown-menu.html">
|
|
<link rel="import" href="../paper-item/paper-item.html">
|
|
<link rel="import" href="../paper-listbox/paper-listbox.html">
|
|
|
|
<link rel="import" href="../strolch-wc-styles/strolch-wc-app-style.html">
|
|
|
|
<link rel="import" href="strolch-wc-inspector-behavior.html">
|
|
|
|
<dom-module id="strolch-wc-components">
|
|
|
|
<template>
|
|
|
|
<style is="custom-style" include="strolch-wc-app-style">
|
|
|
|
:host {
|
|
display: block;
|
|
margin: 0;
|
|
padding: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
paper-material {
|
|
background: white;
|
|
margin-top: 8px;
|
|
margin-bottom: 16px;
|
|
padding: 8px;
|
|
}
|
|
|
|
.component {
|
|
display: flex;
|
|
}
|
|
|
|
.table-row {
|
|
min-height: 24px;
|
|
padding-top: 4px;
|
|
padding-bottom: 4px;
|
|
}
|
|
|
|
.table-heading, .table-cell {
|
|
padding: 0;
|
|
}
|
|
|
|
.table-cell {
|
|
min-height: inherit;
|
|
}
|
|
|
|
.property-key {
|
|
flex-grow: 3;
|
|
font-style: italic;
|
|
overflow: auto;
|
|
}
|
|
|
|
.property-value {
|
|
flex-basis: 100px;
|
|
flex-grow: 8;
|
|
justify-content: flex-start;
|
|
overflow: auto;
|
|
}
|
|
|
|
.property-default {
|
|
flex-basis: 100px;
|
|
flex-grow: 2;
|
|
justify-content: flex-start;
|
|
overflow: auto;
|
|
}
|
|
|
|
.info {
|
|
flex-basis: 300px;
|
|
flex-grow: 1;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.name p {
|
|
margin: 0 0 8px;
|
|
}
|
|
|
|
.properties {
|
|
flex-basis: 300px;
|
|
flex-grow: 3;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
|
|
.btn {
|
|
flex-grow: 0;
|
|
flex-shrink: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
justify-content: center;
|
|
}
|
|
|
|
.btn paper-button {
|
|
margin-bottom: 8px;
|
|
width: 150px;
|
|
}
|
|
|
|
</style>
|
|
|
|
<div class="actions actions-right padding">
|
|
<paper-button on-tap="onReloadConfig" raised>Reload Config</paper-button>
|
|
<paper-icon-button icon="refresh" title="Refresh" on-tap="reload"></paper-icon-button>
|
|
</div>
|
|
|
|
<paper-material elevation="1">
|
|
<h3>Agent</h3>
|
|
<div class="component">
|
|
<div class="info">
|
|
<p>
|
|
<i>Application Name:</i><br>
|
|
<b>[[agent.applicationName]]</b>
|
|
</p>
|
|
<p>
|
|
<i>environment:</i><br>
|
|
<b>[[agent.environment]]</b>
|
|
</p>
|
|
<p>
|
|
<i>locale:</i><br>
|
|
<b>[[agent.locale]]</b>
|
|
</p>
|
|
<p>
|
|
<i>Config Path:</i><br>
|
|
<b>[[agent.configPath]]</b>
|
|
</p>
|
|
<p>
|
|
<i>Data Path:</i><br>
|
|
<b>[[agent.dataPath]]</b>
|
|
</p>
|
|
<p>
|
|
<i>Temp Path:</i><br>
|
|
<b>[[agent.tempPath]]</b>
|
|
</p>
|
|
<p>
|
|
<i>Supported languages:</i><br>
|
|
[[_getSupportedLanguages(agent)]]
|
|
</p>
|
|
</div>
|
|
<div class="properties">
|
|
<h3>Properties</h3>
|
|
<template is="dom-if" if="[[isEmptyArray(agent.properties)]]"><i>No Properties</i></template>
|
|
<template is="dom-if" if="[[isNotEmptyArray(agent.properties)]]">
|
|
<div class="table table-list">
|
|
<div class="table-row">
|
|
<div class="table-heading property-key">Key</div>
|
|
<div class="table-heading property-value">Value</div>
|
|
<div class="table-heading property-default">Default</div>
|
|
<div class="table-heading property-type">Type</div>
|
|
</div>
|
|
<template is="dom-repeat" items="[[agent.properties]]" as="property">
|
|
<div class="table-row">
|
|
<div class="table-cell property-key">[[property.key]]</div>
|
|
<div class="table-cell property-value">[[property.value]]
|
|
<template is="dom-if" if="[[property.unused]]"> <i>(Unused!)</i></template>
|
|
</div>
|
|
<div class="table-cell property-default">[[property.defaultValue]]</div>
|
|
<div class="table-cell property-type">[[property.type]]</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</paper-material>
|
|
|
|
<template is="dom-repeat" items="[[components]]" as="comp">
|
|
<paper-material elevation="1">
|
|
<h3>[[comp.name]]</h3>
|
|
<div class="component">
|
|
<div class="info">
|
|
<p>
|
|
<i>API Class:</i><br>
|
|
<b>[[comp.api]]</b>
|
|
</p>
|
|
<p>
|
|
<i>Implementation:</i><br>
|
|
<b>[[comp.impl]]</b>
|
|
</p>
|
|
<p>
|
|
<i>State:</i><br>
|
|
<b>[[comp.state]]</b>
|
|
</p>
|
|
<p>
|
|
<i>Dependencies:</i><br>
|
|
[[_getDependencies(comp)]]
|
|
</p>
|
|
<div class="btn">
|
|
<paper-button on-tap="onInitialize" raised hidden$="[[_hideInitialize(comp)]]">Initialize
|
|
</paper-button>
|
|
<paper-button on-tap="onStart" raised hidden$="[[_hideStart(comp)]]">Start</paper-button>
|
|
<paper-button on-tap="onStop" raised hidden$="[[_hideStop(comp)]]">Stop</paper-button>
|
|
<paper-button on-tap="onDestroy" raised hidden$="[[_hideDestroy(comp)]]">Destroy
|
|
</paper-button>
|
|
</div>
|
|
</div>
|
|
<div class="properties">
|
|
<h3>Properties</h3>
|
|
<template is="dom-if" if="[[isEmptyArray(comp.properties)]]"><i>No Properties</i></template>
|
|
<template is="dom-if" if="[[isNotEmptyArray(comp.properties)]]">
|
|
<div class="table table-list">
|
|
<div class="table-row">
|
|
<div class="table-heading property-key">Key</div>
|
|
<div class="table-heading property-value">Value</div>
|
|
<div class="table-heading property-default">Default</div>
|
|
<div class="table-heading property-type">Type</div>
|
|
</div>
|
|
<template is="dom-repeat" items="[[comp.properties]]" as="property">
|
|
<div class="table-row">
|
|
<div class="table-cell property-key">[[property.key]]</div>
|
|
<div class="table-cell property-value">[[property.value]]</div>
|
|
<div class="table-cell property-default">[[property.defaultValue]]</div>
|
|
<div class="table-cell property-type">[[property.type]]</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</paper-material>
|
|
</template>
|
|
|
|
<iron-ajax id="ajaxGetComponents"
|
|
url="[[baseRestPath]]/strolch/agent/components"
|
|
content-type="application/json"
|
|
handle-as="json"
|
|
method="GET"
|
|
on-response="onGetComponentsResponse"
|
|
on-error="onRequestError"></iron-ajax>
|
|
|
|
<iron-ajax id="ajaxPutState"
|
|
content-type="application/json"
|
|
handle-as="json"
|
|
on-response="onPutStateResponse"
|
|
on-error="onRequestError"></iron-ajax>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
Polymer({
|
|
|
|
is: 'strolch-wc-components',
|
|
|
|
behaviors: [
|
|
StrolchInspectorBehavior
|
|
],
|
|
|
|
properties: {
|
|
agent: {
|
|
type: Object
|
|
},
|
|
components: {
|
|
type: Array
|
|
}
|
|
},
|
|
_getSupportedLanguages: function (agent) {
|
|
if (this.isEmptyArray(agent.supportedLanguages))
|
|
return "-";
|
|
return this.arrayToString(agent.supportedLanguages);
|
|
},
|
|
_getDependencies: function (component) {
|
|
if (this.isEmptyArray(component.dependencies))
|
|
return "-";
|
|
return this.arrayToString(component.dependencies);
|
|
},
|
|
|
|
_hideInitialize: function (component) {
|
|
return !(component.state === "SETUP" || component.state === "DESTROYED");
|
|
},
|
|
_hideStart: function (component) {
|
|
return !(component.state === "INITIALIZED" || component.state === "STOPPED");
|
|
},
|
|
_hideStop: function (component) {
|
|
return component.state !== "STARTED";
|
|
},
|
|
_hideDestroy: function (component) {
|
|
return !(component.state === "STOPPED" || component.state === "INITIALIZED");
|
|
},
|
|
|
|
onGetComponentsResponse: function (data) {
|
|
this.agent = data.detail.response.data.agent;
|
|
this.components = this.agent.components;
|
|
},
|
|
onPutStateResponse: function (data) {
|
|
this.reload();
|
|
},
|
|
|
|
ready: function () {
|
|
//
|
|
},
|
|
|
|
reload: function () {
|
|
this.$.ajaxGetComponents.generateRequest();
|
|
},
|
|
|
|
onReloadConfig: function (evt) {
|
|
this.$.ajaxPutState.url = this.basePath + 'rest/strolch/agent/configuration/reload';
|
|
this.$.ajaxPutState.params = {};
|
|
this.$.ajaxPutState.method = 'PUT';
|
|
this.$.ajaxPutState.generateRequest();
|
|
},
|
|
|
|
onInitialize: function (evt) {
|
|
this.setState(evt.model.comp.name, 'INITIALIZED');
|
|
},
|
|
onStart: function (evt) {
|
|
this.setState(evt.model.comp.name, 'STARTED');
|
|
},
|
|
onStop: function (evt) {
|
|
this.setState(evt.model.comp.name, 'STOPPED');
|
|
},
|
|
onDestroy: function (evt) {
|
|
this.setState(evt.model.comp.name, 'DESTROYED');
|
|
},
|
|
|
|
setState: function (componentName, state) {
|
|
this.$.ajaxPutState.url = this.basePath + 'rest/strolch/agent/components/' + componentName + '/state';
|
|
this.$.ajaxPutState.params = {state: state};
|
|
this.$.ajaxPutState.method = 'PUT';
|
|
this.$.ajaxPutState.generateRequest();
|
|
}
|
|
});
|
|
|
|
</script>
|
|
|
|
</dom-module>
|