hw2 tests pass on chrome
This commit is contained in:
parent
cf0672d338
commit
c658a1b4fa
|
|
@ -0,0 +1,6 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
var app = angular.module('app', ['ngRoute']);
|
||||
|
||||
})();
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
angular.module("app").controller("EditCtrl", Ctrl);
|
||||
Ctrl.$inject = ['$http', '$routeParams', '$location']
|
||||
|
||||
function Ctrl($http, $routeParams, $location) {
|
||||
var vm = this;
|
||||
|
||||
vm.contact = {};
|
||||
vm.submitForm = submitForm;
|
||||
|
||||
getContact($routeParams.id)
|
||||
function getContact(id) {
|
||||
if(!id) return
|
||||
|
||||
$http.get(`/api/contacts/${id}`).then(resp => {
|
||||
vm.contact = resp.data;
|
||||
});
|
||||
};
|
||||
|
||||
function submitForm() {
|
||||
console.log(vm.contact);
|
||||
if(vm.contact._id) {
|
||||
$http.put(`/api/contacts/${vm.contact._id}`, vm.contact).then(resp => {
|
||||
$location.path("/search");
|
||||
});
|
||||
} else {
|
||||
$http.post(`/api/contacts`, vm.contact).then(resp => {
|
||||
$location.path("/search");
|
||||
});
|
||||
}
|
||||
};
|
||||
};
|
||||
})();
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<form>
|
||||
<table class="form-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Eesnimi:</td>
|
||||
<td><input id="name-input" ng-model="vm.contact.name"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Telefon:</td>
|
||||
<td><input id="phone-input" ng-model="vm.contact.phone"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" align="right"><br/>
|
||||
<a href ng-click="vm.submitForm()" id="save-link">Salvesta</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<div id="simple-modal">
|
||||
<div class="simple-modal-content">
|
||||
|
||||
<b>Oled kindel?</b>
|
||||
|
||||
<br><br>
|
||||
|
||||
<a href ng-click="ok()" id="simple-modal-ok">Jah</a> |
|
||||
<a href ng-click="cancel()" id="simple-modal-cancel">Ei</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
angular.module('app').service('modalService', Srv);
|
||||
|
||||
Srv.$inject = ['$q', '$document', '$http', '$compile', '$rootScope'];
|
||||
|
||||
function Srv($q, $document, $http, $compile, $rootScope) {
|
||||
|
||||
this.confirm = confirm;
|
||||
|
||||
var modal;
|
||||
var scope;
|
||||
|
||||
function confirm() {
|
||||
if (modal) {
|
||||
return showModal();
|
||||
}
|
||||
|
||||
return $http.get('app/modal.html').then(function (result) {
|
||||
createModalElement(result.data);
|
||||
return showModal();
|
||||
});
|
||||
}
|
||||
|
||||
function showModal() {
|
||||
var deferred = $q.defer();
|
||||
|
||||
scope.ok = function () {
|
||||
modal.addClass('hide');
|
||||
deferred.resolve();
|
||||
};
|
||||
|
||||
scope.cancel = function () {
|
||||
modal.addClass('hide');
|
||||
deferred.reject();
|
||||
};
|
||||
|
||||
modal.removeClass('hide');
|
||||
|
||||
return deferred.promise;
|
||||
}
|
||||
|
||||
function createModalElement(html) {
|
||||
var body = angular.element($document[0].body);
|
||||
var containerElement = angular.element(html);
|
||||
scope = $rootScope.$new();
|
||||
modal = $compile(containerElement[0])(scope);
|
||||
body.append(modal);
|
||||
}
|
||||
}
|
||||
|
||||
})();
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
angular.module('app').config(RouteConfig);
|
||||
RouteConfig.$inject = ["$routeProvider"]
|
||||
|
||||
function RouteConfig($routeProvider) {
|
||||
|
||||
$routeProvider.when('/search', {
|
||||
templateUrl : 'app/search.html',
|
||||
controller : 'SearchCtrl',
|
||||
controllerAs : 'vm'
|
||||
}).when("/new", {
|
||||
templateUrl: "app/edit.html",
|
||||
controller: "EditCtrl",
|
||||
controllerAs: "vm"
|
||||
}).when("/edit/:id", {
|
||||
templateUrl: "app/edit.html",
|
||||
controller: "EditCtrl",
|
||||
controllerAs: "vm"
|
||||
}).otherwise("/search")
|
||||
}
|
||||
|
||||
})();
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
angular.module("app").controller("SearchCtrl", Ctrl);
|
||||
Ctrl.$inject = ['$http', 'modalService']
|
||||
|
||||
function Ctrl($http, modalService) {
|
||||
var vm = this;
|
||||
vm.contacts = [];
|
||||
vm.searchString = "";
|
||||
vm.deleteContact = deleteContact;
|
||||
vm.deleteSelected = deleteSelected;
|
||||
vm.nameCodeFilter = nameCodeFilter;
|
||||
|
||||
|
||||
getContacts();
|
||||
function getContacts() {
|
||||
$http.get("/api/contacts").then(resp => {
|
||||
vm.contacts = resp.data;
|
||||
}).catch(e => {
|
||||
console.error("Failed to get contacts", e);
|
||||
})
|
||||
};
|
||||
|
||||
function deleteContact(id) {
|
||||
modalService.confirm().then(resp => {
|
||||
$http.delete(`/api/contacts/${id}`).then(resp => {
|
||||
console.info(`Contact ${id}`)
|
||||
getContacts();
|
||||
})
|
||||
})
|
||||
|
||||
};
|
||||
|
||||
function deleteSelected() {
|
||||
return;
|
||||
};
|
||||
|
||||
function matchSearchString(string) {
|
||||
return void 0 !== string && string.toLowerCase().indexOf(vm.searchString.toLowerCase()) >= 0
|
||||
}
|
||||
|
||||
function nameCodeFilter(contact) {
|
||||
return 0 === vm.searchString.length || (matchSearchString(contact.name) || matchSearchString(contact.phone));
|
||||
};
|
||||
};
|
||||
})();
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<input id="search-string" ng-model="vm.searchString"/>
|
||||
|
||||
<br /><br />
|
||||
|
||||
<table class="list-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nimi</th>
|
||||
<th>Telefon</th>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-class="{ selected : contact.selected }"
|
||||
data-ng-repeat="contact in vm.contacts | filter : vm.nameCodeFilter">
|
||||
<td>
|
||||
<a href="#/edit/{{ contact._id }}" class="edit-link">{{ contact.name }}</a>
|
||||
</td>
|
||||
<td>
|
||||
{{ contact.phone }}
|
||||
</td>
|
||||
<td>
|
||||
<a href ng-click="vm.deleteContact(contact._id)" class="delete-link">Kustuta</a>
|
||||
</td>
|
||||
<td>
|
||||
<input ng-model="contact.selected" type="checkbox">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br><br>
|
||||
|
||||
|
|
@ -12,9 +12,22 @@
|
|||
</head>
|
||||
<body>
|
||||
|
||||
Hello!
|
||||
<ul id="menu">
|
||||
<li><a href="#/search" id="menu-search">Otsi</a></li>
|
||||
<li><a href="#/new" id="menu-new">Lisa</a></li>
|
||||
</ul>
|
||||
<br><br>
|
||||
<div class="ng-cloak" ng-view></div>
|
||||
|
||||
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
|
||||
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-route.js"></script>
|
||||
|
||||
<script src="/app/app.js"></script>
|
||||
<script src="/app/edit.ctrl.js"></script>
|
||||
<script src="/app/search.ctrl.js"></script>
|
||||
<script src="/app/routes.js"></script>
|
||||
<script src="/app/modal.srv.js"></script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in New Issue