Merge branch 'develop'

Author: Viktor Pöntinen

.babelrc

@@ -1,27 +1 @@
-# Logs
-logs
-*.log
-
-# Runtime data
-pids
-*.pid
-*.seed
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-
-# 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 directory
-# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
-node_modules
+node_modules

.editorconfig

@@ -0,0 +1 @@
+8.9.4

.eslintrc

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2018 Viktor Pöntinen
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

.gitignore

@@ -1,54 +1,67 @@
-## ⌨️  TinyTyper - a tiny library for creating a typing effect on specified text element.
-[![JavaScript Style Guide](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com/)
-[![Build Status](https://travis-ci.org/lourenc/tinytyper.svg?branch=develop)](https://travis-ci.org/lourenc/tinytyper)
-[![Dependency Status](https://gemnasium.com/badges/github.com/lourenc/tinytyper.svg)](https://gemnasium.com/github.com/lourenc/tinytyper)
+## VueTinyTyper - a vue component for creating a typing effect element.
 
-#### Demo
-<img align="center" src="http://g.recordit.co/8MTkbe9Crg.gif">
+#### Credits
+This project is forked from https://github.com/lourenc/tinytyper .
+Some parts of the readme are also originally from above repository.
+
+#### Why
+This project was created because I was missing events in the non-vue version.
 
-#### Size (It's really tiny)
-  - Minimized: 2.9KB
-  - Gziped:    1.1KB
+#### Demo
+Full credits to https://github.com/lourenc/tinytyper
+<img align="center" src="https://s28.postimg.org/4qva5c1f1/tinytyper2.gif">
 
 #### Installation
-Library can be easily installed via either NPM or Bower:
+Library can be easily installed via either Yarn or NPM:
 
-`npm i tinytyper --save`
+`npm i vue-tinytyper --save`
 
-OR
+or
 
-`bower i tinytyper --save`
+`yarn add vue-tinytyper`
 
 #### Usage
 
 Basic setup looks like this:
 
 ```js
-import TinyTyper from 'tinytyper';
-
-const el       = document.querySelector('.text-el')
-const options  = { /* . . . */ }
-const instance = new TinyTyper(el, options)
+import VueTinytyper from 'vue-tinytyper';
 ```
-
-In case you need to run animation again: 
+then
+```js
+<vue-tinytyper text="Hello, please type this out."></vue-tinytyper>
+```
+or
 ```js
-instance.animate()
+<vue-tinytyper>Hello, please type this out.</vue-tinytyper>
 ```
 
-Available `options`:
+Available `props`:
+
+Prop           | Default      | Type | Description
+---------------- | ------------- | ----------- | --------------
+`text`           | ``           | String | The text to animate
+`textSpeed`      | `95`         | Number | Defines text speed animation
+`cursor`         | `&#9612;`   | String | Defines current cursor symbol
+`blinkSpeed`     | `0.05`       | Number | Defines blink speed of the cursor
+`containerClass` | 'tiny-typer-container'  | String | A CSS class for the container element
+`cursorClass`    | `tiny-typer-cursor` | String | A CSS class for cursor element
+`textClass`      | `tiny-typer-text` | String | A CSS class for text element
+`staticCursor`   | `false` | Boolean | Makes cursor static (disables blinking)
+`staticText`     | `false` | Boolean | Makes text static (disables animation)
+`customEvents`   | `{}`   | Object  | Pass custom "on-character" events. Example: `{ '!': 'my-event' }`, where the event 'my-event' will be triggered every time the current animation character matches the object key, eg. "!".
+
 
-Option        | Default      | Description
-------------- | -------------|--------------
-`text`        | `innerText` of specifed `el`ement | Sets a text to be displayed
-`textSpeed`   | `95`           | Defines of text speed animation
-`cursor`      | ` &#9612;`   | Defines current cursor symbol
-`blinkSpeed`  | `0.05`         | Defines blink speed of a cursor
-`cursorClass` | `tiny-typer-cursor` | A CSS class for cursor element
-`textClass`   | `tiny-typer-text` | A CSS class for text element
-`staticCursor`| `false` | Makes cursor static (disables blinking)
-`staticText`  | `false` | Makes text static (disables animation)
+Available `events`
+
+Eventname     | Trigger    | Payload
+------------- | ---------- | ----------
+`animation-finished` | When animation doesn't have any more characters to animate | None
 
 #### Contributions
 
-Contributions are welcome. Feel free to create [issues](https://github.com/lourenc/tinytyper/issues) and [PRs](https://github.com/lourenc/tinytyper/pulls)
+Contributions are welcome. Feel free to create [issues](https://github.com/ViktorPontinen/vue-tinytyper/issues)
+
+#### License
+
+MIT