support copy value in task detail page

bower.json

@@ -51,6 +51,7 @@
     "angular-busy": "^4.1.4",
     "angular-promise-buttons": "^0.1.21",
     "angular-dragula": "^1.2.8",
+    "angular-clipboard": "^1.6.2",
     "ngSweetAlert": "^1.1.2"
   },
   "resolutions": {

src/index.html

@@ -327,6 +327,7 @@
 <script src="../bower_components/angular-busy/dist/angular-busy.min.js"></script>
 <script src="../bower_components/angular-promise-buttons/dist/angular-promise-buttons.min.js"></script>
 <script src="../bower_components/angular-dragula/dist/angular-dragula.min.js"></script>
+<script src="../bower_components/angular-clipboard/angular-clipboard.js"></script>
 <script src="../bower_components/ngSweetAlert/SweetAlert.js"></script>
 <!-- endbuild -->
 <!-- build:js js/aria-ng.min.js -->

src/langs/zh_Hans.txt

@@ -87,6 +87,7 @@ Seed Creation Time=种子创建时间
 Download Url=下载地址
 Download Dir=下载路径
 BT Tracker Servers=BT 服务器
+Copy=复制
 (Choose Files)=(选择文件)
 Videos=视频
 Audios=音频

src/langs/zh_Hant.txt

@@ -87,6 +87,7 @@ Seed Creation Time=種子創建時間
 Download Url=下載地址
 Download Dir=下載路徑
 BT Tracker Servers=BT 伺服器
+Copy=複製
 (Choose Files)=(選擇文件)
 Videos=視頻
 Audios=音頻

src/scripts/config/defaultLanguage.js

@@ -91,6 +91,7 @@
             'Download Url': 'Download Url',
             'Download Dir': 'Download Dir',
             'BT Tracker Servers': 'BT Tracker Servers',
+            'Copy': 'Copy',
             '(Choose Files)': '(Choose Files)',
             'Videos': 'Videos',
             'Audios': 'Audios',

src/scripts/controllers/task-detail.js

@@ -1,7 +1,7 @@
 (function () {
     'use strict';
 
-    angular.module('ariaNg').controller('TaskDetailController', ['$rootScope', '$scope', '$routeParams', '$interval', 'aria2RpcErrors', 'ariaNgFileTypes', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgMonitorService', 'aria2TaskService', 'aria2SettingService', function ($rootScope, $scope, $routeParams, $interval, aria2RpcErrors, ariaNgFileTypes, ariaNgCommonService, ariaNgSettingService, ariaNgMonitorService, aria2TaskService, aria2SettingService) {
+    angular.module('ariaNg').controller('TaskDetailController', ['$rootScope', '$scope', '$routeParams', '$interval', 'clipboard', 'aria2RpcErrors', 'ariaNgFileTypes', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgMonitorService', 'aria2TaskService', 'aria2SettingService', function ($rootScope, $scope, $routeParams, $interval, clipboard, aria2RpcErrors, ariaNgFileTypes, ariaNgCommonService, ariaNgSettingService, ariaNgMonitorService, aria2TaskService, aria2SettingService) {
         var tabOrders = ['overview', 'blocks', 'filelist', 'btpeers'];
         var downloadTaskRefreshPromise = null;
         var pauseDownloadTaskRefresh = false;
@@ -325,6 +325,25 @@
             }
         });
 
+        angular.element('#overview-items .row').contextmenu({
+            target:'#task-overview-contextmenu',
+            onItem: function (context, e) {
+                var name = context.find('.setting-key > span').text().trim();
+                var value = "";
+
+                context.find('.setting-value > span').each(function (i, element) {
+                    if (i > 0) {
+                        value += '\n';
+                    }
+
+                    value += angular.element(element).text().trim();
+                });
+
+                var info = name + ': ' + value;
+                clipboard.copyText(info);
+            }
+        });
+
         $rootScope.loadPromise = refreshDownloadTask(false);
     }]);
 }());

src/scripts/core/app.js

@@ -19,6 +19,7 @@
         'cgBusy',
         'angularPromiseButtons',
         'oitozero.ngSweetAlert',
+        'angular-clipboard',
         angularDragula(angular)
     ]);
 }());

src/styles/controls/settings-table.css

@@ -24,6 +24,10 @@
     border-top: inherit;
 }
 
