New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
jquery-chameleon
Advanced tools
jquery-chameleon - npm Package Compare versions
Comparing version 1.0.3 to 1.1.0
| { | ||
| "name": "jquery-chameleon", | ||
| "version": "1.0.3", | ||
| "description": "jQuery plugin for synchronizing slides with JWPlayer Video - https://github.com/wingkwong/jquery-chameleon", | ||
| "version": "1.1.0", | ||
| "description": "jQuery plugin for synchronizing slides with videos - https://github.com/wingkwong/jquery-chameleon", | ||
| "main": "chameleon.min", | ||
@@ -18,3 +18,8 @@ "scripts": { | ||
| "jwplayer", | ||
| "html5", | ||
| "youtube", | ||
| "player", | ||
| "synchronize", | ||
| "video", | ||
| "sync", | ||
| "slides" | ||
@@ -21,0 +26,0 @@ ], |
111
README.md
@@ -1,97 +0,39 @@ | ||
| # Chameleon | ||
| # jQuery-chameleon | ||
| Synchronizing slides with JWPlayer Video | ||
| Synchronizing slide images with videos | ||
|  | ||
|  | ||
| ### Prerequisites | ||
| You should have a valid JW Player license key. The key is required in ChameleonContext. | ||
| ### Installing | ||
| - NPM: https://www.npmjs.com/package/jquery-chameleon | ||
| ``` | ||
| npm install jquery-chameleon | ||
| ``` | ||
| ## Options | ||
| ### Getting Started | ||
| HTML: | ||
| ```HTML | ||
| <div class="chameleon"></div> | ||
| ``` | ||
| | | Description | Optional | | ||
| | ----------------------|-----------------------| -----| | ||
| | width | The width of Chameleon container. Default: 1024px | Y | | ||
| | height | The height of JWPlayer container. Default: 300px | Y | | ||
| | chameleonContext | A JSON object or JSON file including configuration of JWPlayer and the plugin. See below for further detail. | N | | ||
| | numOfCarouselSlide | Number of slides shown in the carousel. Default: 6. | Y | | ||
| Javascript: | ||
| ```Javascript | ||
| $('.chameleon').chameleon(options); | ||
| ``` | ||
| #### ChameleonContext | ||
| ### Option: | ||
| | | Description | Optional | | ||
| | ----------------------|-------------| -----| | ||
| | jwplayerKey | The license key of JW Player. | N | | ||
| | jwplayerSetup | JW Player setup object | N | | ||
| | download | Definition of the url and the title for slides, video and transcript | Y | | ||
| | slides | An array storing multiple objects defining slides info such as time, image path, title and alt text | N | | ||
| | | Description | Type | Default | Option | | ||
| |--------------------|-------------------------------------------------------------------------------------|---------------|---------|--------| | ||
| | width | The width of chameleon container | String | 968px | Y | | ||
| | height | The height of chameleon container | String | 300px | Y | | ||
| | chameleonContext | A JSON object or JSON file containing video player configuration and the slide info | Object/String | {} | N | | ||
| | numOfCarouselSlide | Number of slides shown in the carousel | Number | 5 | Y | | ||
| | responsive | Responsive web design with Bootstrap 3 | Boolean | false | Y | | ||
| | player | The video player to play the video: `html5`, `youtube`, `jwplayer` | String | html5 | N | | ||
| ## Usages | ||
| ### Documentation | ||
| HTML: | ||
| ```html | ||
| <div class="chameleon"></div> | ||
| ``` | ||
| The documentation is available at [https://wingkwong.gitbooks.io/jquery-chameleon/content/](https://wingkwong.gitbooks.io/jquery-chameleon/content/) | ||
| JavaScript: | ||
| You can either define the chameleon context with a json file | ||
| ```javascript | ||
| $('.chameleon').chameleon({ | ||
| chameleonContext: 'http://dev.github.org/chameleon/context.json' | ||
| }); | ||
| ``` | ||
| or a inline JSON object | ||
| ```javascript | ||
| $(document).ready(function(){ | ||
| $('.chameleon').chameleon({ | ||
| chameleonContext: { | ||
| "jwplayerKey": "XXXXXXXXXXXXXXXXXXXXXXXXXXX" , | ||
| "jwplayerSetup" : { | ||
| "file": "XXXXX.xxx" | ||
| }, | ||
| "download": { | ||
| "slides": { | ||
| "url": "xxxxxxxxxxxxxxxxxxx.xxx", | ||
| "title": "this is title" | ||
| }, | ||
| "video": { | ||
| "url": "XXXXXXXXXXXXXXXXXX.xxx", | ||
| "title": "this is video title" | ||
| }, | ||
| "transcript": { | ||
| "url": "xxxxx.xxx", | ||
| "title": "this is transcript title" | ||
| } | ||
| }, | ||
| "slides":[ | ||
| { | ||
| "time":"00:00:00", | ||
| "img":"https://dummyimage.com/600x400/000/fff&text=1", | ||
| "title": "This is a title", | ||
| "alt": "Dummy alt text" | ||
| }, | ||
| { | ||
| "time":"00:00:30", | ||
| "img":"https://dummyimage.com/600x400/000/fff&text=2", | ||
| "title": "This is a title 2" | ||
| }, | ||
| { | ||
| "time":"00:01:25", | ||
| "img":"https://dummyimage.com/600x400/000/fff&text=3", | ||
| "alt": "Dummy alt text" | ||
| }, | ||
| { | ||
| "time":"00:02:35", | ||
| "img":"https://dummyimage.com/600x400/000/fff&text=4" | ||
| } | ||
| ] | ||
| } | ||
| }); | ||
| }); | ||
| ``` | ||
| ## Authors | ||
@@ -101,3 +43,2 @@ | ||
| ## License | ||
@@ -104,0 +45,0 @@ |
New alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Fixed alerts
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by584.77%
2151243
- Lines of code
- increased by950.54%
4843
Worsened metrics
- Number of package files
- decreased by-22.22%
7
- Number of lines in readme file
- decreased by-55.66%
47
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes