Added support for icon libraries (e.g. Font Awesome)

This commit is contained in:
Bastian 2017-02-15 20:47:18 +01:00
parent 43b1fb7ae0
commit 06375a7973
2 changed files with 18 additions and 10 deletions

View file

@ -72,6 +72,7 @@ Add a new tab to the tab group and returns a `Tab` instance.
* `title`: tab title.
* `src`: URL to the page which will be loaded into the view. This is actually the same than `options.webview.src`.
* `iconURL`: optional URL to the tab icon.
* `icon`: optional code for a tab icon. Can be used with symbol libraries (example with Font Awesome: `icon: 'fa fa-icon-name'`). This attribute is ignored if an `iconURL` was given.
* `closable` (default: `true`): if set to `true` the close button won't be displayed and the user won't be able to close the tab. See also `tab.close()`.
* `webviewAttributes`: attributes to add to the webview tag. See [webview documentation](http://electron.atom.io/docs/api/web-view-tag/#tag-attributes).
* `visible` (default: `true`): set this to `false` if you don't want to display the tab once it is loaded. If set to `false` then you will need to call `tab.show()` to display the tab.
@ -98,13 +99,13 @@ Set tab title.
Get current tab title.
#### `tab.setIcon(iconURL)`
#### `tab.setIcon (iconURL, icon)`
Set tab icon (an URL must be given).
Set tab icon (a iconURL or an icon must be given).
#### `tab.getIcon()`
Get current tab icon URL.
Get current tab icon URL / icon.
#### `tab.activate()`
@ -139,7 +140,7 @@ The following events are available:
* `tabGroup.on("tab-removed", (tab, tabGroup) => { ... });`
* `tabGroup.on("tab-active", (tab, tabGroup) => { ... });`
* `tab.on("title-changed", (title, tab) => { ... });`
* `tab.on("icon-changed", (iconURL, tab) => { ... });`
* `tab.on("icon-changed", (icon, tab) => { ... });`
* `tab.on("active", (tab) => { ... });`
* `tab.on("visible", (tab) => { ... });`
* `tab.on("hidden", (tab) => { ... });`

View file

@ -124,6 +124,7 @@ class Tab extends EventEmitter {
this.id = id;
this.title = args.title;
this.iconURL = args.iconURL;
this.icon = args.icon;
this.closable = args.closable === false ? false : true;
this.webviewAttributes = args.webviewAttributes || {};
this.webviewAttributes.src = args.src;
@ -155,20 +156,26 @@ class Tab extends EventEmitter {
return this.title;
}
setIcon (iconURL) {
setIcon (iconURL, icon) {
if (this.isClosed) return;
this.iconURL = iconURL;
this.icon = icon;
let span = this.tabElements.icon;
if (iconURL) {
span.innerHTML = `<img src="${iconURL}" />`;
this.emit("icon-changed", iconURL, this);
} else if (icon) {
span.innerHTML = `<i class="${icon}"></i>`;
this.emit("icon-changed", icon, this);
}
this.emit("icon-changed", iconURL, this);
return this;
}
getIcon () {
if (this.isClosed) return;
return this.iconURL;
if (this.iconURL) return this.iconURL;
return this.icon;
}
activate () {
@ -247,7 +254,7 @@ const TabPrivate = {
}
this.setTitle(this.title);
this.setIcon(this.iconURL);
this.setIcon(this.iconURL, this.icon);
TabPrivate.initTabButtons.bind(this)();
TabPrivate.initTabClickHandler.bind(this)();