Skip to content
This repository has been archived by the owner on May 23, 2019. It is now read-only.

Commit

Permalink
feat(Extensions): Add dynamic feedback of extension install in progress
Browse files Browse the repository at this point in the history 
Signed-off-by: Chris Jackson <chris@cd-jackson.com>
  • Loading branch information
@cdjackson
cdjackson committed May 22, 2016
1 parent e8ae530 commit f006e35
Show file tree
Hide file tree
Showing 6 changed files with 192 additions and 190 deletions.
4 changes: 3 additions & 1 deletion build.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,9 @@ module.exports = {
'de-DE',
'en-GB',
'fr-FR',
'it-IT'
'it-IT',
'pl-PL',
'sv-SE'
],

/**
Expand Down
47 changes: 24 additions & 23 deletions src/app/configuration/extensionsConfig.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,7 @@ angular.module('Config.Extensions', [
'ngLocalize',
'HABmin.userModel',
'HABmin.extensionModel',
'Config.parameter',
'angular-growl',
'ngVis',
'ResizePanel'
])

Expand All @@ -32,50 +30,53 @@ angular.module('Config.Extensions', [
resolve: {
// Make sure the localisation files are resolved before the controller runs
localisations: function (locale) {
return locale.ready('habmin');
return locale.ready('extensions');
}
}
});
})

.controller('ExtensionsConfigCtrl',
function BindingConfigCtrl($scope, locale, growl, $timeout, $window, $http, $interval, UserService, ExtensionModel) {
$scope.panelDisplayed = 'DESCRIPTION';
$scope.extensions = null;
$scope.extensionTypes = null;
$scope.bindingsCnt = -1;
$scope.typesCnt = -1;
$scope.extensionsCnt = -1;

ExtensionModel.getExtensions().then(
function (extensions) {
$scope.extensions = extensions;
$scope.extensionsCnt = extensions.length;
},
function (reason) {
// Handle failure
growl.warning(locale.getString("extensions.ErrorGettingExtensions"));
}
);

ExtensionModel.getTypes().then(
function (extensionTypes) {
$scope.extensionTypes = extensionTypes;
$scope.typesCnt = extensionTypes.length;
$scope.selectedType = $scope.extensionTypes[0];
},
function (reason) {
// Handle failure
growl.warning(locale.getString("habmin.ErrorGettingBindings"));
growl.warning(locale.getString("extensions.ErrorGettingExtensions"));
}
);

$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.selectType = function (extensionType) {
$scope.selectedType = extensionType;
};

$scope.setPanelDisplayed = function (panel) {
$scope.panelDisplayed = panel;
$scope.installExtension = function (extension) {
ExtensionModel.installExtension(extension);
};

$scope.uninstallExtension = function (extension) {
ExtensionModel.uninstallExtension(extension);
};

})

Expand Down
136 changes: 32 additions & 104 deletions src/app/configuration/extensionsConfig.tpl.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,16 @@
<div class="panel panel-default">
<!-- Header -->
<div class="panel-heading">
Extension Sets
<span i18n="extensions.ExtensionTypes"></span>
</div>

<!-- Body -->
<div class="list-group habmin-list" resize-panel>
<!-- BINDING LIST -->
<!-- EXTENSION TYPE 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>
<span>{{extensionType.label}}&nbsp;</span>
</a>
</div>

Expand All @@ -38,113 +38,41 @@
<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>
<span i18n="extensions.Extensions"></span>
</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>
<!-- EXTENSION LIST -->
<div ng-if="extensionsCnt>0"
ng-repeat="extension in extensions | filter: {type: selectedType.id} | orderBy:'label'">
<a role="presentation" ng-class="{'list-group-item':true, 'active': extension==selectedType}">
<span ng-show="extension.inprogress">
<span class="fa fa-fw fa-spin fa-circle-o-notch text-warning"></span>
</span>
<span ng-hide="extension.inprogress">
<span ng-if="extension.installed" class="fa fa-fw fa-check-circle-o text-success"></span>
<span ng-if="!extension.installed" class="fa fa-fw fa-circle-o text-muted"></span>
</span>
<span>{{extension.label}}&nbsp;</span>


<!-- 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>
<span class="pull-right" ng-hide="extension.inprogress">
<button type="button" class="btn btn-xs btn-default"
ng-if="!extension.installed"
ng-click="installExtension(extension)">
<span class="fa fa-fw fa-plus-circle text-success"></span>
<span i18n="extensions.Install"></span>
</button>
<button type="button" class="btn btn-xs btn-default"
ng-if="extension.installed"
ng-click="uninstallExtension(extension)">
<span class="fa fa-fw fa-trash text-danger"></span>
<span i18n="extensions.Uninstall"></span>
</button>
</span>
</a>
</div>
</div>

<!-- Footer -->
Expand Down
Loading

0 comments on commit f006e35

Please # to comment.