Rearranged buttons on the mass payment dialog

beregovoy68 · Dec 27, 2016 · 7e19d93 · 7e19d93
1 parent 58e2060
commit 7e19d93
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 10 deletions.
diff --git a/src/css/style.css b/src/css/style.css
@@ -155,7 +155,7 @@ body {
     font-size: .9rem;
     color: rgb(50,50,50);
     color: #333333;
-    
+
 }
 
 .sectionHeader {
@@ -894,7 +894,6 @@ span.tabs-radio img.selected {
 
 .wavesPop-content-buttons {
     padding-bottom: 2rem;
-    text-align: center;
 }
 
 #send-confirm {
@@ -907,6 +906,14 @@ span.tabs-radio img.selected {
     /*    font-weight: 600;*/
 }
 
+.button-row {
+    text-align: center;
+}
+
+.wavesPop-content .button-row {
+    padding-bottom: 1rem;
+}
+
 
 /* BALANCE BOXES BUTTONS SECTION */
 

diff --git a/src/index.html b/src/index.html
@@ -626,7 +626,7 @@ <h2 class="sectionHeader">ASSET REISSUE</h2>
                             </div>
                         </div>
                         <div class="noDisp" ng-controller="massPaymentController as mass">
-                            <div id="asset-mass-pay-dialog" waves-dialog ok-button-caption="SEND" on-dialog-ok="mass.submitPayment()" show-buttons="mass.stage === 'processing'">
+                            <div id="asset-mass-pay-dialog" waves-dialog ok-button-caption="SEND" show-buttons="false">
                                 <h2 class="sectionHeader">MASS PAYMENT</h2>
                                 <ng-switch on="mass.stage">
                                     <form id="massPaymentFilesForm" name="massPaymentFilesForm" novalidate ng-switch-when="loading" ng-validate="mass.validationOptions">
@@ -657,17 +657,17 @@ <h2 class="sectionHeader">MASS PAYMENT</h2>
                                                         </md-autocomplete>
                                                     </td>
                                                 </tr>
-                                                <tr>
-                                                    <td colspan="2"><button class="wButton wButton-neg" ng-click="mass.processInputFile(massPaymentFilesForm)">LOAD</button></td>
-                                                </tr>
                                             </tbody>
                                         </table>
+                                        <br/>
+                                        <div class="button-row">
+                                            <button class="wButton wButton-neg" ng-click="mass.processInputFile(massPaymentFilesForm)">LOAD</button>
+                                        </div>
                                     </form>
                                     <div class="massPayRecap wScroll" ng-switch-when="processing">
                                         <p>Please notice that only the first 10 transactions are shown below as a sample. Use the EXPORT functionality to export the full transaction details to a text file.</p>
                                         <p>Total transactions: {{mass.summary.totalTransactions}} | Total amount: {{mass.summary.totalAmount.toTokens()}} | Total fee: {{mass.summary.totalFee.toTokens()}}</p>
-<!--                                        <p><button class="wButton wButton-neg fade" ngclipboard ngclipboard-text-provider="mass.transactionsToClipboard()" ngclipboard-success="mass.dataCopied()">COPY</button></p>-->
-
+
                                         <table class="wavesTable">
                                             <thead>
                                             <tr>
@@ -682,6 +682,12 @@ <h2 class="sectionHeader">MASS PAYMENT</h2>
                                             </tr>
                                             </tbody>
                                         </table>
+                                        <br/>
+                                        <div class="button-row">
+                                            <button class="wButton wButton-neg fade" ngclipboard ngclipboard-text-provider="mass.transactionsToClipboard()" ngclipboard-success="mass.dataCopied()">EXPORT</button><span class="divider-2"></span>
+                                            <button class="wButton wButton-neg fade" ng-click="mass.submitPayment()">SEND</button><span class="divider-2"></span>
+                                            <button class="wButton wButton-neg fade" ng-click="mass.cancel()">CANCEL</button>
+                                        </div>
                                     </div>
                                 </ng-switch>
                             </div>
@@ -832,7 +838,7 @@ <h2 class="sectionHeader">ASSET CREATION</h2>
                                     <span class="confirmation-value">{{ctrl.confirm.name}}</span><br/> with
                                     <span class="confirmation-value">{{ctrl.confirm.totalTokens}}</span> of total tokens amount
                                 </p>
-                                <p class="dialog-text" ng-if="!ctrl.asset.reissuable" style="color: red">Please note that flagging an asset as NON RE-ISSUABLE is permanent.<br/>
+                                <p class="dialog-text notice-alert" ng-if="!ctrl.asset.reissuable">Please note that flagging an asset as NON RE-ISSUABLE is permanent.<br/>
                                     Assets created as RE-ISSUABLE can later be changed to NON RE-ISSUABLE.<br/>However, assets flagged as NON RE-ISSUABLE can never be made RE-ISSUABLE.</p>
                                 <p class="dialog-text">Please <span class="fontBold"> CONFIRM </span>to execute or <span class="fontBold"> CANCEL </span> to discard.</p>
                             </div>

diff --git a/src/js/portfolio/mass.payment.controller.js b/src/js/portfolio/mass.payment.controller.js
@@ -59,6 +59,7 @@
         mass.broadcastTransaction = broadcastTransaction;
         mass.transactionsToClipboard = transactionsToClipboard;
         mass.dataCopied = dataCopied;
+        mass.cancel = cancel;
 
         $scope.$on(events.ASSET_MASSPAY, function (event, eventData) {
             mass.wavesBalance = eventData.wavesBalance;
@@ -180,13 +181,18 @@
             mass.confirm.fee.currency = mass.summary.totalFee.currency.displayName;
             mass.confirm.recipients = mass.summary.totalTransactions;
 
+            dialogService.close();
             $timeout(function () {
                 dialogService.open('#asset-mass-pay-confirmation');
             }, 1);
 
             return true;
         }
 
+        function cancel () {
+            dialogService.close();
+        }
+
         function broadcastTransaction() {
             mass.broadcast.broadcast();
         }

diff --git a/src/js/shared/shared.dialog.directive.js b/src/js/shared/shared.dialog.directive.js
@@ -70,7 +70,7 @@
                 link: WavesDialogLink,
                 template: '<img class="wPop-header" ng-src="img/{{image}}" />' +
                     '<div class="wavesPop-content" ng-transclude></div>' +
-                    '<div class="wavesPop-content-buttons" ng-show="showButtons">' +
+                    '<div class="wavesPop-content-buttons button-row" ng-show="showButtons">' +
                         '<button class="wButton wButton-dialog fade tooltip-1" ng-class="[{wButtonDanger: isError}]" ' +
                             'title="{{::tooltip}}" ng-click="onOk()" ng-disabled="!okButtonEnabled">' +
                             '{{::okButtonCaption}}</button>' +