Merge pull request #70 from technote-space/release/v1.3.12

Release/v1.3.12

Author: technote-space

.gitignore

@@ -1,4 +1,9 @@
 node_modules/
 coverage/
 .idea/
-jquery.marker-animation.min.js
+/jquery.marker-animation.min.js
+/travis-ci
+/gh-pages
+.work/
+composer.lock
+!/bin

.npmignore

@@ -3,9 +3,8 @@
 src/
 __tests__/
 node_modules/
-marker-animation.gif
-stripe.png
 _config.yml
 jest.config.js
 jest.setup.js
-yarn.lock
+yarn.lock
+composer.json

.travis.yml

@@ -83,3 +83,23 @@ jobs:
           secure: E2n0AGDW4zKOhf0vfEjI+2L9tPw4SuW3vknG4DDYbkLCLZXRi0XZ16qhIuZShKtXhTDVgTYcM9SCcsdv5PU3FMcMpg3rftzjXIER+pZktPhQoMncrbIY43G7rDInsUSyOfETWcXXEVDSs6/l50YXYwPeKn7fxgom6g16di5tzfKC7U0Ud39BvZXl7LJYUwb+pDtJ4gATJkd8GhyZ+fyZ+nVvSWdEvFBf2tru/2YbnH8U2Y8J2lcWl2RjHpwz8xKYTmak6BRmN9WLrpNeSUAzzus9TCe4c7l+pY4Na4uGBnC1c/8VR46eNHkIRGEgNoxwWMlbv60iSTqnMH2//2l3Rj55HBaHzzlNsRPWteKSPoj13hN9yp1/LqJsDBW3ga+p+7hjt+JEgQYh1y+sa/GlvMYsX7vyYwipOBtSw9zSUmOj/b8NGLqb+sL6a3Pjr0ObKcjojrE6US8FPTLwukRdLxYXF8wYN5EWOo50UXdImFYqmeKfdE/Vluq2/pyZA3MozsffBY6rv4/lNjuIS29dIt2lm+I79Zr/Q4VZjS7Sm4Cckd/c156HQX7uPZLKfHmFOoyZxSvLiJTh5fiSiHVbVl6jqO3yC6qx9FdJvLQKXboSgj00GXZWtebUuua6HW6Bf2XKDW+WN7cXSp2wu5TMLoXGLnVFDrfKBFDKzrMzCn0=
         on:
           tags: true
+
+    - stage: deploy
+      language: node_js
+      node_js: '11'
+      dist: trusty
+      env:
+        - GH_PAGES_TITLE="jQuery Marker Animation"
+        - GH_PAGES_TRACKING_ID=UA-78163306-3
+      script: skip
+      before_deploy:
+        - source tests/bin/deploy/env.sh
+        - bash tests/bin/deploy/gh-pages.sh
+      deploy:
+        provider: pages
+        skip_cleanup: true
+        github_token: ${GITHUB_TOKEN}
+        keep_history: true
+        local_dir: ${GH_PAGES_DIR}
+        on:
+          branch: master

README.ja.md

