Feature/qrcode in modal (MyEtherWallet#25)

* replace popup window with a modal v2.1.9-beta.1

* publish 2.1.9-beta.1

* pre-publish 2.1.9

* publish 2.1.9

* pre-publish 2.1.10.beta.1, fix modals show/hide

* commit pre-publish 2.1.10

* commit pre-publish 2.1.11

* forgot to change the version to 2.1.11 in package.json

CHANGELOG.md

@@ -1,3 +1,19 @@
+### Release v2.1.11
+- Add ```.disconnect``` as a method on the provider
+- Restore debug package use
+
+### Release v2.1.10
+- Fix modal showing up behind web3modal
+
+### Release v2.1.10-beta.1
+- Fix value resets when modal is closed by user
+
+### Release v2.1.9
+- Replace popup window with a modal (stable)
+
+### Release v2.1.9-beta.1
+- Replace popup window with a modal
+
 ### Release v2.1.8
 - Change handling of infuraId to permit same id usage on testnets
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@myetherwallet/mewconnect-web-client",
   "homepage": "https://github.com/myetherwallet/MEWconnect-web-client",
-  "version": "2.1.8",
+  "version": "2.1.11",
   "main": "./dist/index.js",
   "module": "./src/index.js",
   "scripts": {

src/connectClient/initiator/MewConnectInitiator.js

@@ -14,9 +14,7 @@ import WebRtcCommunication from '../WebRtcCommunication';
 import PopUpCreator from '../../connectWindow/popUpCreator';
 
 const debug = debugLogger('MEWconnect:initiator-base');
-// const debugPeer = debugLogger('MEWconnectVerbose:peer-instances');
 const debugStages = debugLogger('MEWconnect:initiator-stages');
-// const logger = createLogger('MewConnectInitiator');
 const debugConnectionState = debugLogger('MEWconnect:connection-state');
 
 export default class MewConnectInitiator extends MewConnectCommon {
@@ -184,6 +182,17 @@ this.requestIds = [];
           this.version + separator + privateKey + separator + this.connId;
       }
 
+      const unloadOrClosed = () => {
+        if (!this.connected) {
+          // eslint-disable-next-line no-console
+          debug('popup window closed');
+          this.uiCommunicator('popup_window_closed');
+          MewConnectInitiator.setConnectionState();
+          this.socketDisconnect();
+          this.emit(this.lifeCycle.AuthRejected);
+          this.refreshCheck();
+        }
+      }
 
       debug(qrCodeString);
       if (this.showPopup) {
@@ -192,17 +201,8 @@ this.requestIds = [];
         } else {
           this.popupCreator.refreshQrcode = this.initiatorStart.bind(this);
           this.popupCreator.openPopupWindow(qrCodeString);
-          this.popupCreator.popupWindow.addEventListener('beforeunload', () => {
-            if (!this.connected) {
-              // eslint-disable-next-line no-console
-              debug('popup window closed');
-              this.uiCommunicator('popup_window_closed');
-              MewConnectInitiator.setConnectionState();
-              this.socketDisconnect();
-              this.emit(this.lifeCycle.AuthRejected);
-              this.refreshCheck();
-            }
-          });
+          // this.popupCreator.container.addEventListener('beforeunload', unloadOrClosed);
+          this.popupCreator.container.addEventListener('mewModalClosed', unloadOrClosed, {once: true});
         }
       } else {
         this.uiCommunicator(this.lifeCycle.codeDisplay, qrCodeString);

src/connectProvider/index.js

@@ -31,9 +31,7 @@ export default class Integration extends EventEmitter {
     this.subscriptionNotFoundNoThrow =
       options.subscriptionNotFoundNoThrow || true;
     // eslint-disable-next-line
-    this.infuraId = !!options.infuraId
-      ? options.infuraId
-      : false;
+    this.infuraId = !!options.infuraId ? options.infuraId : false;
 
     this.CHAIN_ID = options.chainId || 1;
     this.RPC_URL = options.rpcUrl || false;
@@ -96,12 +94,12 @@ export default class Integration extends EventEmitter {
   async enable() {
     return new Promise((resolve, reject) => {
       nativeCheck().then(res => {
-        if(res){
+        if (res) {
           if (MEWconnectWallet.getConnectionState() === 'disconnected') {
             this.returnPromise = this.enabler();
           }
-          if (popUpCreator.popupWindowOpen) {
-            popUpCreator.popupWindow.focus();
+          if (typeof popUpCreator.popupWindowOpen === 'boolean') {
+            popUpCreator.showDialog();
           }
           return resolve(this.returnPromise);
         }
@@ -187,7 +185,7 @@ export default class Integration extends EventEmitter {
       const defaultNetwork = Networks[chain.key][0];
       state.network = defaultNetwork;
       if (this.infuraId && !this.RPC_URL) {
-        RPC_URL = `wss://${chain.name}.infura.io/ws/v3/${this.infuraId}`
+        RPC_URL = `wss://${chain.name}.infura.io/ws/v3/${this.infuraId}`;
       }
       const hostUrl = url.parse(RPC_URL || defaultNetwork.url);
       const options = {
@@ -223,6 +221,7 @@ export default class Integration extends EventEmitter {
       );
 
       web3Provider.close = this.disconnect.bind(this);
+      web3Provider.disconnect = this.disconnect.bind(this);
       state.web3Provider = web3Provider;
 
       state.web3 = new Web3(web3Provider);

src/connectProvider/utils.js

@@ -16,3 +16,5 @@ export function postMessageToParent(message, origin = '*') {
     window.parent.postMessage(message, origin);
   }
 }
+
+

src/connectProvider/web3Provider/MEWconnect/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import MEWconnect from '../../../index';
 import { Transaction } from 'ethereumjs-tx';
 import WalletInterface from '../WalletInterface';
@@ -69,11 +70,14 @@ class MEWconnectWallet {
   }
 
   static setConnectionState(connectionState) {
-    if (!connectionState) MEWconnect.Initiator.connectionState = 'disconnected';
-    else MEWconnect.Initiator.connectionState = connectionState;
+    if (!connectionState) MEWconnect.Initiator.setConnectionState('disconnected');
+    else MEWconnect.Initiator.setConnectionState(connectionState);
+    debug('setConnectionState', MEWconnect.Initiator.connectionState)
   }
 
   static getConnectionState() {
+    debug('getConnectionState', MEWconnect.Initiator.connectionState)
+
     if (!MEWconnect.Initiator.connectionState) return 'disconnected';
     return MEWconnect.Initiator.connectionState;
   }