feat(portfolio): add asset's attributes display

Fixed some bugs on loading assets balance

Gruntfile.js

@@ -154,6 +154,7 @@ module.exports = function (grunt) {
 
                         'src/js/portfolio/portfolio.module.js',
                         'src/js/portfolio/asset.list.controller.js',
+                        'src/js/portfolio/asset.filter.js',
 
                         'src/js/**/*.spec.js'
                     ]

src/index.html

@@ -454,13 +454,14 @@ <h1>PORTFOLIO</h1>
                                 <tr ng-switch-when="0">
                                     <td colspan="5">You do not own or issued any assets</td>
                                 </tr>
-                                <tr ng-switch-default>
-                                    <td></td>
-                                    <td></td>
-                                    <td></td>
-                                    <td></td>
+                                <tr ng-switch-default ng-repeat="tx in assetList.assets | orderBy:'timestamp':true | asset track by tx.id">
+                                    <td>{{tx.name}}</td>
+                                    <td ng-if="!tx.formatted.isSenderCopiable">{{tx.formatted.sender}}</td>
+                                    <td ng-if="tx.formatted.isSenderCopiable"><span class="clipSpan" tooltipster tooltip-theme="tooltipster-theme1" ngclipboard data-clipboard-text="{{tx.formatted.sender}}" title="Copy this address to the clipboard." ngclipboard-success="clipboardOk()">{{tx.formatted.sender}}</span></td>
+                                    <td>{{tx.reissuable}}</td>
+                                    <td>{{tx.balance}}</td>
                                     <td>
-                                        <button>Send</button><span class="divider-2"></span>
+                                        <button>Transfer</button><span class="divider-2"></span>
                                         <button>Reissue</button><span class="divider-2"></span>
                                         <button>Details</button>
                                     </td>
@@ -579,7 +580,7 @@ <h1>ASSET CREATION</h1>
                                     </tr>
                                     <tr>
                                         <td>Fee</td>
-                                        <td>1,000 WAVES</td>
+                                        <td>{{::ctrl.asset.fee.formatAmount(true)}} WAVES</td>
                                     </tr>
                                 </tbody>
                             </table>
@@ -590,7 +591,7 @@ <h1>ASSET CREATION</h1>
 
                         <div id="create-asset-confirmation" waves-dialog ok-button-caption="CONFIRM" ok-button-enabled="!ctrl.confirm.pendingIssuance" on-dialog-ok="ctrl.broadcastIssueTransaction()">
                             <p>You are creating a <span class="confirmation-value">{{ctrl.confirm.reissuable}}</span> asset named
-                                <span class="confirmation-value">{{ctrl.confirm.name}}</span> with
+                                <span class="confirmation-value">{{ctrl.confirm.name}}</span><br/> with
                                 <span class="confirmation-value">{{ctrl.confirm.totalTokens}}</span> of total tokens amount
                             </p>
                             <p>Please <span class="fontBold"> CONFIRM </span>to execute or <span class="fontBold"> CANCEL </span> to discard.</p>
@@ -763,6 +764,7 @@ <h2>LATEST BLOCKS INFORMATION</h2>
 
     <script src="js/portfolio/portfolio.module.js"></script>
     <script src="js/portfolio/asset.list.controller.js"></script>
+    <script src="js/portfolio/asset.filter.js"></script>
 
     <script src="js/style.js"></script>
 </body>

src/js/application.context.factory.js