+.settings-table + .settings-table > div.row:first-child {
+    border-top: 1px solid #ddd;
+}
+
 .settings-table .input-group-addon {
     background-color: #eee;
 }
@@ -36,6 +40,7 @@
     color: #888;
     font-size: 12px;
     font-weight: normal;
+    font-style: normal;
 }
 
 .settings-table .description {
@@ -91,6 +96,10 @@
     padding: 4px 8px 4px 8px;
 }
 
+.settings-table .multi-line {
+    display: block;
+}
+
 @media (max-width: 767px) {
     .settings-table .setting-key {
         font-weight: bold;

src/views/task-detail.html

@@ -22,8 +22,8 @@
 
         <div class="tab-content no-padding">
             <div class="tab-pane" ng-class="{'active': context.currentTab == 'overview'}">
-                <div class="settings-table striped hoverable">
+                <div id="overview-items" class="settings-table striped hoverable" data-toggle="context" data-target="#task-overview-contextmenu">
-                    <div class="row" ng-if="task">
+                    <div class="row" ng-show="task">
                         <div class="setting-key col-sm-4">
                             <span translate>Task Name</span>
                         </div>
@@ -32,7 +32,7 @@
                                   ng-tooltip="{{(task.bittorrent && task.bittorrent.comment) ? task.bittorrent.comment : task.taskName}}"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task">
+                    <div class="row" ng-show="task">
                         <div class="setting-key col-sm-4">
                             <span translate>Task Size</span>
                         </div>
@@ -43,7 +43,7 @@
                             </a>
                         </div>
                     </div>
-                    <div class="row" ng-if="task">
+                    <div class="row" ng-show="task">
                         <div class="setting-key col-sm-4">
                             <span translate>Task Status</span>
                         </div>
@@ -53,7 +53,7 @@
                                   ng-tooltip="{{task.errorMessage}}" ng-tooltip-container="body" ng-tooltip-placement="top"></i>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.status == 'error' && task.errorDescription">
+                    <div class="row" ng-show="task && task.status == 'error' && task.errorDescription">
                         <div class="setting-key col-sm-4">
                             <span translate>Error Description</span>
                         </div>
@@ -61,7 +61,7 @@
                             <span ng-bind="task.errorDescription | translate"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task">
+                    <div class="row" ng-show="task">
                         <div class="setting-key col-sm-4">
                             <span ng-bind="('Progress' | translate) + (task.status == 'active' && task.bittorrent ? ' (' + ('Health Percentage' | translate) + ')' : '')"></span>
                         </div>
@@ -69,7 +69,7 @@
                             <span ng-bind="(task.completePercent | percent: 2) + '%' + (task.status == 'active' && task.bittorrent ? ' (' + (context.healthPercent | percent: 2) + '%' + ')' : '')"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task">
+                    <div class="row" ng-show="task">
                         <div class="setting-key col-sm-4">
                             <span translate>Download</span>
                         </div>
@@ -77,7 +77,7 @@
                             <span ng-bind="(task.completedLength | readableVolume) + (task.status == 'active' ? ' @ ' + (task.downloadSpeed | readableVolume) + '/s' : '')"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.bittorrent">
+                    <div class="row" ng-show="task && task.bittorrent">
                         <div class="setting-key col-sm-4">
                             <span translate>Upload</span>
                         </div>
@@ -85,7 +85,7 @@
                             <span ng-bind="(task.uploadLength | readableVolume) + (task.status == 'active' ? ' @ ' + (task.uploadSpeed | readableVolume) + '/s' : '')"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.bittorrent">
+                    <div class="row" ng-show="task && task.bittorrent">
                         <div class="setting-key col-sm-4">
                             <span translate>Share Ratio</span>
                         </div>
@@ -93,7 +93,7 @@
                             <span ng-bind="(task.shareRatio | number: 2)"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.status == 'active' && task.completedLength < task.totalLength">
+                    <div class="row" ng-show="task && task.status == 'active' && task.completedLength < task.totalLength">
                         <div class="setting-key col-sm-4">
                             <span translate>Remain Time</span>
                         </div>
@@ -101,7 +101,7 @@
                             <span ng-bind="0 <= task.remainTime && task.remainTime < 86400? (task.remainTime | dateDuration: 'second': 'HH:mm:ss') : ('More Than One Day' | translate)"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.status == 'active'">
+                    <div class="row" ng-show="task && task.status == 'active'">
                         <div class="setting-key col-sm-4">
                             <span ng-bind="(task.bittorrent ? ('Seeders' | translate) + ' / ' : '') + ('Connections' | translate)">Connections</span>
                         </div>
@@ -109,7 +109,7 @@
                             <span ng-bind="(task.numSeeders ? (task.numSeeders + ' / ') : '') + task.connections"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.bittorrent && task.bittorrent.creationDate">
+                    <div class="row" ng-show="task && task.bittorrent && task.bittorrent.creationDate">
                         <div class="setting-key col-sm-4">
                             <span translate>Seed Creation Time</span>
                         </div>
@@ -117,7 +117,7 @@
                             <span ng-bind="task.bittorrent.creationDate | amFromUnix | longDate"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.infoHash">
+                    <div class="row" ng-show="task && task.infoHash">
                         <div class="setting-key col-sm-4">
                             <span translate>Info Hash</span>
                         </div>
@@ -125,7 +125,7 @@
                             <span class="allow-word-break" ng-bind="task.infoHash"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.singleUrl">
+                    <div class="row" ng-show="task && task.singleUrl">
                         <div class="setting-key col-sm-4">
                             <span translate>Download Url</span>
                         </div>
@@ -133,7 +133,7 @@
                             <span class="allow-word-break" ng-bind="task.singleUrl"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task">
+                    <div class="row" ng-show="task">
                         <div class="setting-key col-sm-4">
                             <span translate>Download Dir</span>
                         </div>
@@ -141,20 +141,22 @@
                             <span class="allow-word-break" ng-bind="task.dir"></span>
                         </div>
                     </div>
-                    <div class="row" ng-if="task && task.bittorrent && task.bittorrent.announceList && task.bittorrent.announceList.length > 0">
+                    <div class="row" ng-show="task && task.bittorrent && task.bittorrent.announceList && task.bittorrent.announceList.length > 0">
                         <div class="setting-key col-sm-4">
                             <span translate>BT Tracker Servers</span>
-                            <span class="description-inline" ng-bind="'format.settings.total-count' | translate: {count: task.bittorrent.announceList.length}"></span>
+                            <em class="description-inline" ng-bind="'format.settings.total-count' | translate: {count: task.bittorrent.announceList.length}"></em>
                             <i class="icon-expand pointer-cursor fa" ng-if="task.bittorrent.announceList.length > 1"
                                ng-class="{'fa-plus': context.collapseTrackers, 'fa-minus': !context.collapseTrackers}"
                                ng-click="context.collapseTrackers = !context.collapseTrackers"
                                title="{{(context.collapseTrackers ? 'Expand' : 'Collapse') | translate}}"></i>
                         </div>
                         <div class="setting-value col-sm-8">
-                            <div class="auto-ellipsis" ng-bind="serverAddress.length ? serverAddress.join(',') : serverAddress" title="{{serverAddress.length ? serverAddress.join(',') : serverAddress}}"
+                            <span class="multi-line auto-ellipsis" ng-bind="serverAddress.length ? serverAddress.join(',') : serverAddress" title="{{serverAddress.length ? serverAddress.join(',') : serverAddress}}"
-                                 ng-repeat="serverAddress in task.bittorrent.announceList | limitTo: (context.collapseTrackers ? 1 : task.bittorrent.announceList.length)"></div>
+                                 ng-repeat="serverAddress in task.bittorrent.announceList | limitTo: (context.collapseTrackers ? 1 : task.bittorrent.announceList.length)"></span>
                         </div>
                     </div>
+                </div>
+                <div class="settings-table">
                     <div class="row no-hover no-background" ng-if="context.isEnableSpeedChart && task && task.status == 'active'">
                         <div class="col-sm-12">
                             <div class="task-status-chart-wrapper">
@@ -337,4 +339,14 @@
             </div>
         </div>
     </div><!-- /.nav-tabs-custom -->
+    <div id="task-overview-contextmenu">
+        <ul class="dropdown-menu" role="menu">
+            <li>
+                <a id="mnu-overview-copy" tabindex="-1" class="mnu-copy pointer-cursor" title="{{'Copy' | translate}}" data-clipboard-text="1">
+                    <i class="fa fa-copy"></i>
+                    <span translate>Copy</span>
+                </a>
+            </li>
+        </ul>
+    </div>
 </section>