Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/niksy/kist-lazyads
[DEPRECATED] Simple ads manager.
https://github.com/niksy/kist-lazyads
Last synced: 7 days ago
JSON representation
[DEPRECATED] Simple ads manager.
- Host: GitHub
- URL: https://github.com/niksy/kist-lazyads
- Owner: niksy
- License: mit
- Created: 2014-12-09T06:23:08.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2019-03-05T14:35:10.000Z (over 5 years ago)
- Last Synced: 2024-10-18T03:47:37.267Z (28 days ago)
- Language: JavaScript
- Homepage:
- Size: 161 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
**This project is deprecated.**
Use [advertol](https://github.com/niksy/advertol).
---
# kist-lazyads
Simple ads manager. Provides async control with [Postscribe](https://github.com/krux/postscribe).
## Installation
```sh
npm install kist-lazyads --save
```
## API
### `Lazyads(options)`
Type: `Function`
Module class. Available options are:
#### el
Type: `String|jQuery|Element`
Element which will contain ad content. String should be valid CSS selector.
#### context
Type: `Array`
List of contexts which will be used to resolve ads.
#### contentIdDataProp
Type: `String`
`data` property which will be used to connect with ad content.
This will inject `ad1` content inside element with `data-ad-id="ad1"`
```js
{
contentIdDataProp: 'ad-id'
}
```
```html
```
#### classes
Type: `Object`
HTML clasess for DOM elements.
```js
{
el: 'kist-Lazyads-item',
isLoaded: 'is-loaded',
isHidden: 'is-hidden',
isContentEmpty: 'is-contentEmpty'
}
```
#### adapter
Type: `Adapter`
Adapter for banner system (e.g. Revive Ads, Google DFP, …).
### `.init(cb)`
Type: `Function`
Returns: `Lazyads`
Initializes ad manager. **This method must be called**, either after setting up control, or after creating instance.
### `.control(options)`
Type: `Function`
Returns: `Lazyads`
Provides individual control of ads based on specific conditions. Available options are:
#### name
Type: `String`
Name of control. Options with same name will be merged.
#### condition
Type: `Function`
Condition on which `callback` method of current control will be run.
| Argument | Type | Description |
| --- | --- | --- |
| `el` | `jQuery` | Current ad element which fullfils condition. |
#### callback
Type: `Function`
Callback to run when condition is true.
| Argument | Type | Description |
| --- | --- | --- |
| `el` | `jQuery` | Current ad element which fullfils condition. |
| `emit` | `Function` | Accepts one argument: name of event to emit. Emitted event has form of `{Provided argument}:{Control name}` and is triggered on corresponding ad element. |
| `waitForLayout` | `Function` | Alias for `setTimeout`. Default timeout is `300`. |
### `.addPlaceholder(el)`
Type: `Function`
Returns: `Lazyads`
Dynamically creates placeholder for ad. Useful if you don’t want to display specific ad on Lazyads initialization.
#### el
Type: `String|jQuery|Element`
Element which will contain ad content. String should be valid CSS selector.
### `.recheckControl()`
Type: `Function`
Returns: `Lazyads`
Iterates over every control entry and fires callback if condition is satisifed.
### `.destroy()`
Type: `Function`
Returns: `Lazyads`
Destroys current Lazyads instance.
## Examples
```js
import Lazyads from 'kist-lazyads';
import MediaQueryContext from 'kist-lazyads/context/media-query.esm';
import ReviveAdsAdapter from 'kist-lazyads/adaptes/revive-ads.esm';
const lazyads = new Lazyads({
el: '.Banner',
adapter: new ReviveAdsAdapter(),
context: [
new MediaQueryContext({
'screen and (min-width:1000px) and (max-width:1199px)': ['ad1','ad2','ad3','ad5'],
'screen and (min-width:1500px)': ['ad1','ad2','ad3'],
'screen and (min-width:915px) and (max-width:999px)': ['ad1','ad2','ad3','ad3','ad5'],
'screen and (min-width:1200px) and (max-width:1499px)': ['ad1','ad2','ad3'],
'screen and (min-width:728px) and (max-width:914px)': ['ad1','ad3','ad5'],
'screen and (max-width:599px)': ['ad4']
})
]
});
lazyads
.control({
name: 'ad1',
condition: ( el ) => {
return el.data('ad-id') === 'ad1';
},
callback: ( el, emit, wait ) => {
if ( el.hasClass('is-loaded') ) {
if ( el.hasClass('is-hidden') ) {
console.log(1);
emit('foo');
}
}
}
})
.control({
name: 'ad4',
condition: ( el ) => {
return el.data('ad-id') === 'ad4';
},
callback: ( el, emit, wait ) => {
console.log(2);
}
})
.init(() => {
console.log('Lazyads initialized!');
});
lazyads.addPlaceholder($('
'));
$('[data-ad-id="ad1"]').on('foo:ad1', ( e, el ) => {
console.log(arguments);
});
$(document).on('foo:ad1', ( e, el ) => {
console.log(e.currentTarget);
console.log(e.target);
});
```
```html
```
## Browser support
Tested in IE9+ and all modern browsers.
## License
MIT © [Ivan Nikolić](http://ivannikolic.com)