Modals finished. Need to xfer all to React
Vincent
5 years ago
parent
9afb8b4d5e
commit
8aac656107
@ -0,0 +1,209 @@
|
|||||||
|
/* global
|
||||||
|
Whisper,
|
||||||
|
i18n,
|
||||||
|
libloki,
|
||||||
|
textsecure,
|
||||||
|
ConversationController,
|
||||||
|
$,
|
||||||
|
QRCode,
|
||||||
|
*/
|
||||||
|
|
||||||
|
// eslint-disable-next-line func-names
|
||||||
|
(function() {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
window.Whisper = window.Whisper || {};
|
||||||
|
|
||||||
|
Whisper.DevicePairingDialogView = Whisper.View.extend({
|
||||||
|
className: 'loki-dialog device-pairing-dialog modal',
|
||||||
|
templateName: 'device-pairing-dialog',
|
||||||
|
initialize() {
|
||||||
|
this.pubKeyRequests = [];
|
||||||
|
this.reset();
|
||||||
|
this.render();
|
||||||
|
this.showView();
|
||||||
|
this.qr = new QRCode(this.$('#qr')[0], {
|
||||||
|
correctLevel: QRCode.CorrectLevel.L,
|
||||||
|
});
|
||||||
|
this.qr.makeCode(textsecure.storage.user.getNumber());
|
||||||
|
},
|
||||||
|
reset() {
|
||||||
|
this.pubKey = null;
|
||||||
|
this.accepted = false;
|
||||||
|
this.isListening = false;
|
||||||
|
this.pubKeyToUnpair = null;
|
||||||
|
this.success = false;
|
||||||
|
},
|
||||||
|
events: {
|
||||||
|
'click #startPairing': 'startReceivingRequests',
|
||||||
|
'click #close': 'close',
|
||||||
|
'click .waitingForRequestView .cancel': 'stopReceivingRequests',
|
||||||
|
'click .requestReceivedView .skip': 'skipDevice',
|
||||||
|
'click #allowPairing': 'allowDevice',
|
||||||
|
'click .requestAcceptedView .ok': 'stopReceivingRequests',
|
||||||
|
'click .confirmUnpairView .cancel': 'stopReceivingRequests',
|
||||||
|
'click .confirmUnpairView .unpairDevice': 'confirmUnpairDevice',
|
||||||
|
},
|
||||||
|
render_attributes() {
|
||||||
|
return {
|
||||||
|
defaultTitle: i18n('pairedDevices'),
|
||||||
|
waitingForRequestTitle: i18n('waitingForDeviceToRegister'),
|
||||||
|
requestReceivedTitle: i18n('devicePairingReceived'),
|
||||||
|
requestAcceptedTitle: i18n('devicePairingAccepted'),
|
||||||
|
startPairingText: i18n('pairNewDevice'),
|
||||||
|
cancelText: i18n('cancel'),
|
||||||
|
unpairDevice: i18n('unpairDevice'),
|
||||||
|
closeText: i18n('close'),
|
||||||
|
skipText: i18n('skip'),
|
||||||
|
okText: i18n('ok'),
|
||||||
|
allowPairingText: i18n('allowPairing'),
|
||||||
|
confirmUnpairViewTitle: i18n('confirmUnpairingTitle'),
|
||||||
|
};
|
||||||
|
},
|
||||||
|
startReceivingRequests() {
|
||||||
|
this.trigger('startReceivingRequests');
|
||||||
|
this.isListening = true;
|
||||||
|
this.showView();
|
||||||
|
},
|
||||||
|
stopReceivingRequests() {
|
||||||
|
if (this.success) {
|
||||||
|
const deviceAlias = this.$('#deviceAlias')[0].value.trim();
|
||||||
|
const conv = ConversationController.get(this.pubKey);
|
||||||
|
if (conv) {
|
||||||
|
conv.setNickname(deviceAlias);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.trigger('stopReceivingRequests');
|
||||||
|
this.reset();
|
||||||
|
this.showView();
|
||||||
|
},
|
||||||
|
requestReceived(secondaryDevicePubKey) {
|
||||||
|
// FIFO: push at the front of the array with unshift()
|
||||||
|
this.pubKeyRequests.unshift(secondaryDevicePubKey);
|
||||||
|
if (!this.pubKey) {
|
||||||
|
this.nextPubKey();
|
||||||
|
this.showView('requestReceived');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
allowDevice() {
|
||||||
|
this.accepted = true;
|
||||||
|
this.trigger('devicePairingRequestAccepted', this.pubKey, errors =>
|
||||||
|
this.transmisssionCB(errors)
|
||||||
|
);
|
||||||
|
this.showView();
|
||||||
|
},
|
||||||
|
transmisssionCB(errors) {
|
||||||
|
if (!errors) {
|
||||||
|
this.$('.transmissionStatus').text(i18n('provideDeviceAlias'));
|
||||||
|
this.$('#deviceAliasView').show();
|
||||||
|
this.$('#deviceAlias').on('input', e => {
|
||||||
|
if (e.target.value.trim()) {
|
||||||
|
this.$('.requestAcceptedView .ok').removeAttr('disabled');
|
||||||
|
} else {
|
||||||
|
this.$('.requestAcceptedView .ok').attr('disabled', true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.$('.requestAcceptedView .ok').show();
|
||||||
|
this.$('.requestAcceptedView .ok').attr('disabled', true);
|
||||||
|
this.success = true;
|
||||||
|
} else {
|
||||||
|
this.$('.transmissionStatus').text(errors);
|
||||||
|
this.$('.requestAcceptedView .ok').show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
skipDevice() {
|
||||||
|
this.trigger('devicePairingRequestRejected', this.pubKey);
|
||||||
|
this.nextPubKey();
|
||||||
|
this.showView();
|
||||||
|
},
|
||||||
|
nextPubKey() {
|
||||||
|
// FIFO: pop at the back of the array using pop()
|
||||||
|
this.pubKey = this.pubKeyRequests.pop();
|
||||||
|
},
|
||||||
|
async confirmUnpairDevice() {
|
||||||
|
this.trigger('deviceUnpairingRequested', this.pubKeyToUnpair);
|
||||||
|
this.reset();
|
||||||
|
this.showView();
|
||||||
|
},
|
||||||
|
requestUnpairDevice(pubKey) {
|
||||||
|
this.pubKeyToUnpair = pubKey;
|
||||||
|
this.showView();
|
||||||
|
},
|
||||||
|
getPubkeyName(pubKey) {
|
||||||
|
const secretWords = window.mnemonic.pubkey_to_secret_words(pubKey);
|
||||||
|
const conv = ConversationController.get(pubKey);
|
||||||
|
const deviceAlias = conv ? conv.getNickname() : 'Unnamed Device';
|
||||||
|
return `${deviceAlias} (pairing secret: <i>${secretWords}</i>)`;
|
||||||
|
},
|
||||||
|
async showView() {
|
||||||
|
const defaultView = this.$('.defaultView');
|
||||||
|
const waitingForRequestView = this.$('.waitingForRequestView');
|
||||||
|
const requestReceivedView = this.$('.requestReceivedView');
|
||||||
|
const requestAcceptedView = this.$('.requestAcceptedView');
|
||||||
|
const confirmUnpairView = this.$('.confirmUnpairView');
|
||||||
|
if (this.pubKeyToUnpair) {
|
||||||
|
defaultView.hide();
|
||||||
|
requestReceivedView.hide();
|
||||||
|
waitingForRequestView.hide();
|
||||||
|
requestAcceptedView.hide();
|
||||||
|
confirmUnpairView.show();
|
||||||
|
const name = this.getPubkeyName(this.pubKeyToUnpair);
|
||||||
|
this.$('.confirmUnpairView #pubkey').html(name);
|
||||||
|
} else if (!this.isListening) {
|
||||||
|
requestReceivedView.hide();
|
||||||
|
waitingForRequestView.hide();
|
||||||
|
requestAcceptedView.hide();
|
||||||
|
confirmUnpairView.hide();
|
||||||
|
|
||||||
|
const ourPubKey = textsecure.storage.user.getNumber();
|
||||||
|
defaultView.show();
|
||||||
|
const pubKeys = await libloki.storage.getSecondaryDevicesFor(ourPubKey);
|
||||||
|
this.$('#pairedPubKeys').empty();
|
||||||
|
if (pubKeys && pubKeys.length > 0) {
|
||||||
|
this.$('#startPairing').attr('disabled', true);
|
||||||
|
pubKeys.forEach(x => {
|
||||||
|
const name = this.getPubkeyName(x);
|
||||||
|
const li = $('<li>').html(name);
|
||||||
|
if (window.lokiFeatureFlags.multiDeviceUnpairing) {
|
||||||
|
const link = $('<a>')
|
||||||
|
.text('Unpair')
|
||||||
|
.attr('href', '#');
|
||||||
|
link.on('click', () => this.requestUnpairDevice(x));
|
||||||
|
li.append(' - ');
|
||||||
|
li.append(link);
|
||||||
|
}
|
||||||
|
this.$('#pairedPubKeys').append(li);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.$('#startPairing').removeAttr('disabled');
|
||||||
|
this.$('#pairedPubKeys').append('<li>No paired devices</li>');
|
||||||
|
}
|
||||||
|
} else if (this.accepted) {
|
||||||
|
defaultView.hide();
|
||||||
|
requestReceivedView.hide();
|
||||||
|
waitingForRequestView.hide();
|
||||||
|
requestAcceptedView.show();
|
||||||
|
} else if (this.pubKey) {
|
||||||
|
const secretWords = window.mnemonic.pubkey_to_secret_words(this.pubKey);
|
||||||
|
this.$('.secretWords').text(secretWords);
|
||||||
|
requestReceivedView.show();
|
||||||
|
waitingForRequestView.hide();
|
||||||
|
requestAcceptedView.hide();
|
||||||
|
defaultView.hide();
|
||||||
|
} else {
|
||||||
|
waitingForRequestView.show();
|
||||||
|
requestReceivedView.hide();
|
||||||
|
requestAcceptedView.hide();
|
||||||
|
defaultView.hide();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.remove();
|
||||||
|
this.qr.clear();
|
||||||
|
if (this.pubKey && !this.accepted) {
|
||||||
|
this.trigger('devicePairingRequestRejected', this.pubKey);
|
||||||
|
}
|
||||||
|
this.trigger('close');
|
||||||
|
},
|
||||||
|
});
|
||||||
|
})();
|
||||||
Loading…
Reference in New Issue