strolch-wc-plc/strolch-wc-plc-logical-devices.html

<link rel="import" href="../polymer/polymer.html">

<link rel="import" href="../iron-ajax/iron-ajax.html">
<link rel="import" href="../iron-icons/iron-icons.html">
<link rel="import" href="../iron-icons/notification-icons.html">
<link rel="import" href="../iron-icons/maps-icons.html">
<link rel="import" href="../iron-icons/av-icons.html">
<link rel="import" href="../iron-icons/communication-icons.html">
<link rel="import" href="../iron-icons/device-icons.html">
<link rel="import" href="../iron-icons/hardware-icons.html">
<link rel="import" href="../iron-icons/editor-icons.html">
<link rel="import" href="../iron-icons/places-icons.html">
<link rel="import" href="../iron-icons/social-icons.html">

<link rel="import" href="../paper-material/paper-material.html">
<link rel="import" href="../paper-card/paper-card.html">
<link rel="import" href="../paper-button/paper-button.html">
<link rel="import" href="../paper-input/paper-input.html">
<link rel="import" href="../paper-icon-button/paper-icon-button.html">
<link rel="import" href="../paper-toggle-button/paper-toggle-button.html">
<link rel="import" href="../paper-radio-group/paper-radio-group.html">

<link rel="import" href="../strolch-wc-localize-behavior/strolch-wc-localize-behavior.html">
<link rel="import" href="../strolch-wc-ws-observer/strolch-wc-ws-observer.html">

<link rel="import" href="./strolch-wc-plc-style.html">
<link rel="import" href="./strolch-wc-plc-behavior.html">
<link rel="import" href="./strolch-wc-plc-logical-device.html">

<dom-module id="strolch-wc-plc-logical-devices">
    <template>

        <style is="custom-style" include="strolch-wc-plc-style">
            :host {
                display: block;
                padding-left: 10px;
                padding-right: 10px;
            }

            h2:not(:first-of-type) {
                margin-top: 20px;
            }

            .actions {
                padding: 0;
                margin: 0;
            }
        </style>

        <div class="actions">
            <p>[[localize('lastUpdate')]]: [[lastUpdate]]</p>
            <paper-icon-button class="g-pull-right" icon="refresh" on-tap="_refresh"></paper-icon-button>
        </div>

        <template is="dom-repeat" items="[[devicesByGroup]]" as="group">

            <h2>[[group.name]]</h2>

            <template is="dom-repeat" items="[[group.data]]" as="device">

                <strolch-wc-plc-logical-device device="[[device]]"
                                               base-rest-path="[[baseRestPath]]"
                                               observer-handler="[[observerHandler]]"></strolch-wc-plc-logical-device>

            </template>
        </template>

        <iron-ajax id="ajaxGetDevices"
                   url="[[baseRestPath]]/plc/logicalDevices"
                   content-type="application/json"
                   handle-as="json"
                   method="GET"
                   on-response="onGetDevicesResponse"
                   on-error="onRequestError"></iron-ajax>

        <strolch-wc-ws-observer id="observerHandler" ws-path="[[baseWsPath]]/plc/observer"></strolch-wc-ws-observer>

    </template>

    <script>
        Polymer({
            is: 'strolch-wc-plc-logical-devices',

            behaviors: [
                StrolchLocalizeBehavior, StrolchPlcBehavior
            ],

            properties: {
                lastUpdate: {
                    type: String,
                    value: function () {
                        return Strolch.toLocalDateTime(new Date());
                    }
                },
                observerHandler: {
                    type: Object,
                    value: function () {
                        return ObserverHandler;
                    }
                },
                registeredForUpdates: {
                    type: Boolean,
                    value: false
                },
                devicesByGroup: {
                    type: Array,
                    value: []
                }
            },

            /* Listeners */
            onGetDevicesResponse: function (e) {
                this.devicesByGroup = e.detail.response.data;
                this.lastUpdate = Strolch.toLocalDateTime(new Date());
            },

            _refresh: function () {
                this.$.ajaxGetDevices.generateRequest();

                if (!this.registeredForUpdates) {
                    this.$.observerHandler.register("Resource", "PlcAddress", "strolch-wc-plc-logical-devices", {flat: true}, this.handleUpdate.bind(this));
                    this.registeredForUpdates = true;
                }
            },

            /* Lifecycle */
            reload: function () {
                this._refresh();
            },
            handleUpdate: function (notifyType, objectType, type, elements) {
                console.log("Received updates for " + elements.length + " " + objectType + " " + type + " elements.");

                for (var i = 0; i < elements.length; i++) {
                    this.observerHandler.notifyUpdate(objectType, type, elements[i].id, elements[i]);
                }

                this.lastUpdate = Strolch.toLocalDateTime(new Date());
            }
        });

        var registrations = {};

        ObserverHandler = {
            register: function (objectType, type, id, callback) {
                if (objectType == null || type == null || id == null || callback == null)
                    throw "One of objectType, type, id or callback is null: " + objectType + ", " + type + ", " + id + ", " + callback;
                var byObjectType = registrations[objectType];
                if (byObjectType == null) {
                    byObjectType = {};
                    registrations[objectType] = byObjectType;
                }

                var byType = byObjectType[type];
                if (byType == null) {
                    byType = {};
                    byObjectType[type] = byType;
                }

                byType[id] = callback;
            },

            notifyUpdate: function (objectType, type, id, element) {
                if (objectType == null || type == null || id == null || element == null)
                    throw "One of objectType, type, id or element is null: " + objectType + ", " + type + ", " + id + ", " + element;

                var byObjectType = registrations[objectType];
                if (byObjectType == null) {
                    console.log("No observers for objectType " + objectType);
                    return;
                }

                var byType = byObjectType[type];
                if (byType == null) {
                    console.log("No observers for byType " + byType);
                    return;
                }

                var callback = byType[id];
                callback(element);
            }
        }


    </script>
</dom-module>