Initial adding of code...
This commit is contained in:
parent
10a44bc0c9
commit
f2dcc33906
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,51 @@
|
||||||
|
body { background: rgb(255,255,255); width: 18em; overflow-x: hidden; }
|
||||||
|
#listZone { margin-top: 0.5em; }
|
||||||
|
|
||||||
|
#toFind {
|
||||||
|
width: 95%;
|
||||||
|
background: rgb(255,255,255);
|
||||||
|
color: rgb(0,0,0);
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgb(0, 0, 0);
|
||||||
|
text-align: center;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
#errorZone {
|
||||||
|
border-color: rgb(0,0,0);
|
||||||
|
border-style: dotted;
|
||||||
|
color: red;
|
||||||
|
margin-top: 2em;
|
||||||
|
padding-top: 0.5em;
|
||||||
|
padding-bottom: 0.5em;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box:hover { background-color: #3EA724; }
|
||||||
|
.box {
|
||||||
|
display: block;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: #444444;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 20px;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
overflow: hidden;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.thumbImg {
|
||||||
|
width: 64px;
|
||||||
|
height: 64px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
float: left;
|
||||||
|
clear: left;
|
||||||
|
height: 55px;
|
||||||
|
max-width: 120px;
|
||||||
|
overflow: hidden;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.1 KiB |
|
|
@ -0,0 +1,29 @@
|
||||||
|
{
|
||||||
|
"manifest_version": 2,
|
||||||
|
"name": "Tab Search",
|
||||||
|
"version": "1.0.8",
|
||||||
|
"description": "Search Tabs and switch to them quickly.",
|
||||||
|
|
||||||
|
"applications": {
|
||||||
|
"gecko": {
|
||||||
|
"id": "tabsSearch@itdominator.com"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
"icons": {
|
||||||
|
"48": "icons/tabsSearch_48.png",
|
||||||
|
"96": "icons/tabsSearch_96.png"
|
||||||
|
},
|
||||||
|
|
||||||
|
"permissions": [
|
||||||
|
"activeTab",
|
||||||
|
"tabs"
|
||||||
|
],
|
||||||
|
|
||||||
|
"browser_action": {
|
||||||
|
"default_icon": "icons/tabsSearch_48.png",
|
||||||
|
"default_title": "Tab Search",
|
||||||
|
"default_popup": "pages/tabsSearch.html"
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<link rel="stylesheet" href="../css/tabsSearch.css"/>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<input id="toFind" type="text" placeholder="Search tabs..." value=""/>
|
||||||
|
<div id="listZone"></div>
|
||||||
|
<div id="errorZone" style="display: none;"></div>
|
||||||
|
|
||||||
|
<script src="../scripts/tabsSearch.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,81 @@
|
||||||
|
const toFind = document.getElementById("toFind");
|
||||||
|
const tabQuery = browser.tabs.query({currentWindow: true});
|
||||||
|
const errHandler = document.getElementById("errorZone");
|
||||||
|
const listZone = document.getElementById("listZone");
|
||||||
|
const notFoundText = document.createTextNode("Search not found...");
|
||||||
|
|
||||||
|
document.getElementById("toFind").onkeypress = function(e){
|
||||||
|
searchTabs();
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener("click", (e) => {
|
||||||
|
if (e.target.id != "toFind" && e.target.id != "listZone" ) {
|
||||||
|
if (e.target.tagName == "IMG") {
|
||||||
|
var parent = e.target.parentNode;
|
||||||
|
loadSelTab(parseInt(parent.id));
|
||||||
|
} else {
|
||||||
|
loadSelTab(parseInt(e.target.id));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function logTabs(tabs) {
|
||||||
|
var selection = [];
|
||||||
|
|
||||||
|
clearNodes(listZone);
|
||||||
|
if (toFind.value != "") {
|
||||||
|
for (let tab of tabs) {
|
||||||
|
var title = tab.title;
|
||||||
|
if (title.toLowerCase().includes(toFind.value.toLowerCase())) {
|
||||||
|
selection.push(tab);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (selection.length > 1) {
|
||||||
|
for (let sel of selection) {
|
||||||
|
icon = document.createElement("DIV");
|
||||||
|
thumbnail = document.createElement("IMG");
|
||||||
|
title = document.createElement("P");
|
||||||
|
lineBreak = document.createElement("BR");
|
||||||
|
titleText = document.createTextNode(sel.title);
|
||||||
|
|
||||||
|
icon.id = sel.id;
|
||||||
|
icon.className = "box";
|
||||||
|
thumbnail.className = "thumbImg";
|
||||||
|
thumbnail.src = sel.favIconUrl;
|
||||||
|
title.className = "title";
|
||||||
|
|
||||||
|
icon.appendChild(thumbnail);
|
||||||
|
icon.appendChild(title);
|
||||||
|
title.appendChild(titleText);
|
||||||
|
listZone.appendChild(icon);
|
||||||
|
listZone.appendChild(lineBreak);
|
||||||
|
}
|
||||||
|
errHandler.style.display = "none";
|
||||||
|
clearNodes(errHandler);
|
||||||
|
} else {
|
||||||
|
if (selection[0] != undefined) {
|
||||||
|
errHandler.style.display = "none";
|
||||||
|
clearNodes(errHandler);
|
||||||
|
loadSelTab(selection[0].id);
|
||||||
|
} else {
|
||||||
|
errHandler.style.display = "block";
|
||||||
|
errHandler.appendChild(notFoundText);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadSelTab(id) {
|
||||||
|
browser.tabs.update(id, {
|
||||||
|
active: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearNodes(targetNode) {
|
||||||
|
while (targetNode.firstChild) {
|
||||||
|
targetNode.removeChild(targetNode.firstChild);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function searchTabs() { tabQuery.then(logTabs, onError); }
|
||||||
|
function onError(error) { console.log(`Error: ${error}`); }
|
||||||
Loading…
Reference in New Issue