GUI -- Bug fixing and refactoring app view - WIP.
Change-Id: I23012972ac762a62391289a2200bf0b95e4ed9c3
diff --git a/web/gui/src/main/webapp/app/view/app/app.html b/web/gui/src/main/webapp/app/view/app/app.html
index 0420cff..3b78853 100644
--- a/web/gui/src/main/webapp/app/view/app/app.html
+++ b/web/gui/src/main/webapp/app/view/app/app.html
@@ -7,10 +7,22 @@
icon icon-size="36" icon-id="refresh"
ng-click="toggleRefresh()"></div>
<div class="separator"></div>
- <div id="app-install" icon icon-size="36" icon-id="plus" class="active"></div>
- <div id="app-activate" icon icon-size="36" icon-id="play"></div>
- <div id="app-deactivate" icon icon-size="36" icon-id="stop"></div>
- <div id="app-uninstall" icon icon-size="36" icon-id="garbage"></div>
+ <div id="app-install"
+ icon icon-size="36" icon-id="plus"
+ class="active">
+ </div>
+ <div id="app-activate"
+ icon icon-size="36" icon-id="play"
+ ng-class="{active: ctrlBtnState.installed}">
+ </div>
+ <div id="app-deactivate"
+ icon icon-size="36" icon-id="stop"
+ ng-class="{active: ctrlBtnState.active}">
+ </div>
+ <div id="app-uninstall"
+ icon icon-size="36" icon-id="garbage"
+ ng-class="{active: ctrlBtnState.selection}">
+ </div>
</div>
<form id="app-form" method="POST" action="rs/applications/upload"
diff --git a/web/gui/src/main/webapp/app/view/app/app.js b/web/gui/src/main/webapp/app/view/app/app.js
index 50e0063..29cc9b6 100644
--- a/web/gui/src/main/webapp/app/view/app/app.js
+++ b/web/gui/src/main/webapp/app/view/app/app.js
@@ -21,23 +21,39 @@
(function () {
'use strict';
- var selRow, selection;
+ var selectionObj;
angular.module('ovApp', [])
.controller('OvAppCtrl',
- ['$log', '$scope', 'TableBuilderService', 'WebSocketService',
+ ['$log', '$scope', 'FnService', 'TableBuilderService', 'WebSocketService',
- function ($log, $scope, tbs, wss) {
+ function ($log, $scope, fs, tbs, wss) {
+ $scope.ctrlBtnState = {};
+ // TODO: clean up view
+ // all DOM manipulation (adding styles, getting elements and doing stuff
+ // with them) should be done in directives
+
function selCb($event, row) {
- selRow = angular.element($event.currentTarget);
- selection = row;
+ $scope.ctrlBtnState.selection = !!$scope.selId;
+ selectionObj = row;
$log.debug('Got a click on:', row);
- // adjust which toolbar buttons are selected
- d3.select('#app-activate').classed('active', row && row.state === 'INSTALLED');
- d3.select('#app-deactivate').classed('active', row && row.state === 'ACTIVE');
- d3.select('#app-uninstall').classed('active', row);
+
+ if ($scope.ctrlBtnState.selection) {
+ $scope.ctrlBtnState.installed = row.state === 'INSTALLED';
+ $scope.ctrlBtnState.active = row.state === 'ACTIVE';
+ } else {
+ $scope.ctrlBtnState.installed = false;
+ $scope.ctrlBtnState.active = false;
+ }
}
+ tbs.buildTable({
+ scope: $scope,
+ tag: 'app',
+ selCb: selCb
+ });
+
+ // TODO: use d3 click events -- move to directive
d3.select('#app-install').on('click', function () {
$log.debug('Initiating install');
var evt = document.createEvent("HTMLEvents");
@@ -45,18 +61,21 @@
document.getElementById('file').dispatchEvent(evt);
});
+ // TODO: use d3 to select elements -- move to directive
document.getElementById('app-form-response').onload = function () {
document.getElementById('app-form').reset();
- $scope.refresh();
+ $scope.$apply();
+ //$scope.sortCallback($scope.sortParams);
};
function appAction(action) {
- if (selection) {
- $log.debug('Initiating uninstall of', selection);
- wss.sendEvent('appManagementRequest', {action: action, name: selection.id});
+ if ($scope.ctrlBtnState.selection) {
+ $log.debug('Initiating ' + action + ' of', selectionObj);
+ wss.sendEvent('appManagementRequest', {action: action, name: selectionObj.id});
}
}
+ // TODO: use d3 to select elements -- move to directive
d3.select('#file').on('change', function () {
var file = document.getElementById('file').value.replace('C:\\fakepath\\', '');
$log.info('Handling file', file);
@@ -65,16 +84,11 @@
document.getElementById('app-upload').dispatchEvent(evt);
});
+ // TODO: move to directive
d3.select('#app-uninstall').on('click', function () { appAction('uninstall'); });
d3.select('#app-activate').on('click', function () { appAction('activate'); });
d3.select('#app-deactivate').on('click', function () { appAction('deactivate'); });
- tbs.buildTable({
- scope: $scope,
- tag: 'app',
- selCb: selCb
- });
-
$log.log('OvAppCtrl has been created');
}]);
}());