shaba/awx
1
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2024-10-31 23:51:09 +03:00
Code Releases Activity

restyle & modularize Portal Mode, resolves #940 & #939

Browse Source 
freeze codebase before separating PortalJobs & PortalJobTemplates into separate views
This commit is contained in:
Leigh Johnson 2016-03-30 21:22:00 -04:00
parent b6706662a4
commit 7ed44ec167
12 changed files with 156 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
awx/ui/client/src/app.js
View File

@ -24,7 +24,7 @@ import {Home, HomeGroups, HomeHosts} from './controllers/Home';
import {SocketsController} from './controllers/Sockets';
import {CredentialsAdd, CredentialsEdit, CredentialsList} from './controllers/Credentials';
import {JobsListController} from './controllers/Jobs';
import {PortalController} from './controllers/Portal';
import portalMode from './portal-mode/main';
import systemTracking from './system-tracking/main';
import inventories from './inventories/main';
import inventoryScripts from './inventory-scripts/main';
@ -109,6 +109,7 @@ var tower = angular.module('Tower', [
standardOut.name,
access.name,
JobTemplates.name,
portalMode.name,
'templates',
'Utilities',
'OrganizationFormDefinition',
@ -291,20 +292,6 @@ var tower = angular.module('Tower', [
}
}).
state('portal', {
url: '/portal',
templateUrl: urlPrefix + 'partials/portal.html',
controller: PortalController,
ncyBreadcrumb: {
label: "PORTAL"
},
resolve: {
features: ['FeaturesService', function(FeaturesService) {
return FeaturesService.get();
}]
}
}).
state('projects', {
url: '/projects',
templateUrl: urlPrefix + 'partials/projects.html',
@ -828,7 +815,7 @@ var tower = angular.module('Tower', [
$rootScope.$emit('JobStatusChange-jobDetails', data);
} else if ($state.is('dashboard')) {
$rootScope.$emit('JobStatusChange-home', data);
} else if ($state.is('portal')) {
} else if ($state.is('portalMode')) {
$rootScope.$emit('JobStatusChange-portal', data);
} else if ($state.is('projects')) {
$rootScope.$emit('JobStatusChange-projects', data);

3
awx/ui/client/src/helpers/Jobs.js
View File

@ -381,8 +381,7 @@ export default
mode: 'edit',
id: id,
scope: scope,
showSearch: false,
title: false
showSearch: false
});
SearchInit({

5
awx/ui/client/src/lists/PortalJobTemplates.js
View File

@ -13,6 +13,7 @@ export default
iterator: 'job_template',
// selectTitle: 'Add Job Template',
editTitle: 'Job Templates',
listTitle: 'Job Templates',
// selectInstructions: "Click on a row to select it, and click Finished when done. Use the <i class=\"icon-plus\"></i> " +
// "button to create a new job template.",
index: false,
@ -22,9 +23,9 @@ export default
fields: {
name: {
key: true,
noLink: true,
label: 'Name',
columnClass: 'col-lg-5 col-md-5 col-sm-9 col-xs-8'
columnClass: 'col-lg-5 col-md-5 col-sm-9 col-xs-8',
linkTo: '/#/job_templates/{{job_template.id}}'
},
description: {
label: 'Description',

25
awx/ui/client/src/lists/PortalJobs.js
View File

@ -16,6 +16,7 @@ export default
index: false,
hover: true,
well: true,
listTitle: 'Jobs',
fields: {
status: {
@ -34,39 +35,31 @@ export default
{ name: "Canceled", value: "canceled" }
]
},
/*
id: {
label: 'ID',
key: true,
noLink: true, //undocumented: 'key' above will automatically made the fields a link, but 'noLink' will override this setting
desc: true,
searchType: 'int',
columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2 List-staticColumnAdjacent',
columnClass: 'col-xs-2 List-staticColumnAdjacent',
},
*/
name: {
label: 'Name',
columnClass: 'col-lg-4 col-md-4 col-sm-4 col-xs-6',
defaultSearchField: true
defaultSearchField: true,
linkTo: '/#/jobs/{{portal_job.id}}'
},
started: {
label: 'Started',
noLink: true,
searchable: false,
filter: "longDate",
columnClass: "col-lg-4 col-md-4 col-sm-3 xs-hidden"
nosort: true,
columnClass: "col-lg-4 col-md-4 col-sm-3 hidden-xs"
}
},
actions: { },
fieldActions: {
columnClass: 'col-lg-3 col-md-4 col-sm-3 col-xs-4',
job_details: {
mode: 'all',
ngClick: "viewJobDetails(portal_job)",
awToolTip: 'View job details',
dataPlacement: 'top'
}
}
actions: { }
});

22
awx/ui/client/src/main-menu/main-menu.partial.html
View File

@ -58,6 +58,14 @@
SETTINGS
</span>
</a>
<a class="MainMenu-item"
id="main_menu_setup_mobile_link"
ui-sref="portalMode"
ng-class="{'is-currentRoute' : isCurrentRoute('portalMode')}">
<span class="MainMenu-itemText">
PORTAL MODE
</span>
</a>
<a class="MainMenu-item"
id="main_menu_docs_mobile_link"
ng-href="http://docs.ansible.com/ansible-tower/"
@ -127,7 +135,7 @@
</a>
<a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
id="main_menu_setup_link"
ng-href="/#/setup"
ui-href="/#/setup"
ng-class="{'is-currentRoute' : isCurrentRoute('setup'), 'is-loggedOut' : !$root.current_user.username}"
aw-tool-tip="Settings"
data-placement="bottom"
@ -137,6 +145,18 @@
alt="Settings">
</i>
</a>
<a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
id="main_menu_portal_link"
ng-href="/#/portal"
ng-class="{'is-currentRoute' : isCurrentRoute('portalMode'), 'is-loggedOut' : !$root.current_user.username}"
aw-tool-tip="Portal Mode"
data-placement="bottom"
data-trigger="hover"
data-container="body">
<i class="MainMenu-itemImage MainMenu-itemImage--settings fa fa-columns"
alt="Portal Mode">
</i>
</a>
<a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
id="main_menu_docs_link"
ng-href="http://docs.ansible.com/ansible-tower/"

15
awx/ui/client/src/portal-mode/main.js Normal file
View File

@ -0,0 +1,15 @@
/*************************************************
* Copyright (c) 2016 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
import route from './portal-mode.route';
import {PortalModeController} from './portal-mode.controller';
export default
angular.module('portalMode', [])
.controller('PortalModeController', PortalModeController)
.run(['$stateExtender', function($stateExtender){
$stateExtender.addState(route);
}]);

19
awx/ui/client/src/portal-mode/portal-mode.block.less Normal file
View File

@ -0,0 +1,19 @@
@import "awx/ui/client/src/shared/layouts/one-plus-one.less";
.PortalMode-container{
.OnePlusOne-container;
}
.PortalMode-panel--left{
.OnePlusOne-panel--left;
}
.PortalMode-panel--right{
.OnePlusOne-panel--right;
}
.PortalMode-panelHeader{
.OnePlusOne-panelHeader;
}
@media(max-width: 767px){
table {word-wrap: normal !important};
}

8
awx/ui/client/src/controllers/Portal.js → awx/ui/client/src/portal-mode/portal-mode.controller.js
View File

@ -19,12 +19,13 @@
*
*
*/
export function PortalController($scope, $compile, $stateParams, $rootScope, $location, $log, Wait, ClearScope, Rest, GetBasePath, ProcessErrors,
export function PortalModeController($scope, $compile, $stateParams, $rootScope, $location, $log, Wait, ClearScope, Rest, GetBasePath, ProcessErrors,
PortalJobsWidget, GenerateList, PortalJobTemplateList, SearchInit, PaginateInit, PlaybookRun){
ClearScope('portal');
var jobs_scope,
pageSize = 12,
list = PortalJobTemplateList,
view= GenerateList,
defaultUrl = GetBasePath('job_templates'),
@ -43,6 +44,7 @@ export function PortalController($scope, $compile, $stateParams, $rootScope, $lo
});
$scope.job_templatePageSize = $scope.getMaxRows();
console.log($scope.job_templatePageSize);
SearchInit({
scope: $scope,
@ -54,7 +56,7 @@ export function PortalController($scope, $compile, $stateParams, $rootScope, $lo
scope: $scope,
list: list,
url: defaultUrl,
pageSize: $scope.job_templatePageSize
pageSize: pageSize
});
$scope.search(list.iterator);
@ -137,6 +139,6 @@ export function PortalController($scope, $compile, $stateParams, $rootScope, $lo
}
PortalController.$inject = ['$scope', '$compile', '$stateParams', '$rootScope', '$location', '$log','Wait', 'ClearScope', 'Rest', 'GetBasePath', 'ProcessErrors',
PortalModeController.$inject = ['$scope', '$compile', '$stateParams', '$rootScope', '$location', '$log','Wait', 'ClearScope', 'Rest', 'GetBasePath', 'ProcessErrors',
'PortalJobsWidget', 'generateList' , 'PortalJobTemplateList', 'SearchInit', 'PaginateInit', 'PlaybookRun'
];

14
awx/ui/client/src/partials/portal.html → awx/ui/client/src/portal-mode/portal-mode.partial.html
View File

@ -1,4 +1,4 @@
<div class="tab-pane" >
<div class="tab-pane PortalMode" >
<div ng-cloak id="portal-landing">
<div id="refresh-row" class="row">
<div class="col-lg-12">
@ -14,17 +14,15 @@
</div>
</div>
</div>
<div class="row">
<div class="left-side col-sm-6 col-xs-12">
<div id="portal-container-job-templates" class="portal-container">
<span class="portal-header">Job Templates</span>
<div class="PortalMode-container">
<div class="PortalMode-panel--left">
<div id="portal-container-job-templates" class="Panel">
<div id="portal-job-templates" >
</div>
</div>
</div>
<div class="right-side col-sm-6 col-xs-12">
<div id="portal-container-jobs" class="portal-container">
<span class="portal-header">Jobs</span>
<div class="PortalMode-panel--right">
<div id="portal-container-jobs" class="Panel">
<div id="portal-jobs" >
</div>
</div>

16
awx/ui/client/src/portal-mode/portal-mode.route.js Normal file
View File

@ -0,0 +1,16 @@
import {templateUrl} from '../shared/template-url/template-url.factory';
export default {
name: 'portalMode',
url: '/portal',
templateUrl: templateUrl('portal-mode/portal-mode'),
controller: 'PortalModeController',
ncyBreadcrumb: {
label: "PORTAL MODE"
},
resolve: {
features: ['FeaturesService', function(FeaturesService) {
return FeaturesService.get();
}]
}
}

53
awx/ui/client/src/shared/layouts/one-plus-one.less Normal file
View File

@ -0,0 +1,53 @@
/*
* Large resolution 1/2 + 1/2 width panels
* Small resolution: 100% width panels, stacked
* Options: static height, custom breakpoint
*/
@import "awx/ui/client/src/shared/branding/colors.default.less";
.OnePlusOne-container(@height: 100%; @breakpoint: 900px){
height: @height;
display: flex;
flex-diration: row;
@media screen and(max-width: @breakpoint){
flex-direction: column;
}
}
.OnePlusOne-panel--left(@height: 100%; @breakpoint: 900px){
flex: 1 1;
height: @height;
width: 100%;
margin-right: 20px;
.Panel{
height: 100%;
}
@media screen and (max-width @breakpoint){
margin-right: 0px;
height: inherit;
}
}
.OnePlusOne-panel--right(@height: 100%; @breakpoint: 900px){
flex: 1 1;
height: @height;
width: 100%;
margin-right: 0px;
.Panel{
height: 100%;
}
@media screen and (max-width @breakpoint){
height: inherit;
}
}
.OnePlusOne-panelHeader{
color: @default-interface-txt;
font-size: 14px;
font-weight: bold;
margin-right: 10px;
text-transform: uppercase;
display: flex;
}

10
awx/ui/client/src/widgets/PortalJobs.js
View File

@ -24,6 +24,7 @@ angular.module('PortalJobsWidget', ['RestServices', 'Utilities'])
choicesCount = 0,
listCount = 0,
jobs_scope = scope.$new(true),
pageSize = 12,
max_rows,
user,
html, e,
@ -56,7 +57,7 @@ angular.module('PortalJobsWidget', ['RestServices', 'Utilities'])
list: PortalJobsList,
id: 'active-jobs',
url: url , //GetBasePath('jobs')+'?created_by='+user,
pageSize: max_rows,
pageSize: pageSize,
spinner: true
});
@ -71,7 +72,7 @@ angular.module('PortalJobsWidget', ['RestServices', 'Utilities'])
scope.removeChoicesReady = scope.$on('choicesReady', function() {
choicesCount++;
if (choicesCount === 2) {
setPortalJobsHeight();
//setPortalJobsHeight();
scope.$emit('buildJobsList');
}
});
@ -136,6 +137,7 @@ angular.module('PortalJobsWidget', ['RestServices', 'Utilities'])
// Set the height of each container and calc max number of rows containers can hold
/*
function setPortalJobsHeight() {
var docw = $(window).width(),
box_height, available_height, search_row, page_row, height, header, row_height;
@ -191,9 +193,7 @@ angular.module('PortalJobsWidget', ['RestServices', 'Utilities'])
scope[PortalJobTemplateList.iterator + 'PageSize'] = max_rows;
scope.changePageSize(PortalJobTemplateList.name, PortalJobTemplateList.iterator, false);
}
*/
};
}
]);