clipperz/password-manager-mirror
1
0
Fork 0
mirror of http://git.whoc.org.uk/git/password-manager.git synced 2025-10-30 02:47:36 +01:00
Code Issues Releases Wiki Activity

Added a few feature based on actual subscription options

Browse Source
This commit is contained in:
Giulio Cesare Solaroli
2015-01-21 18:29:08 +01:00
parent 334affd36d
commit 43b0239ab8
8 changed files with 173 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/delta/js/Clipperz/PM/UI/Components/CardToolbar.js
View File

@@ -29,7 +29,7 @@ Clipperz.PM.UI.Components.CardToolbar = React.createClass({
// 'style': React.PropTypes.oneOf(['extra-short', 'narrow', 'wide', 'extra-wide']).isRequired,
'style': React.PropTypes.oneOf(Clipperz_PM_UI_availableStyles).isRequired,
'enableSidePanels': React.PropTypes.bool.isRequired,
'accountStatus': React.PropTypes.object.isRequired,
'accountInfo': React.PropTypes.object.isRequired,
'messageBox': React.PropTypes.object.isRequired,
'filter': React.PropTypes.object /*.isRequired */
},
@@ -99,7 +99,7 @@ Clipperz.PM.UI.Components.CardToolbar = React.createClass({
return React.DOM.div({className:'cardToolbar ' + this.props['style']}, [
// React.DOM.div({className:'header'}, this.props['enableSidePanels'] ? this.renderWithSidePanels() : this.renderWithoutSidePanels()),
React.DOM.header({}, this.props['enableSidePanels'] ? this.renderWithSidePanels() : this.renderWithoutSidePanels()),
Clipperz.PM.UI.Components.AccountStatus(this.props['accountStatus']),
Clipperz.PM.UI.Components.AccountStatus(this.props['accountInfo']),
Clipperz.PM.UI.Components.MessageBox(this.props['messageBox']),
]);
}

4
frontend/delta/js/Clipperz/PM/UI/Components/Cards/List.js
View File

@@ -30,6 +30,7 @@ Clipperz.PM.UI.Components.Cards.List = React.createClass({
propTypes: {
'cards': React.PropTypes.array,
'featureSet': React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL', 'OFFLINE']).isRequired,
'selectedCard': React.PropTypes.object
},
@@ -62,7 +63,8 @@ Clipperz.PM.UI.Components.Cards.List = React.createClass({
var cards = this.props['cards'] ? this.props['cards'] : [];
var classes = {
'cardList': true,
'loadingCard': this.props['selectedCard'] && this.props['selectedCard']['_reference'] && this.props['selectedCard']['loading']
'loadingCard': this.props['selectedCard'] && this.props['selectedCard']['_reference'] && this.props['selectedCard']['loading'],
'EXPIRED': this.props['featureSet'] == 'EXPIRED',
};
classes[this.props['style']] = true;

2
frontend/delta/js/Clipperz/PM/UI/Components/ExpiredPanel.js
View File

@@ -26,7 +26,7 @@ Clipperz.Base.module('Clipperz.PM.UI.Components');
Clipperz.PM.UI.Components.ExpiredPanel = React.createClass({
propTypes: {
// featureSet: React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL']).isRequired,
// featureSet: React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL', 'OFFLINE']).isRequired,
// 'level': React.PropTypes.oneOf(['hide', 'info', 'warning', 'error']).isRequired
},

7
frontend/delta/js/Clipperz/PM/UI/Components/Pages/MainPage.js
View File

@@ -28,13 +28,14 @@ Clipperz.PM.UI.Components.Pages.MainPage = React.createClass({
getDefaultProps: function () {
return {
}
featureSet: 'FULL'
};
},
propTypes: {
'messageBox': React.PropTypes.object.isRequired,
// 'featureSet': React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL']),
'accountStatus': React.PropTypes.object.isRequired,
'featureSet': React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL', 'OFFLINE']).isRequired,
'accountInfo': React.PropTypes.object.isRequired,
// 'mediaQueryStyle': React.PropTypes.oneOf(['extra-short', 'narrow', 'wide', 'extra-wide']).isRequired,
'style': React.PropTypes.oneOf(Clipperz_PM_UI_availableStyles).isRequired,
// 'cards': React.PropTypes.deferred.isRequired

113
frontend/delta/js/Clipperz/PM/UI/Components/Panels/ExtraFeaturesPanel.js
View File

@@ -34,10 +34,32 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
handleDownloadOfflineCopyLink: function (anEvent) {
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'downloadOfflineCopy');
},
propTypes: {
'accountInfo': React.PropTypes.object.isRequired,
},
getInitialState: function() {
return {
'account': false,
'subscription': false,
'data': false,
};
},
toggleState: function (section) {
return MochiKit.Base.bind(function () {
var newState = {};
newState[section] = !this.state[section];
this.setState(newState);
}, this);
},
//=========================================================================
render: function () {
//console.log("ExtraFeaturesPanel props", this.props);
var classes = {
'panel': true,
'right': true,
@@ -53,32 +75,93 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
React.DOM.div({}, [
React.DOM.ul({}, [
React.DOM.li({}, [
React.DOM.h1({}, "Account"),
React.DOM.li({'className':this.state['account'] ? 'open' : 'closed'}, [
React.DOM.h1({'onClick':this.toggleState('account')}, "Account"),
React.DOM.ul({}, [
React.DOM.li({}, [
React.DOM.h2({}, "Passphrase"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "One Time Passwords"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "Preferences"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "Delete account"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
])
])
]),
React.DOM.li({}, [
React.DOM.h1({}, "Data"),
React.DOM.li({'className':this.state['subscription'] ? 'open' : 'closed'}, [
React.DOM.h1({'onClick':this.toggleState('subscription')}, "Subscription"),
React.DOM.ul({}, [
React.DOM.li({}, [
React.DOM.h2({}, "x1"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "x2"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "x3"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "x4"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
])
])
]),
React.DOM.li({'className':this.state['data'] ? 'open' : 'closed'}, [
React.DOM.h1({'onClick':this.toggleState('data')}, "Data"),
React.DOM.ul({}, [
React.DOM.li({}, [
React.DOM.h2({}, "Offline copy"),
React.DOM.div({}, [
React.DOM.p({}, "With just one click you can dump all your encrypted data from Clipperz servers to your hard disk and create a read-only offline version of Clipperz to be used when you are not connected to the Internet."),
React.DOM.a({'onClick':this.handleDownloadOfflineCopyLink}, "Download")
React.DOM.a({'className':'button', 'onClick':this.handleDownloadOfflineCopyLink}, "Download")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "Import"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "Export"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
]),
React.DOM.li({}, [
React.DOM.h2({}, "Sharing"),
]),
React.DOM.li({}, [
React.DOM.h2({}, "Import"),
]),
React.DOM.li({}, [
React.DOM.h2({}, "Export"),
React.DOM.div({}, [
React.DOM.p({}, "")
])
])
])
]),
React.DOM.li({}, [
React.DOM.h1({}, "Tools"),
])
])
])

19
frontend/delta/js/Clipperz/PM/UI/Components/Panels/MainPanel.js
View File

@@ -30,16 +30,10 @@ Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
propTypes: {
'messageBox': React.PropTypes.object.isRequired,
'featureSet': React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL']).isRequired,
'featureSet': React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL', 'OFFLINE']).isRequired,
'style': React.PropTypes.oneOf(Clipperz_PM_UI_availableStyles).isRequired,
},
getDefaultProps: function () {
return {
featureSet: 'FULL'
};
},
style: function () {
return this.props['style'];
},
@@ -66,7 +60,13 @@ Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
},
renderCardFrame: function (firstColumnComponents, secondColumnComponents) {
var addCardButton = React.DOM.div({'className': 'addCardButton', 'onClick':this.handleAddCardClick}, 'add card');
var addCardButton;
if ((this.props['featureSet'] != 'EXPIRED') && (this.props['featureSet'] != 'OFFLINE')) {
addCardButton = React.DOM.div({'className': 'addCardButton', 'onClick':this.handleAddCardClick}, 'add card');
} else {
addCardButton = null;
}
return React.DOM.div({'key':'cardContent', 'className':'cardContent'}, [
React.DOM.div({'className':'cardListColumn column'}, [addCardButton, firstColumnComponents]),
@@ -82,7 +82,8 @@ Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
cardToolbarProps = MochiKit.Base.merge(this.props, {
'key': 'toolbar',
'style': this.style(),
'enableSidePanels': (this.props['featureSet'] != 'EXPIRED')
// 'enableSidePanels': (this.props['featureSet'] != 'EXPIRED')
'enableSidePanels': true,
});
return Clipperz.PM.UI.Components.CardToolbar(cardToolbarProps);