@@ -7,17 +7,18 @@
 
         assets.put = function (issueTransaction) {
             var currency = new Currency({
-                id: transaction.assetId,
-                displayName: transaction.name,
-                precision: transaction.decimals
+                id: issueTransaction.assetId,
+                displayName: issueTransaction.name,
+                precision: issueTransaction.decimals
             });
             var balance = new Money(0, currency);
             var asset = {
                 currency: currency,
-                description: transaction.description,
-                reissuable: transaction.reissuable,
-                timestamp: transaction.timestamp,
-                totalTokens: Money.fromCoins(transaction.quantity, currency),
+                description: issueTransaction.description,
+                reissuable: issueTransaction.reissuable,
+                timestamp: issueTransaction.timestamp,
+                sender: issueTransaction.sender,
+                totalTokens: Money.fromCoins(issueTransaction.quantity, currency)
             };
 
             if (angular.isDefined(assets[currency.id]))

src/js/portfolio/asset.filter.js

@@ -0,0 +1,34 @@
+(function () {
+    'use strict';
+
+    function AssetFilter(applicationContext, addressService) {
+        function transformAddress (rawAddress) {
+            var result = angular.isDefined(rawAddress) ? rawAddress : 'none';
+
+            if (result === applicationContext.account.address)
+                result = 'You';
+
+            return result;
+        }
+
+        function formatAsset (transaction) {
+            transaction.formatted = {
+                sender: transformAddress(transaction.sender)
+            };
+
+            transaction.formatted.isSenderCopiable = addressService.validateAddress(transaction.formatted.sender);
+
+            return transaction;
+        }
+
+        return function filterInput (input) {
+            return _.map(input, formatAsset);
+        };
+    }
+
+    AssetFilter.$inject = ['applicationContext', 'addressService'];
+
+    angular
+        .module('app.portfolio')
+        .filter('asset', AssetFilter);
+})();

src/js/portfolio/asset.list.controller.js

@@ -30,13 +30,15 @@
             if (angular.isUndefined(applicationContext.cache.assets[asset.id]))
                 return false;
 
-            var cached = applicationContext.cache.assets[id];
-            cached.balance = new Money(assetBalance.balance, cached.currency);
+            var cached = applicationContext.cache.assets[asset.id];
+            cached.balance = new Money(asset.balance, cached.currency);
 
             asset.name = cached.currency.displayName;
             asset.total = cached.totalTokens.formatAmount();
             asset.balance = cached.balance.formatAmount();
             asset.timestamp = formattingService.formatTimestamp(cached.timestamp);
+            asset.reissuable = cached.reissuable;
+            asset.sender = cached.sender;
 
             return true;
         }
@@ -52,7 +54,7 @@
                         id: id,
                         total: '',
                         name: '',
-                        balance: '',
+                        balance: assetBalance.balance,
                         issued: assetBalance.issued
                     };
 

src/js/shared/transaction.filter.js

@@ -3,7 +3,10 @@
 
     function TransactionFilter(applicationContext, formattingService, addressService) {
         var TRANSACTION_TYPES = {
-            2: 'Payment'
+            2: 'Payment',
+            3: 'Asset Issue',
+            4: 'Transfer',
+            5: 'Asset Reissue'
         };
 
         function buildTransactionType (number) {
@@ -24,8 +27,17 @@
             var currency = Currency.WAV;
             var currentAddress = applicationContext.account.address;
             var type = transaction.sender === currentAddress ? 'Outgoing' : 'Incoming';
-            var formattedAmount = angular.isDefined(transaction.amount) ?
-                Money.fromCoins(transaction.amount, currency).formatAmount() : 'N/A';
+            var formattedAmount = 'N/A';
+            if (angular.isDefined(transaction.amount))
+                formattedAmount = Money.fromCoins(transaction.amount, currency).formatAmount();
+            if (angular.isDefined(transaction.quantity)) {
+                var asset = new Currency({
+                    id: transaction.id,
+                    displayName: transaction.name,
+                    precision: transaction.decimals
+                });
+                formattedAmount = Money.fromCoins(transaction.quantity, asset).formatAmount();
+            }
             var fee = Money.fromCoins(transaction.fee, currency);
 
             transaction.formatted = {

src/js/tokens/token.create.controller.js

@@ -5,6 +5,7 @@
     var ASSET_NAME_MIN = 4;
     var ASSET_NAME_MAX = 16;
     var TOKEN_DECIMALS_MAX = 8;
+    var FIXED_ISSUE_FEE = new Money(1, Currency.WAV);
 
     function TokenCreateController(constants, applicationContext, assetService, dialogService, apiService,
                                    notificationService, formattingService) {
@@ -54,7 +55,9 @@
                 }
             }
         };
-        ctrl.asset = {};
+        ctrl.asset = {
+            fee: FIXED_ISSUE_FEE
+        };
         ctrl.confirm = {
             pendingIssuance: false
         };
@@ -73,9 +76,9 @@
                 name: ctrl.asset.name,
                 description: ctrl.asset.description,
                 totalTokens: ctrl.asset.totalTokens,
-                decimalPlaces: ctrl.asset.decimalPlaces,
+                decimalPlaces: Number(ctrl.asset.decimalPlaces),
                 reissuable: ctrl.asset.reissuable,
-                time: utilityService.getTime()
+                fee: ctrl.asset.fee
             };
 
             var sender = {
@@ -111,6 +114,7 @@
                 applicationContext.cache.assets.put(response);
 
                 transaction = undefined;
+                ctrl.confirm.pendingIssuance = false;
                 resetIssueAssetForm();
             }, function (response) {
                 if (angular.isDefined(response.data))