egjs is a jQuery-based JavaScript library consisting of UI interactions, effects, and utilities, which brings easiest and fastest way to build a web application in your way.
- Usage Examples of egjs: http://codepen.io/egjs
- API Documentation
- Latest: https://naver.github.io/egjs/latest/doc
- Specific version: https://naver.github.io/egjs/[VERSION]/doc
- 한국어 readme
The following is a list of egjs components.
- eg: As a default namespace, it is a collection of base utilities for egjs, which is used in diverse components.
- eg.Class: A module that enables developing classes in object-oriented programming style.
- eg.Component: A base class utility that manages events and options in modules.
- eg.MovableCoord: A module that transforms user coordinates into logical coordinates in a virtual coordinate system.
- eg.Flicking: A module that implements flicking.
- eg.Visible: A module that checks if an element is visible in the base element or viewport.
- eg.infiniteGrid: A module that arranges infinite card elements including content on a grid.
egjs provides methods and events extended from jQuery.
The following is a list of methods extended from jQuery.
- persist() method: Stores the current state of a webpage into a key in JSON.
- prefixCss() method: Enables to add CSS vendor prefixes when you use some jQuery version(1.4.3 ~ 1.8.x) that does not support them.
- animate() method: A method extended from the jQuery animate() method. It supports CSS transform property and 3D acceleration.
- pause() and resume() methods: Pauses and resumes animation executed by the jQuery animate() method.
The following is a list of events extended from jQuery.
- rotate: An event that detects the orientation of the mobile device.
- scrollend: An event that detects the scrolling to bottom of the page.
In order to use egjs, you should download the JavaScript files or install it using Bower or npm.
You can download the uncompressed files for development version from the following locations:
- Latest: http://naver.github.io/egjs/latest/dist/eg.js
- Specific version: http://naver.github.io/egjs/[VERSION]/dist/eg.js
You can download the compressed files for production version from the following locations:
- Latest: http://naver.github.io/egjs/latest/dist/eg.min.js
- Specific version: http://naver.github.io/egjs/[VERSION]/dist/eg.min.js
To create a link to a file provided over CDN, you must check the file URL in the CDN service.
- cdnjs: https://cdnjs.com/libraries/egjs
- jsDelivr: https://www.jsdelivr.com/projects/egjs
If you do not have Bower installed, install it using npm as follows:
$ npm install bower -gThe following code shows how to install egjs using Bower.
$ bower install egjsThe following code shows how to install egjs using npm.
$ npm install egjsThe following table shows browsers supported by egjs.
| Internet Explorer | Chrome | Firefox | Safari | iOS | Android |
|---|---|---|---|---|---|
| 7+ | Latest | Latest | Latest | 7+ | 2.3+(except 3.x) |
Supported browser types and versions may vary depending on modules. For more information, see API documentation.
egjs has the dependencies for the following libraries:
|jQuery (required)|Hammer.JS| |---|---|---| |1.7.0+ |2.0.4+|
Except jQuery, library dependencies may vary depending on modules. For more information, see API documentation.
When add dependency library have to use yarn.
yarn add: adds a package to use in your current package. yarn init: initializes the development of a package. yarn install: installs all the dependencies defined in a package.json file. yarn publish: publishes a package to a package manager. yarn remove: removes an unused package from your current package. For more information, see API documentation.
Let egjs load after jQuery loads.
...
<!-- Load jQuery -->
<script src="node_modules/jquery/dist/jquery.js"></script>
<!-- Load egjs packaged with all dependencies (Hammer.js) -->
<!-- Load from your local installation -->
<script src="bower_components/egjs/dist/pkgd/eg.pkgd.min.js"></script>
<!-- Or load from CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/egjs/1.3.0/pkgd/eg.pkgd.min.js"></script>
...Note
For more information on loading dependency files except jQuery, see the "Download and Using egjs" page on GitHub Wikis.
You need to add the namespace, "eg", to use the egjs components as shown in the example below.
var Klass = eg.Class({
"construct" : function(){}
});
var Komponent = eg.Class.extend(eg.Component,{
"construct" : function(){}
});For anyone interested to develop egjs, follow the instructions below.
Install grunt-cli globally.
$ npm install grunt-cli -g # Install grunt-cliClone the egjs depository and install the Bower and npm dependency modules.
# Create and move a folder.
$ mkdir egjs && cd egjs
# Clone a repository.
$ git clone https://github.com/naver/egjs.git
# Install the node dependencies modules.
$ npm installUse Grunt to build egjs.
$ grunt buildTwo folders will be created after complete build is completed.
- dist folder: Includes the eg.js and eg.min.js files.
- doc folder: Includes API documentation. The home page for the documentation is doc/index.html.
Once you create a branch and done with development, you must perform a test using the "grunt test" command before you push code to a remote repository.
$ grunt testRunning a "grunt test" command will start JShint, JSCS, QUnit, and istanbul.
- JShint and JSCS: Performs static checking and code style checking.
- QUnit: Performs unit tests of egjs.
- istanbul: Measures test coverage. The test results can be verified once the Grunt task is completed. Or you can use the ./report/index.html file to verify them.
If you find a bug, please report it to us using the Issues page on GitHub.
egjs is released under the MIT license.
Copyright (c) 2015 NAVER Corp.
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.