1
0
mirror of http://git.whoc.org.uk/git/password-manager.git synced 2025-10-28 18:07:35 +01:00

Added key-bindings for searching cards (desktop version)

This commit is contained in:
Giulio Cesare Solaroli
2015-01-04 16:53:08 +01:00
parent 3a34051bb1
commit cff99b9603
11 changed files with 1300 additions and 61 deletions

View File

@@ -51,6 +51,21 @@ Clipperz.PM.UI.Components.Selections = React.createClass({
handleSearchChange: function (anEvent) {
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'search', anEvent.currentTarget.value);
},
handleKeyDown: function (anEvent) {
if (anEvent.key == 'Escape') {
this.clearSearch();
} else if (anEvent.key == 'Enter') {
anEvent.stopPropagation();
anEvent.preventDefault();
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'exitSearch', anEvent.currentTarget.value);
}
},
clearSearch: function (anEvent) {
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'search', "");
},
render: function () {
var tagInfo;
@@ -78,10 +93,14 @@ Clipperz.PM.UI.Components.Selections = React.createClass({
React.DOM.div({'className':'search'}, [
React.DOM.form({'className':'searchForm'}, [
React.DOM.div({}, [
React.DOM.input({'type':'text', 'id':'searchValue', 'onFocus':this.handleSearchChange, 'onChange':this.handleSearchChange, 'onKeyDown':this.handleKeyDown, 'name':'search', 'value':this.props['searchTerm']}),
React.DOM.label({'htmlFor':'searchValue'}, 'search'),
React.DOM.input({'type':'text', 'id':'searchValue', 'onFocus':this.handleSearchChange, 'onChange':this.handleSearchChange, 'name':'search', 'value':this.props['searchTerm']})
]),
React.DOM.div({}, [ React.DOM.span({'className':'count'}, selectedCardCount) ])
React.DOM.span({'className':'searchClear', 'onClick':this.clearSearch}, "clear")
])
]),
React.DOM.div({'className':'searchResultInfo'}, [
React.DOM.label({}, "Items found:"),
React.DOM.span({}, selectedCardCount)
])
]),
React.DOM.ul({'className':'tagList'}, MochiKit.Base.map(function (aTag) {return Clipperz.PM.UI.Components.TagIndexItem({'label':aTag, 'count':tagInfo[aTag], 'selected':aTag == filterValue}); }, tags)),

View File

@@ -64,7 +64,6 @@ Clipperz.PM.UI.MainController = function() {
'matchMediaQuery', 'unmatchMediaQuery',
'selectAllCards', 'selectRecentCards', 'search', 'tagSelected', 'selectUntaggedCards',
'refreshCardEditDetail',
// 'refreshCardEditToolbar',
'saveCardEdits', 'cancelCardEdits',
'cardSelected',
'addCardClick',
@@ -75,9 +74,14 @@ Clipperz.PM.UI.MainController = function() {
'maskClick',
'downloadOfflineCopy',
'runDirectLogin',
'exitSearch'
]);
// MochiKit.Signal.connect(MochiKit.DOM.currentDocument(), 'onselectionchange', this, 'selectionChange_handler');
Mousetrap.bind({
'/': MochiKit.Base.method(this, 'focusOnSearch'),
'up': MochiKit.Base.method(this, 'selectPreviousCard'),
'down': MochiKit.Base.method(this, 'selectNextCard'),
})
return this;
}
@@ -347,7 +351,7 @@ console.log("THE BROWSER IS OFFLINE");
},
setUser: function (aUser) {
console.log("SET USER", aUser);
//console.log("SET USER", aUser);
this._user = aUser;
return this._user;
},
@@ -496,7 +500,6 @@ console.log("SET USER", aUser);
selectedCardReference: function () {
return this.pages()['mainPage'].props &&
this.pages()['mainPage'].props['selectedCard'] &&
// this.pages()['mainPage'].props['selectedCard'] &&
this.pages()['mainPage'].props['selectedCard']['_reference']
? this.pages()['mainPage'].props['selectedCard']['_reference']
: '';
@@ -600,23 +603,6 @@ console.log("SET USER", aUser);
deferredResult.addMethodcaller('sort', sortCriteria);
deferredResult.addCallback(rangeFilter);
/*
if (aFilter['type'] == 'ALL') {
deferredResult.addMethodcaller('sort', sortCriteria);
} else if (aFilter['type'] == 'RECENT') {
deferredResult.addMethodcaller('sort', sortCriteria);
deferredResult.addCallback(function (someCards) { return someCards.slice(0, 9)});
} else if (aFilter['type'] == 'SEARCH') {
deferredResult.addCallback(MochiKit.Base.filter, this.regExpFilterGenerator(Clipperz.PM.DataModel.Record.regExpForSearch(aFilter['value'])));
deferredResult.addMethodcaller('sort', sortCriteria);
} else if (aFilter['type'] == 'TAG') {
deferredResult.addCallback(MochiKit.Base.filter, this.regExpFilterGenerator(Clipperz.PM.DataModel.Record.regExpForTag(aFilter['value'])));
deferredResult.addMethodcaller('sort', sortCriteria);
} else if (aFilter['type'] == 'UNTAGGED') {
deferredResult.addCallback(MochiKit.Base.filter, this.regExpFilterGenerator(Clipperz.PM.DataModel.Record.regExpForNoTag()));
deferredResult.addMethodcaller('sort', sortCriteria);
}
*/
deferredResult.addMethod(this, 'setPageProperties', 'mainPage', 'cards');
deferredResult.addCallback(MochiKit.Base.bind(function (someCards) {
if (!this.isSelectedCardStillVisible(someCards)) {
@@ -638,7 +624,7 @@ console.log("SET USER", aUser);
var deferredResult;
deferredResult = new Clipperz.Async.Deferred('MainController.refreshUI', {trace:false});
deferredResult.addMethod(this, 'resetRecordsInfo'),
// deferredResult.addMethod(this, 'resetRecordsInfo'),
deferredResult.addMethod(this, 'refreshSelectedCards');
deferredResult.addMethod(this, 'renderTags');
@@ -740,14 +726,6 @@ console.log("SET USER", aUser);
},
*/
//=========================================================================
/*
searchCards_handler: function (someParameters) {
//console.log("SEARCH CARDS", someParameters);
this.setFilter(someParameters);
this.renderAccountData();
},
*/
//=========================================================================
/*
showPreferences_handler: function (anEvent) {
var deferredResult;
@@ -996,15 +974,28 @@ console.log("SET USER", aUser);
this._isSettingsPanelOpen = false;
},
isSelectionPanelHidable: function () {
var result;
if (this.mediaQueryStyle() == 'extra-wide') {
result = false;
} else {
result = true;
}
return result;
},
isSelectionPanelOpen: function () {
return this._isSelectionPanelOpen;
},
toggleSelectionPanel_handler: function (anEvent) {
this._isSelectionPanelOpen = !this._isSelectionPanelOpen;
this.setCloseMaskAction(MochiKit.Base.method(this, 'toggleSelectionPanel_handler'));
this.refreshCurrentPage();
if (this.isSelectionPanelHidable() == true) {
this._isSelectionPanelOpen = !this._isSelectionPanelOpen;
this.setCloseMaskAction(MochiKit.Base.method(this, 'toggleSelectionPanel_handler'));
this.refreshCurrentPage();
}
},
@@ -1031,16 +1022,13 @@ console.log("SET USER", aUser);
refreshCardEditDetail_handler: function (aRecordReference) {
this.updateSelectedCard({'reference':aRecordReference}, false);
},
// refreshCardEditToolbar_handler: function (aRecordReference) {
//
// },
saveChanges: function () {
// TODO: handle errors while savings
return Clipperz.Async.callbacks("MainController.saveChanges", [
MochiKit.Base.method(this.overlay(), 'show', "saving …", true),
MochiKit.Base.method(this.user(), 'saveChanges'),
// MochiKit.Base.method(this, 'resetRecordsInfo'),
MochiKit.Base.method(this, 'resetRecordsInfo'),
MochiKit.Base.method(this.overlay(), 'done', "saved", 1),
], {trace:false});
},
@@ -1051,11 +1039,9 @@ console.log("SET USER", aUser);
return Clipperz.Async.callbacks("MainController.saveCardEdits_handler", [
MochiKit.Base.method(currentPage, 'setProps', {'showGlobalMask':true}),
// MochiKit.Base.method(this.overlay(), 'show', "saving …", true),
MochiKit.Base.method(this, 'saveChanges'),
MochiKit.Base.method(currentPage, 'setProps', {'mode':'view', 'showGlobalMask':false}),
MochiKit.Base.method(this, 'refreshUI', aRecordReference),
// MochiKit.Base.method(this.overlay(), 'done', "saved", 1),
], {trace:false});
},
@@ -1340,7 +1326,7 @@ console.log("SET USER", aUser);
//============================================================================
'downloadOfflineCopy_handler': function (anEvent) {
downloadOfflineCopy_handler: function (anEvent) {
var downloadHref;
var deferredResult;
var newWindow;
@@ -1359,6 +1345,33 @@ console.log("SET USER", aUser);
},
//============================================================================
focusOnSearch: function (anEvent) {
anEvent.preventDefault();
// TODO: show selection panel, if it is hidden
// if (! this.isSelectionPanelVisible()) {
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'toggleSelectionPanel');
// }
MochiKit.DOM.getElement('searchValue').focus();
},
exitSearch_handler: function (anEvent) {
// TODO: hide selection panel, if it is overlaying
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'toggleSelectionPanel');
MochiKit.DOM.getElement('searchValue').blur();
},
selectPreviousCard: function () {
console.log("select PREVIOUS card");
},
selectNextCard: function () {
console.log("select NEXT card");
},
//============================================================================
/*
wrongAppVersion: function (anError) {
// this.pages()['errorPage'].setProps({message:anError.message});