rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

newtab icon to open new container tab from pop-up

Browse source
This commit is contained in:
groovecoder 2017-01-03 10:43:21 -06:00
parent 50419d6bb1
commit 44b85c6818
3 changed files with 18 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
webextension/css/popup.css
View file

@ -17,7 +17,7 @@ table {
padding: 0; padding: 0;
} }
.header-icon { .icon {
max-width: 16px; max-width: 16px;
height: 16px; height: 16px;
margin: 4px; margin: 4px;
@ -39,12 +39,6 @@ table.unstriped tbody tr {
height: 32px; height: 32px;
} }
.hideorshow-icon {
max-width: 16px;
height: 16px;
margin: 4px;
}
.edit-identities { .edit-identities {
background: #DCDBDC; background: #DCDBDC;
} }

20
webextension/js/popup.js
View file

@ -51,16 +51,21 @@ browser.runtime.sendMessage({method: 'query'}).then(identities=> {
} }
const identityRow = ` const identityRow = `
<tr data-identity-cookie-store-id="${identity.cookieStoreId}" > <tr data-identity-cookie-store-id="${identity.cookieStoreId}" >
<td><div class="userContext-icon" <td>
<div class="userContext-icon"
data-identity-icon="${identity.icon}" data-identity-icon="${identity.icon}"
data-identity-color="${identity.color}" data-identity-color="${identity.color}">
></div></td> </div>
</td>
<td>${identity.name}</td> <td>${identity.name}</td>
<td class="newtab">
<img src="/img/container-add.svg" class="icon newtab-icon" />
</td>
<td class="hideorshow" > <td class="hideorshow" >
<img <img
data-identity-cookie-store-id="${identity.cookieStoreId}" data-identity-cookie-store-id="${identity.cookieStoreId}"
id="${identity.cookieStoreId}-hideorshow-icon" id="${identity.cookieStoreId}-hideorshow-icon"
class="hideorshow-icon" class="icon hideorshow-icon"
src="${hideOrShowIconSrc}" src="${hideOrShowIconSrc}"
/> />
</td> </td>
@ -74,9 +79,9 @@ browser.runtime.sendMessage({method: 'query'}).then(identities=> {
rows.forEach(row=> { rows.forEach(row=> {
row.addEventListener('click', e=> { row.addEventListener('click', e=> {
if (e.target.matches('.hideorshow-icon')) { const containerId = e.target.parentElement.parentElement.dataset.identityCookieStoreId;
const containerId = e.target.dataset.identityCookieStoreId;
if (e.target.matches('.hideorshow-icon')) {
browser.runtime.sendMessage({method: 'getIdentitiesState'}).then(identitiesState=> { browser.runtime.sendMessage({method: 'getIdentitiesState'}).then(identitiesState=> {
if (identitiesState[containerId].hiddenTabUrls.length) { if (identitiesState[containerId].hiddenTabUrls.length) {
showContainerTabs(containerId); showContainerTabs(containerId);
@ -84,6 +89,9 @@ browser.runtime.sendMessage({method: 'query'}).then(identities=> {
hideContainerTabs(containerId); hideContainerTabs(containerId);
} }
}); });
} else if (e.target.matches('.newtab-icon')) {
browser.tabs.create({cookieStoreId: containerId});
window.close();
} }
}); });
}); });

4
webextension/popup.html
View file

@ -8,13 +8,13 @@
<body> <body>
<div class="row popup-bumper"> <div class="row popup-bumper">
<div class="small-2 columns header-column"> <div class="small-2 columns header-column">
<img alt="Containers icon" class="header-icon" src="/img/container-site-d-24.png"> <img alt="Containers icon" class="icon" src="/img/container-site-d-24.png">
</div> </div>
<div class="small-8 columns"> <div class="small-8 columns">
<h4>Containers</h4> <h4>Containers</h4>
</div> </div>
<div class="small-2 columns header-column"> <div class="small-2 columns header-column">
<a id="sort-containers-link"><img alt="Sort Containers" class="header-icon" src="/img/container-sort.svg"></a> <a id="sort-containers-link"><img alt="Sort Containers" class="icon" src="/img/container-sort.svg"></a>
</div> </div>
</div> </div>
<table class="unstriped hover"> <table class="unstriped hover">