diff --git a/guacamole/src/main/webapp/app/client/controllers/clientController.js b/guacamole/src/main/webapp/app/client/controllers/clientController.js index a788cdccf..eb0dc795b 100644 --- a/guacamole/src/main/webapp/app/client/controllers/clientController.js +++ b/guacamole/src/main/webapp/app/client/controllers/clientController.js @@ -505,60 +505,6 @@ angular.module('client').controller('clientController', ['$scope', '$routeParams }; - /** - * Returns a progress object, as required by $scope.addNotification(), which - * contains the given number of bytes as an appropriate combination of - * progress value and associated unit. - * - * @param {String} text - * The translation string to associate with the progress object - * returned. - * - * @param {Number} bytes The number of bytes. - * @param {Number} [length] The file length, in bytes, if known. - * - * @returns {Object} - * A progress object, as required by $scope.addNotification(). - */ - var getFileProgress = function getFileProgress(text, bytes, length) { - - // Gigabytes - if (bytes > 1000000000) - return { - text : text, - value : (bytes / 1000000000).toFixed(1), - ratio : bytes / length, - unit : "gb" - }; - - // Megabytes - if (bytes > 1000000) - return { - text : text, - value : (bytes / 1000000).toFixed(1), - ratio : bytes / length, - unit : "mb" - }; - - // Kilobytes - if (bytes > 1000) - return { - text : text, - value : (bytes / 1000).toFixed(1), - ratio : bytes / length, - unit : "kb" - }; - - // Bytes - return { - text : text, - value : bytes, - ratio : bytes / length, - unit : "b" - }; - - }; - // Clean up when view destroyed $scope.$on('$destroy', function clientViewDestroyed() { diff --git a/guacamole/src/main/webapp/app/client/directives/guacFileTransfer.js b/guacamole/src/main/webapp/app/client/directives/guacFileTransfer.js index 87b7ae949..aad794844 100644 --- a/guacamole/src/main/webapp/app/client/directives/guacFileTransfer.js +++ b/guacamole/src/main/webapp/app/client/directives/guacFileTransfer.js @@ -43,9 +43,118 @@ angular.module('client').directive('guacFileTransfer', [function guacFileTransfe templateUrl: 'app/client/templates/guacFileTransfer.html', controller: ['$scope', '$injector', function guacFileTransferController($scope, $injector) { - /* STUB */ + // Required types + var ManagedFileTransferState = $injector.get('ManagedFileTransferState'); - }] + /** + * Returns the unit string that is most appropriate for the + * number of bytes transferred thus far - either 'gb', 'mb', 'kb', + * or 'b'. + * + * @returns {String} + * The unit string that is most appropriate for the number of + * bytes transferred thus far. + */ + $scope.getProgressUnit = function getProgressUnit() { + + var bytes = $scope.transfer.progress; + + // Gigabytes + if (bytes > 1000000000) + return 'gb'; + + // Megabytes + if (bytes > 1000000) + return 'mb'; + + // Kilobytes + if (bytes > 1000) + return 'kb'; + + // Bytes + return 'b'; + + }; + + /** + * Returns the amount of data transferred thus far, in the units + * returned by getProgressUnit(). + * + * @returns {Number} + * The amount of data transferred thus far, in the units + * returned by getProgressUnit(). + */ + $scope.getProgressValue = function getProgressValue() { + + var bytes = $scope.transfer.progress; + if (!bytes) + return bytes; + + // Convert bytes to necessary units + switch ($scope.getProgressUnit()) { + + // Gigabytes + case 'gb': + return (bytes / 1000000000).toFixed(1); + + // Megabytes + case 'mb': + return (bytes / 1000000).toFixed(1); + + // Kilobytes + case 'kb': + return (bytes / 1000).toFixed(1); + + // Bytes + case 'b': + default: + return bytes; + + } + + }; + + /** + * Returns the percentage of bytes transferred thus far, if the + * overall length of the file is known. + * + * @returns {Number} + * The percentage of bytes transferred thus far, if the + * overall length of the file is known. + */ + $scope.getPercentDone = function getPercentDone() { + return $scope.transfer.progress / $scope.transfer.length * 100; + }; + + /** + * Determines whether the associated file transfer is in progress. + * + * @returns {Boolean} + * true if the file transfer is in progress, false othherwise. + */ + $scope.isInProgress = function isInProgress() { + + // Not in progress if there is no transfer + if (!$scope.transfer) + return false; + + // Determine in-progress status based on stream state + switch ($scope.transfer.transferState.streamState) { + + // IDLE or OPEN file transfers are active + case ManagedFileTransferState.StreamState.IDLE: + case ManagedFileTransferState.StreamState.OPEN: + return true; + + // All others are not active + default: + return false; + + } + + }; + + }] // end file transfer controller }; }]); diff --git a/guacamole/src/main/webapp/app/client/styles/transfer.css b/guacamole/src/main/webapp/app/client/styles/transfer.css index d69df0d4e..a903e234e 100644 --- a/guacamole/src/main/webapp/app/client/styles/transfer.css +++ b/guacamole/src/main/webapp/app/client/styles/transfer.css @@ -53,7 +53,23 @@ .transfer .progress { width: 100%; - background: #C2C2C2 url('images/progress.png'); + background: #C2C2C2; + padding: 0.25em; + + border: 1px solid gray; + + position: absolute; + top: 0; + left: 0; + bottom: 0; + opacity: 0.25; + +} + +.transfer.in-progress .progress { + + background-image: url('images/progress.png'); + background-size: 16px 16px; -moz-background-size: 16px 16px; -webkit-background-size: 16px 16px; @@ -69,16 +85,6 @@ -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; - padding: 0.25em; - - border: 1px solid gray; - - position: absolute; - top: 0; - left: 0; - bottom: 0; - opacity: 0.25; - } .transfer .progress .bar { diff --git a/guacamole/src/main/webapp/app/client/templates/guacFileTransfer.html b/guacamole/src/main/webapp/app/client/templates/guacFileTransfer.html index 89a1e76a0..170753cbc 100644 --- a/guacamole/src/main/webapp/app/client/templates/guacFileTransfer.html +++ b/guacamole/src/main/webapp/app/client/templates/guacFileTransfer.html @@ -1,4 +1,4 @@ -
+
-
{{transfer.progress}}
+
{{'CLIENT.TEXT_FILE_TRANSFER_PROGRESS' | translate:'{PROGRESS: getProgressValue(), UNIT: getProgressUnit()}'}}
-
+