Merge pull request #2237 from jaredevantabor/networking

Network UI fixes
This commit is contained in:
Jared Tabor 2018-06-20 15:47:33 -07:00 committed by GitHub
commit f38b01c80e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 113 additions and 91 deletions

View File

@ -5,7 +5,7 @@
*************************************************/
export default ['i18n', function(i18n) {
export default ['i18n', 'awxNetStrings' , function(i18n, awxNetStrings) {
return {
name: 'inventories',
@ -102,9 +102,9 @@ export default ['i18n', function(i18n) {
ngShow: '!inventory.pending_deletion && inventory.summary_fields.user_capabilities.edit'
},
network: {
label: i18n._('Network Visualization'),
label: awxNetStrings.get('feature.ACTION_BUTTON'),
ngClick: 'goToGraph(inventory)',
awToolTip: i18n._('Network Visualization'),
awToolTip: awxNetStrings.get('feature.ACTION_BUTTON'),
dataPlacement: 'top',
ngShow: '!inventory.pending_deletion'
},

View File

@ -86,7 +86,12 @@ function InventoriesList($scope,
};
$scope.goToGraph = function(inventory){
$state.go('inventories.edit.networking', {inventory_id: inventory.id, inventory_name: inventory.name});
if(inventory.kind && inventory.kind === 'smart') {
$state.go('inventories.editSmartInventory.networking', {smartinventory_id: inventory.id, inventory_name: inventory.name});
}
else {
$state.go('inventories.edit.networking', {inventory_id: inventory.id, inventory_name: inventory.name});
}
};
$scope.editInventory = function (inventory, reload) {

View File

@ -46,6 +46,7 @@ import groupNestedGroupsAssociateRoute from './related/groups/related/nested-gro
import nestedHostsAssociateRoute from './related/groups/related/nested-hosts/group-nested-hosts-associate.route';
import nestedHostsAddRoute from './related/groups/related/nested-hosts/group-nested-hosts-add.route';
import hostCompletedJobsRoute from '~features/jobs/routes/hostCompletedJobs.route.js';
import networkUIRoute from '../../network-ui/network.ui.route.js';
export default
angular.module('inventory', [
@ -294,6 +295,9 @@ angular.module('inventory', [
let relatedHostCompletedJobs = _.cloneDeep(hostCompletedJobsRoute);
relatedHostCompletedJobs.name = 'inventories.edit.hosts.edit.completed_jobs';
let smartInvNetworkUI = _.cloneDeep(networkUIRoute);
smartInvNetworkUI.name = 'inventories.editSmartInventory.networking';
return Promise.all([
standardInventoryAdd,
standardInventoryEdit,
@ -342,7 +346,9 @@ angular.module('inventory', [
stateExtender.buildDefinition(nestedHostsAssociateRoute),
stateExtender.buildDefinition(nestedGroupsAdd),
stateExtender.buildDefinition(nestedHostsAddRoute),
stateExtender.buildDefinition(relatedHostCompletedJobs)
stateExtender.buildDefinition(relatedHostCompletedJobs),
stateExtender.buildDefinition(networkUIRoute),
stateExtender.buildDefinition(smartInvNetworkUI)
])
};
});

View File

@ -95,6 +95,10 @@ function SmartInventoryEdit($scope, $location,
});
};
$scope.goToGraph = function(){
$state.go('inventories.editSmartInventory.networking', {smartinventory_id: $scope.inventory_obj.id, inventory_name: $scope.inventory_obj.name});
};
$scope.formCancel = function() {
$state.go('inventories');
};

View File

@ -4,7 +4,7 @@
* All Rights Reserved
*************************************************/
export default ['i18n', function(i18n) {
export default ['i18n', 'awxNetStrings', function(i18n, awxNetStrings) {
return {
addTitle: i18n._('NEW SMART INVENTORY'),
@ -156,6 +156,14 @@ export default ['i18n', function(i18n) {
skipGenerator: true,
ngClick: "$state.go('inventories.editSmartInventory.completed_jobs')"
}
},
relatedButtons: {
network: {
ngClick: 'goToGraph()',
label: awxNetStrings.get('feature.ACTION_BUTTON'),
class: 'Form-primaryButton',
ngShow: "$state.is('inventories.editSmartInventory')"
}
}
};

View File

@ -99,6 +99,10 @@ function InventoriesEdit($scope, $location,
});
};
$scope.goToGraph = function(){
$state.go('inventories.edit.networking', {inventory_id: $scope.inventory_obj.id, inventory_name: $scope.inventory_obj.name});
};
$scope.formCancel = function() {
$state.go('inventories');
};

View File

@ -10,8 +10,8 @@
* @description This form is for adding/editing an inventory
*/
export default ['i18n',
function(i18n) {
export default ['i18n', 'awxNetStrings',
function(i18n, awxNetStrings) {
return {
addTitle: i18n._('NEW INVENTORY'),
@ -174,9 +174,15 @@ function(i18n) {
}
},
relatedButtons: {
network: {
ngClick: 'goToGraph()',
ngShow: "$state.is('inventories.edit')",
label: awxNetStrings.get('feature.ACTION_BUTTON'),
class: 'Form-primaryButton'
},
remediate_inventory: {
ngClick: 'remediateInventory(id, insights_credential)',
ngShow: 'is_insights && mode !== "add" && canRemediate',
ngShow: "is_insights && mode !== 'add' && canRemediate && ($state.is('inventories.edit') || $state.is('inventories.edit.hosts'))",
label: i18n._('Remediate Inventory'),
class: 'Form-primaryButton'
}

View File

@ -22,7 +22,7 @@ function NullChannel(from_controller, tracer) {
NullChannel.prototype.send = function() {
};
function FSMController (scope, name, initial_state, tracer) {
function FSMController (scope, name, initial_state, tracer, log) {
this.scope = scope;
this.name = name;
this.state = initial_state;
@ -32,6 +32,7 @@ function FSMController (scope, name, initial_state, tracer) {
this.handling_message_type = 'start';
this.state.start(this);
this.handling_message_type = null;
this.log = log;
}
exports.FSMController = FSMController;

View File

@ -91,6 +91,7 @@
<text
class="NetworkUI__toolbox--title"
filter="url(#background)"
ng-if="toolbox.enabled"
ng-attr-transform="translate({{toolbox.title_coordinates.x}},{{toolbox.title_coordinates.y}})">
{{toolbox.name}}
</text>

View File

@ -174,7 +174,7 @@ _Ready.prototype.onPasteDevice = function (controller, msg_type, message) {
}
scope.selected_devices.push(device);
device.selected = true;
console.log(c_messages);
controller.log.debug(c_messages);
scope.$emit('awxNet-addSearchOption', device);
scope.send_control_message(new messages.MultipleMessage(controller.scope.client_id, c_messages));
controller.changeState(Selected2);

View File

@ -14,7 +14,7 @@
};
}
$scope.codeMirror = new codemirror();
$scope.formCancel = function(){
$scope.formClose = function(){
$scope.$parent.$broadcast('awxNet-closeDetailsPanel');
};
$scope.strings = strings;

View File

@ -40,7 +40,7 @@
</div>
</form>
<div class="buttons Form-buttons" id="host_controls">
<button type="button" class="btn btn-sm Form-cancelButton" id="host_cancel_btn" ng-click="formCancel()"> {{strings.get('details.CANCEL')}}</button>
<button type="button" class="btn btn-sm Form-cancelButton" id="host_cancel_btn" ng-click="formClose()"> {{strings.get('details.CLOSE')}}</button>
</div>
<div class="Networking-saveConfirmation" ng-show="saveConfirmed">
{{strings.get('details.SAVE_COMPLETE')}} <i class="fa fa-check-circle"></i>

View File

@ -1,54 +1,6 @@
import NetworkingController from './network.nav.controller';
const MODULE_NAME = 'at.features.networking';
const networkNavTemplate = require('~network-ui/network-nav/network.nav.view.html');
function NetworkingResolve ($stateParams, resourceData) {
const resolve = {
inventory: {
id: $stateParams.inventory_id,
name: $stateParams.inventory_name
},
canEdit: resourceData.data.summary_fields.user_capabilities.edit
};
if (!resolve.inventory.name) {
resolve.inventory.name = resourceData.data.name;
}
return resolve;
}
NetworkingResolve.$inject = [
'$stateParams',
'resourceData'
];
function NetworkingRun ($stateExtender, strings) {
$stateExtender.addState({
name: 'inventories.edit.networking',
route: '/networking',
ncyBreadcrumb: {
label: strings.get('state.BREADCRUMB_LABEL')
},
views: {
'networking@': {
templateUrl: networkNavTemplate,
controller: NetworkingController,
controllerAs: 'vm'
}
},
resolve: {
resolvedModels: NetworkingResolve
}
});
}
NetworkingRun.$inject = [
'$stateExtender',
'awxNetStrings'
];
angular
.module(MODULE_NAME, [])
.run(NetworkingRun);
.module(MODULE_NAME, []);
export default MODULE_NAME;

View File

@ -1,15 +1,12 @@
/* eslint-disable */
function NetworkingController (models, $state, $scope, strings) {
function NetworkingController (canEdit, inventory, $state, $scope, strings) {
const vm = this || {};
const {
inventory
} = models;
vm.networkUIisOpen = true;
vm.strings = strings;
vm.panelTitle = `${strings.get('state.BREADCRUMB_LABEL')} | ${inventory.name}`;
vm.hostDetail = {};
vm.canEdit = models.canEdit;
vm.canEdit = canEdit;
vm.rightPanelIsExpanded = false;
vm.leftPanelIsExpanded = true;
vm.keyPanelExpanded = false;
@ -131,7 +128,8 @@ function NetworkingController (models, $state, $scope, strings) {
}
NetworkingController.$inject = [
'resolvedModels',
'canEdit',
'inventory',
'$state',
'$scope',
'awxNetStrings',

View File

@ -5,7 +5,6 @@ import networkDetailsDirective from './network-details/main';
import networkZoomWidget from './zoom-widget/main';
import awxNetStrings from './network.ui.strings';
//console.log = function () { };
var NetworkUIController = require('./network.ui.controller.js');
var cursor = require('./cursor.directive.js');
var router = require('./router.directive.js');

View File

@ -42,7 +42,7 @@ var NetworkUIController = function($scope,
$scope.topology_id = 0;
// Create a web socket to connect to the backend server
$scope.inventory_id = $state.params.inventory_id;
$scope.inventory_id = $scope.$parent.$resolve.inventory.id;
var protocol = null;
@ -153,7 +153,7 @@ var NetworkUIController = function($scope,
from_y: 0,
to_x: 0,
to_y: 0};
$scope.canEdit = $scope.$parent.$resolve.resolvedModels.canEdit;
$scope.canEdit = $scope.$parent.$resolve.canEdit;
$scope.strings = awxNetStrings;
$scope.send_trace_message = function (message) {
if (!$scope.recording) {
@ -194,17 +194,17 @@ var NetworkUIController = function($scope,
};
//Define the FSMs
$scope.hotkeys_controller = new fsm.FSMController($scope, "hotkeys_fsm", hotkeys.Start, $scope);
$scope.keybindings_controller = new fsm.FSMController($scope, "keybindings_fsm", keybindings.Start, $scope);
$scope.view_controller = new fsm.FSMController($scope, "view_fsm", view.Start, $scope);
$scope.move_controller = new fsm.FSMController($scope, "move_fsm", move.Start, $scope);
$scope.move_readonly_controller = new fsm.FSMController($scope, "move_readonly_fsm", move_readonly.Start, $scope);
$scope.details_panel_controller = new fsm.FSMController($scope, "details_panel_fsm", details_panel_fsm.Start, $scope);
$scope.buttons_controller = new fsm.FSMController($scope, "buttons_fsm", buttons.Start, $scope);
$scope.time_controller = new fsm.FSMController($scope, "time_fsm", time.Start, $scope);
$scope.test_controller = new fsm.FSMController($scope, "test_fsm", test_fsm.Start, $scope);
$scope.hotkeys_controller = new fsm.FSMController($scope, "hotkeys_fsm", hotkeys.Start, $scope, $log);
$scope.keybindings_controller = new fsm.FSMController($scope, "keybindings_fsm", keybindings.Start, $scope, $log);
$scope.view_controller = new fsm.FSMController($scope, "view_fsm", view.Start, $scope, $log);
$scope.move_controller = new fsm.FSMController($scope, "move_fsm", move.Start, $scope, $log);
$scope.move_readonly_controller = new fsm.FSMController($scope, "move_readonly_fsm", move_readonly.Start, $scope, $log);
$scope.details_panel_controller = new fsm.FSMController($scope, "details_panel_fsm", details_panel_fsm.Start, $scope, $log);
$scope.buttons_controller = new fsm.FSMController($scope, "buttons_fsm", buttons.Start, $scope, $log);
$scope.time_controller = new fsm.FSMController($scope, "time_fsm", time.Start, $scope, $log);
$scope.test_controller = new fsm.FSMController($scope, "test_fsm", test_fsm.Start, $scope, $log);
$scope.inventory_toolbox_controller = new fsm.FSMController($scope, "toolbox_fsm", toolbox_fsm.Start, $scope);
$scope.inventory_toolbox_controller = new fsm.FSMController($scope, "toolbox_fsm", toolbox_fsm.Start, $scope, $log);
var toolboxTopMargin = $('.Networking-top').height();
var toolboxTitleMargin = toolboxTopMargin + 35;

View File

@ -0,0 +1,34 @@
import { N_ } from '../i18n';
import NetworkingController from './network-nav/network.nav.controller';
const networkNavTemplate = require('~network-ui/network-nav/network.nav.view.html');
export default {
name: 'inventories.edit.networking',
route: '/networking',
ncyBreadcrumb: {
label: N_("INVENTORIES")
},
views: {
'networking@': {
templateUrl: networkNavTemplate,
controller: NetworkingController,
controllerAs: 'vm'
}
},
resolve: {
inventory: ['$stateParams', 'resourceData',
function($stateParams, resourceData){
let inventory = {
name: $stateParams.inventory_name || resourceData.data.name,
id: $stateParams.inventory_id || $stateParams.smartinventory_id
};
return inventory;
}],
canEdit: ['$stateParams', 'resourceData',
function($stateParams, resourceData){
return resourceData.data.summary_fields.user_capabilities.edit;
}
]
}
};

View File

@ -4,8 +4,12 @@ function awxNetStrings (BaseString) {
const { t } = this;
const ns = this.awxNet;
ns.feature = {
ACTION_BUTTON: t.s('Network Visualizer')
};
ns.state = {
BREADCRUMB_LABEL: t.s('INVENTORIES')
BREADCRUMB_LABEL: t.s('NETWORK VISUALIZER')
};
ns.toolbox = {
@ -13,7 +17,7 @@ function awxNetStrings (BaseString) {
};
ns.actions = {
ACTIONS: t.s('Actions'),
ACTIONS: t.s('ACTIONS'),
EXPORT: t.s('Export'),
EXPAND_PANEL: t.s('Expand Panel'),
COLLAPSE_PANEL: t.s('Collapse Panel')
@ -29,7 +33,7 @@ function awxNetStrings (BaseString) {
};
ns.search = {
SEARCH: t.s('Search'),
SEARCH: t.s('SEARCH'),
HOST: t.s('Host'),
SWITCH: t.s('Switch'),
ROUTER: t.s('Router'),
@ -46,7 +50,7 @@ function awxNetStrings (BaseString) {
DESCRIPTION: t.s('Description'),
HOST_POPOVER: t.s('Provide a host name, ip address, or ip address:port. Examples include:'),
SAVE_COMPLETE: t.s('Save Complete'),
CANCEL: t.s('Cancel')
CLOSE: t.s('Close')
};
}

View File

@ -117,7 +117,7 @@ _Reporting.prototype.start = function (controller) {
new Date().toISOString(),
controller.scope.version);
controller.scope.test_results.push(test_result);
console.log(["Reporting test", test_result.name, test_result.id]);
controller.log.debug(["Reporting test", test_result.name, test_result.id]);
controller.scope.send_test_message(new messages.TestResult(controller.scope.client_id,
test_result.id,
test_result.name,
@ -125,7 +125,7 @@ _Reporting.prototype.start = function (controller) {
test_result.date,
test_result.code_under_test));
if (typeof(window.__coverage__) !== "undefined" && window.__coverage__ !== null) {
console.log(["Reporting coverage", test_result.name, test_result.id]);
controller.log.debug(["Reporting coverage", test_result.name, test_result.id]);
controller.scope.send_test_message(new messages.Coverage(controller.scope.client_id, window.__coverage__, test_result.id));
}
controller.changeState(Loading);
@ -138,7 +138,7 @@ _Loading.prototype.start = function (controller) {
if (controller.scope.current_tests.length === 0) {
controller.changeState(Disabled);
} else {
console.log("Starting test");
controller.log.debug("Starting test");
controller.scope.reset_coverage();
controller.scope.current_test = controller.scope.current_tests.shift();
controller.scope.reset_toolboxes();
@ -169,7 +169,7 @@ _Ready.prototype.start = function (controller) {
var load_id = controller.scope.test_result_id_seq();
console.log(["Reporting Load", load_id]);
controller.log.debug(["Reporting Load", load_id]);
controller.scope.send_test_message(new messages.TestResult(controller.scope.client_id,
load_id,
"Load",
@ -177,7 +177,7 @@ _Ready.prototype.start = function (controller) {
new Date().toISOString(),
controller.scope.version));
if (typeof(window.__coverage__) !== "undefined" && window.__coverage__ !== null) {
console.log(["Reporting Load Coverage", load_id]);
controller.log.debug(["Reporting Load Coverage", load_id]);
controller.scope.send_test_message(new messages.Coverage(controller.scope.client_id, window.__coverage__, load_id));
}

View File

@ -150,7 +150,7 @@ export default
if(this.socket){
this.socket.close();
delete this.socket;
console.log("Socket deleted: "+this.socket);
$log.debug("Socket deleted: "+this.socket);
}
},
subscribe: function(state){