Added automatic copying of field values to clipboard

frontend/delta/html/index_template.html

@@ -85,6 +85,7 @@ Clipperz_normalizedNewLine = '\x0d\x0a';
 	</div>
 	<span class="icon done"   style="display:none">done</span>
 	<span class="icon failed" style="display:none">failed</span>
+	<span class="icon custom" style="display:none"></span>
 	<span class="progressBar" style="display:none"><span class="progress"></span></span>
 	<span class="title">loading</span>
 	<div class="mask hidden"></div>
@@ -100,11 +101,11 @@ Clipperz_normalizedNewLine = '\x0d\x0a';
 </script>
 
 
-<!-- div class="testBlock">
+<div class="testBlock">
 	<script>
 		Clipperz.Crypto.PRNG.defaultRandomGenerator().fastEntropyAccumulationForTestingPurpose();
 	</script>
-<!- - - ->
+<!-- -->
 	<script type="text/javascript" src="./js/TestData/User.data.js" charset="utf-8"></script>
 	<script>
 		var	dataStore = new Clipperz.PM.Proxy.Offline.DataStore({
@@ -120,12 +121,12 @@ Clipperz_normalizedNewLine = '\x0d\x0a';
 	<script>
 		NETWORK = npm.bitcoin.networks.testnet;
 	</script>
-<!- - - ->
+<!-- -->
 	<script>
 		//	Live Reload hoock
 		document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')
 	</script>
-</div -->
+</div>
 
 </body>
 </html>

frontend/delta/js/Clipperz/PM/UI/Components/Cards/View.js

@@ -306,6 +306,33 @@ Clipperz.PM.UI.Components.Cards.ViewClass = React.createClass({
 		return result;
 	},
 
+	onClickOnFieldValue: function (event) {
+		var	succeeded;
+		var	element;
+
+		element = event.target;
+
+//		event.target.focus();
+//		event.target.select();
+//		event.target.selectionStart = 0;
+//		event.target.selectionEnd = event.target.value.length;
+//		event.stopPropagation();
+//		event.preventDefault();
+
+		element.focus();
+		element.setSelectionRange(0, element.value.length);
+		event.stopPropagation();
+		event.preventDefault();
+
+//		selectedText = element.value;
+
+		succeeded = document.execCommand('copy');
+		if (succeeded === true) {
+			window.getSelection().removeAllRanges();
+			MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'copyFieldValueFeedback');
+		}
+	},
+
 	//............................................................................
 
 	renderField: function (aField) {
@@ -331,10 +358,10 @@ Clipperz.PM.UI.Components.Cards.ViewClass = React.createClass({
 			React.DOM.div({'className':'fieldValues'}, [
 				React.DOM.div({'className':'fieldLabel'}, aField['label']),
 				Clipperz.PM.UI.Components.Cards.TextArea({
-//				React.DOM.textarea({
 					'readOnly': true,
 					// 'onMouseUp': function(e) { e.target.focus(); e.target.select(); e.stopPropagation(); e.preventDefault();},
-					'onClick': function(e) { e.target.focus(); e.target.select(); e.target.selectionStart = 0; e.target.selectionEnd = e.target.value.length; e.stopPropagation(); e.preventDefault(); },
+//					'onClick': function(e) { e.target.focus(); e.target.select(); e.target.selectionStart = 0; e.target.selectionEnd = e.target.value.length; e.stopPropagation(); e.preventDefault(); },
+					'onClick': this.onClickOnFieldValue,
 					'className':Clipperz.PM.UI.Components.classNames(cardFieldValueClasses),
 					'value': aField['value'],
 					'rows': 1

frontend/delta/js/Clipperz/PM/UI/Components/Overlay.js

@@ -88,6 +88,17 @@ Clipperz.Base.extend(Clipperz.PM.UI.Components.Overlay, Object, {
 		this.completed(this.showDoneIcon, aMessage, aDelayBeforeHiding);
 	},
 	
+	'setCustomResultIcon': function (anIcon) {
+		this.getElement('custom').innerHTML = anIcon;
+		MochiKit.Style.showElement(this.getElement('custom'));
+	},
+
+	'customResult': function (anIcon, aMessage, aDelayBeforeHiding) {
+		this.hideMask();
+		this.hideProgressBar();
+		this.completed(MochiKit.Base.method(this, 'setCustomResultIcon', anIcon), aMessage, aDelayBeforeHiding);
+	},
+	
 	'failed': function (aMessage, aDelayBeforeHiding) {
 		this.completed(this.showFailIcon, aMessage, aDelayBeforeHiding);
 	},
@@ -139,10 +150,20 @@ Clipperz.Base.extend(Clipperz.PM.UI.Components.Overlay, Object, {
 	'hide': function (withoutAnimationTime) {
 		var secondsBeforeHiding = withoutAnimationTime ? 0 : 1;
 		var element = this.element();
+
+//		this.getElement('custom').innerHTML = '';
+//		MochiKit.Style.hideElement(this.getElement('custom'));
+
 		this.hideProgressBar();
 		MochiKit.DOM.removeElementClass(element, 'ios-overlay-show');
 		MochiKit.DOM.addElementClass(element, 'ios-overlay-hide');
-		return MochiKit.Async.callLater(secondsBeforeHiding, MochiKit.Style.hideElement, element);
+//		return MochiKit.Async.callLater(secondsBeforeHiding, MochiKit.Style.hideElement, element);
+		return MochiKit.Async.callLater(secondsBeforeHiding, MochiKit.Base.method(this, 'hideElement'));
+	},
+
+	'hideElement': function () {
+		this.getElement('custom').innerHTML = '';
+		MochiKit.Style.hideElement(this.element())
 	},
 
 	'hideSpinner': function () {

frontend/delta/js/Clipperz/PM/UI/MainController.js

@@ -83,7 +83,7 @@ Clipperz.PM.UI.MainController = function() {
 		'matchMediaQuery', 'unmatchMediaQuery',
 		'selectAllCards', 'selectRecentCards', 'selectCardsWithCertificate', 'selectCardsWithAttachments', 'selectUntaggedCards', 'tagSelected', 'search',
 		'refreshCardEditDetail',
-		'saveCardEdits', 'cancelCardEdits',
+		'saveCardEdits', 'cancelCardEdits', 'copyFieldValueFeedback',
 		'selectCard',
 		'addCardClick',
 		'deleteCard', 'toggleArchiveCard', 'cloneCard', 'editCard',	//	'createCertificate',
@@ -2620,6 +2620,13 @@ console.log("showCertificateCard_handler");
 		return deferredResult;
 	},
 
+	copyFieldValueFeedback_handler: function () {
+//		this.overlay().show("copy", true);
+//		MochiKit.Async.callLater(0.5, MochiKit.Base.method(this.overlay(), 'hide', true));
+		this.overlay().show("copying …", true);
+		this.overlay().customResult('copy', "copied", 0.5);
+	},
+
 	uploadMessageCallback: function (someArguments, aProgressCallback) {
 		var deferredResult;
 

frontend/delta/scss/core/overlay.scss

@@ -101,6 +101,10 @@ div.overlay {
 		font-size: 96pt;
 		color: white;
 		text-shadow: none;
+		
+		&.custom {
+			font-size: 80pt;
+		}
 	}
 
 	&.ios-overlay-show {

frontend/delta/scss/style/card.scss

@@ -436,6 +436,7 @@ $cardViewBasePadding: 10px;
 //				line-height: 1em;
 //				height: 1.3em;
 				outline: none;
+				cursor: pointer;
 			}
 		}
 	}