Add button to remove domain filter (#7)

* Add button to remove domain filter

* Fix removing hint via backspace when search text is present

* Move trim & fuzzy-enabled into search function

* Simplify code

* Use a more descriptive name
This commit is contained in:
Erayd
2018-04-21 20:46:59 +12:00
committed by GitHub
parent 9c6b7237f5
commit 6efaa5ef36
5 changed files with 88 additions and 11 deletions

View File

@@ -0,0 +1,44 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 32.025562 24.291258"
height="24.291258"
width="32.025562"
id="svg2"
version="1.1">
<metadata
id="metadata8">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs6" />
<path
id="path817"
d="M 32,0 H 7.676162 L 0,11.793103 l 7.916042,12.464255 24.109522,0.0339 z"
style="fill:#d40000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.00038135px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
<g
transform="matrix(0.74244039,0,0,0.68917867,4.4293442,0.9133566)"
style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:4;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="g825">
<path
style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:4;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 12.471062,8.3881031 27.653541,23.611032"
id="path819" />
<path
style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:4;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 27.620082,8.3808186 12.36939,23.630587"
id="path821" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@@ -23,7 +23,7 @@ function Interface(settings, logins) {
this.settings = settings;
this.logins = logins;
this.results = [];
this.active = !settings.tab.url.match(/^chrome:\/\//);
this.currentDomainOnly = !settings.tab.url.match(/^chrome:\/\//);
this.searchPart = new SearchInterface(this);
// initialise with empty search
@@ -131,16 +131,17 @@ function view(ctl, params) {
* Run a search
*
* @param string s Search string
* @param bool fuzzyFirstWord Whether to use fuzzy search on the first word
* @return void
*/
function search(s, fuzzyFirstWord = true) {
function search(s) {
var self = this;
var fuzzyFirstWord = s.substr(0, 1) !== " ";
s = s.trim();
// get candidate list
var candidates = this.logins.map(result => Object.assign(result, { display: result.login }));
if (this.active) {
candidates = candidates.filter(login => login.active);
if (this.currentDomainOnly) {
candidates = candidates.filter(login => login.inCurrentDomain);
}
if (s.length) {

View File

@@ -61,6 +61,16 @@ body {
.part.search > .hint {
background-color: #66c;
display: flex;
}
.part.search > .hint > .remove-hint {
background-image: url("icon-bs-delete.svg");
background-repeat: no-repeat;
background-size: contain;
height: 12px;
margin: 1px 0 1px 4px;
width: 16px;
}
.part.search > input[type="text"] {

View File

@@ -92,7 +92,7 @@ async function run(settings) {
login: response[store][key].replace(/\.gpg$/i, "")
};
login.domain = pathToDomain(login.store + "/" + login.login);
login.active =
login.inCurrentDomain =
settings.host == login.domain || settings.host.endsWith("." + login.domain);
// bind handlers

View File

@@ -50,7 +50,21 @@ function view(ctl, params) {
}
},
[
this.popup.active ? m("div.hint.badge", this.popup.settings.host) : null,
this.popup.currentDomainOnly
? m("div.hint.badge", [
this.popup.settings.host,
m("div.remove-hint", {
onclick: function(e) {
var target = document.querySelector(
".part.search > input[type=text]"
);
target.focus();
self.popup.currentDomainOnly = false;
self.popup.search(target.value);
}
})
])
: null,
m("input[type=text]", {
focused: true,
placeholder: "Search logins...",
@@ -58,14 +72,22 @@ function view(ctl, params) {
e.dom.focus();
},
oninput: function(e) {
self.popup.search(e.target.value.trim(), e.target.value.substr(0, 1) !== " ");
self.popup.search(e.target.value);
},
onkeydown: function(e) {
switch (e.code) {
case "Backspace":
if (self.popup.active && e.target.value.length == 0) {
self.popup.active = false;
self.popup.search("");
if (self.popup.currentDomainOnly) {
if (e.target.value.length == 0) {
self.popup.currentDomainOnly = false;
self.popup.search("");
} else if (
e.target.selectionStart == 0 &&
e.target.selectionEnd == 0
) {
self.popup.currentDomainOnly = false;
self.popup.search(e.target.value);
}
}
break;
}