Implemented icon for copy to clipboard in join, address book, transactions and addresses.

css/main.css

@@ -1026,4 +1026,28 @@ a.text-white:hover {color: #ccc;}
   text-align: left;
 }
 
+/**** Copy to clipboard ****/
+
+.btn-copy {
+  color: #9b9b9b;
+  display: inline-block;
+  height: 16px;
+  width: 16px;
+  outline: none;
+  vertical-align: sub;
+  background: transparent url('../img/icons/copy.png') center center no-repeat;
+}
+
+.btn-copied {
+  display: inline-block;
+  width: auto;
+  color: #16A085; 
+  font-weight: bold; 
+  font-size: 11px; 
+}
+
+.btn-copy.zeroclipboard-is-hover { color: #000; }
+.btn-copy.zeroclipboard-is-active { opacity: 1; }
+
+
 /*-----------------------------------------------------------------*/

css/mobile.css

@@ -115,5 +115,10 @@
     float: none;
     margin: 0 auto;
   }
+
+  .btn-copy {
+    display: none;
+  }
+
 }
 

views/copayers.html

@@ -11,7 +11,10 @@
           <h3>Share this secret with your other copayers</h3>
           <div class="panel">
             <qrcode size="250" data="{{$root.wallet.getSecret()}}"></qrcode>
-            <div class="secret text-gray size-14">{{$root.wallet.getSecret()}}</div>
+            <div class="secret text-gray size-14">
+              {{$root.wallet.getSecret()}} 
+              <span class="btn-copy" clip-copy="$root.wallet.getSecret()"></span>
+            </div>
             <div style="clear:both;"></div>
           </div>
         </div>

views/modals/qr-address.html

@@ -1,6 +1,7 @@
 <div class="text-center">
   <qrcode size="160" data="{{address.address}}"></qrcode>
-  <h4>{{address.address}}</h4>
+  <h4>{{address.address}} <span class="btn-copy" clip-copy="address.address"></span></h4>
+
   <div>
     <span ng-if="$root.updatingBalance">
       <i class="fi-bitcoin-circle icon-rotate spinner"></i>

views/send.html

@@ -123,34 +123,34 @@
       </div>
     </div>
 
-      <div class="large-12 columns line-dashed">
+    <div class="large-12 columns line-dashed">
-        <h2>Address Book</h2>
+      <h2>Address Book</h2>
-        <p class="text-gray" ng-hide="showAddressBook()">Empty. Create an alias for your addresses</p>
+      <p class="text-gray" ng-hide="showAddressBook()">Empty. Create an alias for your addresses</p>
-        <table ng-show="showAddressBook()">
+      <table class="large-12 medium-12 small-12" ng-show="showAddressBook()">
-          <thead>
+        <thead>
-            <tr>
+          <tr>
-              <th>Label</th>
+            <th>Label</th>
-              <th>Address</th>
+            <th>Address</th>
-              <th>Creator</th>
+            <th>Creator</th>
-              <th>Date</th>
+            <th>Date</th>
-              <th>&nbsp;</th>
+            <th>&nbsp;</th>
-            </tr>
-          </thead>
-          <tbody>
-          <tr 
-            ng-repeat="(addr, info) in $root.wallet.addressBook" 
-            ng-class="{'addressbook-disabled': info.hidden}">
-            <td><a ng-click="copyAddress(addr)" title="Copy address">{{info.label}}</a></td>
-            <td width="100" class="ellipsis">{{addr}}</td>
-            <td>{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td>
-            <td><time>{{info.createdTs | amCalendar}}</time></td>
-            <td><a ng-click="toggleAddressBookEntry(addr)">{{info.hidden ?
-                'Enable' : 'Disable'}}</a></td>
           </tr>
-          </tbody>
+        </thead>
-        </table>
+        <tbody>
-        <button class="button tiny primary text-center" ng-click="openAddressBookModal()">Add New Entry</button>
+        <tr 
-      </div>
+          ng-repeat="(addr, info) in $root.wallet.addressBook" 
+          ng-class="{'addressbook-disabled': info.hidden}">
+          <td><a ng-click="copyAddress(addr)" title="Copy address">{{info.label}}</a></td>
+          <td class="ellipsis">{{addr}} <span class="btn-copy" clip-copy="addr"></span></td>
+          <td>{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td>
+          <td><time>{{info.createdTs | amCalendar}}</time></td>
+          <td width="5"><a ng-click="toggleAddressBookEntry(addr)">{{info.hidden ?
+              'Enable' : 'Disable'}}</a></td>
+        </tr>
+        </tbody>
+      </table>
+      <button class="button tiny primary text-center" ng-click="openAddressBookModal()">Add New Entry</button>
+    </div>
   </div>
 </div>
 

views/transactions.html

@@ -123,12 +123,13 @@
         </div>
         <div class="last-transactions" ng-repeat="btx in blockchain_txs | orderBy: 'time':true">
           <div class="last-transactions-header">
-            <div class="large-8 columns">
+            <div class="large-8 medium-7 small-3 columns ellipsis">
-              <a class="ellipsis" href="http://{{getShortNetworkName()}}.insight.is/tx/{{btx.txid}}" target="_blank">
+              <a href="http://{{getShortNetworkName()}}.insight.is/tx/{{btx.txid}}" target="_blank">
-                {{btx.txid}}
+                {{btx.txid}} 
-              </a>
+              </a> 
+              <span class="btn-copy" clip-copy="btx.txid"></span>
             </div>
-            <div class="large-4 columns text-right">
+            <div class="large-4 medium-5 small-9 columns text-right">
               <div data-ng-show="btx.firstSeenTs">
                 first seen at
                 <time>{{btx.firstSeenTs * 1000 | amCalendar}}</time>