Moving inventory pages

the view that displayed the groups/hosts is now mapped to inventories/id/manage and the page for editing an inventory is an inventories/id

awx/ui/static/js/app.js

@@ -39,7 +39,7 @@ import {JobTemplatesList, JobTemplatesAdd, JobTemplatesEdit} from 'tower/control
 import {ScheduleEditController} from 'tower/controllers/Schedules';
 import {ProjectsList, ProjectsAdd, ProjectsEdit} from 'tower/controllers/Projects';
 import {OrganizationsList, OrganizationsAdd, OrganizationsEdit} from 'tower/controllers/Organizations';
-import {InventoriesList, InventoriesAdd, InventoriesEdit} from 'tower/controllers/Inventories';
+import {InventoriesList, InventoriesAdd, InventoriesEdit, InventoriesManage} from 'tower/controllers/Inventories';
 import {AdminsList} from 'tower/controllers/Admins';
 import {UsersList, UsersAdd, UsersEdit} from 'tower/controllers/Users';
 import {TeamsList, TeamsAdd, TeamsEdit} from 'tower/controllers/Teams';
@@ -258,10 +258,15 @@ var tower = angular.module('Tower', [
             }).
 
             when('/inventories/:inventory_id', {
-                templateUrl: urlPrefix + 'partials/inventory-edit.html',
+                templateUrl: urlPrefix + 'partials/inventories.html',
                 controller: InventoriesEdit
             }).
 
