Skip to content

Commit 9d1aa28

Browse files
committed
feat(all): initial version
0 parents  commit 9d1aa28

File tree

122 files changed

+17133
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

122 files changed

+17133
-0
lines changed

.editorconfig

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# Editor configuration, see http://editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
indent_style = space
7+
indent_size = 2
8+
insert_final_newline = true
9+
trim_trailing_whitespace = true
10+
11+
[*.md]
12+
max_line_length = 0
13+
trim_trailing_whitespace = false

.github/ISSUE_TEMPLATE.md

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<!--
2+
IF YOU DON'T FILL OUT THE FOLLOWING INFORMATION YOUR ISSUE MIGHT BE CLOSED WITHOUT INVESTIGATING
3+
-->
4+
### Bug Report or Feature Request (mark with an `x`)
5+
```
6+
- [ ] bug report -> please search issues before submitting
7+
- [ ] feature request
8+
```
9+
10+
### OS and Version?
11+
<!--
12+
> Windows 7, 8 or 10. Linux (which distribution).macOS(Yosemite ? El Capitan? Sierra ?)
13+
-->
14+
15+
### Versions
16+
<!--
17+
Output from: `ng --version`, in case you are using Angular CLI.
18+
Otherwise, output from: `node --version` , `npm --version` and Angular version.
19+
-->
20+
21+
22+
### Repro steps
23+
<!--
24+
Simple steps to reproduce this bug.
25+
Please include: commands run, packages added, related code changes.
26+
A link to a sample repo would help too.
27+
-->
28+
29+
30+
### The log given by the failure
31+
<!-- Normally this include a stack trace and some more information. -->
32+
33+
34+
### Desired functionality
35+
<!--
36+
What would like to see implemented?
37+
What is the usecase?
38+
-->
39+
40+
41+
### Mention any other details that might be useful
42+
<!-- Please include a link to the repo if this is related to an OSS project. -->

