Add clipboard button to public share link

owncloud · Jul 11, 2016 · 728a41e · 728a41e
1 parent 48f8a9f
commit 728a41e
Show file tree

Hide file tree

Showing 9 changed files with 777 additions and 6 deletions.
diff --git a/apps/files_sharing/css/sharetabview.css b/apps/files_sharing/css/sharetabview.css
@@ -10,8 +10,9 @@
 	top: 2px;
 }
 
-.shareTabView .shareWithRemoteInfo {
-	padding: 11px 20px;
+.shareTabView .shareWithRemoteInfo,
+.shareTabView .clipboardButton {
+	padding-left: 10px;
 }
 
 .shareTabView label {
@@ -28,7 +29,8 @@
 	width: 94%;
 	margin-left: 0;
 }
-.shareTabView input[type="text"].shareWithField {
+.shareTabView input[type="text"].shareWithField,
+.shareTabView input[type="text"].linkText {
 	width: 80%;
 }
 

diff --git a/bower.json b/bower.json
@@ -30,6 +30,7 @@
     "backbone": "~1.2.3",
     "davclient.js": "https://github.com/evert/davclient.js.git",
     "es6-promise": "https://github.com/jakearchibald/es6-promise.git#~2.3.0",
-    "base64": "~0.3.0"
+    "base64": "~0.3.0",
+    "clipboard": "^1.5.12"
   }
 }
diff --git a/core/css/icons.css b/core/css/icons.css
@@ -368,3 +368,7 @@ img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading-
 .icon-picture {
 	background-image: url('../img/places/picture.svg');
 }
+
+.icon-clippy {
+	background-image: url('../img/actions/clippy.svg');
+}
diff --git a/core/img/actions/clippy.svg b/core/img/actions/clippy.svg
diff --git a/core/js/core.json b/core/js/core.json
@@ -10,7 +10,8 @@
 		"bootstrap/js/tooltip.js",
 		"backbone/backbone.js",
 		"es6-promise/dist/es6-promise.js",
-		"davclient.js/lib/client.js"
+		"davclient.js/lib/client.js",
+		"clipboard/dist/clipboard.js"
 	],
 	"libraries": [
 		"jquery-showpassword.js",

diff --git a/core/js/sharedialoglinkshareview.js b/core/js/sharedialoglinkshareview.js
@@ -22,8 +22,11 @@
 			'<input type="checkbox" name="linkCheckbox" id="linkCheckbox-{{cid}}" class="checkbox linkCheckbox" value="1" {{#if isLinkShare}}checked="checked"{{/if}} />' +
 			'<label for="linkCheckbox-{{cid}}">{{linkShareLabel}}</label>' +
 			'<br />' +
+			'<div class="oneline">' +
 			'<label for="linkText-{{cid}}" class="hidden-visually">{{urlLabel}}</label>' +
 			'<input id="linkText-{{cid}}" class="linkText {{#unless isLinkShare}}hidden{{/unless}}" type="text" readonly="readonly" value="{{shareLinkURL}}" />' +
+			'<a class="{{#unless isLinkShare}}hidden-visually{{/unless}} clipboardButton icon icon-clippy" data-clipboard-target="#linkText-{{cid}}"></a>' +
+			'</div>' +
 			'    {{#if publicUpload}}' +
 			'<div id="allowPublicUploadWrapper">' +
 			'    <span class="icon-loading-small hidden"></span>' +
@@ -112,6 +115,17 @@
 				'onShowPasswordClick',
 				'onAllowPublicUploadChange'
 			);
+
+			var clipboard = new Clipboard('.clipboardButton');
+			clipboard.on('success', function(e) {
+				$input = $(e.trigger);
+				$input.tooltip({placement: 'bottom', trigger: 'manual', title: t('core', 'Copied!')});
+				$input.tooltip('show');
+				_.delay(function() {
+					$input.tooltip('hide');
+				}, 3000);
+			});
+
 		},
 
 		onLinkCheckBoxChange: function() {

diff --git a/core/js/sharedialogview.js b/core/js/sharedialogview.js
@@ -30,7 +30,7 @@
 		'<div class="loading hidden" style="height: 50px"></div>';
 
 	var TEMPLATE_REMOTE_SHARE_INFO =
-		'<a target="_blank" class="icon-info shareWithRemoteInfo hasTooltip" href="{{docLink}}" ' +
+		'<a target="_blank" class="icon icon-info shareWithRemoteInfo hasTooltip" href="{{docLink}}" ' +
 		'title="{{tooltip}}"></a>';
 
 	/**

diff --git a/core/vendor/.gitignore b/core/vendor/.gitignore
@@ -137,3 +137,7 @@ es6-promise/dist/*
 
 # base64
 base64/*min.js
+
+# clipboard
+clipboard/**
+!clipboard/dist/clipboard.js