', options );
8 | }];
9 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/client/list/client.list.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./viewModel";
2 |
3 | export const ClientListComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./clientlist.html') as string,
9 | controller: class ClientListController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/client/list/client.list.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./viewModel";
2 |
3 | export const ClientListComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./clientlist.html') as string,
9 | controller: class ClientListController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/client/list/client.list.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./viewModel";
2 |
3 | export const ClientListComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./clientlist.html') as string,
9 | controller: class ClientListController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/04 custom events/src/appinsights/trackevent.factory.ts:
--------------------------------------------------------------------------------
1 | import { AppInsights } from 'applicationinsights-js'
2 |
3 | export class TrackEventService {
4 |
5 |
6 | constructor() {
7 | }
8 |
9 | public trackEvent(name : string, properties?, measurements?) {
10 | AppInsights.trackEvent(name, properties, measurements);
11 | }
12 | }
13 |
14 | TrackEventService.$inject = [];
15 |
16 |
--------------------------------------------------------------------------------
/05 nojdk/src/appinsights/Options.ts:
--------------------------------------------------------------------------------
1 |
2 | export class Options {
3 |
4 | applicationName= '';
5 | autoPageViewTracking= true;
6 | autoLogTracking= true;
7 | autoExceptionTracking= true;
8 | sessionInactivityTimeout = 1800000;
9 | instrumentationKey = '';
10 | developerMode = false; // true
11 | }
12 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&'
5 | },
6 | controllerAs: 'vm',
7 | controller: class LoginController {
8 | user: string;
9 | password: string;
10 |
11 | $onInit = () => {
12 | this.user = '';
13 | this.password = '';
14 | }
15 | }
16 | };
--------------------------------------------------------------------------------
/00 startup/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&'
5 | },
6 | controllerAs: 'vm',
7 | controller: class LoginController {
8 | user: string;
9 | password: string;
10 |
11 | $onInit = () => {
12 | this.user = '';
13 | this.password = '';
14 | }
15 | }
16 | };
--------------------------------------------------------------------------------
/00 startup/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&'
5 | },
6 | controllerAs: 'vm',
7 | controller: class LoginController {
8 | user: string;
9 | password: string;
10 |
11 | $onInit = () => {
12 | this.user = '';
13 | this.password = '';
14 | }
15 | }
16 | };
--------------------------------------------------------------------------------
/00 startup/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&'
5 | },
6 | controllerAs: 'vm',
7 | controller: class LoginController {
8 | user: string;
9 | password: string;
10 |
11 | $onInit = () => {
12 | this.user = '';
13 | this.password = '';
14 | }
15 | }
16 | };
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/client/list/result/client.list.result.component.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "../viewModel";
2 |
3 | export const ClientListResultComponent = {
4 | bindings: {
5 | clientList: '<'
6 | },
7 | controllerAs: 'vm',
8 | template: require('./client.list.result.component.html') as string,
9 | controller: class ClientListResultController {
10 | clientList: Client[];
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/client/list/search/client.list.search.component.html:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 |
11 |
12 |
--------------------------------------------------------------------------------
/00 startup/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/04 custom events/src/appinsights/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {ExceptionConfig} from './exception.config';
3 | import {stateChange} from './uirouter.config'
4 | import {TrackEventService} from './trackevent.factory'
5 |
6 | export const appinsightsmod = angular.module('appinsightsmod', [])
7 | .config(ExceptionConfig)
8 | .service('TrackEventService', TrackEventService)
9 | .run(stateChange)
10 | ;
11 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/04 custom events/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&',
5 | onGenerateException: '&'
6 | },
7 | controllerAs: 'vm',
8 | controller: class LoginController {
9 | user: string;
10 | password: string;
11 |
12 | $onInit = () => {
13 | this.user = '';
14 | this.password = '';
15 | }
16 | }
17 | };
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&',
5 | onGenerateException: '&'
6 | },
7 | controllerAs: 'vm',
8 | controller: class LoginController {
9 | user: string;
10 | password: string;
11 |
12 | $onInit = () => {
13 | this.user = '';
14 | this.password = '';
15 | }
16 | }
17 | };
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/login/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import {LoginComponent} from './login.component';
3 | import { LoginPage } from './login.page';
4 | import { ApiModule } from '../../api/index'
5 |
6 | export const LoginModule = angular.module('login', [
7 | ApiModule.name,
8 | 'ngMessages',
9 | 'toastr'
10 | ])
11 | .component('login', LoginComponent)
12 | .component('loginPage', LoginPage)
13 | ;
--------------------------------------------------------------------------------
/04 custom events/src/app/components/login/login.component.ts:
--------------------------------------------------------------------------------
1 | export const LoginComponent = {
2 | template: require('./login.html') as string,
3 | bindings: {
4 | onDoLogin: '&',
5 | onGenerateException: '&'
6 | },
7 | controllerAs: 'vm',
8 | controller: class LoginController {
9 | user: string;
10 | password: string;
11 |
12 | $onInit = () => {
13 | this.user = '';
14 | this.password = '';
15 | }
16 | }
17 | };
--------------------------------------------------------------------------------
/05 nojdk/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/00 startup/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/02 exceptions/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/03 uirouter/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/04 custom events/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/06 angulartics/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/01 basic configuration/fake-json-server/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "clients": [
3 | {
4 | "id": "1",
5 | "name": "Soccer stars",
6 | "status": "Pending presenting new materials."
7 | },
8 | {
9 | "id": "2",
10 | "name": "We Run",
11 | "status": "New running shoes avalable, interested in eva models."
12 | },
13 | {
14 | "id": "3",
15 | "name": "Multi sports",
16 | "status": "Not accepting new orders til summer."
17 | }
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/app.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { routing } from './app.routes'
3 | import {AppComponent} from './app.component';
4 | import { components } from './components'
5 | import {angularAppInsights} from '../appinsights/angularModule';
6 | import {insightsConfig} from './app.insights';
7 |
8 | angular.module('app', [
9 | 'ui.router',
10 | angularAppInsights.name,
11 | components.name
12 | ])
13 | .config(routing)
14 | .component('app', AppComponent)
15 | .config(insightsConfig)
16 | ;
17 |
--------------------------------------------------------------------------------
/00 startup/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/00 startup/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/04 custom events/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/api/login.ts:
--------------------------------------------------------------------------------
1 |
2 | export class LoginService {
3 | $q: angular.IQService = null;
4 |
5 | constructor($q: angular.IQService) {
6 | "ngInject";
7 |
8 | this.$q = $q;
9 | }
10 |
11 | public validateLogin(user: string, pwd: string): angular.IPromise {
12 |
13 | const deferred = this.$q.defer();
14 | const validationResult = (user === 'admin' && pwd === 'test');
15 | deferred.resolve(validationResult);
16 |
17 | return deferred.promise;
18 | }
19 | }
20 |
21 | LoginService.$inject = ['$q'];
22 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/client/list/mapper.ts:
--------------------------------------------------------------------------------
1 | import * as model from '../../../api/model/client';
2 | import * as vm from "./viewModel";
3 |
4 |
5 | export class ClientListMapper {
6 |
7 | constructor() {
8 | "ngInject";
9 | }
10 |
11 | public ClientFromModelToVm(clientModel : model.Client ): vm.Client {
12 | return {
13 | ...clientModel
14 | }
15 | }
16 |
17 | public ClientListFromModelToVm(clientListModel : model.Client[]) : vm.Client[] {
18 | return clientListModel.map(this.ClientFromModelToVm);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/02 exceptions/src/appinsights/exception.config.ts:
--------------------------------------------------------------------------------
1 | import { AppInsights } from 'applicationinsights-js'
2 |
3 | ExceptionConfig.$inject = ['$provide'];
4 |
5 | export function ExceptionConfig($provide: any) {
6 | 'use strict';
7 | $provide.decorator('$exceptionHandler', extendExceptionHandler);
8 | }
9 |
10 | extendExceptionHandler.$inject = ['$delegate'];
11 |
12 | function extendExceptionHandler($delegate: any) {
13 | 'use strict';
14 | return (exception: any, cause: any) => {
15 | $delegate(exception, cause);
16 | AppInsights.trackException(exception, null, null, null, AI.SeverityLevel.Error);
17 | };
18 | }
--------------------------------------------------------------------------------
/03 uirouter/src/appinsights/exception.config.ts:
--------------------------------------------------------------------------------
1 | import { AppInsights } from 'applicationinsights-js'
2 |
3 | ExceptionConfig.$inject = ['$provide'];
4 |
5 | export function ExceptionConfig($provide: any) {
6 | 'use strict';
7 | $provide.decorator('$exceptionHandler', extendExceptionHandler);
8 | }
9 |
10 | extendExceptionHandler.$inject = ['$delegate'];
11 |
12 | function extendExceptionHandler($delegate: any) {
13 | 'use strict';
14 | return (exception: any, cause: any) => {
15 | $delegate(exception, cause);
16 | AppInsights.trackException(exception, null, null, null, AI.SeverityLevel.Error);
17 | };
18 | }
--------------------------------------------------------------------------------
/04 custom events/src/appinsights/exception.config.ts:
--------------------------------------------------------------------------------
1 | import { AppInsights } from 'applicationinsights-js'
2 |
3 | ExceptionConfig.$inject = ['$provide'];
4 |
5 | export function ExceptionConfig($provide: any) {
6 | 'use strict';
7 | $provide.decorator('$exceptionHandler', extendExceptionHandler);
8 | }
9 |
10 | extendExceptionHandler.$inject = ['$delegate'];
11 |
12 | function extendExceptionHandler($delegate: any) {
13 | 'use strict';
14 | return (exception: any, cause: any) => {
15 | $delegate(exception, cause);
16 | AppInsights.trackException(exception, null, null, null, AI.SeverityLevel.Error);
17 | };
18 | }
--------------------------------------------------------------------------------
/00 startup/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/03 uirouter/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/05 nojdk/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/02 exceptions/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/04 custom events/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/06 angulartics/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/01 basic configuration/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "moduleResolution": "node",
5 | "noImplicitAny": false,
6 | "removeComments": true,
7 | "sourceMap": true,
8 | "types": [
9 | "jasmine",
10 | "webpack-env",
11 | "angular-mocks"
12 | ],
13 | "jsx": "react",
14 | "experimentalDecorators": true,
15 | "emitDecoratorMetadata": false,
16 | "noLib": false,
17 | "preserveConstEnums": true,
18 | "suppressImplicitAnyIndexErrors": true
19 | },
20 | "compileOnSave": false,
21 | "exclude": [
22 | "node_modules"
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/03 uirouter/src/appinsights/uirouter.config.ts:
--------------------------------------------------------------------------------
1 | import { AppInsights } from 'applicationinsights-js'
2 |
3 | stateChange.$inject = ['$rootScope', '$transitions'];
4 |
5 | export function stateChange(
6 | $rootScope: angular.IRootScopeService,
7 | $transitions : any
8 | ) {
9 | 'use strict';
10 |
11 | $transitions.onSuccess({ }, function(trans) {
12 | AppInsights.trackPageView(trans.router.stateService.current.url)
13 | });
14 |
15 | /*
16 | // Legacy UI Router versions
17 | $rootScope.$on('$stateChangeStart',
18 | (event: any, toState: any, toParams: any) => {
19 | AppInsights.trackPageView(toState.name)
20 |
21 | }
22 | );
23 | */
24 | };
25 |
--------------------------------------------------------------------------------
/04 custom events/src/appinsights/uirouter.config.ts:
--------------------------------------------------------------------------------
1 | import { AppInsights } from 'applicationinsights-js'
2 |
3 | stateChange.$inject = ['$rootScope', '$transitions'];
4 |
5 | export function stateChange(
6 | $rootScope: angular.IRootScopeService,
7 | $transitions : any
8 | ) {
9 | 'use strict';
10 |
11 | $transitions.onSuccess({ }, function(trans) {
12 | AppInsights.trackPageView(trans.router.stateService.current.url)
13 | });
14 |
15 | /*
16 | // Legacy UI Router versions
17 | $rootScope.$on('$stateChangeStart',
18 | (event: any, toState: any, toParams: any) => {
19 | AppInsights.trackPageView(toState.name)
20 |
21 | }
22 | );
23 | */
24 | };
25 |
--------------------------------------------------------------------------------
/05 nojdk/src/appinsights/TelemetryRequest.ts:
--------------------------------------------------------------------------------
1 | export class TelemetryRequest implements angular.IRequestConfig {
2 | method: string;
3 | url: string;
4 | headers: TelemetryRequestHeaders;
5 | data: string;
6 | // bugfix for issue# 18: disable credentials on CORS requests.
7 | withCredentials: boolean;
8 |
9 | }
10 |
11 |
12 | export class TelemetryRequestHeaders implements angular.IHttpRequestConfigHeaders {
13 | [requestType: string]: string | (() => string);
14 |
15 | common: string | (() => string);
16 | get: string | (() => string);
17 | post: string | (() => string);
18 | put: string | (() => string);
19 | patch: string | (() => string);
20 | }
--------------------------------------------------------------------------------
/00 startup/Readme.md:
--------------------------------------------------------------------------------
1 | # 00 Startup
2 |
3 | This project is divided in two parts:
4 | - Exposes a fake api server.
5 | - Implement a simple application:
6 | - Implements basic navigation (ui-router).
7 | - Fetches data form a remote source (fake api).
8 |
9 | ## Prerequisites
10 |
11 | You will need node (at least v. 8.11.0) installed: https://nodejs.org/en/
12 |
13 | ## Steps to run it
14 |
15 | - First you need to install all the depdencies, open your command prompt and execute an _npm install_.
16 |
17 | ```bash
18 | npm install
19 | ```
20 |
21 | - Now let's start our fake server:
22 |
23 | ```bash
24 | npm run api:fake
25 | ```
26 |
27 | - And let's start our web application:
28 |
29 |
30 | ```bash
31 | npm start
32 | ```
33 |
34 |
35 |
36 |
--------------------------------------------------------------------------------
/00 startup/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/app.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { routing } from './app.routes'
3 | import {AppComponent} from './app.component';
4 | import { components } from './components'
5 | import { AppInsights } from 'applicationinsights-js'
6 |
7 | /* Call downloadAndSetup to download full ApplicationInsights script from CDN and initialize it with instrumentation key */
8 | AppInsights.downloadAndSetup({
9 | instrumentationKey: "",
10 | // Limit number of Ajax calls logged, to reduce traffic.
11 | maxAjaxCallsPerView: 10, // default is 500
12 | });
13 |
14 | AppInsights.trackPageView();
15 |
16 |
17 | angular.module('app', [
18 | 'ui.router',
19 | components.name
20 | ])
21 | .config(routing)
22 | .component('app', AppComponent)
23 | ;
24 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/04 custom events/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/api/clientApi.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "./model/client";
2 |
3 |
4 | export class ClientApiService {
5 | $http: angular.IHttpService = null;
6 |
7 | constructor($http: angular.IHttpService, private $q : angular.IQService) {
8 | "ngInject";
9 |
10 | this.$http = $http;
11 | }
12 |
13 | public getClientList(): angular.IPromise {
14 | const deferred = this.$q.defer();
15 |
16 | // TODO This could be configured, baseURL and environment variable in webpack
17 | this.$http.get('http://localhost:3000/clients').then(
18 | (result) => {
19 | const clients = result.data as Client[];
20 | deferred.resolve(clients);
21 | }
22 | );
23 | return deferred.promise;
24 | }
25 | }
26 |
27 | ClientApiService.$inject = ['$http','$q'];
28 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/app.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { routing } from './app.routes'
3 | import {AppComponent} from './app.component';
4 | import { components } from './components'
5 | import { AppInsights } from 'applicationinsights-js'
6 | import { appinsightsmod } from '../appinsights';
7 |
8 | /* Call downloadAndSetup to download full ApplicationInsights script from CDN and initialize it with instrumentation key */
9 | AppInsights.downloadAndSetup({
10 | instrumentationKey: "",
11 | // Limit number of Ajax calls logged, to reduce traffic.
12 | maxAjaxCallsPerView: 10, // default is 500
13 | });
14 |
15 | AppInsights.trackPageView();
16 |
17 |
18 | angular.module('app', [
19 | 'ui.router',
20 | components.name,
21 | appinsightsmod.name
22 | ])
23 | .config(routing)
24 | .component('app', AppComponent)
25 | ;
26 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/app.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { routing } from './app.routes'
3 | import {AppComponent} from './app.component';
4 | import { components } from './components'
5 | import { AppInsights } from 'applicationinsights-js'
6 | import { appinsightsmod } from '../appinsights';
7 |
8 | /* Call downloadAndSetup to download full ApplicationInsights script from CDN and initialize it with instrumentation key */
9 | AppInsights.downloadAndSetup({
10 | instrumentationKey: "",
11 | // Limit number of Ajax calls logged, to reduce traffic.
12 | maxAjaxCallsPerView: 10, // default is 500
13 | });
14 |
15 | AppInsights.trackPageView();
16 |
17 |
18 | angular.module('app', [
19 | 'ui.router',
20 | components.name,
21 | appinsightsmod.name
22 | ])
23 | .config(routing)
24 | .component('app', AppComponent)
25 | ;
26 |
--------------------------------------------------------------------------------
/04 custom events/src/app/app.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { routing } from './app.routes'
3 | import {AppComponent} from './app.component';
4 | import { components } from './components'
5 | import { AppInsights } from 'applicationinsights-js'
6 | import { appinsightsmod } from '../appinsights';
7 |
8 | /* Call downloadAndSetup to download full ApplicationInsights script from CDN and initialize it with instrumentation key */
9 | AppInsights.downloadAndSetup({
10 | instrumentationKey: "",
11 | // Limit number of Ajax calls logged, to reduce traffic.
12 | maxAjaxCallsPerView: 10, // default is 500
13 | });
14 |
15 | AppInsights.trackPageView();
16 |
17 |
18 | angular.module('app', [
19 | 'ui.router',
20 | components.name,
21 | appinsightsmod.name
22 | ])
23 | .config(routing)
24 | .component('app', AppComponent)
25 | ;
26 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/app.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { routing } from './app.routes'
3 | import {AppComponent} from './app.component';
4 | import { components } from './components'
5 | import { AppInsights } from 'applicationinsights-js'
6 | import { angularticsAzure } from '../appinsights/angulartics-azure';
7 |
8 | /* Call downloadAndSetup to download full ApplicationInsights script from CDN and initialize it with instrumentation key */
9 | AppInsights.downloadAndSetup({
10 | instrumentationKey: "",
11 | // Limit number of Ajax calls logged, to reduce traffic.
12 | maxAjaxCallsPerView: 10, // default is 500
13 | });
14 |
15 | AppInsights.trackPageView();
16 |
17 |
18 | angular.module('app', [
19 | 'ui.router',
20 | angularticsAzure.name,
21 | components.name
22 | ])
23 | .config(routing)
24 | .component('app', AppComponent)
25 | ;
26 |
--------------------------------------------------------------------------------
/00 startup/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/03 uirouter/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/05 nojdk/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/02 exceptions/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/04 custom events/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/06 angulartics/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/01 basic configuration/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { StateProvider, UrlRouterProvider, Ng1StateDeclaration } from '@uirouter/angularjs'
3 |
4 |
5 | // https://github.com/ngParty/ng-metadata/issues/206
6 | export const routing = ['$locationProvider', '$stateProvider', '$urlRouterProvider',($locationProvider: angular.ILocationProvider,
7 | $stateProvider: StateProvider,
8 | $urlRouterProvider: UrlRouterProvider
9 |
10 | ) => {
11 | "ngInject";
12 |
13 | // html5 removes the need for # in URL
14 | $locationProvider.html5Mode({
15 | enabled: false
16 | });
17 |
18 | $stateProvider.state('home', {
19 | url: '/home',
20 | views: {
21 | 'content@': { template: '' }
22 | }
23 | }
24 | );
25 |
26 | $stateProvider.state('clients', {
27 | url: '/clients',
28 | views: {
29 | 'content@': { template: '' }
30 | }
31 | }
32 | );
33 |
34 | $urlRouterProvider.otherwise('/home');
35 |
36 | }]
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/00 startup/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/00 startup/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import {IToastrService} from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 |
5 | export class LoginPageController {
6 | loginService: LoginService = null;
7 | toastr : IToastrService;
8 | $state: StateService;
9 |
10 | constructor(LoginService: LoginService, toastr : IToastrService, $state: StateService) {
11 | "ngInject";
12 |
13 | this.loginService = LoginService;
14 | this.toastr = toastr;
15 | this.$state = $state;
16 | }
17 |
18 | doLogin(login: string, password: string) {
19 | this.loginService.validateLogin(login, password).then(
20 | (succeeded) => {
21 | if(succeeded) {
22 | console.log('login succeeded');
23 | this.$state.go('clients');
24 | } else {
25 | this.toastr.error('Incorrect login or password, please try again')
26 | }
27 | }
28 | );
29 | }
30 | }
31 |
32 | LoginPageController.$inject = ['LoginService', 'toastr', '$state'];
33 |
34 |
35 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/client/list/index.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 | import { ClientListComponent } from './client.list.component';
3 | import { ClientListSearchComponent } from './search/client.list.search.component';
4 | import { ClientListResultComponent } from './result/client.list.result.component';
5 | import { ClientListCardComponent } from './result/client.list.card.component'
6 | import { ClientListPage } from './client.list.page';
7 | import { ApiModule } from '../../../api';
8 | import { ClientListMapper } from './mapper';
9 |
10 | export const ClientListModule = angular.module('clientlist', [
11 | ApiModule.name
12 | ])
13 | .component('clientlist', ClientListComponent)
14 | .component('clientlistsearchcomponent', ClientListSearchComponent)
15 | .component('clientlistresultcomponent', ClientListResultComponent)
16 | .component('clientlistcardcomponent', ClientListCardComponent)
17 | .component('clientListComponent', ClientListComponent)
18 | .component('clientListPage', ClientListPage)
19 | .service('clientListMapper', ClientListMapper)
20 | ;
21 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import {IToastrService} from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 |
5 | export class LoginPageController {
6 | loginService: LoginService = null;
7 | toastr : IToastrService;
8 | $state: StateService;
9 |
10 | constructor(LoginService: LoginService, toastr : IToastrService, $state: StateService) {
11 | "ngInject";
12 |
13 | this.loginService = LoginService;
14 | this.toastr = toastr;
15 | this.$state = $state;
16 | }
17 |
18 | doLogin(login: string, password: string) {
19 | this.loginService.validateLogin(login, password).then(
20 | (succeeded) => {
21 | if(succeeded) {
22 | console.log('login succeeded');
23 | this.$state.go('clients');
24 | } else {
25 | this.toastr.error('Incorrect login or password, please try again')
26 | }
27 | }
28 | );
29 | }
30 | }
31 |
32 | LoginPageController.$inject = ['LoginService', 'toastr', '$state'];
33 |
34 |
35 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import {IToastrService} from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 |
5 | export class LoginPageController {
6 | loginService: LoginService = null;
7 | toastr : IToastrService;
8 | $state: StateService;
9 |
10 | constructor(LoginService: LoginService, toastr : IToastrService, $state: StateService) {
11 | "ngInject";
12 |
13 | this.loginService = LoginService;
14 | this.toastr = toastr;
15 | this.$state = $state;
16 | }
17 |
18 | doLogin(login: string, password: string) {
19 | this.loginService.validateLogin(login, password).then(
20 | (succeeded) => {
21 | if(succeeded) {
22 | console.log('login succeeded');
23 | this.$state.go('clients');
24 | } else {
25 | this.toastr.error('Incorrect login or password, please try again')
26 | }
27 | }
28 | );
29 | }
30 | }
31 |
32 | LoginPageController.$inject = ['LoginService', 'toastr', '$state'];
33 |
34 |
35 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import {IToastrService} from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 |
5 | export class LoginPageController {
6 | loginService: LoginService = null;
7 | toastr : IToastrService;
8 | $state: StateService;
9 |
10 | constructor(LoginService: LoginService, toastr : IToastrService, $state: StateService) {
11 | "ngInject";
12 |
13 | this.loginService = LoginService;
14 | this.toastr = toastr;
15 | this.$state = $state;
16 | }
17 |
18 | doLogin(login: string, password: string) {
19 | this.loginService.validateLogin(login, password).then(
20 | (succeeded) => {
21 | if(succeeded) {
22 | console.log('login succeeded');
23 | this.$state.go('clients');
24 | } else {
25 | this.toastr.error('Incorrect login or password, please try again')
26 | }
27 | }
28 | );
29 | }
30 | }
31 |
32 | LoginPageController.$inject = ['LoginService', 'toastr', '$state'];
33 |
34 |
35 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 Lemoncode
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import { IToastrService } from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 |
5 | export class LoginPageController {
6 | loginService: LoginService = null;
7 | toastr: IToastrService;
8 | $state: StateService;
9 |
10 | constructor(LoginService: LoginService, toastr: IToastrService, $state: StateService) {
11 | "ngInject";
12 |
13 | this.loginService = LoginService;
14 | this.toastr = toastr;
15 | this.$state = $state;
16 | }
17 |
18 | doUncontrolledException() {
19 | throw "my exception";
20 | }
21 |
22 | doLogin(login: string, password: string) {
23 | this.loginService.validateLogin(login, password).then(
24 | (succeeded) => {
25 | if (succeeded) {
26 | console.log('login succeeded');
27 | this.$state.go('clients');
28 | } else {
29 | this.toastr.error('Incorrect login or password, please try again')
30 | }
31 | }
32 | );
33 | }
34 | }
35 |
36 | LoginPageController.$inject = ['LoginService', 'toastr', '$state'];
37 |
38 |
39 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import { IToastrService } from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 |
5 | export class LoginPageController {
6 | loginService: LoginService = null;
7 | toastr: IToastrService;
8 | $state: StateService;
9 |
10 | constructor(LoginService: LoginService, toastr: IToastrService, $state: StateService) {
11 | "ngInject";
12 |
13 | this.loginService = LoginService;
14 | this.toastr = toastr;
15 | this.$state = $state;
16 | }
17 |
18 | doUncontrolledException() {
19 | throw "my exception";
20 | }
21 |
22 | doLogin(login: string, password: string) {
23 | this.loginService.validateLogin(login, password).then(
24 | (succeeded) => {
25 | if (succeeded) {
26 | console.log('login succeeded');
27 | this.$state.go('clients');
28 | } else {
29 | this.toastr.error('Incorrect login or password, please try again')
30 | }
31 | }
32 | );
33 | }
34 | }
35 |
36 | LoginPageController.$inject = ['LoginService', 'toastr', '$state'];
37 |
38 |
39 |
--------------------------------------------------------------------------------
/05 nojdk/src/appinsights/HTTPRequest.ts:
--------------------------------------------------------------------------------
1 | export interface IHttpRequest {
2 | send(options: HttpRequestOptions, onSuccessCallback: () => void, onErrorCallback: (statusCode: number) => void);
3 | }
4 |
5 |
6 | export class HttpRequest implements IHttpRequest {
7 |
8 | send(options: HttpRequestOptions, onSuccessCallback:()=>void, onErrorCallback:(statusCode:number)=>void) {
9 | var request = new XMLHttpRequest();
10 |
11 | request.onerror = function(e) {
12 | onErrorCallback(0);
13 | }
14 | request.onload = function(e) {
15 | if (request.status == 200) {
16 | // success!
17 | onSuccessCallback();
18 | } else {
19 | onErrorCallback(request.status);
20 | }
21 |
22 | }
23 |
24 | request.open(options.method, options.url, true);
25 | for (var header in options.headers) {
26 | request.setRequestHeader(header, options.headers[header]);
27 | }
28 | request.send(JSON.stringify(options.data));
29 |
30 | }
31 |
32 | }
33 |
34 |
35 |
36 | export class HttpRequestOptions {
37 | method: string;
38 | url: string;
39 | headers: any;
40 | data: any;
41 | }
--------------------------------------------------------------------------------
/00 startup/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/03 uirouter/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/02 exceptions/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/06 angulartics/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/01 basic configuration/src/app/components/client/list/client.list.page.controller.ts:
--------------------------------------------------------------------------------
1 | import {Client} from './viewModel';
2 | import { ClientApiService } from '../../../api/clientApi';
3 | import { ClientListMapper } from './mapper';
4 |
5 | export class ClientListPageController {
6 | clientList : Client[];
7 | clientApiService : ClientApiService;
8 | clientListMapper : ClientListMapper;
9 |
10 | constructor(ClientApiService : ClientApiService, clientListMapper : ClientListMapper) {
11 | "ngInject";
12 |
13 | this.clientApiService = ClientApiService;
14 | this.clientListMapper = clientListMapper;
15 | }
16 |
17 | $onInit = () => {
18 | this.clientApiService.getClientList().then(
19 | (clients) => {
20 | this.clientList = this.clientListMapper.ClientListFromModelToVm(clients);
21 | }
22 | )
23 |
24 | this.clientList = [
25 | {
26 | id : '1',
27 | name : 'fake client A',
28 | status : 'fake status client A',
29 | },
30 | {
31 | id : '1',
32 | name : 'fake client A',
33 | status : 'fake status client A',
34 | },
35 | ]
36 | }
37 | }
38 |
39 | ClientListPageController.$inject = ['ClientApiService', 'clientListMapper'];
40 |
--------------------------------------------------------------------------------
/06 angulartics/src/appinsights/angulartics-azure.ts:
--------------------------------------------------------------------------------
1 | import * as angular from 'angular';
2 |
3 | /**
4 | * @license Angulartics v0.17.2
5 | * (c) 2013 Luis Farzati http://luisfarzati.github.io/angulartics
6 | * Microsoft Azure Application Insights plugin contributed by https://github.com/anthonychu
7 | * License: MIT
8 | */
9 |
10 | export const angularticsAzure = angular.module('angulartics.azure', ['angulartics'])
11 | .config(['$analyticsProvider', function ($analyticsProvider) {
12 |
13 | $analyticsProvider.registerPageTrack(function (path) {
14 | appInsights.trackPageView(path);
15 | });
16 |
17 | /**
18 | * Numeric properties are sent as metric (measurement) properties.
19 | * Everything else is sent as normal properties.
20 | */
21 | $analyticsProvider.registerEventTrack(function (eventName, eventProperties) {
22 | var properties = {};
23 | var measurements = {};
24 |
25 | angular.forEach(eventProperties, function (value, key) {
26 | if (isNumeric(value)) {
27 | measurements[key] = parseFloat(value);
28 | } else {
29 | properties[key] = value;
30 | }
31 | });
32 |
33 | appInsights.trackEvent(eventName, properties, measurements);
34 | });
35 |
36 | }]);
37 |
38 | function isNumeric(n) {
39 | return !isNaN(parseFloat(n)) && isFinite(n);
40 | }
--------------------------------------------------------------------------------
/00 startup/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/05 nojdk/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/02 exceptions/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/03 uirouter/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/06 angulartics/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/04 custom events/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/01 basic configuration/spec.bundle.js:
--------------------------------------------------------------------------------
1 | /*
2 | * When testing with Webpack and TS, we have to do some
3 | * preliminary setup. Because we are writing our tests also in TS,
4 | * we must transpile those as well, which is handled inside
5 | * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
6 | * file for the Webpack tests. Similarly to how Webpack creates a
7 | * `bundle.js` file for the compressed app source files, when we
8 | * run our tests, Webpack, likewise, compiles and bundles those tests here.
9 | */
10 |
11 | import angular from 'angular';
12 | import mocks from 'angular-mocks';
13 | import toastr from 'angular-toastr';
14 | import 'angular-messages';
15 |
16 | // We use the context method on `require` which Webpack created
17 | // in order to signify which files we actually want to require or import.
18 | // Below, `context` will be a/an function/object with file names as keys.
19 | // Using that regex, we scan within ./src/app` and target
20 | // all files ending with `.spec.ts` and trace its path.
21 | // By passing in true, we permit this process to occur recursively.
22 | let context = require.context('./src/app', true, /\.spec\.ts/);
23 |
24 | // Get all files, for each file, call the context function
25 | // that will require the file and load it here. Context will
26 | // loop and require those spec files here.
27 | context.keys().forEach(context);
28 |
--------------------------------------------------------------------------------
/05 nojdk/src/appinsights/ExceptionInterceptor.ts:
--------------------------------------------------------------------------------
1 | import { Tools } from './Tools';
2 | import { Options } from './Options';
3 |
4 | // Exception interceptor
5 | // Intercepts calls to the $exceptionHandler and sends them to Application insights as exception telemetry.
6 | export class ExceptionInterceptor {
7 |
8 | private _origExceptionHandler;
9 | private _interceptFunction;
10 |
11 | static errorOnHttpCall: boolean;
12 |
13 | setInterceptFunction(func) {
14 | this._interceptFunction = func;
15 | }
16 |
17 | getPrivateExceptionHanlder() {
18 | return Tools.isNullOrUndefined(this._origExceptionHandler) ? Tools.noop : this._origExceptionHandler;
19 | }
20 |
21 | constructor($provide: any) {
22 |
23 | ExceptionInterceptor.errorOnHttpCall = false;
24 |
25 | this._interceptFunction = Tools.noop;
26 |
27 | $provide.decorator('$exceptionHandler', [
28 | '$delegate', ($delegate) => {
29 | this._origExceptionHandler = $delegate;
30 | return (exception, cause) => {
31 | // track the call
32 | // ... only if there is no active issues/errors sending data over http, in order to prevent an infinite loop.
33 | if (!ExceptionInterceptor.errorOnHttpCall) {
34 | this._interceptFunction(exception, cause);
35 | }
36 | // Call the original
37 | this._origExceptionHandler(exception, cause);
38 | };
39 | }
40 | ]);
41 | }
42 |
43 | }
44 |
--------------------------------------------------------------------------------
/04 custom events/src/app/components/login/login.page.controller.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from '../../api/login'
2 | import { IToastrService } from 'angular-toastr'
3 | import { StateService } from '@uirouter/angularjs'
4 | import { TrackEventService } from '../../../appinsights/trackevent.factory'
5 |
6 | export class LoginPageController {
7 | loginService: LoginService = null;
8 | toastr: IToastrService;
9 | $state: StateService;
10 | trackEventService : TrackEventService = null;
11 |
12 | constructor(LoginService: LoginService, toastr: IToastrService, $state: StateService, TrackEventService : TrackEventService) {
13 | "ngInject";
14 |
15 | this.loginService = LoginService;
16 | this.toastr = toastr;
17 | this.$state = $state;
18 | this.trackEventService = TrackEventService;
19 | }
20 |
21 | doUncontrolledException() {
22 | throw "my exception";
23 | }
24 |
25 | doLogin(login: string, password: string) {
26 | this.loginService.validateLogin(login, password).then(
27 | (succeeded) => {
28 | this.trackEventService.trackEvent("user clicked on login");
29 | if (succeeded) {
30 | console.log('login succeeded');
31 | this.$state.go('clients');
32 | } else {
33 | this.toastr.error('Incorrect login or password, please try again')
34 | }
35 | }
36 | );
37 | }
38 | }
39 |
40 | LoginPageController.$inject = ['LoginService', 'toastr', '$state', 'TrackEventService'];
41 |
42 |
43 |
--------------------------------------------------------------------------------
/05 nojdk/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/00 startup/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/02 exceptions/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/03 uirouter/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/06 angulartics/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/04 custom events/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/01 basic configuration/src/app/api/login.spec.ts:
--------------------------------------------------------------------------------
1 | import { LoginService } from "./login"
2 | import * as angular from 'angular'
3 | import 'angular-mocks';
4 |
5 | describe('login', () => {
6 | describe('performLogin', () => {
7 | let $q;
8 | let $rootScope;
9 |
10 | beforeEach(() => {
11 | angular['mock'].inject((_$q_, _$rootScope_) => {
12 | this.$q = _$q_;
13 | this.$rootScope = _$rootScope_;
14 | });
15 | });
16 |
17 | it('Login Service exists', () => {
18 | const loginService = new LoginService(this.$q);
19 |
20 | expect(loginService).toBeDefined();
21 | expect(loginService.validateLogin).toBeDefined();
22 | })
23 |
24 | it('valid login', () => {
25 | const loginService = new LoginService(this.$q);
26 | const promise = loginService.validateLogin('admin', 'test');
27 |
28 | promise.then((loginSucceeded) => {
29 | expect(loginSucceeded).toBeTruthy();
30 | })
31 | // Force deferred promise to be resolved
32 | this.$rootScope.$digest();
33 | });
34 |
35 | it('invalid login', () => {
36 | const loginService = new LoginService(this.$q);
37 | const promise = loginService.validateLogin('admin', 'wrongpassword');
38 |
39 | promise.then((loginSucceeded) => {
40 | expect(loginSucceeded).toBeFalsy();
41 | })
42 | // Force deferred promise to be resolved
43 | this.$rootScope.$digest();
44 | });
45 | });
46 | });
--------------------------------------------------------------------------------
/readme.md:
--------------------------------------------------------------------------------
1 | # App insights + Angularjs firestarter
2 |
3 | In this step by step guided samples we will learn how to work with the app insights
4 | javascript sdk and integrate it in angularjs (1.6 version).
5 |
6 |
7 | # Samples
8 |
9 | ## 00 Project startup
10 |
11 | This sample wil be taken as startup point, it contains:
12 | - ui-router implementation.
13 | - exceptions.
14 | - http calls.
15 | - custom events to track.
16 |
17 | ## 01 Basic configuration
18 |
19 | We will start with a very simple sample, just some instrucions to donwload the SDK library
20 | from npm, initialize it and chec results with AJAX calls.
21 |
22 |
23 | ## 02 Basic angularjs integration - exceptions
24 |
25 | Let's start by tracking exceptions, we need a single entry point for all this,
26 | we can just hook to Exception Provider.
27 |
28 | ## 03 Basic angularjs integration - ui router navigation
29 |
30 | Let's start by tracking exceptions, we need a single entry point for all this,
31 | we can just hook to ui-router-provider.
32 |
33 | ## 04 Custom events
34 |
35 | In some scenarios we want to register custom events
36 |
37 | # About Basefactor + Lemoncode
38 |
39 | We are an innovating team of Javascript experts, passionate about turning your ideas into robust products.
40 |
41 | [Basefactor, consultancy by Lemoncode](http://www.basefactor.com) provides consultancy and coaching services.
42 |
43 | [Lemoncode](http://lemoncode.net/services/en/#en-home) provides training services.
44 |
45 | For the LATAM/Spanish audience we are running an Online Front End Master degree, more info: http://lemoncode.net/master-frontend
46 |
47 |
--------------------------------------------------------------------------------
/05 nojdk/src/appinsights/Tools.ts:
--------------------------------------------------------------------------------
1 |
2 | export class Tools {
3 |
4 | private _angular: angular.IAngularStatic;
5 | static isDefined: (val: any) => boolean;
6 | static isUndefined: (val: any) => boolean;
7 | static isObject: (val: any) => boolean;
8 | static isArray: (val: any) => boolean;
9 | static isString: (val: any) => boolean;
10 | static extend: (destination: any, ...sources: any[]) => any;
11 | static toJson: (obj: any, pretty?: boolean) => string;
12 | static fromJson: (obj: string) => any;
13 | static forEach;
14 | static noop: (...args: any[]) => void;
15 |
16 | constructor(angular: angular.IAngularStatic) {
17 |
18 |
19 | Tools.isDefined = angular.isDefined,
20 | Tools.isUndefined = angular.isUndefined,
21 | Tools.isObject = angular.isObject,
22 | Tools.isArray = angular.isArray,
23 | Tools.isString = angular.isString,
24 | Tools.extend = angular.extend,
25 | Tools.toJson = angular.toJson,
26 | Tools.fromJson = angular.fromJson,
27 | Tools.forEach = angular.forEach,
28 | Tools.noop = angular.noop; // jshint ignore:line
29 | }
30 |
31 | static isNullOrUndefined(val) {
32 | return Tools.isUndefined(val) || val === null;
33 | }
34 |
35 | static isNumber(n: any) {
36 | return !isNaN(parseFloat(n)) && isFinite(n);
37 | }
38 |
39 | static generateGuid() {
40 | const value = [];
41 | const digits = "0123456789abcdef";
42 | for (var i = 0; i < 36; i++) {
43 | value[i] = digits.substr(Math.floor(Math.random() * 0x10), 1);
44 | }
45 | value[8] = value[13] = value[18] = value[23] = "-";
46 | value[14] = "4";
47 | value[19] = digits.substr((value[19] & 0x3) | 0x8, 1);
48 | return value.join("");
49 | }
50 |
51 |
52 | }
--------------------------------------------------------------------------------
/03 uirouter/Readme.md:
--------------------------------------------------------------------------------
1 | # 03 Navigation
2 |
3 | In this project we are going to keep track of the user navigation.
4 |
5 |
6 | ## Prerequisites
7 |
8 | You will need node (at least v. 8.11.0) installed: https://nodejs.org/en/
9 |
10 | ## Steps
11 |
12 | - Let's start from our previous sample _01 basic configuratin_ let's copy the content from that folder.
13 |
14 | - First you need to install all the dependencies, open your command prompt and execute an _npm install_.
15 |
16 | ```bash
17 | npm install
18 | ```
19 |
20 | - Now let's start our fake server (good idea to let it working in background):
21 |
22 | ```bash
23 | npm run api:fake
24 | ```
25 | - Now we are going to create a new function under the appinsights module:
26 |
27 | _./src/appinsights/uirouter.config.ts_
28 |
29 | ```typescript
30 | import { AppInsights } from 'applicationinsights-js'
31 |
32 | stateChange.$inject = ['$rootScope', '$transitions'];
33 |
34 | export function stateChange(
35 | $rootScope: angular.IRootScopeService,
36 | $transitions : any
37 | ) {
38 | 'use strict';
39 |
40 | $transitions.onSuccess({ }, function(trans) {
41 | AppInsights.trackPageView(trans.router.stateService.current.url)
42 | });
43 |
44 | /*
45 | // Legacy UI Router versions
46 | $rootScope.$on('$stateChangeStart',
47 | (event: any, toState: any, toParams: any) => {
48 | AppInsights.trackPageView(toState.name)
49 |
50 | }
51 | );
52 | */
53 | };
54 | ```
55 |
56 | - Next step is to run this function that we have previously created on module startup.
57 |
58 | _./src/appinsights/index.ts_
59 |
60 |
61 | ```diff
62 | import * as angular from 'angular';
63 | import {ExceptionConfig} from './exception.config';
64 | + import {stateChange} from './uirouter.config'
65 |
66 | export const appinsightsmod = angular.module('appinsightsmod', [])
67 | .config(ExceptionConfig)
68 | + .run(stateChange)
69 | ;
70 | ```
71 |
72 |
--------------------------------------------------------------------------------
/00 startup/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "angular-1-6-tutorial",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "start": "webpack-dev-server --inline",
8 | "api:fake": "json-server --routes ./fake-json-server/routes.json --watch ./fake-json-server/db.json",
9 | "build": "webpack",
10 | "test": "karma start --no-single-Run",
11 | "test:single": "karma start --single-Run"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "git+https://github.com/Lemoncode/angular-1-6-tutorial.git"
16 | },
17 | "author": "",
18 | "license": "ISC",
19 | "bugs": {
20 | "url": "https://github.com/Lemoncode/angular-1-6-tutorial/issues"
21 | },
22 | "homepage": "https://github.com/Lemoncode/angular-1-6-tutorial#readme",
23 | "devDependencies": {
24 | "@types/angular": "^1.6.40",
25 | "@types/angular-toastr": "^1.6.33",
26 | "@types/jasmine": "^2.8.4",
27 | "@types/webpack-env": "^1.13.3",
28 | "angular-mocks": "^1.6.8",
29 | "awesome-typescript-loader": "^3.4.1",
30 | "babel-core": "^6.26.0",
31 | "babel-preset-env": "^1.6.1",
32 | "file-loader": "^1.1.6",
33 | "jasmine": "^2.9.0",
34 | "jasmine-core": "^2.9.1",
35 | "json-server": "^0.12.1",
36 | "karma": "^2.0.0",
37 | "karma-chrome-launcher": "^2.2.0",
38 | "karma-jasmine": "^1.1.1",
39 | "karma-sourcemap-loader": "^0.3.7",
40 | "karma-spec-reporter": "0.0.32",
41 | "karma-webpack": "^2.0.9",
42 | "ng-annotate-webpack-plugin": "^0.2.1-pre",
43 | "raw-loader": "^0.5.1",
44 | "typescript": "^2.6.2",
45 | "url-loader": "^0.6.2",
46 | "webpack": "^3.10.0",
47 | "webpack-dev-server": "^2.11.0",
48 | "webpack-env": "^0.8.0"
49 | },
50 | "dependencies": {
51 | "@types/angular-mocks": "^1.5.11",
52 | "@uirouter/angularjs": "^1.0.13",
53 | "angular": "^1.6.3",
54 | "angular-messages": "^1.6.8",
55 | "angular-toastr": "^2.1.1",
56 | "bootstrap": "^3.3.7",
57 | "css-loader": "^0.28.9",
58 | "extract-text-webpack-plugin": "^3.0.2",
59 | "html-webpack-plugin": "^2.30.1",
60 | "node-sass": "^4.7.2",
61 | "sass-loader": "^6.0.6",
62 | "style-loader": "^0.19.1"
63 | }
64 | }
65 |
--------------------------------------------------------------------------------
/05 nojdk/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "angular-1-6-tutorial",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "start": "webpack-dev-server --inline",
8 | "api:fake": "json-server --routes ./fake-json-server/routes.json --watch ./fake-json-server/db.json",
9 | "build": "webpack",
10 | "test": "karma start --no-single-Run",
11 | "test:single": "karma start --single-Run"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "git+https://github.com/Lemoncode/angular-1-6-tutorial.git"
16 | },
17 | "author": "",
18 | "license": "ISC",
19 | "bugs": {
20 | "url": "https://github.com/Lemoncode/angular-1-6-tutorial/issues"
21 | },
22 | "homepage": "https://github.com/Lemoncode/angular-1-6-tutorial#readme",
23 | "devDependencies": {
24 | "@types/angular": "^1.6.40",
25 | "@types/angular-toastr": "^1.6.33",
26 | "@types/jasmine": "^2.8.4",
27 | "@types/webpack-env": "^1.13.3",
28 | "angular-mocks": "^1.6.8",
29 | "awesome-typescript-loader": "^3.4.1",
30 | "babel-core": "^6.26.0",
31 | "babel-preset-env": "^1.6.1",
32 | "file-loader": "^1.1.6",
33 | "jasmine": "^2.9.0",
34 | "jasmine-core": "^2.9.1",
35 | "json-server": "^0.12.1",
36 | "karma": "^2.0.0",
37 | "karma-chrome-launcher": "^2.2.0",
38 | "karma-jasmine": "^1.1.1",
39 | "karma-sourcemap-loader": "^0.3.7",
40 | "karma-spec-reporter": "0.0.32",
41 | "karma-webpack": "^2.0.9",
42 | "ng-annotate-webpack-plugin": "^0.2.1-pre",
43 | "raw-loader": "^0.5.1",
44 | "typescript": "^2.6.2",
45 | "url-loader": "^0.6.2",
46 | "webpack": "^3.10.0",
47 | "webpack-dev-server": "^2.11.0",
48 | "webpack-env": "^0.8.0"
49 | },
50 | "dependencies": {
51 | "@types/angular-mocks": "^1.5.11",
52 | "@uirouter/angularjs": "^1.0.13",
53 | "angular": "^1.6.3",
54 | "angular-messages": "^1.6.8",
55 | "angular-toastr": "^2.1.1",
56 | "bootstrap": "^3.3.7",
57 | "css-loader": "^0.28.9",
58 | "extract-text-webpack-plugin": "^3.0.2",
59 | "html-webpack-plugin": "^2.30.1",
60 | "node-sass": "^4.7.2",
61 | "sass-loader": "^6.0.6",
62 | "style-loader": "^0.19.1"
63 | }
64 | }
65 |
--------------------------------------------------------------------------------
/00 startup/src/app/components/login/login.html:
--------------------------------------------------------------------------------
1 |
4 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
44 |
45 |
46 |
47 |
Navigate to clients
48 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
44 |
45 |
46 |
47 |
Navigate to clients
48 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
44 |
45 |
46 |
47 |
Navigate to clients
48 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
44 |
45 |
46 |
47 |
Navigate to clients
48 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
45 |
46 |
47 |
48 |
Navigate to clients
49 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
45 |
46 |
47 |
48 |
Navigate to clients
49 |
5 |
6 |
7 |
8 |
9 |
10 | Sign in (user: admin pwd: test)
11 |
12 |
13 |
45 |
46 |
47 |
48 |
Navigate to clients
49 |