| 1 |
{% if two_factor.isActivated %} |
| 2 |
<script type="application/javascript"> |
| 3 |
|
| 4 |
jQuery(document).ready(function ($) { |
| 5 |
jQuery('#wtotem-2fa-deactivate').on('click', function(e) { |
| 6 |
|
| 7 |
jQuery('#wtotem-2fa-wrap').addClass('wtotem_loader_spinner'); |
| 8 |
e.preventDefault(); |
| 9 |
e.stopPropagation(); |
| 10 |
|
| 11 |
jQuery.post( |
| 12 |
ajaxurl, |
| 13 |
{ |
| 14 |
action: 'wtotem_ajax', |
| 15 |
ajax_action: 'two_factor_auth', |
| 16 |
case_action: 'deactivate', |
| 17 |
wtotem_page_nonce: '{{ page_nonce }}', |
| 18 |
{% if user_id %} user_id: {{ user_id }}, {% endif %} |
| 19 |
}, |
| 20 |
function (data) { |
| 21 |
jQuery('#wtotem-2fa-wrap').removeClass('wtotem_loader_spinner'); |
| 22 |
jQuery('#wtotem_notifications').html(data.notifications); |
| 23 |
|
| 24 |
if(data.success){ |
| 25 |
jQuery('#wtotem-2fa-wrap-inner').html(data.content); |
| 26 |
} |
| 27 |
|
| 28 |
} |
| 29 |
); |
| 30 |
|
| 31 |
}); |
| 32 |
}); |
| 33 |
</script> |
| 34 |
|
| 35 |
<p class="wtotem-content-text">{{ 'Two-factor authentication is currently active on your account. You may deactivate it by clicking the button below'|trans }}.</p> |
| 36 |
|
| 37 |
<div class="wtotem_settings_submit_wrap"> |
| 38 |
<button class="wtotem_control__btn" id="wtotem-2fa-deactivate" type="submit">{{ 'Deactivate 2FA' |trans }}</button> |
| 39 |
</div> |
| 40 |
|
| 41 |
{% else %} |
| 42 |
|
| 43 |
<script type="application/javascript"> |
| 44 |
jQuery(document).ready(function ($) { |
| 45 |
$(function() { |
| 46 |
$('#wtotem_ga_qr').qrcode({text: '{{ two_factor.qr_url | raw}}', width: (window.outerWidth < 500) ? 175 : 250, height: (window.outerWidth < 500) ? 175 : 250 }); |
| 47 |
if (window.outerWidth < 500) { |
| 48 |
$('#wtotem_qr_text').attr('size', 35).css('font-family', 'monospace'); |
| 49 |
} |
| 50 |
}); |
| 51 |
|
| 52 |
jQuery('#wtotem-recovery-download').on('click', function(e) { |
| 53 |
e.preventDefault(); |
| 54 |
e.stopPropagation(); |
| 55 |
saveAs(new Blob(["{{two_factor.fileContents}}"], {type: "text/plain;charset=" + document.characterSet}), '{{two_factor.fileName}}'); |
| 56 |
//var savedRecoveryCodes = true; |
| 57 |
}); |
| 58 |
|
| 59 |
jQuery('#wtotem-recovery-copy').on('click', function(e) { |
| 60 |
try { |
| 61 |
navigator.clipboard.writeText("{{two_factor.fileContents}}"); |
| 62 |
} catch(err) { |
| 63 |
if(typeof document.execCommand == 'function') { |
| 64 |
var $tmp = $("<textarea>"); |
| 65 |
$("body").append($tmp); |
| 66 |
$tmp.val("{{two_factor.fileContents}}").select(); |
| 67 |
document.execCommand("copy"); |
| 68 |
$tmp.remove(); |
| 69 |
} |
| 70 |
} |
| 71 |
}); |
| 72 |
|
| 73 |
jQuery('#wtotem-2fa-activate-field').on('keyup', function(e) { |
| 74 |
jQuery('#wtotem-2fa-activate').toggleClass('wtotem_disabled', jQuery('#wtotem-2fa-activate-field').val().length !== 6); |
| 75 |
|
| 76 |
if (e.keyCode === 13) { |
| 77 |
jQuery('#wtotem-2fa-activate').trigger('click'); |
| 78 |
} |
| 79 |
}); |
| 80 |
|
| 81 |
jQuery('#wtotem-2fa-activate').on('click', function(e) { |
| 82 |
|
| 83 |
jQuery('#wtotem-2fa-wrap').addClass('wtotem_loader_spinner'); |
| 84 |
e.preventDefault(); |
| 85 |
e.stopPropagation(); |
| 86 |
|
| 87 |
jQuery.post( |
| 88 |
ajaxurl, |
| 89 |
{ |
| 90 |
action: 'wtotem_ajax', |
| 91 |
ajax_action: 'two_factor_auth', |
| 92 |
case_action: 'activate', |
| 93 |
wtotem_page_nonce: '{{ page_nonce }}', |
| 94 |
secret: '{{ two_factor.secret }}', |
| 95 |
recovery: '{{ two_factor.recovery | raw }}', |
| 96 |
code: $('#wtotem-2fa-activate-field').val(), |
| 97 |
{% if user_id %} user_id: {{ user_id }}, {% endif %} |
| 98 |
}, |
| 99 |
function (data) { |
| 100 |
jQuery('#wtotem-2fa-wrap').removeClass('wtotem_loader_spinner'); |
| 101 |
jQuery('#wtotem_notifications').html(data.notifications); |
| 102 |
|
| 103 |
if(data.success){ |
| 104 |
jQuery('#wtotem-2fa-wrap-inner').html(data.content); |
| 105 |
} |
| 106 |
|
| 107 |
} |
| 108 |
); |
| 109 |
|
| 110 |
}); |
| 111 |
|
| 112 |
jQuery('#two_factor').on('change', function (e) { |
| 113 |
if(jQuery(this).is(':checked')){ |
| 114 |
jQuery('#two_factor-details').removeClass('visually-hidden'); |
| 115 |
} else { |
| 116 |
jQuery('#two_factor-details').addClass('visually-hidden'); |
| 117 |
} |
| 118 |
}); |
| 119 |
|
| 120 |
}); |
| 121 |
|
| 122 |
</script> |
| 123 |
|
| 124 |
|
| 125 |
<ul class="wtotem-mb-20"> |
| 126 |
<li class="togglers-list__item one-element"> |
| 127 |
<div> |
| 128 |
<p class="togglers-list__name"> |
| 129 |
{{ 'Activate 2FA'|trans }} |
| 130 |
<div class="wtotem_title-info__info wtotem-tooltip wtotem-tooltip-top" data-service="Activate 2FA"> |
| 131 |
<div class="wtotem-tooltip__content"> |
| 132 |
<p class="wtotem-tooltip__header">{{ 'Activate 2FA'|trans }}</p> |
| 133 |
<p class="wtotem-tooltip__text"> |
| 134 |
{{ 'Enables two-factor authorization for the current user'|trans }} |
| 135 |
</p> |
| 136 |
</div> |
| 137 |
</div> |
| 138 |
</p> |
| 139 |
</div> |
| 140 |
|
| 141 |
<div class="wtotem_option__checkbox onoff"> |
| 142 |
<input type="checkbox" class="onoff__input" id="two_factor" |
| 143 |
value="{{ two_factor.isActivated }}" {{ two_factor.isActivated }}/> |
| 144 |
|
| 145 |
<label for="two_factor" class="onoff__label"> |
| 146 |
<span class="onoff__circle"></span> |
| 147 |
</label> |
| 148 |
</div> |
| 149 |
</li> |
| 150 |
</ul> |
| 151 |
|
| 152 |
<div id="two_factor-details" class="{% if (two_factor.isActivated == false) %}visually-hidden{% endif %}"> |
| 153 |
|
| 154 |
<h3 class="wtotem-mb-15 wtotem-content-text">{{ '1. Scan Code or Enter Key'|trans }}</h3> |
| 155 |
<p class="wtotem-mb-15 wtotem-content-text">{{ 'Scan the code below with your mobile app to add this account. Some authenticator apps also allow you to type in the text version instead.'|trans }}</p> |
| 156 |
|
| 157 |
<div class="wtotem-tabs"> |
| 158 |
|
| 159 |
<ul class="wtotem-tabs__caption firewall-configuration__list-types"> |
| 160 |
<li class="firewall-configuration__list-types-item active">{{ 'Scan QR'|trans }}</li> |
| 161 |
<li class="firewall-configuration__list-types-item">{{ 'Enter key'|trans }}</li> |
| 162 |
</ul> |
| 163 |
|
| 164 |
<div class="wtotem-tabs__content active"> |
| 165 |
<div id="wtotem_ga_qr" class="wtotem-mb-15"> |
| 166 |
<img src="" alt=""> |
| 167 |
</div> |
| 168 |
</div> |
| 169 |
<div class="wtotem-tabs__content"> |
| 170 |
<div class="text-align-center"> |
| 171 |
<input value="{{ two_factor.secret }}" type="text" id="wtotem_qr_text" class="wtotem_settings_input wtotem-mb-15 text-align-center" disabled> |
| 172 |
</div> |
| 173 |
|
| 174 |
</div> |
| 175 |
</div> |
| 176 |
|
| 177 |
<hr class="wtotem-hr wtotem-mb-15"> |
| 178 |
|
| 179 |
<h3 class="wtotem-mb-15 wtotem-content-text">{{ '2. Enter Code from mobile app'|trans }}</h3> |
| 180 |
<div class="wtotem-block-content"> |
| 181 |
<p class="wtotem-content-text">{{ 'Use one of these codes to log in if you lose access to your authenticator device.'|trans }}</p> |
| 182 |
|
| 183 |
<div class="wtotem-recovery-list"> |
| 184 |
<ul class="wtotem-recovery-codes"> |
| 185 |
{% for code in two_factor.blocks %} |
| 186 |
<li>{{ code }}</li> |
| 187 |
{% endfor %} |
| 188 |
</ul> |
| 189 |
<div class="wtotem-recovery-btn"> |
| 190 |
<img src="{{ images_path }}copy-min.svg" alt="" id="wtotem-recovery-copy"> |
| 191 |
<img src="{{ images_path }}download-mini.svg" alt="" id="wtotem-recovery-download"> |
| 192 |
</div> |
| 193 |
</div> |
| 194 |
|
| 195 |
<p class="wtotem-mb-15 wtotem-content-text">{{ 'Enter the code from your mobile app below to verify and activate two-factor authentication for this account'|trans }}</p> |
| 196 |
<input type="text" class="wtotem_settings_input" id="wtotem-2fa-activate-field" value="" size="6" maxlength="6" placeholder="{{ 'Enter the code'|trans }}" autocomplete="off"> |
| 197 |
|
| 198 |
<div class="wtotem_settings_submit_wrap"> |
| 199 |
<button class="wtotem_control__btn wtotem_disabled" id="wtotem-2fa-activate" type="submit">{{ 'Activate 2FA' |trans }}</button> |
| 200 |
</div> |
| 201 |
</div> |
| 202 |
|
| 203 |
</div> |
| 204 |
{% endif %} |
| 205 |
|
