extern/2FAuth
1
0
Fork 0
mirror of https://github.com/Bubka/2FAuth.git synced 2025-02-23 05:41:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

Refactor OTP displayer to ease steamtotp support

Browse Source
This commit is contained in:
Bubka 2022-06-25 17:35:29 +02:00
parent c998356ba5
commit 1d99c27675
1 changed files with 20 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
resources/js/components/OtpDisplayer.vue
View File

@ -6,10 +6,10 @@
<p class="is-size-4 has-text-grey-light has-ellipsis">{{ internal_service }}</p>
<p class="is-size-6 has-text-grey has-ellipsis">{{ internal_account }}</p>
<p class="is-size-1 has-text-white is-clickable" :title="$t('commons.copy_to_clipboard')" v-clipboard="() => internal_password.replace(/ /g, '')" v-clipboard:success="clipboardSuccessHandler">{{ displayedOtp }}</p>
<ul class="dots" v-show="internal_otp_type === 'totp'">
<ul class="dots" v-show="isTimeBased(internal_otp_type)">
<li v-for="n in 10"></li>
</ul>
<ul v-show="internal_otp_type === 'hotp'">
<ul v-show="isHMacBased(internal_otp_type)">
<li>counter: {{ internal_counter }}</li>
</ul>
</div>
@ -60,7 +60,7 @@
const spacePosition = Math.ceil(this.internal_password.length / 2)
let pwd = this.internal_password.substr(0, spacePosition) + " " + this.internal_password.substr(spacePosition)
return this.$root.appSettings.showOtpAsDot ? pwd.replace(/[0-9]/g, '●') : pwd
}
},
},
mounted: function() {
@ -69,6 +69,14 @@
methods: {
isTimeBased: function(otp_type) {
return (otp_type === 'totp' || otp_type === 'steamtotp')
},
isHMacBased: function(otp_type) {
return otp_type === 'hotp'
},
async show(id) {
// 3 possible cases :
@ -100,7 +108,7 @@
this.internal_icon = data.icon
this.internal_otp_type = data.otp_type
if( data.otp_type === 'hotp' && data.counter ) {
if( this.isHMacBased(data.otp_type) && data.counter ) {
this.internal_counter = data.counter
}
}
@ -113,16 +121,13 @@
if( this.internal_id || this.uri || this.secret ) { // minimun required vars to get an otp from the backend
switch(this.internal_otp_type) {
case 'totp':
await this.startTotpLoop()
break;
case 'hotp':
await this.getHOTP()
break;
default:
this.$router.push({ name: 'genericError', params: { err: this.$t('errors.not_a_supported_otp_type') } });
}
if(this.isTimeBased(this.internal_otp_type)) {
await this.startTotpLoop()
}
else if(this.isHMacBased(this.internal_otp_type)) {
await this.getHOTP()
}
else this.$router.push({ name: 'genericError', params: { err: this.$t('errors.not_a_supported_otp_type') } });
this.$parent.isActive = true
}
@ -259,7 +264,7 @@
stopLoop: function() {
if( this.internal_otp_type === 'totp' ) {
if( this.isTimeBased(this.internal_otp_type) ) {
clearTimeout(this.remainingTimeout)
clearTimeout(this.firstDotToNextOneTimeout)
clearInterval(this.dotToDotInterval)