clipperz/password-manager-mirror
1
0
Fork 0
mirror of http://git.whoc.org.uk/git/password-manager.git synced 2025-10-29 18:37:35 +01:00
Code Issues Releases Wiki Activity

Highlighted selected items in the selection panel.

Browse Source 
Also added some improvements suggested here: http://www.luster.io/blog/9-29-14-mobile-web-checklist.html
This commit is contained in:
Giulio Cesare Solaroli
2014-10-12 14:48:34 +02:00
parent c3add59d1b
commit 3910a2dd8f
8 changed files with 72 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/delta/js/Clipperz/PM/UI/Components/Selections.js
View File

@@ -58,12 +58,16 @@ Clipperz.PM.UI.Components.Selections = React.createClass({
var archivedCardsCount;
var selectedCardCount;
var filterType;
var filterValue;
console.log("SELECTIONS PROPS", this.props);
tagInfo = this.props['tags'] ? this.props['tags'] : {};
tags = MochiKit.Base.filter(Clipperz.PM.DataModel.Record.isRegularTag, MochiKit.Base.keys(tagInfo)).sort(Clipperz.Base.caseInsensitiveCompare);
archivedCardsCount = this.props['archivedCardsCount'];
selectedCardCount = this.props['cards'] ? this.props['cards'].length : 0;
filterType = (this.props['filter'] && this.props['filter']['type']) ? this.props['filter']['type'] : 'ALL';
filterValue = (this.props['filter'] && this.props['filter']['value']) ? this.props['filter']['value'] : null;
return React.DOM.div({'key':'selections', 'id':'selections', 'className':filterType}, [
React.DOM.ul({'className':'defaultSet'}, [
@@ -80,7 +84,7 @@ Clipperz.PM.UI.Components.Selections = React.createClass({
React.DOM.div({}, [ React.DOM.span({'className':'count'}, selectedCardCount) ])
])
]),
React.DOM.ul({'className':'tagList'}, MochiKit.Base.map(function (aTag) {return Clipperz.PM.UI.Components.TagIndexItem({'label':aTag, 'count':tagInfo[aTag]}); }, tags)),
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)),
React.DOM.div({'className':'showArchivedCards', 'onClick':this.handleCheckboxChanges}, [
React.DOM.input({'type':'checkbox', 'checked':this.props['shouldIncludeArchivedCards'] ? 'checked' : null}),
React.DOM.span({'className':'label'}, "Show archived cards"),

6
frontend/delta/js/Clipperz/PM/UI/Components/TagIndexItem.js
View File

@@ -39,7 +39,11 @@ Clipperz.PM.UI.Components.TagIndexItem = React.createClass({
},
render: function () {
return React.DOM.li({'onClick': this.handleClick, 'data-tag':this.props['label']}, [
var classes = {
'selected': this.props['selected']
}
return React.DOM.li({'onClick': this.handleClick, 'className':React.addons.classSet(classes), 'data-tag':this.props['label']}, [
React.DOM.span({'className':'tagLabel'}, this.props['label']),
React.DOM.span({'className':'tagCount'}, this.props['count'])
]);