.gitignore

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
# See http://help.github.com/ignore-files/ for more about ignoring files.
2+
3+
# compiled output
4+
/dist
5+
/tmp
6+
7+
# dependencies
8+
/node_modules
9+
10+
# IDEs and editors
11+
/.idea
12+
.project
13+
.classpath
14+
.c9/
15+
*.launch
16+
.settings/
17+
*.sublime-workspace
18+
19+
# IDE - VSCode
20+
.vscode/*
21+
!.vscode/settings.json
22+
!.vscode/tasks.json
23+
!.vscode/launch.json
24+
!.vscode/extensions.json
25+
26+
# misc
27+
/.sass-cache
28+
/connect.lock
29+
/coverage
30+
/libpeerconnection.log
31+
npm-debug.log
32+
yarn-error.log
33+
testem.log
34+
/typings
35+
/config/gulp-tasks/README.md
36+
37+
# e2e
38+
/e2e/*.js
39+
/e2e/*.map
40+
41+
# System Files
42+
.DS_Store
43+
Thumbs.db

.travis.yml

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
sudo: required
2+
dist: trusty
3+
4+
#install google chrome, using addons
5+
addons:
6+
apt:
7+
sources:
8+
- google-chrome
9+
packages:
10+
- google-chrome-stable
11+
12+
language: node_js
13+
node_js:
14+
- "6"
15+
16+
before_script:
17+
- export DISPLAY=:99.0
18+
- sh -e /etc/init.d/xvfb start
19+
- npm install --quiet -g gulp-cli
20+
21+
script: gulp test:ci
22+
23+
after_success: gulp coveralls

.vscode/launch.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
// Use IntelliSense to learn about possible attributes.
3+
// Hover to view descriptions of existing attributes.
4+
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
5+
"version": "0.2.0",
6+
"configurations": [
7+
{
8+
"type": "node",
9+
"request": "launch",
10+
"name": "Gulp serve:demo",
11+
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
12+
"args": [
13+
"serve:demo"
14+
]
15+
}
16+
]
17+
}

.yo-rc.json

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
{
2+
"generator-ngx-library": {
3+
"version": "4.3.0",
4+
"authorName": "Tine Kondo",
5+
"authorEmail": "kondotine@gmail.com",
6+
"githubUsername": "tinesoft",
7+
"projectName": "ngx-wow",
8+
"projectVersion": "0.0.1",
9+
"projectDescription": "Angular module for WOW.js.",
10+
"projectKeywords": [
11+
"ng",
12+
"angular",
13+
"WOW",
14+
"WOW.js",
15+
"scroll",
16+
"reveal",
17+
"animation"
18+
],
19+
"ngPrefix": "ngw",
20+
"ngVersion": "2.0.0",
21+
"ngModules": [
22+
"core",
23+
"common"
24+
],
25+
"useGreenkeeper": true,
26+
"useCompodoc": true,
27+
"enforceNgGitCommitMsg": true,
28+
"exclusions": [
29+
"src/module/component/lib.component.html",
30+
"src/module/component/lib.component.spec.ts",
31+
"src/module/component/lib.component.ts",
32+
"src/module/component/lib.component.scss",
33+
"src/module/service/lib.service.ts",
34+
"src/module/service/lib.service.spec.ts",
35+
"src/module/lib.module.ts",
36+
"src/tsconfig.lib.es5.json",
37+
"src/index.ts",
38+
"demo/src/app/home/home.component.html",
39+
"demo/src/app/home/home.component.scss",
40+
"demo/src/app/home/home.module.ts",
41+
"demo/src/favicon.ico",
42+
"demo/src/styles.scss"
43+
]
44+
}
45+
}

CHANGELOG.md

Whitespace-only changes.

LICENSE

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2017 Tine Kondo
4+
5+
Permission is hereby granted, free of charge, to any person obtaining
6+
a copy of this software and associated documentation files (the
7+
"Software"), to deal in the Software without restriction, including
8+
without limitation the rights to use, copy, modify, merge, publish,
9+
distribute, sublicense, and/or sell copies of the Software, and to
10+
permit persons to whom the Software is furnished to do so, subject to
11+
the following conditions:
12+
13+
The above copyright notice and this permission notice shall be
14+
included in all copies or substantial portions of the Software.
15+
16+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

README.md

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
<p align="center">
2+
<img height="256px" width="256px" style="text-align: center;" src="https://cdn.rawgit.com/tinesoft/ngx-wow/master/demo/src/assets/logo.svg">
3+
</p>
4+
5+
# ngx-wow - Angular module for WOW.js.
6+
7+
[![npm version](https://badge.fury.io/js/ngx-wow.svg)](https://badge.fury.io/js/ngx-wow)
8+
[![Build Status](https://travis-ci.org/tinesoft/ngx-wow.svg?branch=master)](https://travis-ci.org/tinesoft/ngx-wow)
9+
[![Coverage Status](https://coveralls.io/repos/github/tinesoft/ngx-wow/badge.svg?branch=master)](https://coveralls.io/github/tinesoft/ngx-wow?branch=master)
10+
[![dependency Status](https://david-dm.org/tinesoft/ngx-wow/status.svg)](https://david-dm.org/tinesoft/ngx-wow)
11+
[![devDependency Status](https://david-dm.org/tinesoft/ngx-wow/dev-status.svg?branch=master)](https://david-dm.org/tinesoft/ngx-wow#info=devDependencies)
12+
[![Greenkeeper Badge](https://badges.greenkeeper.io/tinesoft/ngx-wow.svg)](https://greenkeeper.io/)
13+
14+
## Demo
15+
16+
View all the directives in action at https://tinesoft.github.io/ngx-wow
17+
18+
## Dependencies
19+
* [Angular](https://angular.io) (*requires* Angular 2 or higher, tested with 2.0.0)
20+
21+
## Installation
22+
Install above dependencies via *npm*.
23+
24+
Now install `ngx-wow` via:
25+
```shell
26+
npm install --save ngx-wow
27+
```
28+
29+
---
30+
##### SystemJS
31+
>**Note**:If you are using `SystemJS`, you should adjust your configuration to point to the UMD bundle.
32+
In your systemjs config file, `map` needs to tell the System loader where to look for `ngx-wow`:
33+
```js
34+
map: {
35+
'ngx-wow': 'node_modules/ngx-wow/bundles/ngx-wow.umd.js',
36+
}
37+
```
38+
---
39+
40+
Once installed you need to import the main module:
41+
```js
42+
import { NgwWowModule } from 'ngx-wow';
43+
```
44+
The only remaining part is to list the imported module in your application module. The exact method will be slightly
45+
different for the root (top-level) module for which you should end up with the code similar to (notice ` NgwWowModule.forRoot()`):
46+
```js
47+
import { NgwWowModule } from 'ngx-wow';
48+
49+
@NgModule({
50+
declarations: [AppComponent, ...],
51+
imports: [NgwWowModule.forRoot(), ...],
52+
bootstrap: [AppComponent]
53+
})
54+
export class AppModule {
55+
}
56+
```
57+
58+
Other modules in your application can simply import ` NgwWowModule `:
59+
60+
```js
61+
import { NgwWowModule } from 'ngx-wow';
62+
63+
@NgModule({
64+
declarations: [OtherComponent, ...],
65+
imports: [NgwWowModule, ...],
66+
})
67+
export class OtherModule {
68+
}
69+
```
70+
71+
## Usage
72+
Once the module is imported, you can use the `NgwWowService` in your component (i.e. `AppComponent`) to trigger reveal animation by calling `init()` or to be notified by WOW when an element is revealed.
73+
74+
Here is how it works:
75+
76+
```ts
77+
import { Component, OnInit, OnDestroy } from '@angular/core';
78+
import { Router, NavigationEnd } from '@angular/router';
79+
import { NgwWowService } from 'ngx-wow';
80+
import { Subscription } from 'rxjs/Subscription';
81+
82+
@Component({
83+
selector: 'app-root',
84+
templateUrl: './app.component.html',
85+
styleUrls: ['./app.component.scss']
86+
})
87+
export class AppComponent implements OnInit, OnDestroy {
88+
89+
//keep refs to subscription to be abble to unsubscribe later
90+
private wowSubscription: Subscription;
91+
92+
constructor(private router: Router, private wowService: NgwWowService){
93+
this.router.events.filter(event => event instanceof NavigationEnd).subscribe(event => {
94+
// Reload WoW animations when done navigating to page,
95+
// but you are free to call it whenever/wherever you like
96+
this.wowService.init();
97+
});
98+
99+
}
100+
101+
ngOnInit() {
102+
// subscribe to WOW observable to react when an element is revealed
103+
this.wowSubscription = this.wowService.itemRevealed$.subscribe(
104+
(item:HTMLElement) => {
105+
// do whatever you want with revealed element
106+
});
107+
}
108+
109+
ngOnDestroy() {
110+
// unsubscribe to cookieconsent observables to prevent memory leaks
111+
this.wowSubscription.unsubscribe();
112+
}
113+
}
114+
115+
```
116+
117+
See [WOW.js Documentation](https://github.com/matthieua/WOW#advanced-usage) to see more about how to customize animation settings.
118+
119+
## Credits
120+
121+
`ngx-wow` is built upon [WOW.js](http://mynameismatthieu.com/WOW/), created by [Matthieu Aussaguel](http://mynameismatthieu.com/)
122+
123+
## License
124+
125+
Copyright (c) 2017 Tine Kondo. Licensed under the MIT License (MIT)
126+

config/gulp-tasks/markdown.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
const gulp = require('gulp');
2+
const helpers = require('../helpers');
3+
4+
const gulpRename = require('gulp-rename');
5+
const gulpReplace = require('gulp-replace');
6+
const gulpTap = require('gulp-tap');
7+
const Handlebars = require('handlebars');
8+
const Highlights = require('highlights');
9+
const MarkdownIt = require('markdown-it');
10+
11+
12+
const highligther = new Highlights();
13+
const markdowniter = new MarkdownIt({
14+
highlight: function (code, lang) {
15+
let highlighted =
16+
highligther.highlightSync({
17+
fileContents: code,
18+
scopeName: 'source.js'
19+
});
20+
return highlighted;
21+
}
22+
});
23+
24+
//Demo Tasks
25+
gulp.task('markdown', () => {
26+
return gulp.src(helpers.root('./demo/src/app/getting-started/getting-started.component.hbs'))
27+
.pipe(gulpTap((file) => {
28+
let template = Handlebars.compile(file.contents.toString());
29+
30+
return gulp.src(helpers.root('./README.md'))
31+
.pipe(gulpTap((file) => {
32+
// convert from markdown
33+
let mdContents = file.contents.toString();
34+
file.contents = new Buffer(markdowniter.render(mdContents), 'utf-8');
35+
}))
36+
.pipe(gulpTap((file) => {
37+
// file is the converted HTML from the markdown
38+
// set the contents to the contents property on data
39+
let data = { README_md: file.contents.toString() };
40+
// we will pass data to the Handlebars template to create the actual HTML to use
41+
let html = template(data);
42+
// replace the file contents with the new HTML created from the Handlebars template + data object that contains the HTML made from the markdown conversion
43+
file.contents = new Buffer(html, "utf-8");
44+
}))
45+
.pipe(gulpReplace(/(<p>&lt;p align=&quot;center&quot;&gt;[^]+?)(<h2>Dependencies<\/h2>)/, '$2'))// strips everything between start & '<h2 id="installation">'
46+
.pipe(gulpReplace('{', "{{ '{' }}")) // escapes '{' to comply with angular parser
47+
.pipe(gulpRename('getting-started.component.html'))
48+
.pipe(gulp.dest(helpers.root('./demo/src/app/getting-started')));
49+
50+
}));
51+
});

0 commit comments

Comments
 (0)