Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/tommoor/tinycon

A small library for manipulating the favicon, in particular adding alert bubbles and changing images.
https://github.com/tommoor/tinycon

favicon javascript

Last synced: 4 days ago
JSON representation

A small library for manipulating the favicon, in particular adding alert bubbles and changing images.

Awesome Lists containing this project

README

        

# Tinycon

A small library for manipulating the favicon, in particular adding alert bubbles and changing images. Tinycon gracefully falls back to a number in title approach for browsers that don't support canvas or dynamic favicons.

See the Live Demo here.

## Documentation

Tinycon adds a single object to the global namespace and does not require initialization.

### Installation

Install with your favorite package manager.

```
npm install tinycon --save
```
```
yarn add tinycon
```

### Basic Usage

```javascript
Tinycon.setBubble(6);
```

### Options

Tinycon can take a range of options to customize the look

* width: the width of the alert bubble
* height: the height of the alert bubble
* font: a css string to use for the fontface (recommended to leave this)
* color: the foreground font color
* background: the alert bubble background color
* fallback: should we fallback to a number in brackets for browsers that don't support canvas/dynamic favicons? Boolean, or use the string 'force' to ensure a title update even in supported browsers.
* abbreviate: should tinycon shrink large numbers such as 1000 to an abbreviated version (1k). Boolean, defaults to true

```javascript
Tinycon.setOptions({
width: 7,
height: 9,
font: '10px arial',
color: '#ffffff',
background: '#549A2F',
fallback: true
});
```

### AMD support

Tinycon can also be used as an asynchronous module.

```javascript
require([
'tinycon.js'
], function (T) {

T.setOptions({
width: 7,
height: 9,
font: '10px arial',
color: '#ffffff',
background: '#549A2F',
fallback: true
});

T.setBubble(7);

});
```

## Browser Support

Tinycon has been tested to work completely in the following browsers. Older versions may be supported, but haven't been tested:

* Chrome 15+
* Firefox 9+
* Opera 11+

Currently the library degrades to title update in the following browsers:

* Internet Explorer 9
* Safari 5

## Development

To produce the minified file run `grunt uglify`

## License / Credits

Tinycon is released under the MIT license. It is simple and easy to understand and places almost no restrictions on what you can do with Tinycon.
[More Information](http://en.wikipedia.org/wiki/MIT_License)

Tinycon was inspired by [Notificon](https://github.com/makeable/Notificon)

## Download

Releases are available for download from
[GitHub](http://github.com/tommoor/tinycon/downloads).