External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-16 04:10:44 -03:30
Code Issues Packages Projects Releases Wiki Activity

removing ngRouter and old routeExensions

Browse Source
This commit is contained in:
Jared Tabor 2016-01-04 17:11:36 -05:00
parent f9f8083a5c
commit 63c16af26a
15 changed files with 35 additions and 414 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -31,7 +31,6 @@ import systemTracking from './system-tracking/main';
import inventoryScripts from './inventory-scripts/main';
import permissions from './permissions/main';
import managementJobs from './management-jobs/main';
// import routeExtensions from './shared/route-extensions/main';
import breadcrumbs from './shared/breadcrumbs/main';
@ -78,11 +77,9 @@ __deferLoadIfEnabled();
var tower = angular.module('Tower', [
// 'ngAnimate',
'ngRoute',
'ngSanitize',
'ngCookies',
RestServices.name,
// routeExtensions.name,
browserData.name,
breadcrumbs.name,
systemTracking.name,

8
awx/ui/client/src/bread-crumb/bread-crumb.directive.js
View File

@ -1,7 +1,7 @@
/* jshint unused: vars */
export default
[ 'templateUrl', '$route', function(templateUrl, $route) {
[ 'templateUrl', '$state', function(templateUrl, $state) {
return {
restrict: 'E',
templateUrl: templateUrl('bread-crumb/bread-crumb'),
@ -10,11 +10,11 @@ export default
scope.toggleActivityStreamActive = function(){
scope.activityStreamActive = !scope.activityStreamActive;
}
};
scope.isActive = function (path) {
if ($route.current && $route.current.regexp) {
return $route.current.regexp.test(path);
if ($state.current && $state.current.regexp) {
return $state.current.regexp.test(path);
}
return false;
};

4
awx/ui/client/src/controllers/Inventories.js
View File

@ -863,7 +863,9 @@ export function InventoriesManage ($log, $scope, $rootScope, $location,
});
$scope.systemTracking = function() {
$state.transitionTo('systemTracking',
$scope.inventory = JSON.stringify($scope.inventory);
$scope.hostsSelectedItems = JSON.stringify($scope.hostsSelectedItems);
$state.go('systemTracking',
{ inventory: $scope.inventory,
hosts: $scope.hostsSelectedItems
});

2
awx/ui/client/src/controllers/Projects.js
View File

@ -343,7 +343,7 @@ export function ProjectsList ($scope, $rootScope, $location, $log, $stateParams,
.error(function (data, status) {
ProcessErrors($scope, data, status, null, { hdr: 'Error!',
msg: 'Call to get project failed. GET status: ' + status });
})
});
};
$scope.refresh = function () {

10
awx/ui/client/src/permissions/add/main.js
View File

@ -11,11 +11,7 @@ import controller from './add.controller';
export default
angular.module('permissionsAdd', [])
.controller('permissionsAddController', controller)
.config(['$routeProvider', function($routeProvider) {
var url = userRoute.route;
delete userRoute.route;
$routeProvider.when(url, userRoute);
url = teamRoute.route;
delete teamRoute.route;
$routeProvider.when(url, teamRoute);
.run(['$stateExtender', function($stateExtender) {
$stateExtender.addState(userRoute);
$stateExtender.addState(teamRoute);
}]);

10
awx/ui/client/src/permissions/edit/main.js
View File

@ -11,11 +11,7 @@ import controller from './edit.controller';
export default
angular.module('permissionsEdit', [])
.controller('permissionsEditController', controller)
.config(['$routeProvider', function($routeProvider) {
var url = userRoute.route;
delete userRoute.route;
$routeProvider.when(url, userRoute);
url = teamRoute.route;
delete teamRoute.route;
$routeProvider.when(url, teamRoute);
.run(['$stateExtender', function($stateExtender) {
$stateExtender.addState(userRoute);
$stateExtender.addState(teamRoute);
}]);

10
awx/ui/client/src/permissions/list/main.js
View File

@ -11,11 +11,7 @@ import controller from './list.controller';
export default
angular.module('permissionsList', [])
.controller('permissionsListController', controller)
.config(['$routeProvider', function($routeProvider) {
var url = userRoute.route;
delete userRoute.route;
$routeProvider.when(url, userRoute);
url = teamRoute.route;
delete teamRoute.route;
$routeProvider.when(url, teamRoute);
.run(['$stateExtender', function($stateExtender) {
$stateExtender.addState(userRoute);
$stateExtender.addState(teamRoute);
}]);

96
awx/ui/client/src/shared/route-extensions/link-to.directive.js
View File

@ -1,96 +0,0 @@
/*************************************************
* Copyright (c) 2015 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
/* jshint unused: vars */
import {lookupRouteUrl} from './lookup-route-url';
/**
*
* @ngdoc directive
* @name routeExtensions.directive:linkTo
* @desription
* The `linkTo` directive looks up a route's URL and generates a link to that route. When a user
* clicks the link, this directive calls the `transitionTo` factory to send them to the given
* URL. For accessibility and fallback purposes, it also sets the `href` attribute of the link
* to the path.
*
* Note that in this example the model object uses a key that matches up with the route parameteer
* name in the route url (in this case `:id`).
*
* **N.B.** The below example currently won't run. It's included to show an example of using
* the `linkTo` directive within code. In order for this to run, we will need to run
* the code in an iframe (using something like `dgeni` instead of `grunt-ngdocs`).
*
* @example
*
<example module="simpleRouteExample">
<file name="script.js">
angular.module('simpleRouteExample', ['ngRoute', 'routeExtensions'])
.config(['$routeProvider', function($route) {
$route.when('/posts/:id', {
name: 'post',
template: '<h1>{{post.title}}</h1><p>{{post.body}}</p>',
controller: 'post'
});
}]).controller('post', function($scope) {
});
</file>
<file name="index.html">
<section ng-init="featuredPost =
{ id: 1,
title: 'Featured',
body: 'This post is featured because it is awesome'
};">
<a link-to="post" model="{ id: featuredPost }">
{{featuredPost.title}}
</a>
</section>
</file>
</example>
*
*/
export default
[ '$route',
'$location',
'transitionTo',
function($routeProvider, $location, transitionTo) {
function transitionListener(routeName, model, e) {
e.stopPropagation();
e.preventDefault();
transitionTo(routeName, model);
}
return {
restrict: 'A',
scope: {
routeName: '@linkTo',
model: '&'
},
link: function (scope, element, attrs) {
var listener;
scope.$watch(function() {
var model = scope.$eval(scope.model);
return model;
}, function(newValue) {
var model = scope.$eval(scope.model);
scope.url = lookupRouteUrl(scope.routeName, $routeProvider.routes, model, $location.$$html5);
element.off('click', listener);
listener = _.partial(transitionListener, scope.routeName, model);
element.on('click', listener);
element.attr('href', scope.url);
}, true);
}
};
}
];

53
awx/ui/client/src/shared/route-extensions/lookup-route-url.js
View File

@ -1,53 +0,0 @@
/*************************************************
* Copyright (c) 2015 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
export function lookupRouteUrl(name, routes, models, html5Mode) {
var route = _.find(routes, {name: name});
if (angular.isUndefined(route)) {
throw "Unknown route " + name;
}
var routeUrl = route.originalPath;
if (!angular.isUndefined(models) && angular.isObject(models)) {
var match = routeUrl.match(route.regexp);
var keyMatchers = match.slice(1);
routeUrl =
keyMatchers.reduce(function(url, keyMatcher) {
var value;
var key = keyMatcher.replace(/^:/, '');
var model = models[key];
if (angular.isArray(model)) {
value = _.compact(_.pluck(model, key));
if (_.isEmpty(value)) {
value = _.pluck(model, 'id');
}
value = value.join(',');
} else if (angular.isObject(model)) {
value = model[key];
if (_.isEmpty(value)) {
value = model.id;
}
}
return url.replace(keyMatcher, value);
}, routeUrl);
}
if (!html5Mode) {
routeUrl = '#' + routeUrl;
}
return routeUrl;
}

34
awx/ui/client/src/shared/route-extensions/main.js
View File

@ -1,34 +0,0 @@
/*************************************************
* Copyright (c) 2015 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
import linkTo from './link-to.directive';
import transitionTo from './transition-to.factory';
import modelListener from './model-listener.config';
/**
* @ngdoc overview
* @name routeExtensions
* @description
*
* # routeExtensions
*
* Adds a couple useful features to ngRoute:
* - Adds a `name` property to route objects; used to identify the route in transitions & links
* - Adds the ability to pass model data when clicking a link that goes to a route
* - Adds a directive that generates a route's URL from the route name & given models
* - Adds the ability to specify models in route resolvers
*
* ## Usage
*
* If you need to generate a link to a route, then use the {@link routeExtensions.directive:linkTo `linkTo directive`}. If you need to transition to a route in JavaScript code, then use the {@link routeExtensions.factory:transitionTo `transitionTo service`}.
*
*/
export default
angular.module('routeExtensions',
['ngRoute'])
.factory('transitionTo', transitionTo)
.run(modelListener)
.directive('linkTo', linkTo);

29
awx/ui/client/src/shared/route-extensions/model-listener.config.js
View File

@ -1,29 +0,0 @@
/*************************************************
* Copyright (c) 2015 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
import {wrapDelegate} from './route-params.decorator';
export default
[ '$rootScope',
'$stateParams',
function($rootScope, $stateParams) {
$rootScope.$on('$routeChangeStart', function(e, newRoute) {
wrapDelegate(newRoute);
});
$rootScope.$on('$routeChangeSuccess', function(e, newRoute) {
if (angular.isUndefined(newRoute.model)) {
var keys = Object.keys(newRoute.params);
var models = keys.reduce(function(model, key) {
model[key] = newRoute.locals[key];
return model;
}, {});
$stateParams.model = models;
}
});
}
];

22
awx/ui/client/src/shared/route-extensions/route-params.decorator.js
View File

@ -1,22 +0,0 @@
/*************************************************
* Copyright (c) 2015 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
export function wrapDelegate($delegate) {
$delegate.hasModelKey = function hasModelKey(key) {
return $delegate.params.hasOwnProperty('model') &&
$delegate.params.model.hasOwnProperty(key);
};
return $delegate;
}
export default
[ '$provide',
function($provide) {
$provide.decorator('$route', wrapDelegate);
}
];

137
awx/ui/client/src/shared/route-extensions/transition-to.factory.js
View File

@ -1,137 +0,0 @@
/*************************************************
* Copyright (c) 2015 Ansible, Inc.
*
* All Rights Reserved
*************************************************/
import {lookupRouteUrl} from './lookup-route-url';
/**
* @ngdoc service
* @name routeExtensions.service:transitionTo
* @description
* The `transitionTo` service generates a URL given a route name and model parameters, then
* updates the browser's URL via `$location.path`. Use this in situations where you cannot
* use the `linkTo` directive, for example to redirect the user after saving an object.
*
* @param {string} routeName The name of the route whose URL you want to redirect to (corresponds
* name property of route)
* @param {object} model The model you want to use to generate the URL and be passed to the new
* route. This object follows a strict key/value naming convention where
* the keys match the parameters listed in the route's URL. For example,
* a URL of `/posts/:id` would require a model object like: `{ id: post }`,
* where `post` is the object you want to pass to the new route.
*
* **N.B.** The below example currently won't run. It's included to show an example of using
* the `transitionTo` function within code. In order for this to run, we will need to run
* the code in an iframe (using something like `dgeni` instead of `grunt-ngdocs`).
*
* @example
*
<example module="transitionToExample">
<file name="script.js">
angular.module('transitionToExample',
['ngRoute',
'routeExtensions'
])
.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/post/:id',
{ name: 'post',
template: '<h1>{{post.title}}</h1><p>{{post.body}}</p>'
});
$locationProvider.html5Mode(true);
$locationProvider.hashPrefix('!');
})
.controller('post', ['$scope', function($scope) {
}])
.controller('postForm', ['$scope', 'transitionTo', function($scope, transitionTo) {
$scope.post = {
id: 1,
title: 'A post',
body: 'Some text'
};
$scope.savePost = function() {
transitionTo('post', { id: $scope.post });
}
}]);
</file>
<file name="index.html">
<form ng-controller="postForm">
<legend>Edit Post</legend>
<label>
Title
<input type="text" ng-model="post.title">
</label>
<label>
Body
<textarea ng-model="post.body"></textarea>
</label>
<button ng-click="savePost()">Save Post</button>
</form>
</file>
</example>
*/
function safeApply(fn, $rootScope) {
var currentPhase = $rootScope.$$phase;
if (currentPhase === '$apply' || currentPhase === '$digest') {
fn();
} else {
$rootScope.$apply(fn);
}
}
export default
[ '$location',
'$rootScope',
'$route',
'$q',
function($location, $rootScope, $route, $q) {
return function(routeName, model) {
var deferred = $q.defer();
var url = lookupRouteUrl(routeName, $route.routes, model, true);
var offRouteChangeStart =
$rootScope.$on('$routeChangeStart', function(e, newRoute) {
if (newRoute.$$route.name === routeName) {
deferred.resolve(newRoute, model);
newRoute.params.model = model;
}
offRouteChangeStart();
});
var offRouteChangeSuccess =
$rootScope.$on('$routeChangeSuccess', function(e, newRoute) {
if (newRoute.$$route.name === routeName) {
deferred.resolve(newRoute);
}
offRouteChangeSuccess();
});
var offRouteChangeError =
$rootScope.$on('$routeChangeError', function(e, newRoute, previousRoute, rejection) {
if (newRoute.$$route.name === routeName) {
deferred.reject(newRoute, previousRoute, rejection);
}
offRouteChangeError();
});
safeApply(function() {
$location.path(url);
}, $rootScope);
return deferred;
};
}
];

2
awx/ui/client/src/system-tracking/system-tracking.controller.js
View File

@ -14,6 +14,7 @@ function controller($rootScope,
$stateParams,
$location,
$q,
$state,
moduleOptions,
getDataForComparison,
waitIndicator,
@ -317,6 +318,7 @@ export default
'$stateParams',
'$location',
'$q',
'$state',
'moduleOptions',
'getDataForComparison',
'Wait',

29
awx/ui/client/src/system-tracking/system-tracking.route.js
View File

@ -17,9 +17,11 @@ export default {
[ 'getModuleOptions',
'lodashAsPromised',
'ProcessErrors',
'$route',
function(getModuleOptions, _, ProcessErrors, $route) {
var hostIds = $route.current.params.hosts.split(',');
'$state',
'$stateParams',
function(getModuleOptions, _, ProcessErrors, $state, $stateParams) {
var hostIds = JSON.parse($stateParams.hosts);
// hostIds = hostIds.split(',');
var data =
getModuleOptions(hostIds[0])
@ -37,17 +39,18 @@ export default {
}
],
inventory:
[ '$route',
[ '$state',
'$q',
'Rest',
'GetBasePath',
'ProcessErrors',
function($route, $q, rest, getBasePath, ProcessErrors) {
if ($route.current.hasModelKey('inventory')) {
return $q.when($route.current.params.model.inventory);
function($state, $q, rest, getBasePath, ProcessErrors) {
if ($state.current.hasModelKey('inventory')) {
return $q.when($state.current.params.model.inventory);
}
var inventoryId = $route.current.params.inventory;
var inventoryId = $state.current.params.inventory;
var url = getBasePath('inventory') + inventoryId + '/';
rest.setUrl(url);
@ -64,17 +67,17 @@ export default {
}
],
hosts:
[ '$route',
[ '$state',
'$q',
'Rest',
'GetBasePath',
'ProcessErrors',
function($route, $q, rest, getBasePath, ProcessErrors) {
if ($route.current.hasModelKey('hosts')) {
return $q.when($route.current.params.model.hosts);
function($state, $q, rest, getBasePath, ProcessErrors) {
if ($state.current.hasModelKey('hosts')) {
return $q.when($state.current.params.model.hosts);
}
var hostIds = $route.current.params.hosts.split(',');
var hostIds = $state.current.params.hosts.split(',');
var hosts =
hostIds.map(function(hostId) {