Minor UI/UX improvements.

This commit is contained in:
Dario Chiappetta
2015-11-30 11:47:06 +01:00
parent ce0883a7f1
commit 8cc2ad14b2
9 changed files with 113 additions and 28 deletions

View File

@@ -68,7 +68,7 @@ Clipperz.PM.UI.Components.ExtraFeatures.DataExportClass = React.createClass({
React.DOM.h3({}, "Offline copy"),
React.DOM.div({'className':'description'}, [
React.DOM.p({}, "Download a read-only portable version of Clipperz. Very convenient when no Internet connection is available."),
React.DOM.p({}, "An offline copy is just a single HTML file that contains both the whole Clipperz web application and your encrypted data."),
React.DOM.p({}, "An offline copy is just a single HTML file that contains both the whole Clipperz web application and your encrypted data, except file attachments."),
React.DOM.p({}, "It is as secure as the hosted Clipperz service since they both share the same code and security architecture.")
]),
React.DOM.a({'className':'button', 'onClick':this.handleDownloadOfflineCopyLink}, "download offline copy")
@@ -77,7 +77,7 @@ Clipperz.PM.UI.Components.ExtraFeatures.DataExportClass = React.createClass({
React.DOM.h3({}, "HTML + JSON"),
React.DOM.div({'className':'description'}, [
React.DOM.p({}, "Download a printer-friendly HTML file that lists the content of all your cards."),
React.DOM.p({}, "This same file also contains all your data in JSON format."),
React.DOM.p({}, "This same file also contains all your data in JSON format. Please note that file attachments are not included."),
React.DOM.p({'className':'warning'}, "Beware: all data are unencrypted! Therefore make sure to properly store and manage this file.")
]),
React.DOM.a({'className':'button', 'onClick':this.handleExportLink}, "download HTML+JSON")

View File

@@ -41,13 +41,23 @@ Clipperz.PM.UI.Components.ExtraFeatures.DevicePINClass = React.createClass({
//=========================================================================
handleChange: function(anEvent) {
if (anEvent.target.value.length <= this.props['PIN'].DEFAULT_PIN_LENGTH) {
var newValue = anEvent.target.value;
if (!isNaN(newValue) && newValue.length <= this.props['PIN'].DEFAULT_PIN_LENGTH) {
this.setState({
'pinValue': anEvent.target.value
});
}
},
handleSubmit: function(anEvent) {
var isSubmitEnabled = (this.state['pinValue'].length == this.props['PIN'].DEFAULT_PIN_LENGTH);
if (isSubmitEnabled) { this.savePIN(); }
anEvent.preventDefault();
},
setFocus: function() {
this.refs['pinValue'].getDOMNode().focus();
},
@@ -94,7 +104,9 @@ Clipperz.PM.UI.Components.ExtraFeatures.DevicePINClass = React.createClass({
React.DOM.div({'className': 'content'}, [
// React.DOM.p({}, "PIN is "+((this.props['PIN'].isSet()) ? '' : 'not ')+"set on this device"),
React.DOM.p({}, ((this.props['PIN'].isSet()) ? "PIN is set on this device" : "PIN is not set on this device")),
React.DOM.form({},[
React.DOM.form({
'onSubmit': this.handleSubmit,
},[
React.DOM.input({
'type': 'tel',
'key': 'pinValue',