Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
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.
- Host: GitHub
- URL: https://github.com/tommoor/tinycon
- Owner: tommoor
- License: mit
- Created: 2012-01-30T02:17:54.000Z (almost 13 years ago)
- Default Branch: master
- Last Pushed: 2023-09-15T14:57:21.000Z (about 1 year ago)
- Last Synced: 2024-11-26T04:03:34.319Z (18 days ago)
- Topics: favicon, javascript
- Language: JavaScript
- Homepage:
- Size: 107 KB
- Stars: 5,113
- Watchers: 107
- Forks: 277
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-list - tinycon
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.
## 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).