1 | # egjs-visible [![npm version](https://badge.fury.io/js/%40egjs%2Fvisible.svg)](https://badge.fury.io/js/%40egjs%2Fvisible) [![Build Status](https://travis-ci.org/naver/egjs-visible.svg?branch=master)](https://travis-ci.org/naver/egjs-visible) [![Coverage Status](https://coveralls.io/repos/github/naver/egjs-visible/badge.svg?branch=master)](https://coveralls.io/github/naver/egjs-visible?branch=master)
|
2 |
|
3 | A class that checks if an element is visible in the base element or viewport.
|
4 |
|
5 | ## Documents
|
6 | - [Get Started and Demos](https://naver.github.io/egjs-visible/)
|
7 | - [API documentation](https://naver.github.io/egjs-visible/release/latest/doc/)
|
8 |
|
9 | ## Download and Installation
|
10 |
|
11 | Download dist files from repo directly or install it via npm.
|
12 |
|
13 | ### For development (Uncompressed)
|
14 |
|
15 | You can download the uncompressed files for development
|
16 |
|
17 | - Latest : https://naver.github.io/egjs-visible/release/latest/dist/visible.js
|
18 | - Specific version : https://naver.github.io/egjs-visible/release/[VERSION]/dist/visible.js
|
19 |
|
20 | ### For production (Compressed)
|
21 |
|
22 | You can download the compressed files for production
|
23 |
|
24 | - Latest : https://naver.github.io/egjs-visible/release/latest/dist/visible.min.js
|
25 | - Specific version : https://naver.github.io/egjs-visible/release/[VERSION]/dist/visible.min.js
|
26 |
|
27 | ### Packaged version (with Dependencies)
|
28 | > Packaged version is not an official distribution.
|
29 | > Is just to provide for ease use of 'egjs-visible' with dependency.
|
30 |
|
31 | - **Latest**
|
32 | - https://naver.github.io/egjs-visible/release/latest/dist/visible.pkgd.js
|
33 | - https://naver.github.io/egjs-visible/release/latest/dist/visible.pkgd.min.js
|
34 |
|
35 | - **Specific version**
|
36 | - https://naver.github.io/egjs-visible/release/[VERSION]/dist/visible.pkgd.js
|
37 | - https://naver.github.io/egjs-visible/release/[VERSION]/dist/visible.pkgd.min.js
|
38 |
|
39 | ### Installation with npm
|
40 |
|
41 | The following command shows how to install egjs-visible using npm.
|
42 |
|
43 | ```bash
|
44 | $ npm install @egjs/visible
|
45 | ```
|
46 |
|
47 |
|
48 | ## Supported Browsers
|
49 | The following are the supported browsers.
|
50 |
|
51 | |Internet Explorer|Chrome|Firefox|Safari|iOS|Android|
|
52 | |---|---|---|---|---|---|
|
53 | |8+|Latest|Latest|Latest|7+|2.1+(except 3.x)|
|
54 |
|
55 | ## Dependency
|
56 |
|
57 | egjs-visible has the dependencies for the following libraries:
|
58 |
|
59 | |[egjs-component](http://github.com/naver/egjs/egjs-component)|
|
60 | |----|
|
61 | |2.0.0+|
|
62 |
|
63 |
|
64 | ## How to start developing egjs-visible?
|
65 |
|
66 | For anyone interested to develop egjs-visible, follow the instructions below.
|
67 |
|
68 | ### Development Environment
|
69 |
|
70 | #### 1. Clone the repository
|
71 |
|
72 | Clone the egjs-visible repository and install the dependency modules.
|
73 |
|
74 | ```bash
|
75 | # Clone the repository.
|
76 | $ git clone https://github.com/naver/egjs-visible.git
|
77 | ```
|
78 |
|
79 | #### 2. Install dependencies
|
80 | `npm` is supported.
|
81 |
|
82 | ```
|
83 | # Install the dependency modules.
|
84 | $ npm install
|
85 | ```
|
86 |
|
87 | #### 3. Build
|
88 |
|
89 | Use npm script to build eg.Visible
|
90 |
|
91 | ```bash
|
92 | # Run webpack-dev-server for development
|
93 | $ npm start
|
94 |
|
95 | # Build
|
96 | $ npm run build
|
97 |
|
98 | # Generate jsdoc
|
99 | $ npm run jsdoc
|
100 | ```
|
101 |
|
102 | Two folders will be created after complete build is completed.
|
103 |
|
104 | - **dist** folder: Includes the **visible.js** and **visible.min.js** files.
|
105 | - **doc** folder: Includes API documentation. The home page for the documentation is **doc/index.html**.
|
106 |
|
107 | ### Linting
|
108 |
|
109 | To keep the same code style, we adopted [ESLint](http://eslint.org/) to maintain our code quality. The [rules](https://github.com/naver/eslint-config-naver/tree/master/rules) are modified version based on [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript).
|
110 | Setup your editor for check or run below command for linting.
|
111 |
|
112 | ```bash
|
113 | $ npm run lint
|
114 | ```
|
115 |
|
116 | ### Test
|
117 |
|
118 | Once you created a branch and done with development, you must perform a test running `npm run test` command before you push code to a remote repository.
|
119 |
|
120 | ```bash
|
121 | $ npm run test
|
122 | ```
|
123 | Running a `npm run test` command will start [Mocha](https://mochajs.org/) tests via [Karma-runner](https://karma-runner.github.io/).
|
124 |
|
125 |
|
126 | ## Bug Report
|
127 |
|
128 | If you find a bug, please report it to us using the [Issues](https://github.com/naver/egjs-visible/issues) page on GitHub.
|
129 |
|
130 |
|
131 | ## License
|
132 | egjs-visible is released under the [MIT license](http://naver.github.io/egjs/license.txt).
|
133 |
|
134 |
|
135 | ```
|
136 | Copyright (c) 2015 NAVER Corp.
|
137 |
|
138 | Permission is hereby granted, free of charge, to any person obtaining a copy
|
139 | of this software and associated documentation files (the "Software"), to deal
|
140 | in the Software without restriction, including without limitation the rights
|
141 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
142 | copies of the Software, and to permit persons to whom the Software is
|
143 | furnished to do so, subject to the following conditions:
|
144 |
|
145 | The above copyright notice and this permission notice shall be included in
|
146 | all copies or substantial portions of the Software.
|
147 |
|
148 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
149 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
150 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
151 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
152 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
153 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
154 | THE SOFTWARE.
|
155 | ```
|