+            when('/inventories/:inventory_id/manage', {
+                templateUrl: urlPrefix + 'partials/inventory-manage.html',
+                controller: InventoriesManage
+            }).
+
             when('/organizations', {
                 templateUrl: urlPrefix + 'partials/organizations.html',
                 controller: OrganizationsList

awx/ui/static/js/controllers/Inventories.js

@@ -476,9 +476,117 @@ InventoriesAdd.$inject = ['$scope', '$rootScope', '$compile', '$location', '$log
     'PaginateInit', 'LookUpInit', 'GetBasePath', 'ParseTypeChange', 'Wait', 'ToJSON'
 ];
 
+export function InventoriesEdit($scope, $rootScope, $compile, $location, $log, $routeParams, InventoryForm, GenerateForm, Rest,
+    Alert, ProcessErrors, LoadBreadCrumbs, ReturnToCaller, ClearScope, GenerateList, OrganizationList, SearchInit, PaginateInit,
+    LookUpInit, GetBasePath, ParseTypeChange, Wait, ToJSON) {
+
+    ClearScope();
+
+    // Inject dynamic view
+    var defaultUrl = GetBasePath('inventory'),
+        form = InventoryForm,
+        generator = GenerateForm;
+
+    form.well = true;
+    form.formLabelSize = null;
+    form.formFieldSize = null;
+
+    generator.inject(form, { mode: 'add', related: false, scope: $scope });
+
+    generator.reset();
+    LoadBreadCrumbs();
+
+    $scope.parseType = 'yaml';
+    ParseTypeChange({
+        scope: $scope,
+        variable: 'variables',
+        parse_variable: 'parseType',
+        field_id: 'inventory_variables'
+    });
+
+    LookUpInit({
+        scope:  $scope,
+        form: form,
+        current_item: ($routeParams.organization_id) ? $routeParams.organization_id : null,
+        list: OrganizationList,
+        field: 'organization',
+        input_type: 'radio'
+    });
+
+    // Save
+    $scope.formSave = function () {
+        generator.clearApiErrors();
+        Wait('start');
+        try {
+            var fld, json_data, data;
+
+            json_data = ToJSON($scope.parseType, $scope.variables, true);
+
+            data = {};
+            for (fld in form.fields) {
+                if (fld !== 'variables') {
+                    if (form.fields[fld].realName) {
+                        data[form.fields[fld].realName] =  $scope[fld];
+                    } else {
+                        data[fld] =  $scope[fld];
+                    }
+                }
+            }
+
+            if ($scope.removeUpdateInventoryVariables) {
+                $scope.removeUpdateInventoryVariables();
+            }
+            $scope.removeUpdateInventoryVariables = $scope.$on('UpdateInventoryVariables', function(e, data) {
+                var inventory_id = data.id;
+                Rest.setUrl(data.related.variable_data);
+                Rest.put(json_data)
+                    .success(function () {
+                        Wait('stop');
+                        $location.path('/inventories/' + inventory_id + '/');
+                    })
+                    .error(function (data, status) {
+                        ProcessErrors( $scope, data, status, null, { hdr: 'Error!',
+                            msg: 'Failed to update inventory varaibles. PUT returned status: ' + status
+                        });
+                    });
+            });
+
+            Rest.setUrl(defaultUrl);
+            Rest.post(data)
+                .success(function (data) {
+                    var inventory_id = data.id;
+                    if ($scope.variables) {
+                        $scope.$emit('UpdateInventoryVariables', data);
+                    } else {
+                        Wait('stop');
+                        $location.path('/inventories/' + inventory_id + '/');
+                    }
+                })
+                .error(function (data, status) {
+                    ProcessErrors( $scope, data, status, form, { hdr: 'Error!',
+                        msg: 'Failed to add new inventory. Post returned status: ' + status });
+                });
+        } catch (err) {
+            Wait('stop');
+            Alert("Error", "Error parsing inventory variables. Parser returned: " + err);
+        }
+
+    };
+
+    // Reset
+    $scope.formReset = function () {
+        generator.reset();
+    };
+}
+
+InventoriesEdit.$inject = ['$scope', '$rootScope', '$compile', '$location', '$log', '$routeParams', 'InventoryForm', 'GenerateForm',
+    'Rest', 'Alert', 'ProcessErrors', 'LoadBreadCrumbs', 'ReturnToCaller', 'ClearScope', 'GenerateList', 'OrganizationList', 'SearchInit',
+    'PaginateInit', 'LookUpInit', 'GetBasePath', 'ParseTypeChange', 'Wait', 'ToJSON'
+];
 
 
-export function InventoriesEdit ($log, $scope, $location, $routeParams, $compile, GenerateList, ClearScope, Empty, Wait, Rest, Alert, LoadBreadCrumbs, GetBasePath, ProcessErrors,
+
+export function InventoriesManage ($log, $scope, $location, $routeParams, $compile, GenerateList, ClearScope, Empty, Wait, Rest, Alert, LoadBreadCrumbs, GetBasePath, ProcessErrors,
     Breadcrumbs, InventoryGroups, InjectHosts, Find, HostsReload, SearchInit, PaginateInit, GetSyncStatusMsg, GetHostsStatusMsg, GroupsEdit, InventoryUpdate,
     GroupsCancelUpdate, ViewUpdateStatus, GroupsDelete, Store, HostsEdit, HostsDelete, EditInventoryProperties, ToggleHostEnabled, Stream, ShowJobSummary,
     InventoryGroupsHelp, HelpDialog, ViewJob, WatchInventoryWindowResize, GetHostContainerRows, GetGroupContainerRows, GetGroupContainerHeight,
@@ -1021,9 +1129,9 @@ export function InventoriesEdit ($log, $scope, $location, $routeParams, $compile
     });
 }
 
-InventoriesEdit.$inject = ['$log', '$scope', '$location', '$routeParams', '$compile', 'GenerateList', 'ClearScope', 'Empty', 'Wait', 'Rest', 'Alert', 'LoadBreadCrumbs',
+InventoriesManage.$inject = ['$log', '$scope', '$location', '$routeParams', '$compile', 'GenerateList', 'ClearScope', 'Empty', 'Wait', 'Rest', 'Alert', 'LoadBreadCrumbs',
     'GetBasePath', 'ProcessErrors', 'Breadcrumbs', 'InventoryGroups', 'InjectHosts', 'Find', 'HostsReload', 'SearchInit', 'PaginateInit', 'GetSyncStatusMsg',
     'GetHostsStatusMsg', 'GroupsEdit', 'InventoryUpdate', 'GroupsCancelUpdate', 'ViewUpdateStatus', 'GroupsDelete', 'Store', 'HostsEdit', 'HostsDelete',
     'EditInventoryProperties', 'ToggleHostEnabled', 'Stream', 'ShowJobSummary', 'InventoryGroupsHelp', 'HelpDialog', 'ViewJob', 'WatchInventoryWindowResize',
     'GetHostContainerRows', 'GetGroupContainerRows', 'GetGroupContainerHeight', 'GroupsCopy', 'HostsCopy', 'Socket'
-    ];
+    ];

awx/ui/static/js/lists/Inventories.js

@@ -48,7 +48,8 @@ export default
                 key: true,
                 label: 'Name',
                 columnClass: 'col-md-4 col-sm-6 col-xs-6',
-                modalColumnClass: 'col-md-8'
+                modalColumnClass: 'col-md-8',
+                linkTo: '/#/inventories/{{inventory.id}}/manage'
             },
             organization: {
                 label: 'Organization',
@@ -105,7 +106,7 @@ export default
             },
             edit: {
                 label: 'Edit',
-                ngClick: 'editInventoryProperties(inventory.id)',
+                ngClick: 'editInventory(inventory.id)', //'editInventoryProperties(inventory.id)',
                 awToolTip: 'Edit inventory',
                 dataPlacement: 'top'
             },

awx/ui/static/partials/inventory-edit.html

@@ -1,159 +0,0 @@
-<div class="tab-pane" id="inventory_edit">
-    <div ng-cloak id="htmlTemplate">
-
-        <ul class="ansible-breadcrumb" id="#breadcrumbs">
-            <li><a href="#/inventories">Inventories</a></li>
-            <!-- <li><a href="">{{ inventory.name }}</a></li> -->
-            <li ng-repeat="group_breadcrumb in group_breadcrumbs" ng-class="group_breadcrumb.active_class"><a href="" ng-click="breadcrumbGroupSelect(group_breadcrumb.id)">{{ group_breadcrumb.name }}</a></li>
-        </ul>
-
-        <div class="row">
-            <div id="groups-container" class="col-lg-6">
-                <div id="group-list-container"></div>
-            </div>
-            <div id="hosts-container" class="col-lg-6"></div>
-        </div>
-
-        <div id="inventory-modal-container"></div>
-
-        <div id="group-copy-dialog" style="display: none;">
-            <div id="copy-group-radio-container" class="well">
-                <div class="title"><span class="highlight">1.</span> Copy or move <span ng-bind="name"></span>?</div>
-                <div class="form-group">
-                    <label class="radio-inline">
-                        <input type="radio" ng-model="copy_choice" value="copy"> Copy
-                    </label>
-                    <label class="radio-inline">
-                        <input type="radio" ng-model="copy_choice" value="move"> Move
-                    </label>
-                </div>
-            </div>
-            <div id="copy-group-target-container" class="well">
-                <div class="title" ng-show="offer_root_group"><span class="highlight">2.</span> Select a target group below, OR choose the inventory root:
-                    <div class="form-group">
-                        <label><input type="checkbox" ng-model="use_root_group" ng-change="toggleUseRootGroup()"> Use the inventory root</label>
-                    </div>
-                </div>
-                <div class="title" ng-show="!offer_root_group"><span class="highlight">2.</span> Select a target group:</div>
-                <div id="copy-select-container" ng-show="!use_root_group"></div>
-            </div>
-        </div>
-
-        <div id="host-copy-dialog" style="display: none;">
-            <div id="copy-group-radio-container" class="well">
-                <div class="title"><span class="highlight">1.</span> Copy or move <span ng-bind="name"></span>?</div>
-                <div class="form-group">
-                    <label class="radio-inline">
-                        <input type="radio" ng-model="copy_choice" value="copy"> Copy
-                    </label>
-                    <label class="radio-inline">
-                        <input type="radio" ng-model="copy_choice" value="move"> Move
-                    </label>
-                </div>
-            </div>
-            <div id="copy-group-target-container" class="well">
-                <div class="title"><span class="highlight">2.</span> Select a target group:</div>
-                <div id="copy-host-select-container"></div>
-            </div>
-        </div>
-
-        <div id="group-modal-dialog" style="display: none;">
-            <ul id="group_tabs" class="nav nav-tabs">
-                <li class="active"><a id="properties_link" ng-click="toggleTab($event, 'properties_link', 'group_tabs')"
-                        href="#properties-tab" data-toggle="tab">Properties</a></li>
-                <li ng-show="showSourceTab"><a id="source_link" ng-click="toggleTab($event, 'source_link', 'group_tabs')"
-                        href="#sources-tab" data-toggle="tab">Source</a></li>
-                <li ng-show="showSchedulesTab"><a id="schedules_link" ng-click="toggleTab($event, 'schedules_link', 'group_tabs')"
-                        href="#schedules-tab" data-toggle="tab">Schedule</a></li>
-            </ul>
-            <div class="tab-content">
-                <div class="tab-pane active" id="properties-tab"></div>
-                <div class="tab-pane" id="sources-tab"></div>
-                <div class="tab-pane" id="schedules-tab">
-                    <div id="schedules-overlay"></div>
-                    <div id="schedules-list"></div>
-                    <div id="schedules-form-container">
-                        <div id="schedules-title">
-                            <h4 ng-bind="schedulesTitle"></h4>
-                            <button type="button" class="close pull-right" ng-click="cancelScheduleForm()">x</button>
-                        </div>
-                        <div id="schedules-form-container-body">
-                            <div id="schedules-form"></div>
-                            <div id="schedules-detail"></div>
-                        </div>
-                        <div id="schedules-buttons">
-                            <a id="schedules-flip-link" ng-show="formShowing" ng-click="showScheduleDetail()" href=""><i class="fa fa-search-plus"></i> View Details</a>
-                            <a id="schedules-flip-link" ng-show="!formShowing" ng-click="showScheduleDetail()" href=""><i class="fa fa-arrow-circle-left"></i> Back to options</a>
-                            <button type="button" class="btn btn-default btn-sm" id="reset-button" ng-click="cancelScheduleForm()"><i class="fa fa-times"></i> Cancel</button>
-                            <button type="button" class="btn btn-primary btn-sm" id="save-button" ng-click="saveScheduleForm()"><i class="fa fa-check"></i> Save</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div id="host-modal-dialog" style="display: none;" class="dialog-content"></div>
-
-        <div id="group-delete-dialog" style="display: none;" class="dialog-content">
-            <div ng-show="groupsCount > 0 || hostsCount > 0">
-                <div class="alert alert-info">
-                    <p>Deleting group <em>{{ group_name }}</em>.
-                    <span ng-show="groupsCount > 0 && hostsCount > 0"> This group contains {{ groupsCount }} groups and {{ hostsCount }} hosts. </span>
-                    <span ng-show="groupsCount == 0 && hostsCount > 0"> This group contains {{ hostsCount }} hosts. </span>
-                    <span ng-show="groupsCopunt > 0 && hostsCount == 0"> This group contains {{ groupsCount }} groups. </span>
-                    Delete or promote the group's children?</p>
-                    <div style="width: 50%; margin: 15px auto;">
-
-                        <div class="radio" ng-show="groupsCount > 0 && hostsCount > 0">
-                            <label>
-                                <input type="radio" ng-model="deleteOption" name="delete_option1" value="preserve-all"> Promote groups and hosts
-                            </label>
-                        </div>
-                        <div class="radio" ng-show="groupsCount > 0 && hostsCount > 0">
-                            <label>
-                                <input type="radio" ng-model="deleteOption" name="delete_option1" value="delete-all"> Delete groups and hosts
-                            </label>
-                        </div>
-
-                        <div class="radio" ng-show="groupsCount > 0 && hostsCount == 0">
-                            <label>
-                                <input type="radio" ng-model="deleteOption" name="delete_option2" value="preserve-all"> Promote groups
-                            </label>
-                        </div>
-                        <div class="radio" ng-show="groupsCount > 0 && hostsCount == 0">
-                            <label>
-                                <input type="radio" ng-model="deleteOption" name="delete_option2" value="delete-all"> Delete groups
-                            </label>
-                        </div>
-
-                        <div class="radio" ng-show="groupsCount == 0 && hostsCount > 0">
-                            <label>
-                                <input type="radio" ng-model="deleteOption" name="delete_option3" value="preserve-all"> Promote hosts
-                            </label>
-                        </div>
-                        <div class="radio" ng-show="groupsCount == 0 && hostsCount > 0">
-                            <label>
-                                <input type="radio" ng-model="deleteOption" name="delete_option3" value="delete-all"> Delete hosts
-                            </label>
-                        </div>
-
-                    </div>
-
-                </div>
-
-                <div class="help-container" style="text-align:right;">
-                    <a href="" id="awp-promote" href="" aw-pop-over="{{ helpText }}" aw-tool-tip="Click for help" aw-pop-over-watch="helpText" data-placement="top" data-container="body" data-title="Help" class="help-link"><i class="fa fa-question-circle"></i> click for help</a>
-                </div>
-
-            </div>
-            <div ng-show="groupsCount == 0 && hostsCount == 0">
-                <div class="alert alert-info">Delete group <em>{{ group_name }}</em>?</div>
-            </div>
-        </div>
-
-        <div id="inventory-edit-modal-dialog"></div>
-
-        <div ng-include="'/static/partials/logviewer.html'"></div>
-
-    </div>
-</div>