feat(UI): Add extensions interfaces

Signed-off-by: Chris Jackson <chris@cd-jackson.com>

src/app/app.js

@@ -34,6 +34,7 @@ angular.module('HABmin', [
     'FloorplanEditor',
     'ZWaveLogViewer',
     'ZWaveNetwork',
+    'Config.Extensions',
     'Config.Bindings',
     'Config.Things',
     'Config.Items',

src/app/configuration/extensionsConfig.js

@@ -0,0 +1,82 @@
+/**
+ * HABmin - Home Automation User and Administration Interface
+ * Designed for openHAB (www.openhab.com)
+ *
+ * This software is copyright of Chris Jackson under the GPL license.
+ * Note that this licence may be changed at a later date.
+ *
+ * (c) 2014-2016 Chris Jackson (chris@cd-jackson.com)
+ */
+angular.module('Config.Extensions', [
+    'ui.router',
+    'ui.bootstrap',
+    'ngLocalize',
+    'HABmin.userModel',
+    'HABmin.extensionModel',
+    'Config.parameter',
+    'angular-growl',
+    'ngVis',
+    'ResizePanel'
+])
+
+    .config(function config($stateProvider) {
+        $stateProvider.state('extensions', {
+            url: '/extensions',
+            views: {
+                "main": {
+                    controller: 'ExtensionsConfigCtrl',
+                    templateUrl: 'configuration/extensionsConfig.tpl.html'
+                }
+            },
+            data: {pageTitle: 'Extensions'},
+            resolve: {
+                // Make sure the localisation files are resolved before the controller runs
+                localisations: function (locale) {
+                    return locale.ready('habmin');
+                }
+            }
+        });
+    })
+
+    .controller('ExtensionsConfigCtrl',
+    function BindingConfigCtrl($scope, locale, growl, $timeout, $window, $http, $interval, UserService, ExtensionModel) {
+        $scope.panelDisplayed = 'DESCRIPTION';
+        $scope.extensionTypes = null;
+        $scope.bindingsCnt = -1;
+
+        ExtensionModel.getTypes().then(
+            function (extensionTypes) {
+                $scope.extensionTypes = extensionTypes;
+                $scope.typesCnt = extensionTypes.length;
+            },
+            function (reason) {
+                // Handle failure
+                growl.warning(locale.getString("habmin.ErrorGettingBindings"));
+            }
+        );
+
+        $scope.selectBinding = function (binding) {
+            $scope.setPanelDisplayed("DESCRIPTION");
+            $scope.selectedBinding = binding;
+
+            if (binding.configDescriptionURI != null) {
+                // Get the configuration
+                ConfigModel.getConfig(binding.configDescriptionURI).then(
+                    function (cfg) {
+                        $scope.bindingConfig = cfg;
+                    },
+                    function () {
+                        $scope.bindingConfig = null;
+                    }
+                );
+            }
+        };
+
+        $scope.setPanelDisplayed = function (panel) {
+            $scope.panelDisplayed = panel;
+        };
+
+
+    })
+
+;

src/app/configuration/extensionsConfig.tpl.html

@@ -0,0 +1,154 @@
+<!-- Device List -->
+<div class="col-sm-4">
+    <div class="panel panel-default">
+        <!-- Header -->
+        <div class="panel-heading">
+            Extension Sets
+        </div>
+
+        <!-- Body -->
+        <div class="list-group habmin-list" resize-panel>
+            <!-- BINDING LIST -->
+            <div ng-if="typesCnt>0" ng-repeat="extensionType in extensionTypes | orderBy:'label'">
+                <a role="presentation" ng-class="{'list-group-item':true, 'active': extensionType==selectedType}"
+                   ng-click="selectType(extensionType)">
+                   <span>{{extensionType.label}}&nbsp;</span>
+                </a>
+            </div>
+
+            <!-- Cover options for loading, and no types -->
+            <div ng-if="typesCnt==-1" class="list-group-item text-center">
+                <span class="fa fa-spin fa-refresh"></span>
+                <span i18n="common.loading"></span>
+            </div>
+            <div ng-if="typesCnt==0" class="list-group-item text-center">
+                <span class="fa fa-exclamation-triangle text-warning"></span>
+                <span i18n="binding.NoneFound"></span>
+            </div>
+        </div>
+
+        <!-- Footer -->
+        <div class="panel-footer panel-footer-none">
+        </div>
+    </div>
+</div>
+
+<!-- Binding Information / Configuration -->
+<div class="col-sm-8">
+    <div class="panel panel-default">
+        <!-- Header -->
+        <div class="panel-heading">
+            <h3 class="panel-title pull-left">
+                <span i18n="binding.Information"></span>&nbsp;<span><i>{{selectedBinding.name}}</i></span>
+            </h3>
+
+            <div class="pull-right btn-group dropdown">
+                <button type="button"
+                        class="btn btn-default dropdown-toggle"
+                        data-toggle="dropdown">
+                    <span class="fa fa-cog"></span>
+                    <span i18n="thing.Tools"></span>
+                    <span class="caret"></span>
+                    <span class="sr-only">Dropdown</span>
+                </button>
+                <ul class="dropdown-menu" role="menu">
+                    <li ng-repeat="config in selectedThingConfig.parameters">
+                        <a ng-if="config.groupName=='actions'" ng-click="doAction(config)">
+                            <span class="fa fa-fw"></span>
+                            <span class="fa fa-fw fa-user-plus"></span>
+                            <span>{{config.label}}</span>
+                        </a>
+                    </li>
+
+                    <li>
+                        <a ng-click="showAdvancedSettings=!showAdvancedSettings">
+                            <span class="fa fa-fw" ng-class="{'fa-check-square-o': showAdvancedSettings}"></span>
+                            <span class="fa fa-fw fa-user-plus"></span>
+                            <span i18n="thing.AdvancedMode"></span>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+            <div class="clearfix"></div>
+        </div>
+
+        <!-- Body -->
+        <div class="list-group habmin-list" resize-panel>
+            <form name="thingConfigForm" novalidate ng-show="selectedBinding" style="height:100%">
+                <!-- DESCRIPTION -->
+                <div>
+                    <a role="presentation"
+                       ng-class="{'list-group-item config-panel-title':true, 'active': panelDisplayed=='DESCRIPTION'}"
+                       ng-click="setPanelDisplayed('DESCRIPTION')">
+                        <span class="fa fa-fw fa-book"></span>
+                        <span i18n="thing.Description"></span>
+                    </a>
+                </div>
+                <div collapse="panelDisplayed!='DESCRIPTION'" class="panel-form">
+                    <div class="habmin-info">
+                        <label i18n="binding.Description"></label>
+
+                        <div class="well well-sm" ng-bind-html="selectedBinding.description">
+                        </div>
+                    </div>
+
+                    <div class="habmin-info">
+                        <label i18n="binding.Author"></label>
+
+                        <div class="well well-sm">
+                            {{selectedBinding.author}}
+                        </div>
+                    </div>
+                </div>
+
+
+                <!-- CONFIGURATION GROUPS -->
+                <div ng-repeat="group in bindingConfig.parameterGroups">
+                    <div>
+                        <a role="presentation"
+                           ng-class="{'list-group-item list-group-item-heading':true, 'active': panelDisplayed=='CONFIG-{{group.name}}'}"
+                           ng-click="setPanelDisplayed('CONFIG-{{group.name}}')"
+                           ng-if="configGroupAdvanced(group)||showAdvancedSettings">
+                            <habmin-icon class="fa-fw" cfgcontext="{{group.context}}"></habmin-icon>
+                            <span>{{group.label}}</span>
+                        </a>
+                    </div>
+                    <div collapse="$parent.panelDisplayed!='CONFIG-{{group.name}}'"
+                         class="panel-form">
+                        <div ng-repeat="config in bindingConfig.parameters">
+                            <div class="form-group"
+                                 ng-if="configGroupFilter(config, group.name) && (!config.advanced||showAdvancedSettings)">
+                                <ng-include src="'configuration/eshConfigParam.tpl.html'"></ng-include>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- CONFIGURATION UNGROUPED -->
+                <div ng-if="bindingHasUngroupedParams()">
+                    <div>
+                        <a role="presentation"
+                           ng-class="{'list-group-item list-group-item-heading':true, 'active': panelDisplayed=='CONFIG-ungrouped'}"
+                           ng-click="setPanelDisplayed('CONFIG-ungrouped')">
+                            <span class="fa fa-fw fa-wrench"></span>
+                            <span i18n="thing.Configuration"></span>
+                        </a>
+                    </div>
+                    <div collapse="$parent.panelDisplayed!='CONFIG-ungrouped'"
+                         class="panel-form">
+                        <div ng-repeat="config in bindingConfig.parameters">
+                            <div class="form-group"
+                                 ng-if="configGroupFilter(config, null) && (!config.advanced||showAdvancedSettings)">
+                                <ng-include src="'configuration/eshConfigParam.tpl.html'"></ng-include>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </form>
+        </div>
+
+        <!-- Footer -->
+        <div class="panel-footer panel-footer-none">
+        </div>
+    </div>
+</div>

src/app/models/extensionModel.js

@@ -0,0 +1,96 @@
+/**
+ * HABmin - Home Automation User and Administration Interface
+ * Designed for openHAB (www.openhab.com)
+ *
+ * This software is copyright of Chris Jackson under the GPL license.
+ * Note that this licence may be changed at a later date.
+ *
+ * (c) 2014-2016 Chris Jackson (chris@cd-jackson.com)
+ */
+angular.module('HABmin.extensionModel', [
+    'HABmin.userModel',
+    'HABmin.restModel'
+])
+
+    .service('ExtensionModel', function ($http, $q, UserService, RestService) {
+        var svcExtensions = "/extensions";
+        var extensionTypeList = [];
+
+        this.getTypes = function () {
+            var tStart = new Date().getTime();
+            var deferred = $q.defer();
+
+            RestService.getService(svcExtensions).then(
+                function (url) {
+                    if (url == null) {
+                        deferred.resolve(null);
+                        return;
+                    }
+
+                    $http.get(url + "/types")
+                        .success(function (data) {
+                            console.log("Fetch completed in", new Date().getTime() - tStart);
+
+                            // Keep a local copy.
+                            // This allows us to update the data later and keeps the GUI in sync.
+                            angular.forEach(data, function (newType) {
+                                var found = false;
+                                angular.forEach(extensionTypeList, function (extensionType) {
+                                    if (extensionType.id == newType.id) {
+                                        for (var i in newType) {
+                                            extensionType[i] = newType[i];
+                                        }
+                                        found = true;
+                                    }
+                                });
+
+                                // Is this a new binding we've not seen before?
+                                if (found == false) {
+                                    extensionTypeList.push(newType);
+                                }
+                            });
+
+                            console.log("Processing completed in", new Date().getTime() - tStart);
+
+                            deferred.resolve(extensionTypeList);
+                        })
+                        .error(function (data, status) {
+                            deferred.reject();
+                        });
+                },
+                function () {
+                    deferred.reject();
+                }
+            );
+
+            return deferred.promise;
+        };
+
+        this.startDiscovery = function (binding) {
+            var deferred = $q.defer();
+
+            RestService.getService(svcDisc).then(
+                function (url) {
+                    if (url == null) {
+                        deferred.resolve(false);
+                        return deferred.promise;
+                    }
+
+                    $http.post(url + "/bindings/" + binding + "/scan") //, {bindingId: binding})
+                        .success(function (data) {
+                            deferred.resolve(true);
+                        })
+                        .error(function (data, status) {
+                            deferred.reject(false);
+                        });
+                },
+                function () {
+                    deferred.reject(false);
+                }
+            );
+
+            return deferred.promise;
+        };
+
+    })
+;

src/index.html

@@ -318,6 +318,12 @@ <h4>
                                 <span i18n="habmin.Items"></span>
                             </a>
                         </li>
+                        <li>
+                            <a ui-sref="extensions" ng-class="{active: $state.includes('extensions')}">
+                                <i class="fa fa-fw fa-map-signs"></i>
+                                <span i18n="habmin.Extensions"></span>
+                            </a>
+                        </li>
                         <li>
                             <a ui-sref="floorplan/editor" ng-class="{active: $state.includes('items')}">
                                 <i class="fa fa-fw fa-home"></i>

src/languages/en-GB/habmin.lang.json

@@ -33,5 +33,6 @@
   "ErrorLoadingInbox": "Error loading inbox!",
   "ErrorGettingBindings": "Error loading list of bindings!",
   "OpenHABOffline": "OpenHAB is offline!",
-  "ZWaveNetworkViewer": "Z-Wave Network Viewer"
+  "ZWaveNetworkViewer": "Z-Wave Network Viewer",
+  "Extensions": "Extensions"
 }