added decorators for service and pipes, modified component decorator

Author: vsternbach

package.json

@@ -25,8 +25,10 @@
     "ng-tags-input": "^3.0.0"
   },
   "scripts": {
-    "prestart": "npm install & typings install",
+    "postinstall": "typings install",
+    "prestart": "npm install",
     "start": "webpack-dev-server --hot",
+    "typings": "typings",
     "bundle": "rimraf dist & copyfiles -f src/index.html dist/ & copyfiles -f src/assets/* dist/assets & webpack -p ./dist/bundle.js"
   }
 }

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

@@ -1,11 +1,12 @@
 /**
  * Created by voland on 4/2/16.
  */
-import Component from '../../decorators';
+import {Component} from '../../decorators';
 import './comment-list.scss';
 import {IComment} from "../../interfaces";
 
-@Component('app.components', 'comments', {
+@Component({
+    selector: 'comments',
     template: `
         <div class="container-fluid">
             <div class="discussion-timeline">
@@ -17,7 +18,7 @@ import {IComment} from "../../interfaces";
             </div>
         </div>`
 })
-class CommentsController {
+export class CommentsController {
     comments: IComment[];
     emptyComment: IComment;
     tags: string[];

src/components/comment/comment.component.ts

@@ -2,11 +2,12 @@
  * Created by voland on 4/2/16.
  */
 
-import Component from '../../decorators';
+import {Component} from '../../decorators';
 import './comment.scss';
 import {IComment} from "../../interfaces";
 
-@Component('app.components', 'comment', {
+@Component({
+    selector: 'comment',
     bindings: {
         comment: '=',
         tags: '=',
@@ -54,7 +55,7 @@ import {IComment} from "../../interfaces";
             </div>
         </div>`
 })
-class CommentController {
+export class CommentController {
     editMode: boolean;
     comment: IComment;
     commentCopy: IComment;

src/components/components.module.ts

@@ -1,17 +1,6 @@
 /**
- * Created by voland on 4/2/16.
+ * Created by vlad on 5/29/16.
  */
-
-
-export default angular.module('app.components', [])
-    .filter('filterByTags', () => (comments, tags) => {
-        if (!tags.length) return comments;
-        function check(comment) {
-            let filterArray = tags.map((tag: any) => tag.text);
-            let findCount = filterArray
-                .map((tag) => comment.tags.indexOf(tag) > -1 ? 1 : 0)
-                .reduce((prev, curr) => prev + curr);
-            return findCount === filterArray.length;
-        }
-        return comments.filter(check);
-    })
+export default angular.module('app.components', []);
+export {CommentController} from './comment/comment.component';
+export {CommentsController} from './comment-list/comments.component';

src/decorators.ts

@@ -1,16 +1,44 @@
 /**
  * Created by voland on 4/2/16.
  */
-export default function Component(moduleOrName: string | ng.IModule, selector: string, options: {
+
+export function Component(options: {
+    selector: string,
     controllerAs?: string,
     template?: string,
     templateUrl?: string,
     bindings? : any
-}) {
+}, moduleOrName: string | ng.IModule = 'app.components') {
     return (controller: Function) => {
+        var selector = options.selector;
         var module = typeof moduleOrName === "string"
             ? angular.module(moduleOrName)
             : moduleOrName;
+        delete options.selector;
         module.component(selector, angular.extend(options, { controller: controller }));
     }
+}
+
+export function Service(moduleOrName: string | ng.IModule = 'app.services') {
+    return (service: any) => {
+        var name = service.name;
+        var module = typeof moduleOrName === "string"
+            ? angular.module(moduleOrName)
+            : moduleOrName;
+        module.service(name, service);
+    }
+}
+
+export interface PipeTransform {
+    transform(value: any, ...args: any[]): any;
+}
+
+export function Pipe(options: {name: string}, moduleOrName: string | ng.IModule = 'app.pipes') {
+    return (Pipe: any) => {
+        var instance = new Pipe();
+        var module = typeof moduleOrName === "string"
+            ? angular.module(moduleOrName)
+            : moduleOrName;
+        module.filter(options.name, () => instance.transform);
+    }
 }

src/main.ts

@@ -2,14 +2,14 @@
  * Created by voland on 4/2/16.
  */
 import 'angular';
-import 'angular-sanitize';
 import 'angular-ui-router';
+import 'angular-sanitize';
 import 'ng-tags-input';
 
-import services   from './services/services.module';
+
+import services from './services/services.module';
 import components from './components/components.module';
-import './components/comment/comment.component';
-import './components/comment-list/comments.component';
+import pipes from './pipes/pipes.module';
 
 function appConfig ($urlRouterProvider, $stateProvider, tagsInputConfigProvider) {
     $urlRouterProvider.otherwise('/');
@@ -30,16 +30,18 @@ function appConfig ($urlRouterProvider, $stateProvider, tagsInputConfigProvider)
 appConfig.$inject = ['$urlRouterProvider', '$stateProvider', 'tagsInputConfigProvider'];
 
 // configure the main module
-angular.module('app', [
-    'ngTagsInput',
-    'ngSanitize',
-    'ui.router',
-    services.name,
-    components.name
-])
-.config(appConfig);
+angular
+    .module('app', [
+        'ui.router',
+        'ngTagsInput',
+        'ngSanitize',
+        services.name,
+        components.name,
+        pipes.name
+    ])
+    .config(appConfig);
 
 // bootstrap angular
 angular.element(document).ready(() => {
     angular.bootstrap(document, ['app']);
-});
+});

src/pipes/filterByTags.ts

@@ -0,0 +1,20 @@
+/**
+ * Created by voland on 4/2/16.
+ */
+
+import {PipeTransform, Pipe} from '../decorators';
+
+@Pipe({name: 'filterByTags'})
+export class FilterByTagsPipe implements PipeTransform {
+    transform(comments:any, tags:any) {
+        if (!tags.length) return comments;
+        function check(comment) {
+            let filterArray = tags.map((tag: any) => tag.text);
+            let findCount = filterArray
+                .map((tag) => comment.tags.indexOf(tag) > -1 ? 1 : 0)
+                .reduce((prev, curr) => prev + curr);
+            return findCount === filterArray.length;
+        }
+        return comments.filter(check);
+    }
+}

src/pipes/pipes.module.ts

@@ -0,0 +1,2 @@
+export default angular.module('app.pipes', []);
+export {FilterByTagsPipe} from './filterByTags';

src/services/comments.service.ts

@@ -2,7 +2,9 @@
  * Created by voland on 4/2/16.
  */
 import {IComment} from "../interfaces";
+import {Service} from "../decorators";
 
+@Service()
 export class Comments {
 
     static $inject = ['$http'];

src/services/services.module.ts

@@ -1,7 +1,5 @@
 /**
  * Created by voland on 4/2/16.
  */
-import {Comments} from './comments.service'
-
-export default angular.module('app.services', [])
-    .service('Comments', Comments)
+export default angular.module('app.services', []);
+export {Comments} from './comments.service'