basic working version

.gitignore

@@ -1,37 +1,4 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-
-# Runtime data
-pids
-*.pid
-*.seed
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (http://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules
-jspm_packages
-
-# Optional npm cache directory
-.npm
-
-# Optional REPL history
-.node_repl_history
+node_modules/
+.idea/
+*.sw*
+build

gulpfile.js

@@ -0,0 +1 @@
+eval(require("typescript").transpile(require("fs").readFileSync("./gulpfile.ts").toString()));

gulpfile.ts

@@ -0,0 +1,179 @@
+import {Gulpclass, Task, SequenceTask, MergedTask} from "gulpclass";
+
+const gulp = require("gulp");
+const del = require("del");
+const shell = require("gulp-shell");
+const replace = require("gulp-replace");
+// const mocha = require("gulp-mocha");
+// const chai = require("chai");
+const tslint = require("gulp-tslint");
+const stylish = require("tslint-stylish");
+const ts = require("gulp-typescript");
+const sourcemaps = require("gulp-sourcemaps");
+
+@Gulpclass()
+export class Gulpfile {
+
+    // -------------------------------------------------------------------------
+    // General tasks
+    // -------------------------------------------------------------------------
+
+    /**
+     * Cleans build folder.
+     */
+    @Task()
+    clean(cb: Function) {
+        return del(["./build/**"], cb);
+    }
+
+    /**
+     * Runs typescript files compilation.
+     */
+    @Task()
+    compile() {
+        return gulp.src("*.js", { read: false })
+            .pipe(shell(["tsc"]));
+    }
+
+    // -------------------------------------------------------------------------
+    // Packaging and Publishing tasks
+    // -------------------------------------------------------------------------
+
+    /**
+     * Publishes a package to npm from ./build/package directory.
+     */
+    @Task()
+    npmPublish() {
+        return gulp.src("*.js", { read: false })
+            .pipe(shell([
+                "cd ./build/package && npm publish"
+            ]));
+    }
+
+    /**
+     * Copies all sources to the package directory.
+     */
+    @MergedTask()
+    packageCompile() {
+        const tsProject = ts.createProject("tsconfig.json");
+        const tsResult = gulp.src(["./src/**/*.ts","typings/**/node/**/*.ts"])
+            .pipe(sourcemaps.init())
+            .pipe(ts(tsProject));
+
+        return [
+            tsResult.dts.pipe(gulp.dest("./build/package")),
+            tsResult.js
+                .pipe(sourcemaps.write(".", { sourceRoot: "", includeContent: true }))
+                .pipe(gulp.dest("./build/package"))
+        ];
+    }
+
+    /**
+     * Moves all compiled files to the final package directory.
+     */
+    @Task()
+    packageMoveCompiledFiles() {
+        return gulp.src("./build/package/src/**/*")
+            .pipe(gulp.dest("./build/package"));
+    }
+
+    /**
+     *  Add the html files, otherwise angular complains
+     */
+    @Task()
+    packageCopyResources() {
+        return gulp.src(["./src/**/*.html", "./src/**/*.css", "./src/**/*.less"])
+            .pipe(gulp.dest("./build/package"));
+    }
+
+    /**
+     * Moves all compiled files to the final package directory.
+     */
+    @Task()
+    packageClearCompileDirectory(cb: Function) {
+        return del([
+            "./build/package/src/**"
+        ], cb);
+    }
+
+    /**
+     * Change the "private" state of the packaged package.json file to public.
+     */
+    @Task()
+    packagePreparePackageFile() {
+        return gulp.src("./package.json")
+            .pipe(replace("\"private\": true,", "\"private\": false,"))
+            .pipe(gulp.dest("./build/package"));
+    }
+
+    /**
+     * This task will replace all typescript code blocks in the README (since npm does not support typescript syntax
+     * highlighting) and copy this README file into the package folder.
+     */
+    @Task()
+    packageReadmeFile() {
+        return gulp.src("./README.md")
+            .pipe(replace(/```typescript([\s\S]*?)```/g, "```javascript$1```"))
+            .pipe(gulp.dest("./build/package"));
+    }
+
+    /**
+     * Creates a package that can be published to npm.
+     */
+    @SequenceTask()
+    package() {
+        return [
+            "clean",
+            "packageCompile",
+            "packageMoveCompiledFiles",
+            "packageClearCompileDirectory",
+            ["packagePreparePackageFile", "packageReadmeFile"]
+        ];
+    }
+
+    /**
+     * Creates a package and publishes it to npm.
+     */
+    @SequenceTask()
+    publish() {
+        return ["package", "npmPublish"];
+    }
+
+    // -------------------------------------------------------------------------
+    // Run tests tasks
+    // -------------------------------------------------------------------------
+
+    /**
+     * Runs ts linting to validate source code.
+     */
+    @Task()
+    tslint() {
+        return gulp.src(["./src/**/*.ts", "./test/**/*.ts", "./sample/**/*.ts"])
+            .pipe(tslint())
+            .pipe(tslint.report(stylish, {
+                emitError: true,
+                sort: true,
+                bell: true
+            }));
+    }
+
+    /**
+     * Runs unit-tests.
+     */
+    @Task()
+    unit() {
+        chai.should();
+        chai.use(require("sinon-chai"));
+        return gulp.src("./build/es5/test/unit/**/*.js")
+            .pipe(mocha());
+    }
+
+    /**
+     * Compiles the code and runs tests.
+     */
+    @SequenceTask()
+    tests() {
+        return ["clean", "compile", "tslint", "unit"];
+    }
+
+}

package.json

@@ -0,0 +1,54 @@
+{
+  "name": "ng2-pop-over",
+  "version": "0.9.1",
+  "description": "simple pop over component for angular2 (final release)",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "tsc": "ngc -p ."
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/meiriko/ng2-pop-over.git"
+  },
+  "keywords": [
+    "ng2",
+    "angualr2",
+    "popover"
+  ],
+  "author": "Meir <[email protected]> (https://www.linkedin.com/in/meirs)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/meiriko/ng2-pop-over/issues"
+  },
+  "homepage": "https://github.com/meiriko/ng2-pop-over#readme",
+  "devDependencies": {
+    "@angular/common": "2.0.0",
+    "@angular/compiler": "2.0.0",
+    "@angular/core": "2.0.0",
+    "@angular/platform-browser": "2.0.0",
+    "@angular/platform-browser-dynamic": "2.0.0",
+    "@types/core-js": "^0.9.34",
+    "del": "^2.2.1",
+    "es6-promise": "^3.2.1",
+    "es6-shim": "^0.35.1",
+    "gulp": "^3.9.1",
+    "gulp-mocha": "^3.0.0",
+    "gulp-replace": "^0.5.4",
+    "gulp-shell": "^0.5.1",
+    "gulp-sourcemaps": "^1.6.0",
+    "gulp-tslint": "^4.3.1",
+    "gulp-typescript": "^2.13.6",
+    "gulpclass": "^0.1.1",
+    "reflect-metadata": "^0.1.8",
+    "rxjs": "^5.0.0-beta.12",
+    "tslint": "^3.14.0",
+    "tslint-stylish": "^2.1.0-beta",
+    "typescript": "^2.0.3",
+    "zone.js": "^0.6.25"
+  },
+  "peerDependencies": {
+    "@angular/core": "2.0.0",
+    "rxjs": "^5.0.0-beta.12"
+  }
+}

