Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
162 changes: 121 additions & 41 deletions apps/twofactor_backupcodes/js/settingsview.js
Original file line number Diff line number Diff line change
@@ -1,94 +1,167 @@
/* global Backbone, Handlebars, OC, _ */

(function (OC, Handlebars, $, _) {
(function(OC, Handlebars, $, _) {
'use strict';

OC.Settings = OC.Settings || {};
OC.Settings.TwoFactorBackupCodes = OC.Settings.TwoFactorBackupCodes || {};

var TEMPLATE = '<div>'
+ '{{#unless enabled}}'
+ '<button id="generate-backup-codes">' + t('twofactor_backupcodes', 'Generate backup codes') + '</button>'
+ '{{else}}'
+ '<p>'
+ '{{#unless codes}}'
+ t('twofactor_backupcodes', 'Backup codes have been generated. {{used}} of {{total}} codes have been used.')
+ '{{else}}'
+ t('twofactor_backupcodes', 'These are your backup codes. Please save and/or print them as you will not be able to read the codes again later')
+ '<ul>'
+ '{{#each codes}}'
+ '<li class="backup-code">{{this}}</li>'
+ '{{/each}}'
+ '</ul>'
+ '<a href="{{download}}" class="button" download="Nextcloud-backup-codes.txt">' + t('twofactor_backupcodes', 'Save backup codes') + '</a>'
+ '<button id="print-backup-codes" class="button">' + t('twofactor_backupcodes', 'Print backup codes') + '</button>'
+ '{{/unless}}'
+ '</p>'
+ '<p>'
+ '<button id="generate-backup-codes">' + t('twofactor_backupcodes', 'Regenerate backup codes') + '</button>'
+ '</p>'
+ '<p>'
+ t('twofactor_backupcodes', 'If you regenerate backup codes, you automatically invalidate old codes.')
+ '</p>'
+ '{{/unless}}'
+ '</div';
+ '{{#unless enabled}}'
+ '<button id="generate-backup-codes">' + t('twofactor_backupcodes', 'Generate backup codes') + '</button>'
+ '{{else}}'
+ '<p>'
+ '{{#unless codes}}'
+ t('twofactor_backupcodes', 'Backup codes have been generated. {{used}} of {{total}} codes have been used.')
+ '{{else}}'
+ t('twofactor_backupcodes', 'These are your backup codes. Please save and/or print them as you will not be able to read the codes again later')
+ '<ul>'
+ '{{#each codes}}'
+ '<li class="backup-code">{{this}}</li>'
+ '{{/each}}'
+ '</ul>'
+ '<a href="{{download}}" class="button" download="Nextcloud-backup-codes.txt">' + t('twofactor_backupcodes', 'Save backup codes') + '</a>'
+ '<button id="print-backup-codes" class="button">' + t('twofactor_backupcodes', 'Print backup codes') + '</button>'
+ '{{/unless}}'
+ '</p>'
+ '<p>'
+ '<button id="generate-backup-codes">' + t('twofactor_backupcodes', 'Regenerate backup codes') + '</button>'
+ '</p>'
+ '<p>'
+ t('twofactor_backupcodes', 'If you regenerate backup codes, you automatically invalidate old codes.')
+ '</p>'
+ '{{/unless}}'
+ '</div';

/**
* @class OC.Settings.TwoFactorBackupCodes.View
*/
var View = OC.Backbone.View.extend({

/**
* @type {undefined|Function}
*/
_template: undefined,
template: function (data) {

/**
* @param {Object} data
* @returns {string}
*/
template: function(data) {
if (!this._template) {
this._template = Handlebars.compile(TEMPLATE);
}
return this._template(data);
},

/**
* @type {boolean}
*/
_loading: undefined,

/**
* @type {boolean}
*/
_enabled: undefined,

/**
* @type {Number}
*/
_total: undefined,

/**
* @type {Number}
*/
_used: undefined,

/**
* @type {Array}
*/
_codes: undefined,

events: {
'click #generate-backup-codes': '_onGenerateBackupCodes',
'click #print-backup-codes': '_onPrintBackupCodes',
'click #print-backup-codes': '_onPrintBackupCodes'
},
initialize: function () {

/**
* @returns {undefined}
*/
initialize: function() {
this._load();
},
render: function () {

/**
* @returns {self}
*/
render: function() {
this.$el.html(this.template({
enabled: this._enabled,
total: this._total,
used: this._used,
codes: this._codes,
download: this._getDownloadData()
}));

return this;
},
_getDownloadData: function () {

/**
* @private
* @returns {String}
*/
_getDownloadData: function() {
if (!this._codes) {
return '';
}
return 'data:text/plain,' + encodeURIComponent(_.reduce(this._codes, function(prev, code) {
return prev + code + '\r\n';
}, ''));
},

/**
* @private
* @returns {String}
*/
_getPrintData: function() {
if (!this._codes) {
return '';
}
return _.reduce(this._codes, function (prev, code) {
return _.reduce(this._codes, function(prev, code) {
return prev + code + "<br>";
}, '');
},
_load: function () {

/**
* Load codes from the server
*
* @returns {undefined}
*/
_load: function() {
this._loading = true;

var url = OC.generateUrl('/apps/twofactor_backupcodes/settings/state');
var loading = $.ajax(url, {
method: 'GET',
method: 'GET'
});

$.when(loading).done(function (data) {
$.when(loading).done(function(data) {
this._enabled = data.enabled;
this._total = data.total;
this._used = data.used;
}.bind(this));
$.when(loading).always(function () {
$.when(loading).always(function() {
this._loading = false;
this.render();
}.bind(this));
},
_onGenerateBackupCodes: function () {

/**
* Event handler to generate the codes
*
* @returns {undefined}
*/
_onGenerateBackupCodes: function() {
if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
OC.PasswordConfirmation.requirePasswordConfirmation(_.bind(this._onGenerateBackupCodes, this));
return;
Expand All @@ -101,25 +174,32 @@
var url = OC.generateUrl('/apps/twofactor_backupcodes/settings/create');
$.ajax(url, {
method: 'POST'
}).done(function (data) {
}).done(function(data) {
this._enabled = data.state.enabled;
this._total = data.state.total;
this._used = data.state.used;
this._codes = data.codes;
this.render();
}.bind(this)).fail(function () {
}.bind(this)).fail(function() {
OC.Notification.showTemporary(t('twofactor_backupcodes', 'An error occurred while generating your backup codes'));
$('#generate-backup-codes').removeClass('icon-loading-small');
});
},
_onPrintBackupCodes: function () {
var data = this._getDownloadData();

/**
* Event handler to print the codes
*
* @returns {undefined}
*/
_onPrintBackupCodes: function() {
var data = this._getPrintData();
var newTab = window.open('', t('twofactor_backupcodes', 'Nextcloud backup codes'));
newTab.document.write('<h1>' + t('twofactor_backupcodes', 'Nextcloud backup codes') + '</h1>');
newTab.document.write(data);
newTab.print();
newTab.close();
}

});

OC.Settings.TwoFactorBackupCodes.View = View;
Expand Down