Updated to React 13.1
This commit is contained in:
@@ -24,7 +24,7 @@ refer to http://www.clipperz.com.
|
||||
"use strict";
|
||||
Clipperz.Base.module('Clipperz.PM.UI.Components.Panels');
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
|
||||
Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanelClass = React.createClass({
|
||||
|
||||
settingsToggleHandler: function (anEvent) {
|
||||
//console.log("settingsToggleHandler");
|
||||
@@ -77,43 +77,43 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
|
||||
'disabled': !this.isFeatureEnabled('OFFLINE_COPY')
|
||||
}
|
||||
|
||||
return React.DOM.div({'key':'extraFeaturesPanel', 'id':'extraFeaturesPanel', 'className':React.addons.classSet(classes)}, [
|
||||
React.DOM.header({}, [
|
||||
React.DOM.div({'className':'settingsToggle'}, [
|
||||
Clipperz.PM.UI.Components.Button({'eventName':'settingsToggleButton', 'label':"menu", 'handler':this.settingsToggleHandler})
|
||||
return React.DOM.div({'key':'extraFeaturesPanel', 'id':'extraFeaturesPanel', 'className':Clipperz.PM.UI.Components.classNames(classes)}, [
|
||||
React.DOM.header({'key':'header'}, [
|
||||
React.DOM.div({'key':'headerDiv', 'className':'settingsToggle'}, [
|
||||
Clipperz.PM.UI.Components.Button({'key':'button', 'eventName':'settingsToggleButton', 'label':"menu", 'handler':this.settingsToggleHandler})
|
||||
])
|
||||
]),
|
||||
|
||||
React.DOM.div({}, [
|
||||
React.DOM.ul({}, [
|
||||
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.div({'key':'ulWrapper'}, [
|
||||
React.DOM.ul({'key':'ul'}, [
|
||||
React.DOM.li({'key':'account', 'className':this.state['account'] ? 'open' : 'closed'}, [
|
||||
React.DOM.h1({'key':'accountH1', 'onClick':this.toggleState('account')}, "Account"),
|
||||
React.DOM.ul({'key':'accountUL'}, [
|
||||
React.DOM.li({'key':'account_1'}, [
|
||||
React.DOM.h2({'key':'account_1_h2'}, "Passphrase"),
|
||||
React.DOM.div({'key':'account_1_div'}, [
|
||||
React.DOM.p({'key':'account_1_p'}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'account_2'}, [
|
||||
React.DOM.h2({}, "One Time Passwords"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'account_3'}, [
|
||||
React.DOM.h2({}, "Device PIN"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "Configure a PIN that will allow to get access to your cards, but only on this device.")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'account_4'}, [
|
||||
React.DOM.h2({}, "Preferences"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'account_5'}, [
|
||||
React.DOM.h2({}, "Delete account"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
@@ -121,28 +121,28 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
|
||||
])
|
||||
])
|
||||
]),
|
||||
React.DOM.li({'className':this.state['subscription'] ? 'open' : 'closed'}, [
|
||||
React.DOM.li({'key':'subscription', 'className':this.state['subscription'] ? 'open' : 'closed'}, [
|
||||
React.DOM.h1({'onClick':this.toggleState('subscription')}, "Subscription"),
|
||||
React.DOM.ul({}, [
|
||||
React.DOM.li({}, [
|
||||
React.DOM.ul({'key':'subscription'}, [
|
||||
React.DOM.li({'key':'subscription_1'}, [
|
||||
React.DOM.h2({}, "x1"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'subscription_2'}, [
|
||||
React.DOM.h2({}, "x2"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'subscription_3'}, [
|
||||
React.DOM.h2({}, "x3"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'subscription_4'}, [
|
||||
React.DOM.h2({}, "x4"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
@@ -150,29 +150,29 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
|
||||
])
|
||||
])
|
||||
]),
|
||||
React.DOM.li({'className':this.state['data'] ? 'open' : 'closed'}, [
|
||||
React.DOM.li({'key':'data', 'className':this.state['data'] ? 'open' : 'closed'}, [
|
||||
React.DOM.h1({'onClick':this.toggleState('data')}, "Data"),
|
||||
React.DOM.ul({}, [
|
||||
React.DOM.li({}, [
|
||||
React.DOM.ul({'key':'data'}, [
|
||||
React.DOM.li({'key':'data_1'}, [
|
||||
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({'className':React.addons.classSet(offlineCopyButtonClasses), 'onClick':this.handleDownloadOfflineCopyLink}, "Download")
|
||||
React.DOM.a({'className':Clipperz.PM.UI.Components.classNames(offlineCopyButtonClasses), 'onClick':this.handleDownloadOfflineCopyLink}, "Download")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'data_2'}, [
|
||||
React.DOM.h2({}, "Import"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'data_3'}, [
|
||||
React.DOM.h2({}, "Export"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
])
|
||||
]),
|
||||
React.DOM.li({}, [
|
||||
React.DOM.li({'key':'data_4'}, [
|
||||
React.DOM.h2({}, "Sharing"),
|
||||
React.DOM.div({}, [
|
||||
React.DOM.p({}, "")
|
||||
@@ -182,12 +182,14 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
|
||||
])
|
||||
])
|
||||
]),
|
||||
React.DOM.footer({'className':'applicationVersion'}, [
|
||||
React.DOM.span({}, "application version"),
|
||||
React.DOM.a({'href':'https://github.com/clipperz/password-manager/commit/' + Clipperz_version, 'target':'github'}, Clipperz_version)
|
||||
React.DOM.footer({'key':'footer', 'className':'applicationVersion'}, [
|
||||
React.DOM.span({'key':'applicationVersion'}, "application version"),
|
||||
React.DOM.a({'key':'applicationVersionLink', 'href':'https://github.com/clipperz/password-manager/commit/' + Clipperz_version, 'target':'github'}, Clipperz_version)
|
||||
])
|
||||
]);
|
||||
}
|
||||
|
||||
//=========================================================================
|
||||
});
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createFactory(Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanelClass);
|
||||
|
||||
@@ -24,7 +24,7 @@ refer to http://www.clipperz.com.
|
||||
'use strict';
|
||||
Clipperz.Base.module('Clipperz.PM.UI.Components.Panels');
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
|
||||
Clipperz.PM.UI.Components.Panels.MainPanelClass = React.createClass({
|
||||
|
||||
//=========================================================================
|
||||
|
||||
@@ -86,7 +86,7 @@ Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
|
||||
'addCard': this.isFeatureEnabled('ADD_CARD')
|
||||
}
|
||||
return React.DOM.div({'key':'cardContent', 'className':'cardContent'}, [
|
||||
React.DOM.div({'className':React.addons.classSet(cardColumnClasses)}, [addCardButton, firstColumnComponents]),
|
||||
React.DOM.div({'className':Clipperz.PM.UI.Components.classNames(cardColumnClasses)}, [addCardButton, firstColumnComponents]),
|
||||
React.DOM.div({'className':'cardDetail column right'}, secondColumnComponents)
|
||||
])
|
||||
},
|
||||
@@ -193,7 +193,7 @@ Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
|
||||
};
|
||||
classes[this.style()] = true;
|
||||
|
||||
return React.DOM.div({'key':'mainPanel', 'id':'mainPanel', 'className':React.addons.classSet(classes)}, [
|
||||
return React.DOM.div({'key':'mainPanel', 'id':'mainPanel', 'className':Clipperz.PM.UI.Components.classNames(classes)}, [
|
||||
React.DOM.div({'className':'mask', 'onClick':this.handleMaskClick, 'onTouchEnd':this.handleMaskClick}),
|
||||
React.DOM.div({'className':'container'},
|
||||
// this.style() == 'extra-wide' ? this.renderExtraWide() : this.renderOther()
|
||||
@@ -204,3 +204,5 @@ Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
|
||||
|
||||
//=========================================================================
|
||||
});
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.MainPanel = React.createFactory(Clipperz.PM.UI.Components.Panels.MainPanelClass);
|
||||
|
||||
@@ -24,7 +24,7 @@ refer to http://www.clipperz.com.
|
||||
'use strict';
|
||||
Clipperz.Base.module('Clipperz.PM.UI.Components.Panels');
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.SelectionPanel = React.createClass({
|
||||
Clipperz.PM.UI.Components.Panels.SelectionPanelClass = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
selectionPanelStatus: React.PropTypes.oneOf(['OPEN', 'CLOSED']).isRequired
|
||||
@@ -34,7 +34,7 @@ Clipperz.PM.UI.Components.Panels.SelectionPanel = React.createClass({
|
||||
|
||||
render: function () {
|
||||
//console.log("SelectionPanel", this.props);
|
||||
var classes = React.addons.classSet({
|
||||
var classes = Clipperz.PM.UI.Components.classNames({
|
||||
'panel': true,
|
||||
'left': true,
|
||||
'open': this.props['selectionPanelStatus'] == 'OPEN'
|
||||
@@ -47,3 +47,5 @@ Clipperz.PM.UI.Components.Panels.SelectionPanel = React.createClass({
|
||||
|
||||
//=========================================================================
|
||||
});
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.SelectionPanel = React.createFactory(Clipperz.PM.UI.Components.Panels.SelectionPanelClass);
|
||||
|
||||
Reference in New Issue
Block a user