Merge pull request #370 from LiskHQ/358-modal-full-screen

Unify modals fullscreen and width - Closes #358

src/components/delegates/delegates.js

@@ -21,15 +21,14 @@ app.component('delegates', {
    * @constructor
    */
   controller: class delegates {
-    constructor($scope, $rootScope, Peers, $mdDialog, $mdMedia,
-      dialog, $timeout, delegateApi, Account) {
+    constructor($scope, $rootScope, Peers, dialog, $mdMedia,
+      $timeout, delegateApi, Account) {
       this.$scope = $scope;
       this.$rootScope = $rootScope;
       this.peers = Peers;
       this.delegateApi = delegateApi;
-      this.$mdDialog = $mdDialog;
-      this.$mdMedia = $mdMedia;
       this.dialog = dialog;
+      this.$mdMedia = $mdMedia;
       this.$timeout = $timeout;
       this.account = Account;
 
@@ -339,31 +338,14 @@ app.component('delegates', {
     }
 
     /**
-     * Uses mdDialog to show vote list directive.
+     * Uses dialog.modal to show vote list directive.
      *
      * @method openVoteDialog
-     * @todo Use a general dialog service instead.
      */
     openVoteDialog() {
-      this.$mdDialog.show({
-        controllerAs: '$ctrl',
-        controller: class voteDialog {
-          constructor($scope, voteList, unvoteList) {
-            this.$scope = $scope;
-            this.$scope.voteList = voteList;
-            this.$scope.unvoteList = unvoteList;
-          }
-        },
-        template:
-          '<md-dialog flex="80">' +
-            '<vote vote-list="voteList" unvote-list="unvoteList">' +
-            '</vote>' +
-          '</md-dialog>',
-        fullscreen: (this.$mdMedia('sm') || this.$mdMedia('xs')) && this.$scope.customFullscreen,
-        locals: {
-          voteList: this.voteList,
-          unvoteList: this.unvoteList,
-        },
+      this.dialog.modal('vote', {
+        'vote-list': this.voteList,
+        'unvote-list': this.unvoteList,
       }).then((() => {
         this.setPendingVotes();
       }));

src/components/header/header.js

@@ -17,10 +17,9 @@ app.component('header', {
    * @constructor
    */
   controller: class header {
-    constructor($rootScope, Account, signVerify) {
+    constructor($rootScope, Account) {
       this.$rootScope = $rootScope;
       this.account = Account;
-      this.signVerify = signVerify;
     }
   },
 });

src/components/header/header.pug

@@ -16,10 +16,10 @@ md-content.header(layout='row', layout-align='center center', layout-padding)
           div(layout='row', flex='')
             p(flex='') Register as delegate 
       md-menu-item
-        md-button.sign-message(ng-click='$ctrl.signVerify.openSignMessageDialog()')
+        md-button.sign-message(data-open-dialog='sign-message')
           div(layout='row', flex='')
             p(flex='') Sign message
       md-menu-item
-        md-button.verify-message(ng-click='$ctrl.signVerify.openVerifyMessageDialog()')
+        md-button.verify-message(data-open-dialog='verify-message')
           div(layout='row', flex='')
             p(flex='') Verify message

src/liskNano.js

@@ -30,7 +30,6 @@ import './services/api/forgingApi';
 import './services/api/peers';
 import './services/dialog';
 import './services/lsk';
-import './services/signVerify';
 import './services/sync';
 import './services/notification';
 

src/services/dialog.js

@@ -4,7 +4,7 @@
  * @module app
  * @submodule dialog
  */
-app.factory('dialog', ($mdDialog, $mdToast) => ({
+app.factory('dialog', ($mdDialog, $mdToast, $mdMedia) => ({
 
   /**
    * Uses mdToast to show a toast with error theme
@@ -114,13 +114,14 @@ app.factory('dialog', ($mdDialog, $mdToast) => ({
     return $mdDialog.show({
       parent: angular.element(document.body),
       template: `
-                <md-dialog flex="80" >
+                <md-dialog flex-gt-sm="75" flex="95" >
                     <${component} ${attrs} close-dialog="closeDialog()" ></${component}>
                 </md-dialog>
               `,
       locals: {
         option: options,
       },
+      fullscreen: $mdMedia('xs'),
       controller: modalController,
     });
   },

test/components/delegates/delegates.spec.js

@@ -195,7 +195,7 @@ describe('delegates component controller', () => {
 
   describe('openVoteDialog()', () => {
     it('opens vote dialog', () => {
-      const spy = sinon.spy(controller.$mdDialog, 'show');
+      const spy = sinon.spy(controller.dialog, 'modal');
       controller.openVoteDialog();
       expect(spy).to.have.been.calledWith();
     });

test/test.js

@@ -23,7 +23,6 @@ require('./services/api/forgingApi.spec');
 require('./services/api/peers.spec');
 require('./services/lsk.spec');
 require('./services/passphrase.spec');
-require('./services/signVerify.spec');
 require('./services/notification.spec');
 
 require('./run.spec');