Skip to content

Commit a2f0ec2

Browse files
500Tech500Tech
500Tech
authored and
500Tech
committed
initial commit
1 parent 37493e2 commit a2f0ec2

10 files changed

+76
-68
lines changed

src/app.config.ts

+5-9
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,11 @@
1-
/**
2-
* Created by 500tech on 7/14/16.
3-
*/
4-
export const appName = 'app';
1+
import {routes} from "./app.routes";
2+
import {provideStates} from "./decorators";
53

64
export function appConfig($urlRouterProvider, $stateProvider, tagsInputConfigProvider) {
5+
provideStates(routes, $stateProvider);
6+
77
$urlRouterProvider.otherwise('/');
8-
$stateProvider
9-
.state('root', {
10-
url: '/',
11-
template: `<${appName}></${appName}>`
12-
});
8+
139
tagsInputConfigProvider
1410
.setDefaults('tagsInput', {
1511
placeholder: 'Search tags',

src/app.routes.ts

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import {AppComponent} from "./components/app.component";
2+
import {IComponentState} from "./decorators";
3+
4+
export const routes: IComponentState[] = [
5+
{ state: 'root', url: '/', component: AppComponent }
6+
];

src/components/app.component.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import {Component} from '../decorators';
2-
import {appName} from "../app.config";
32
import {CommentsComponent} from "./comment-list/comments.component";
43

54
@Component({
6-
selector: appName,
5+
selector: 'app',
76
directives: [CommentsComponent],
87
template: `<comments></comments>`
98
})

src/components/comment-list/comments.component.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -24,15 +24,14 @@ import {FilterByTagsPipe} from "../../pipes/filterByTags";
2424
</div>
2525
</div>`
2626
})
27-
2827
@Injectable()
2928
export class CommentsComponent {
3029
comments: IComment[];
3130
emptyComment: IComment;
3231
tags: string[];
3332
tagFilter: any[];
3433

35-
constructor(private _CommentsService: CommentsService) {
34+
constructor(private _CommentsService) {
3635
this.emptyComment = {};
3736
this.tagFilter = [];
3837
_CommentsService.getComments().then((comments) => {

src/decorators.ts

+44-30
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import {appName} from "./app.config";
1+
import {IState, IStateProvider} from "angular-ui-router";
2+
3+
const appName = 'app';
24

35
const module = function(moduleOrName) {
46
return typeof moduleOrName === "string"
@@ -13,27 +15,30 @@ export function Component(options: {
1315
templateUrl?: string,
1416
bindings?: any,
1517
require?: any,
16-
directives?: any[]
17-
pipes?: any[]
18+
directives?: any[],
19+
pipes?: any[],
1820
providers?: any[]
1921
}, moduleOrName: string | ng.IModule = `${appName}.components`) {
20-
return (controller: any) => {
22+
return (Class: any) => {
2123
const selector = options.selector;
2224
delete options.selector;
2325
delete options.directives;
2426
delete options.pipes;
2527
delete options.providers;
26-
module(moduleOrName).component(selector, angular.extend(options, { controller: controller }));
28+
Class.selector = selector;
29+
module(moduleOrName).component(selector, angular.extend(options, { controller: Class }));
2730
}
2831
}
32+
function annotate(func: any) {
33+
const $injector = angular.injector(['ng']);
34+
func.$inject = $injector.annotate(func).map(member => member.replace(/^_/, ''));
35+
}
2936

30-
export function Service(moduleOrName: string | ng.IModule = `${appName}.services`) {
37+
export function Injectable(moduleOrName: string | ng.IModule = `${appName}.services`) {
3138
return (service: any) => {
3239
const name = service.name;
3340
const isProvider = service.hasOwnProperty('$get');
34-
if (!name) {
35-
console.error('Service decorator can be used with named class only');
36-
}
41+
annotate(service);
3742
module(moduleOrName)[isProvider ? 'provider' : 'service'](name, service);
3843
}
3944
}
@@ -48,32 +53,41 @@ export interface PipeTransform {
4853

4954
export function Pipe(options: {name: string}, moduleOrName: string | ng.IModule = `${appName}.pipes`) {
5055
return (Pipe: PipeTransformStatic) => {
51-
const filter = () => {
52-
console.log(Pipe.$inject);
53-
//@todo: add support for injection across all registered modules
54-
const $injector = angular.injector(['ng']);
55-
const instance:any = $injector.instantiate(Pipe);
56-
return instance.transform.bind(instance);
57-
};
58-
module(moduleOrName).filter(options.name, filter);
56+
annotate(Pipe);
57+
//@todo: add support for injection across all registered modules
58+
debugger;
59+
const $injector = angular.injector(['ng']);
60+
const instance:any = $injector.instantiate(Pipe);
61+
module(moduleOrName).filter(options.name, () => instance.transform.bind(instance));
5962
}
6063
}
6164

65+
export interface IComponentState extends IState {
66+
state: string,
67+
component?: any,
68+
views?: { [name: string]: IComponentState }
69+
}
6270

63-
export function Injectable() {
64-
return (Class: any) => {
65-
const $injector = angular.injector(['ng']);
66-
Class.$inject = $injector.annotate(Class).map((member) => member.replace(/^_/, ''));
67-
}
71+
function setTemplate(state: IComponentState) {
72+
const selector = state.component.selector;
73+
state.template = `<${selector}></${selector}>`;
74+
delete state.component;
6875
}
6976

70-
export function bootstrap(appName: string, appClass: any) {
71-
return (anything: any) => {
72-
if (!appClass) {
73-
console.error(`Please provide main component class as a second argument to @bootstrap decorator`);
77+
export function provideStates(states: IComponentState[], $stateProvider: IStateProvider) {
78+
states.map((config) => {
79+
const name = config.state;
80+
const namedState = config.views;
81+
if (namedState) {
82+
const namedViews = Object.keys(namedState);
83+
namedViews.forEach((view) => {
84+
setTemplate(namedState[view]);
85+
});
7486
}
75-
angular.element(document).ready(() => {
76-
angular.bootstrap(document, [appName]);
77-
});
78-
}
87+
else {
88+
setTemplate(config);
89+
}
90+
delete config.state;
91+
return { name, config };
92+
}).forEach(state => $stateProvider.state(state.name, state.config));
7993
}

src/main.ts

+7-7
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,12 @@ import 'ng-tags-input';
88
import services from './services/services.module';
99
import components from './components/components.module';
1010
import pipes from './pipes/pipes.module';
11-
import {appConfig, appName} from "./app.config";
12-
import {AppComponent} from "./components/app.component";
13-
import {bootstrap} from "./decorators";
11+
import {appConfig} from "./app.config";
12+
13+
const appName = 'app';
1414

1515
// configure
16-
angular
17-
.module(appName, [
16+
angular.module(appName, [
1817
'ui.router',
1918
'ngTagsInput',
2019
'ngSanitize',
@@ -25,5 +24,6 @@ angular
2524
.config(appConfig);
2625

2726
// bootstrap
28-
@bootstrap(appName, AppComponent)
29-
class App {}
27+
angular.element(document).ready(() => {
28+
angular.bootstrap(document, [appName], { strictDi: true });
29+
});

src/pipes/filterByTags.ts

+5-4
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,18 @@
55
import {PipeTransform, Pipe, Injectable} from '../decorators';
66
import {CommentsService} from "../services/comments.service";
77

8-
@Injectable()
8+
// @Injectable()
99
@Pipe({name: 'filterByTags'})
1010
export class FilterByTagsPipe implements PipeTransform {
1111
// static $inject = ['$q'];
12-
// constructor(private _$q: ng.IQService, private _CommentsService: CommentsService) {
13-
constructor(private _$q: ng.IQService) {
12+
constructor(private _$q: ng.IQService, private _$state: CommentsService) {
13+
console.log(`filter register`);
14+
// constructor(private _$q, private _CommentsService) {
1415
}
1516

1617
transform(comments: any, tags: any) {
1718
let deferred = this._$q.defer;
18-
// console.log(this._Comments_Service.getComments);
19+
console.log(this._$state);
1920
if (!tags.length) return comments;
2021
function check(comment) {
2122
let filterArray = tags.map((tag: any) => tag.text);

src/pipes/pipes.module.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
export default angular.module('app.pipes', []);
1+
export default angular.module('app.pipes', ['app.services']);
22
// export {FilterByTagsPipe} from './filterByTags';

src/services/comments.service.ts

+5-11
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,13 @@
1-
/**
2-
* Created by voland on 4/2/16.
3-
*/
4-
import {IComment} from "../interfaces";
5-
import {Service} from "../decorators";
1+
import {Injectable} from "../decorators";
62

7-
@Service()
3+
@Injectable()
84
export class CommentsService {
95

10-
static $inject = ['$http'];
11-
constructor(private $http) {
6+
constructor(private _$http) {
7+
console.log(`CommentsService register`);
128
}
139

1410
getComments() {
15-
return this.$http.get('assets/mock.json').then((response: {data: IComment[]}) => {
16-
return response.data;
17-
});
11+
return this._$http.get('assets/mock.json').then(response => response.data);
1812
};
1913
}

src/services/services.module.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
/**
22
* Created by voland on 4/2/16.
33
*/
4-
export default angular.module('app.services', []);
5-
// export {Comments} from './comments.service'
4+
export default angular.module('app.services', []);

0 commit comments

Comments
 (0)