src/index.ts

@@ -0,0 +1,23 @@
+import { CommonModule } from '@angular/common';
+import { PopOverComponent } from './pop-over.component';
+import { PopOverTrigger } from './pop-over-trigger.directive';
+import { NgModule } from '@angular/core';
+
+@NgModule({
+    imports: [
+        CommonModule
+    ],
+    declarations: [
+        PopOverComponent,
+        PopOverTrigger
+    ],
+    exports: [
+        PopOverComponent,
+        PopOverTrigger
+    ],
+    entryComponents: [
+        PopOverComponent
+    ]
+})
+export class PopoverModule {
+}

src/pop-over-trigger.directive.ts

@@ -0,0 +1,53 @@
+import { Directive, Input, OnInit, OnChanges, SimpleChanges, ElementRef, Renderer } from '@angular/core';
+import { PopOverComponent } from "./pop-over.component";
+import { Observable } from "rxjs";
+
+@Directive({
+    selector: '[pop-over-trigger]'
+})
+export class PopOverTrigger implements OnInit, OnChanges {
+    @Input('pop-over-trigger') popover: PopOverComponent;
+    @Input('show-on') showOn: string;
+    @Input('hide-on') hideOn: string;
+
+    constructor(private elRef: ElementRef, private renderer: Renderer) {
+    }
+
+    ngOnInit(): void {
+    }
+
+    ngOnChanges(changes: SimpleChanges): void {
+        if(changes.hasOwnProperty('showOn')){
+            this.setShowOn();
+        };
+        if(changes.hasOwnProperty('hideOn')){
+            this.setHideOn();
+        };
+    }
+
+    private setHideOn(): void {
+        if(this.popover) {
+            if(this.hideOn) {
+                this.popover.hideOn = Observable.merge(
+                        ...this.hideOn.split(',')
+                            .map(eventType => eventType.trim())
+                            .map((eventType: string): Observable<MouseEvent> => Observable.fromEvent<MouseEvent>(this.elRef.nativeElement, eventType)));
+            } else {
+                this.popover.hideOn = Observable.empty<MouseEvent>();
+            }
+        }
+    }
+
+    private setShowOn(): void {
+        if(this.popover) {
+            if(this.showOn) {
+                this.popover.showOn = Observable.merge(
+                    ...this.showOn.split(',')
+                        .map(eventType => eventType.trim())
+                        .map((eventType: string): Observable<MouseEvent> => Observable.fromEvent<MouseEvent>(this.elRef.nativeElement, eventType)));
+            } else {
+                this.popover.showOn = Observable.empty<MouseEvent>();
+            }
+        }
+    }
+}