Skip to content
This repository was archived by the owner on Jun 25, 2024. It is now read-only.

Commit 9b38f8f

Browse files
longrunningprocesslongrunningprocess
authored
Merge pull request #53 from silinternational/develop
Get new codes here
2 parents 2375e0c + d2f070d commit 9b38f8f

6 files changed

Lines changed: 240 additions & 3 deletions

File tree

‎dictionaries/mfa.definition.json‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,42 @@
150150
"fr": "Dernier code imprimable utilisé",
151151
"ko": "​​마지막 인쇄 가능 코드가​​ ​사용되었습니다."
152152
},
153+
"new_codes_header": {
154+
"en": "New printable codes",
155+
"es": "Nuevos códigos imprimibles",
156+
"fr": "Nouveaux codes imprimables",
157+
"ko": "​​새로운 인쇄 가능 코드"
158+
},
159+
"old_codes_gone": {
160+
"en": "You may now discard any of your previous codes, they have been deleted.",
161+
"es": "Ahora puede descartar cualquiera de sus códigos anteriores, se han eliminado.",
162+
"fr": "Vous pouvez maintenant jeter tous vos codes précédents, ils ont été supprimés.",
163+
"ko": "​​이제 이전 코드를 삭제해도 삭제 될 수 있습니다."
164+
},
165+
"new_codes_info": {
166+
"en": "Printable codes should be treated with the same level of attention as any password.",
167+
"es": "Los códigos imprimibles deben tratarse con el mismo nivel de atención que cualquier contraseña.",
168+
"fr": "Les codes imprimables doivent être traités avec le même niveau d'attention que les mots de passe.",
169+
"ko": "​​인쇄 가능한 코드는 모든 비밀번호와 동일한주의 수준으로 처리되어야합니다."
170+
},
171+
"new_codes_only_once": {
172+
"en": "Each code may only be used once.",
173+
"es": "Cada código solo puede usarse una vez.",
174+
"fr": "Chaque code ne peut être utilisé qu'une seule fois.",
175+
"ko": "​​각 코드는 한 번만 사용할 수 있습니다."
176+
},
177+
"new_codes_failed": {
178+
"en": "Something went wrong while creating new printable codes for you. We are sorry for the inconvenience, please check your configuration at the following address after continuing: ",
179+
"es": "Algo salió mal al crear nuevos códigos imprimibles para usted. Disculpe las molestias, compruebe su configuración en la siguiente dirección después de continuar: ",
180+
"fr": "Une erreur s'est produite lors de la création de nouveaux codes imprimables. Nous sommes désolés pour le dérangement. Veuillez vérifier votre configuration à l'adresse suivante après avoir continué: ",
181+
"ko": "새로운 인쇄 가능한 코드를 만드는 동안 문제가 발생했습니다. 불편을 끼쳐 드려 죄송합니다. 계속 진행 한 후 다음 주소로 구성을 확인하십시오. "
182+
},
183+
"account": {
184+
"en": "{idpName} account",
185+
"es": "Cuenta de {idpName}",
186+
"fr": "Compte {idpName}",
187+
"ko": "{idpName} 계정"
188+
},
153189
"has_options_besides_codes": {
154190
"en": "Thankfully you do have other 2-Step Verification options set up but you should create more Printable codes if you plan to need them in the future.",
155191
"es": "Afortunadamente, tiene otras opciones de verificación en dos pasos configuradas, pero debe crear más códigos imprimibles si planea necesitarlos en el futuro.",
@@ -228,6 +264,36 @@
228264
"fr": "Avoir plus",
229265
"ko": "더​ ​​가져오기"
230266
},
267+
"button_continue": {
268+
"en": "Continue",
269+
"es": "Continuar",
270+
"fr": "Continuer",
271+
"ko": "계속하다"
272+
},
273+
"button_print": {
274+
"en": "Print",
275+
"es": "Imprimir",
276+
"fr": "Imprimer",
277+
"ko": "인쇄"
278+
},
279+
"button_download": {
280+
"en": "Download",
281+
"es": "Descargar",
282+
"fr": "Télécharger",
283+
"ko": "다운로드"
284+
},
285+
"button_copy": {
286+
"en": "Copy",
287+
"es": "Copiar",
288+
"fr": "Copier",
289+
"ko": "사본"
290+
},
291+
"button_copied": {
292+
"en": "Copied ✓",
293+
"es": "Copiado ✓",
294+
"fr": "Copié ✓",
295+
"ko": "복사 됨 ✓"
296+
},
231297
"remember_this": {
232298
"en": "Remember this browser for 30 days",
233299
"es": "Recuerde esta navegador por 30 días",

‎themes/material/common-head-elements.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
$colors = htmlentities($this->configuration->getValue('theme.color-scheme') ?: 'indigo-purple');
3333
?>
3434
<link rel="stylesheet" href="material.<?= $colors ?>.1.2.1.min.css">
35-
<link rel="stylesheet" href="styles.2.2.4.css">
35+
<link rel="stylesheet" href="styles.2.3.0.css">
3636

3737
<script async src="material.1.2.1.min.js"></script>
3838

‎themes/material/mfa/low-on-backup-codes.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@
4040

4141
<span flex></span>
4242

43-
<button name="setUpMfa" class="mdl-button mdl-button--raised mdl-button--primary">
43+
<button name="getMore" class="mdl-button mdl-button--raised mdl-button--primary">
4444
<?= $this->t('{material:mfa:button_get_more}') ?>
4545
</button>
4646
</div>

‎themes/material/mfa/new-backup-codes.php‎

Lines changed: 134 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,134 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title><?= $this->t('{material:mfa:title}') ?></title>
5+
6+
<?php include __DIR__ . '/../common-head-elements.php' ?>
7+
</head>
8+
<body class="gradient-bg">
9+
<div class="mdl-layout mdl-layout--fixed-header fill-viewport">
10+
<header class="mdl-layout__header">
11+
<div class="mdl-layout__header-row">
12+
<span class="mdl-layout-title">
13+
<?= $this->t('{material:mfa:header}') ?>
14+
</span>
15+
</div>
16+
</header>
17+
<main class="mdl-layout__content" layout-children="column">
18+
<form layout-children="column" method="post">
19+
<?php $newCodes = $this->data['newBackupCodes']; ?>
20+
<?php if (! empty($newCodes)): ?>
21+
<h1 class="mdl-typography--display-1">
22+
<?= $this->t('{material:mfa:new_codes_header}') ?>
23+
</h1>
24+
25+
<p class="mdl-typography--body-1">
26+
<em><?= $this->t('{material:mfa:old_codes_gone}') ?></em>
27+
</p>
28+
29+
<p class="mdl-typography--body-1">
30+
<?= $this->t('{material:mfa:new_codes_info}') ?>
31+
<span class="mdl-typography--body-2"><?= $this->t('{material:mfa:new_codes_only_once}') ?></span>
32+
</p>
33+
34+
<div class="mdl-card mdl-shadow--8dp">
35+
<div class="mdl-card__supporting-text" layout-children="column" id="code-card">
36+
<?php
37+
$idpName = htmlentities($this->configuration->getValue('idp_display_name', $this->configuration->getValue('idp_name', '—')));
38+
?>
39+
<p class="fill-parent" layout-children="row">
40+
<span flex><?= $this->t('{material:mfa:account}', ['{idpName}' => $idpName]) ?></span>
41+
<em class="mdl-typography--caption"><?= date('M j, Y') ?></em>
42+
</p>
43+
44+
<?php
45+
function calculateMaxHeightStyle($newCodes)
46+
{
47+
$numCodes = count($newCodes);
48+
$numCols = $numCodes <= 5 ? 1 : 2;
49+
$numCodesPerRow = ceil($numCodes / $numCols);
50+
$numCodesPerRow *= 1.3; // the .3 here accounts for px differences in <code> and base em sizes.
51+
52+
return "max-height: {$numCodesPerRow}em;";
53+
}
54+
?>
55+
<div class="code-container" style="<?= calculateMaxHeightStyle($newCodes) ?>">
56+
<?php foreach ($newCodes as $newCode): ?>
57+
<code>☐ <?= htmlentities($newCode) ?></code>
58+
<?php endforeach; ?>
59+
</div>
60+
61+
<span class="mdl-typography--caption"><?= $this->t('{material:mfa:new_codes_only_once}') ?></span>
62+
</div>
63+
64+
<div class="mdl-card__actions" layout-children="row">
65+
<script>
66+
function printElement(selector) {
67+
var elementToPrint = document.querySelector(selector);
68+
69+
elementToPrint.classList.add('printable-codes');
70+
71+
window.print();
72+
}
73+
</script>
74+
<button class="mdl-button mdl-button--primary" type="button" onclick="printElement('#code-card')">
75+
<?= $this->t('{material:mfa:button_print}') ?>
76+
</button>
77+
78+
<a href="data:text/plain,<?= $idpName . urlencode("\r\n" . join("\r\n", $newCodes)) ?>"
79+
download="<?= $idpName ?>-printable-codes.txt" class="mdl-button mdl-button--primary">
80+
<?= $this->t('{material:mfa:button_download}') ?>
81+
</a>
82+
83+
<script>
84+
function copyCodesToClipboard(button) {
85+
document.querySelector('textarea').select();
86+
87+
document.execCommand('copy');
88+
89+
button.innerHTML = button.innerHTML.replace('<?= $this->t("{material:mfa:button_copy}") ?>', '<?= $this->t("{material:mfa:button_copied}") ?>');
90+
}
91+
</script>
92+
<button class="mdl-button mdl-button--primary" type="button" onclick="copyCodesToClipboard(this)">
93+
<?= $this->t('{material:mfa:button_copy}') ?>
94+
<textarea class="out-of-sight"><?= $idpName."\n".join("\n", $newCodes) ?></textarea>
95+
</button>
96+
</div>
97+
</div>
98+
<?php else: ?>
99+
<div class="mdl-card mdl-shadow--8dp">
100+
<div class="mdl-card__media white-bg margin" layout-children="column">
101+
<i class="mdl-color-text--red error material-icons mdl-typography--display-4">error</i>
102+
</div>
103+
104+
<div class="mdl-card__title center">
105+
<h1 class="mdl-card__title-text">
106+
<?= $this->t('{material:error:header}') ?>
107+
</h1>
108+
</div>
109+
110+
<div class="mdl-card__supporting-text" >
111+
<p>
112+
<?= $this->t('{material:mfa:new_codes_failed}') ?>
113+
<a href="<?= $this->data['mfaSetupUrl'] ?>" target="_blank"><?= $this->data['mfaSetupUrl'] ?></a>
114+
</p>
115+
</div>
116+
</div>
117+
118+
<script>
119+
ga('send','event','error','backupcode','generation-failed');
120+
</script>
121+
<?php endif; ?>
122+
123+
<div layout-children="row" class="fill-parent">
124+
<span flex></span>
125+
126+
<button name="continue" class="mdl-button mdl-button--raised mdl-button--primary">
127+
<?= $this->t('{material:mfa:button_continue}') ?>
128+
</button>
129+
</div>
130+
</form>
131+
</main>
132+
</div>
133+
</body>
134+
</html>

‎themes/material/mfa/out-of-backup-codes.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@
4646

4747
<span flex></span>
4848

49-
<button name="setUpMfa" class="mdl-button mdl-button--raised mdl-button--primary">
49+
<button name="getMore" class="mdl-button mdl-button--raised mdl-button--primary">
5050
<?= $this->t('{material:mfa:button_get_more}') ?>
5151
</button>
5252
</div>

www/styles.2.2.4.css renamed to www/styles.2.3.0.css

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@ p {
22
max-width: 60ch;
33
}
44

5+
pre {
6+
white-space: pre-line;
7+
max-width: 100%;
8+
}
9+
510
.fill-viewport {
611
width: 100vw;
712
height: 100vh;
@@ -27,6 +32,37 @@ p {
2732
align-items: center;
2833
}
2934

35+
.code-container {
36+
display: flex;
37+
flex-direction: column;
38+
align-items: center;
39+
min-width: 16em; /* allows for 2 columns, i.e., codes are 8-digits */
40+
flex-wrap: wrap;
41+
padding-bottom: 1em;
42+
}
43+
44+
.out-of-sight {
45+
position: absolute;
46+
right: 100%;
47+
}
48+
49+
@media print {
50+
body * {
51+
visibility: hidden;
52+
}
53+
54+
.printable-codes {
55+
position: fixed;
56+
top: 0;
57+
left: 0;
58+
width: 20em; /* based on the fact that a code and its checkbox take about 10 em's and there will be a max of 2 cols */
59+
}
60+
61+
.printable-codes, .printable-codes * {
62+
visibility: visible;
63+
}
64+
}
65+
3066
[child-spacing=space-around] {
3167
justify-content: space-around;
3268
}
@@ -52,6 +88,7 @@ form p.error > i {
5288
i.material-icons.mdl-typography--display-4 {
5389
font-size: 112px; /* needed to override font-size established in material icons. */
5490
}
91+
5592
.margin {
5693
margin: 1em;
5794
}

0 commit comments

Comments
 (0)