Skip to content
Snippets Groups Projects
Commit b67ce6b1 authored by michaelisvy's avatar michaelisvy
Browse files

code migrated to Angular-ui-router

parent ef2ba55a
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 88 additions and 71 deletions
src/main/java/org/springframework/samples/petclinic/web/OwnerListResource.java
+ 0
− 7
View file @ b67ce6b1
......@@ -17,17 +17,10 @@ package org.springframework.samples.petclinic.web;
import java.util.Collection;
import javax.validation.Valid;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.MediaType;
import org.springframework.samples.petclinic.model.Owner;
import org.springframework.samples.petclinic.service.ClinicService;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.WebDataBinder;
import org.springframework.web.bind.annotation.InitBinder;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
......
src/main/java/org/springframework/samples/petclinic/web/OwnerResource.java
+ 1
− 3
View file @ b67ce6b1
......@@ -56,10 +56,8 @@ public class OwnerResource {
}
// TODO: should be improved so we have a single method parameter
@RequestMapping(value = "/owner/{ownerId}", method = RequestMethod.POST)
@RequestMapping(value = "/owner/{ownerId}", method = RequestMethod.PUT)
public Owner updateOwner(@ModelAttribute Owner ownerModel, @RequestBody Owner ownerRequest) {
// seems like a workaround. I haven't found a proper way to inject to have @ModelAttribute pupulate object
// first and then have the delta come from @RequestBody
ownerModel.setFirstName(ownerRequest.getFirstName());
ownerModel.setLastName(ownerRequest.getLastName());
ownerModel.setCity(ownerRequest.getCity());
......
src/main/webapp/index.html
+ 4
− 5
View file @ b67ce6b1
......@@ -7,10 +7,9 @@
<link rel="stylesheet" href="bower_components/bootstrap/docs/assets/css/bootstrap.css" />
<link href="resources/css/petclinic.css" rel="stylesheet"/>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="scripts/app/app.js"></script>
<script src="scripts/app/main/MainController.js"></script>
......@@ -19,11 +18,11 @@
</head>
<body class="container">
<div ng-include="'scripts/app/fragments/bodyHeader.html'"></div>
<div ui-view="header"></div>
<div ng-view></div>
<div ui-view="content"></div>
<div ng-include="'scripts/app/fragments/footer.html'"></div>
<div ui-view="footer"></div>
</body>
</html>
src/main/webapp/scripts/app/app.js
+ 59
− 26
View file @ b67ce6b1
......@@ -7,40 +7,73 @@ angular.module('services', ['ngResource']);
/* App Module */
var petClinicApp = angular.module('petClinicApp', [
'ngRoute', 'controllers', 'services'
'ui.router', 'controllers', 'services'
]);
petClinicApp.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/', {
templateUrl: 'scripts/app/main/main.html',
controller: 'mainController'
petClinicApp.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state('app', {
url: '/',
controller: 'mainController',
views: {
'header': { templateUrl: 'scripts/app/fragments/bodyHeader.html'},
'content': { templateUrl: 'scripts/app/main/main.html'},
'footer': { templateUrl: 'scripts/app/fragments/footer.html'}
}
}).
when('/owner/search', {
templateUrl: 'scripts/app/owner/ownerSearchForm.html',
controller: 'ownerSearchController'
state('app.ownersearch', {
url: 'owner/search',
views: {
'content@': {
templateUrl: 'scripts/app/owner/ownerSearchForm.html',
controller: 'ownerSearchController'
}
}
}).
when('/owner/list', {
templateUrl: 'scripts/app/owner/ownerList.html',
controller: 'ownerListController'
}).
when('/owner/:id/view', {
templateUrl: 'scripts/app/owner/ownerDetail.html',
controller: 'ownerDetailController'
state('app.ownerlist', {
url: 'owner/list',
views: {
'content@': {
templateUrl: 'scripts/app/owner/ownerList.html',
controller: 'ownerListController'
}
}
}).
when('/owner/:id/edit', {
templateUrl: 'scripts/app/owner/ownerForm.html',
controller: 'ownerFormController'
state('app.ownerdetail', {
url: 'owner/:id',
views: {
'content@': {
templateUrl: 'scripts/app/owner/ownerDetail.html',
controller: 'ownerDetailController'
}
}
}).
when('/vets', {
templateUrl: 'scripts/app/vet/vetList.html',
controller: 'vetController'
}).
otherwise({
redirectTo: '/'
state('app.owneredit', {
url: 'owner/:id/edit',
views: {
'content@': {
templateUrl: 'scripts/app/owner/ownerForm.html',
controller: 'ownerFormController'
}
}
}).
state('app.vets', {
url: 'vets',
views: {
'content@': {
templateUrl: 'scripts/app/vet/vetList.html',
controller: 'vetController'
}
}
});
}]);
......
src/main/webapp/scripts/app/fragments/bodyHeader.html
+ 4
− 4
View file @ b67ce6b1
......@@ -3,15 +3,15 @@
<div class="navbar" style="width: 601px;">
<div class="navbar-inner">
<ul class="nav">
<ul class="nav">
<li style="width: 120px;">
<a href="#/main"><i class="icon-home"></i> Home</a>
<a ui-sref="app"><i class="icon-home"></i> Home</a>
</li>
<li style="width: 150px;">
<a href="#/owner/search"><i class="icon-search"></i> Find owners</a>
<a ui-sref="app.ownersearch"><i class="icon-search"></i> Find owners</a>
</li>
<li style="width: 160px;">
<a href="#/vets"><i class="icon-th-list"></i> Veterinarians</a>
<a ui-sref="app.vets"><i class="icon-th-list"></i> Veterinarians</a>
</li>
<li style="width: 110px;">
<a href="oups.html" title="trigger a RuntimeException to see how it is handled">
......
src/main/webapp/scripts/app/main/main.html
+ 1
− 1
View file @ b67ce6b1
<div ng-controlleeer="mainControllerww">
<div ng-controller="mainController">
<p>Welcome to Petclinic </p>
</div>
src/main/webapp/scripts/app/owner/OwnerController.js
+ 14
− 20
View file @ b67ce6b1
......@@ -3,8 +3,8 @@
/*
* Owner Search
*/
angular.module('controllers').controller('ownerSearchController', ['$scope', '$rootScope', '$resource', '$location',
function($scope, $rootScope, $resource, $location) {
angular.module('controllers').controller('ownerSearchController', ['$scope', '$rootScope', '$resource', '$state',
function($scope, $rootScope, $resource, $state) {
$scope.submitOwnerFindForm = function() {
......@@ -15,42 +15,36 @@ angular.module('controllers').controller('ownerSearchController', ['$scope', '$r
var ownerResource = $resource(destUrl);
$rootScope.owners = ownerResource.query();
$location.path('/owner/list');
$state.go('app.ownerlist'); //updating URL in address bar
}}]);
/*
* Owners List
*/
angular.module('controllers').controller('ownerListController', ['$scope', '$rootScope', '$location',
angular.module('controllers').controller('ownerListController', ['$scope', '$rootScope',
function($scope, $rootScope, $location) {
if ($rootScope.owners!=null){
$scope.ownerList = $rootScope.owners;
}
$scope.displayOwnerDetail = function(id) {
var url = "owner/" + id + "/view";
$rootScope.ownerId = id;
$location.path(url);
}
}
}]);
/*
* Owners detail (used for both Editable and non-editable pages)
*/
angular.module('controllers').controller('ownerDetailController', ['$scope', '$resource', '$rootScope',
angular.module('controllers').controller('ownerDetailController', ['$scope', '$resource', '$stateParams',
loadOwner
]);
function loadOwner($scope, $resource, $rootScope) {
var ownerResource = $resource('/petclinic/owner/' + $rootScope.ownerId);
function loadOwner($scope, $resource, $stateParams) {
var ownerResource = $resource('/petclinic/owner/' + $stateParams.id);
$scope.owner = ownerResource.get();
}
/*
* Owner Edit Form
*/
angular.module('controllers').controller('ownerFormController', ['$scope', '$resource', '$http', '$rootScope', '$location',
function($scope, $resource, $http, $rootScope, $location) {
angular.module('controllers').controller('ownerFormController', ['$scope', '$resource', '$http', '$stateParams', '$state',
function($scope, $resource, $http, $stateParams, $state) {
$scope.submitOwnerForm = function() {
var form = $scope.owner;
......@@ -63,12 +57,12 @@ function($scope, $resource, $http, $rootScope, $location) {
city: form.city,
telephone: form.telephone
};
var restUrl = "/petclinic/owner/" + $rootScope.ownerId;
$http.post(restUrl, data);
$location.path('/owner/list');
var restUrl = "/petclinic/owner/" + $stateParams.id;
$http.put(restUrl, data);
$state.go('app.ownerlist');
}
loadOwner($scope, $resource, $rootScope);
loadOwner($scope, $resource, $stateParams);
}]);
......
src/main/webapp/scripts/app/owner/ownerDetail.html
+ 1
− 1
View file @ b67ce6b1
......@@ -21,7 +21,7 @@
</tr>
<tr>
<td>
<a class="btn btn-info" ng-href="#/owner/{{owner.id}}/edit">Edit Owner</a></td>
<a class="btn btn-info" ui-sref="app.owneredit({id: owner.id})">Edit Owner</a></td>
<td>
<spring:url value="{ownerId}/pets/new.html" var="addUrl">
<spring:param name="ownerId" value="${owner.id}"/>
......
src/main/webapp/scripts/app/owner/ownerForm.html
+ 1
− 1
View file @ b67ce6b1
<div class="container">
<h2>Owner</h2>
<form class="form-horizontal" name="ownerForm" ng-controller="ownerFormController">
<form class="form-horizontal" name="ownerForm" data-ng-controller="ownerFormController">
<fieldset>
<div class="control-group" id="firstName">
<label class="control-label">First name </label>
......
src/main/webapp/scripts/app/owner/ownerList.html
+ 1
− 1
View file @ b67ce6b1
......@@ -12,7 +12,7 @@
<tr ng-repeat="owner in ownerList">
<td>
<a ng-click="displayOwnerDetail(owner.id)">
<a ui-sref="app.ownerdetail({id: owner.id})">
{{owner.firstName}} {{owner.lastName}}
</a>
</td>
......
src/main/webapp/scripts/app/owner/ownerSearchForm.html
+ 1
− 1
View file @ b67ce6b1
<h2>Find Owners</h2>
<form class="form-horizontal" id="ownerFindForm" ng-controller="ownerSearchController">
<form class="form-horizontal" id="ownerFindForm" data-ng-controller="ownerSearchController">
<fieldset>
<div class="control-group" id="lastName">
<label class="control-label">Last name </label>
......
src/main/webapp/scripts/app/vet/vetList.html
+ 1
− 1
View file @ b67ce6b1
<div ng-controller="vetController">
<div data-ng-controller="vetController">
<table class="table table-striped">
<thead>
<tr>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment