korbs/electron-tabs
1
0
Fork 0
mirror of https://ark.sudovanilla.org/Korbs/electron-tabs.git synced 2024-12-23 03:53:53 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

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

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

11
README.md
View file

@ -72,6 +72,7 @@ Add a new tab to the tab group and returns a `Tab` instance.
* `title`: tab title. * `title`: tab title.
* `src`: URL to the page which will be loaded into the view. This is actually the same than `options.webview.src`. * `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. * `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()`. * `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). * `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. * `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. 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()` #### `tab.getIcon()`
Get current tab icon URL. Get current tab icon URL / icon.
#### `tab.activate()` #### `tab.activate()`
@ -139,7 +140,7 @@ The following events are available:
* `tabGroup.on("tab-removed", (tab, tabGroup) => { ... });` * `tabGroup.on("tab-removed", (tab, tabGroup) => { ... });`
* `tabGroup.on("tab-active", (tab, tabGroup) => { ... });` * `tabGroup.on("tab-active", (tab, tabGroup) => { ... });`
* `tab.on("title-changed", (title, tab) => { ... });` * `tab.on("title-changed", (title, tab) => { ... });`
* `tab.on("icon-changed", (iconURL, tab) => { ... });` * `tab.on("icon-changed", (icon, tab) => { ... });`
* `tab.on("active", (tab) => { ... });` * `tab.on("active", (tab) => { ... });`
* `tab.on("visible", (tab) => { ... });` * `tab.on("visible", (tab) => { ... });`
* `tab.on("hidden", (tab) => { ... });` * `tab.on("hidden", (tab) => { ... });`
@ -180,4 +181,4 @@ var tabGroup = new TabGroup({
## License ## License
The MIT License (MIT) - Copyright (c) 2016 Thomas Brouard The MIT License (MIT) - Copyright (c) 2016 Thomas Brouard

17
index.js
View file

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