From 2cbb1610a17a4bf9c7727c50ceb7b2bcae1758e2 Mon Sep 17 00:00:00 2001
From: Kane York <rikingcoding@gmail.com>
Date: Tue, 14 Jul 2015 19:26:11 -0700
Subject: [PATCH] FEATURE: Automatically copy the share link

---
 .../javascripts/discourse/templates/share.hbs |  1 +
 .../javascripts/discourse/views/share.js.es6  | 26 +++++++++++++++++--
 .../stylesheets/common/base/share_link.scss   | 12 +++++++++
 config/locales/client.en.yml                  |  1 +
 4 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/discourse/templates/share.hbs b/app/assets/javascripts/discourse/templates/share.hbs
index 019da994781..cdc48cfb581 100644
--- a/app/assets/javascripts/discourse/templates/share.hbs
+++ b/app/assets/javascripts/discourse/templates/share.hbs
@@ -1,5 +1,6 @@
 {{#if controller.link}}
   <h3>{{view.title}}</h3>
+  <span class="copy-text {{if copied "success"}}">{{i18n 'share.copied'}}</span>
 
   {{#if date}}
     <span class="date">{{displayDate}}</span>
diff --git a/app/assets/javascripts/discourse/views/share.js.es6 b/app/assets/javascripts/discourse/views/share.js.es6
index 8d9db1dc57a..ab052c2c5c2 100644
--- a/app/assets/javascripts/discourse/views/share.js.es6
+++ b/app/assets/javascripts/discourse/views/share.js.es6
@@ -18,13 +18,34 @@ export default Discourse.View.extend({
     return null;
   }.property('controller.link'),
 
+  copyLink($element) {
+    const element = $element[0];
+    try {
+      if (document.queryCommandSupported('copy')) {
+        let newRange = document.createRange();
+        newRange.selectNode(element);
+        const selection = window.getSelection();
+        selection.removeAllRanges();
+        selection.addRange(newRange);
+
+        if (document.execCommand("copy")) {
+          this.set('controller.copied', true);
+        }
+      }
+    } catch (e) {
+      // Ignore
+    }
+  },
+
   linkChanged: function() {
-    var self=this;
+    const self = this;
+    this.set('controller.copied', false);
     if (this.present('controller.link')) {
-      Em.run.next(function(){
+      Em.run.next(function() {
         if (!self.capabilities.touch) {
           var $linkInput = $('#share-link input');
           $linkInput.val(self.get('controller.link'));
+          self.copyLink($linkInput);
 
           // Wait for the fade-in transition to finish before selecting the link:
           window.setTimeout(function() {
@@ -34,6 +55,7 @@ export default Discourse.View.extend({
           var $linkForTouch = $('#share-link .share-for-touch a');
           $linkForTouch.attr('href',self.get('controller.link'));
           $linkForTouch.html(self.get('controller.link'));
+          self.copyLink($linkForTouch);
         }
       });
     }
diff --git a/app/assets/stylesheets/common/base/share_link.scss b/app/assets/stylesheets/common/base/share_link.scss
index 15ee61bcbe5..49f56f747e0 100644
--- a/app/assets/stylesheets/common/base/share_link.scss
+++ b/app/assets/stylesheets/common/base/share_link.scss
@@ -24,6 +24,18 @@
   h3 {
     font-size: 0.929em;
   }
+  .copy-text {
+    display: inline-block;
+    position: absolute;
+    margin: 5px 5px 5px 15px;
+    color: $success;
+    opacity: 1;
+    transition: opacity 0.25s;
+    font-size: 13px;
+    &:not(.success) {
+      opacity: 0;
+    }
+  }
   .social-link {
     margin-left: 2px;
     margin-right: 8px;
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index e25a7b2b95a..04ebf7d7e3d 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -114,6 +114,7 @@ en:
       topic: 'share a link to this topic'
       post: 'post #%{postNumber}'
       close: 'close'
+      copied: 'copied to clipboard'
       twitter: 'share this link on Twitter'
       facebook: 'share this link on Facebook'
       google+: 'share this link on Google+'