1
0
Fork 0
mirror of https://github.com/wallabag/wallabag.git synced 2025-06-27 16:36:00 +00:00

Extract QRCode controller

This commit is contained in:
Yassine Guedidi 2025-02-23 22:40:55 +01:00
parent e5042074a2
commit 3125eb43ad
4 changed files with 12 additions and 11 deletions

View file

@ -0,0 +1,10 @@
import { Controller } from '@hotwired/stimulus';
import jrQrcode from 'jr-qrcode';
export default class extends Controller {
static values = { url: String };
connect() {
this.element.setAttribute('src', jrQrcode.getQrBase64(this.urlValue));
}
}

View file

@ -12,9 +12,6 @@ import annotator from 'annotator';
import ClipboardJS from 'clipboard';
import 'mathjax/es5/tex-svg';
/* jrQrcode */
import jrQrcode from 'jr-qrcode';
/* Fonts */
import 'material-design-icons-iconfont/dist/material-design-icons.css';
import 'lato-font/css/lato-font.css';
@ -342,10 +339,4 @@ $(document).ready(() => {
$('form[name="form_mass_action"] button[name="tag"]').trigger('click');
}
});
document.querySelectorAll('img.jr-qrcode').forEach((qrcode) => {
const src = jrQrcode.getQrBase64(qrcode.getAttribute('data-url'));
qrcode.setAttribute('src', src);
});
});

View file

@ -112,7 +112,7 @@
<div class="input-field col s12">
<h5>{{ 'config.form_settings.android_configuration'|trans }}</h5>
<a href="wallabag://{{ app.user.username }}@{{ wallabag_url }}" class="waves-effect waves-light btn hide-on-large-only">{{ 'config.form_settings.android_instruction'|trans }}</a>
<img class="hide-on-med-and-down jr-qrcode" alt="{{ 'config.otp.app.qrcode_label'|trans }}" data-url="wallabag://{{ app.user.username }}@{{ wallabag_url }}" />
<img data-controller="qrcode" data-qrcode-url-value="wallabag://{{ app.user.username }}@{{ wallabag_url }}" class="hide-on-med-and-down" alt="{{ 'config.otp.app.qrcode_label'|trans }}" />
</div>
</div>

View file

@ -15,7 +15,7 @@
<p>{{ 'config.otp.app.two_factor_code_description_2'|trans }}</p>
<p>
<img class="hide-on-med-and-down jr-qrcode" data-url="{{ qr_code|raw }}" />
<img data-controller="qrcode" data-qrcode-url-value="{{ qr_code|raw }}" class="hide-on-med-and-down" />
</p>
<p>