@@ -0,0 +1,119 @@
+# jQuery Marker Animation
+
+[![npm version](https://badge.fury.io/js/jquery.marker-animation.svg)](https://badge.fury.io/js/jquery.marker-animation)
+[![Build Status](https://travis-ci.com/technote-space/jquery.marker-animation.svg?branch=master)](https://travis-ci.com/technote-space/jquery.marker-animation)
+[![Coverage Status](https://coveralls.io/repos/github/technote-space/jquery.marker-animation/badge.svg?branch=master)](https://coveralls.io/github/technote-space/jquery.marker-animation?branch=master)
+[![CodeFactor](https://www.codefactor.io/repository/github/technote-space/jquery.marker-animation/badge)](https://www.codefactor.io/repository/github/technote-space/jquery.marker-animation)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/technote-space/jquery.marker-animation/blob/master/LICENSE)
+
+*Read this in other languages: [English](README.md), [日本語](README.ja.md).*
+
+蛍光ペンで塗るようなアニメーションを表示するjQueryプラグイン
+
+![動作](https://raw.githubusercontent.com/technote-space/jquery.marker-animation/images/marker-animation.gif)
+
+## Installation
+### ダウンロードして利用
+[リリースバージョン](https://github.com/technote-space/jquery.marker-animation/releases/latest/download/jquery.marker-animation.min.js)をダウンロードして
+```html
+<script type="text/javascript" src="/assets/jquery.marker-animation.min.js"></script>
+```
+のように読み込む
+### npmから利用
+https://www.npmjs.com/package/jquery.marker-animation
+
+```bash
+npm install --save jquery.marker-animation
+```
+
+### WordPressで利用
+プラグインとして利用できるようにしました。  
+
+[WordPress](https://ja.wordpress.org/plugins/marker-animation/)
+
+[GitHub](https://github.com/technote-space/marker-animation)
+
+## 基本的な使用方法
+```html
+文章文章文章<span class="marker-animation">強調したい文字</span>文章文章文章文章
+```
+
+```html
+<script>
+    $('.marker-animation').markerAnimation();
+</script>
+```
+
+## オプション
+### color
+マーカーの色を指定
+```javascript
+$('.marker-animation').markerAnimation({
+    color: '#fe9'
+});
+```
+### thickness
+マーカーの太さを指定
+```javascript
+$('.marker-animation').markerAnimation({
+    thickness: '.6em'
+});
+```
+### duration
+マーカーを塗るのを完了するまでの時間を指定
+```javascript
+$('.marker-animation').markerAnimation({
+    duration: '2s'
+});
+```
+### delay
+マーカーを塗るのを開始するまでの時間を指定
+```javascript
+$('.marker-animation').markerAnimation({
+    duration: '.1s'
+});
+```
+### font_weight
+文字の太さを指定
+```javascript
+$('.marker-animation').markerAnimation({
+    font_weight: 'bold'
+});
+```
+デフォルトは太字です。  
+太字にしない場合はnullを設定してください。
+### repeat
+アニメーションを繰り返すかどうかを指定
+```javascript
+$('.marker-animation').markerAnimation({
+    repeat: false
+});
+```
+trueにすると一度画面から外れて再び表示された際に再度アニメーションが実行されます。
+### stripe
+ストライプデザインにするかどうかを指定
+```javascript
+$('.marker-animation').markerAnimation({
+    stripe: false
+});
+```
+これが `true` の場合はアニメーションなしの動作になります。  
+![stripe](https://raw.githubusercontent.com/technote-space/jquery.marker-animation/images/stripe.png)
+
+## 個別に値を指定する方法
+`data-ma_[オプション名]` の形式で個別にオプションを指定することが可能です。
+### 例1: 色の変更
+```html
+文章文章文章<span class="marker-animation" data-ma_color="red">強調したい文字</span>文章文章文章文章
+```
+この例ではマーカーの色が赤色になります。
+### 例2: 複数設定
+```html
+文章文章文章<span class="marker-animation" data-ma_repeat="true" data-ma_font_weight="null" data-ma_delay="2s">強調したい文字</span>文章文章文章文章
+```
+この例では
+* 画面から外れるごとにアニメーションが実行
+* 太文字ではない
+* ２秒遅れてアニメーション開始
+
+が設定されます。

README.md

@@ -6,34 +6,33 @@
 [![CodeFactor](https://www.codefactor.io/repository/github/technote-space/jquery.marker-animation/badge)](https://www.codefactor.io/repository/github/technote-space/jquery.marker-animation)
 [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/technote-space/jquery.marker-animation/blob/master/LICENSE)
 
-蛍光ペンで塗るようなアニメーションを表示するjQueryプラグイン
+*Read this in other languages: [English](README.md), [日本語](README.ja.md).*
 
-![動作](https://raw.githubusercontent.com/technote-space/jquery.marker-animation/master/marker-animation.gif)
+jQuery plugin to add under line animation like highlighter.
+
+![Behavior](https://raw.githubusercontent.com/technote-space/jquery.marker-animation/images/marker-animation.gif)
 
 ## Installation
-### ダウンロードして利用
-[リリースバージョン](https://github.com/technote-space/jquery.marker-animation/releases/latest/download/jquery.marker-animation.min.js)をダウンロードして
+### Use from download
+Download [Release version](https://github.com/technote-space/jquery.marker-animation/releases/latest/download/jquery.marker-animation.min.js) and enqueue script.
 ```html
 <script type="text/javascript" src="/assets/jquery.marker-animation.min.js"></script>
 ```
-のように読み込み
-### npmから利用
+### Use from npm
 https://www.npmjs.com/package/jquery.marker-animation
 
 ```bash
 npm install --save jquery.marker-animation
 ```
 
-### WordPressで利用
-プラグインとして利用できるようにしました。  
-
+### for WordPress
 [WordPress](https://ja.wordpress.org/plugins/marker-animation/)
 
 [GitHub](https://github.com/technote-space/marker-animation)
 
-## 基本的な使用方法
+## Usage
 ```html
-文章文章文章<span class="marker-animation">強調したい文字</span>文章文章文章文章
+Hello, Dolly <span class="marker-animation">Well, hello, Dolly</span> Hello, Dolly
 ```
 
 ```html
@@ -42,76 +41,78 @@ npm install --save jquery.marker-animation
 </script>
 ```
 
-## オプション
+## Options
 ### color
-マーカーの色を指定
+Set the color of line
 ```javascript
 $('.marker-animation').markerAnimation({
     color: '#fe9'
 });
 ```
 ### thickness
-マーカーの太さを指定
+Set the thickness of line
 ```javascript
 $('.marker-animation').markerAnimation({
     thickness: '.6em'
 });
 ```
 ### duration
-マーカーを塗るのを完了するまでの時間を指定
+Set the time to complete drawing a line
 ```javascript
 $('.marker-animation').markerAnimation({
     duration: '2s'
 });
 ```
 ### delay
-マーカーを塗るのを開始するまでの時間を指定
+Set the time to start drawing a line
 ```javascript
 $('.marker-animation').markerAnimation({
     duration: '.1s'
 });
 ```
 ### font_weight
-文字の太さを指定
+Set the thickness of characters
 ```javascript
 $('.marker-animation').markerAnimation({
     font_weight: 'bold'
 });
 ```
-デフォルトは太字です。  
-太字にしない場合はnullを設定してください。
+\[default = `bold`]  
+If you do not want to make it bold, please set `null`.
 ### repeat
-アニメーションを繰り返すかどうかを指定
+Set whether to repeat the animation
 ```javascript
 $('.marker-animation').markerAnimation({
     repeat: false
 });
 ```
-trueにすると一度画面から外れて再び表示された際に再度アニメーションが実行されます。
+If this set to true, the animation will be executed again when it is off screen and displayed again.
 ### stripe
-ストライプデザインにするかどうかを指定
+Set whether to make it stripe design
 ```javascript
 $('.marker-animation').markerAnimation({
     stripe: false
 });
 ```
-これが `true` の場合はアニメーションなしの動作になります。  
-![stripe](https://raw.githubusercontent.com/technote-space/jquery.marker-animation/master/stripe.png)
+If this set to true, the animation will not be executed.
+
+![stripe](https://raw.githubusercontent.com/technote-space/jquery.marker-animation/images/stripe.png)
 
-## 個別に値を指定する方法
-`data-ma_[オプション名]` の形式で個別にオプションを指定することが可能です。
-### 例1: 色の変更
+## How to set the value for each
+You can set options in the following format.   
+```
+data-ma_[option name]
+```
+### e.g. Change color
 ```html
-文章文章文章<span class="marker-animation" data-ma_color="red">強調したい文字</span>文章文章文章文章
+Hello, Dolly <span class="marker-animation" data-ma_color="red">Well, hello, Dolly</span> Hello, Dolly
 ```
-この例ではマーカーの色が赤色になります。
-### 例2: 複数設定
+In this example, the color of the line is red.
+### e.g Multiple options
 ```html
-文章文章文章<span class="marker-animation" data-ma_repeat="true" data-ma_font_weight="null" data-ma_delay="2s">強調したい文字</span>文章文章文章文章
+Hello, Dolly <span class="marker-animation" data-ma_repeat="true" data-ma_font_weight="null" data-ma_delay="2s">Well, hello, Dolly</span> Hello, Dolly
 ```
-この例では
-* 画面から外れるごとにアニメーションが実行
-* 太文字ではない
-* ２秒遅れてアニメーション開始
-
-が設定されます。
+In this example, the options below are set.
+* Repeat animation
+* Not bold
+* 2sec delay animation