mirror of
https://github.com/wallabag/wallabag.git
synced 2025-03-13 22:52:39 +00:00
Extract Annotations controller
This commit is contained in:
parent
f76aae2354
commit
09a55ac2c9
3 changed files with 66 additions and 55 deletions
57
assets/controllers/annotations_controller.js
Normal file
57
assets/controllers/annotations_controller.js
Normal file
|
@ -0,0 +1,57 @@
|
|||
import { Controller } from '@hotwired/stimulus';
|
||||
import annotator from 'annotator';
|
||||
|
||||
export default class extends Controller {
|
||||
static values = {
|
||||
entryId: Number,
|
||||
createUrl: String,
|
||||
updateUrl: String,
|
||||
destroyUrl: String,
|
||||
searchUrl: String,
|
||||
};
|
||||
|
||||
connect() {
|
||||
this.app = new annotator.App();
|
||||
|
||||
this.app.include(annotator.ui.main, {
|
||||
element: this.element,
|
||||
});
|
||||
|
||||
const authorization = {
|
||||
permits() { return true; },
|
||||
};
|
||||
this.app.registry.registerUtility(authorization, 'authorizationPolicy');
|
||||
|
||||
this.app.include(annotator.storage.http, {
|
||||
prefix: '',
|
||||
urls: {
|
||||
create: this.createUrlValue,
|
||||
update: this.updateUrlValue,
|
||||
destroy: this.destroyUrlValue,
|
||||
search: this.searchUrlValue,
|
||||
},
|
||||
entryId: this.entryIdValue,
|
||||
onError(msg, xhr) {
|
||||
if (!Object.prototype.hasOwnProperty.call(xhr, 'responseJSON')) {
|
||||
annotator.notification.banner('An error occurred', 'error');
|
||||
return;
|
||||
}
|
||||
Object.values(xhr.responseJSON.children).forEach((v) => {
|
||||
if (v.errors) {
|
||||
Object.values(v.errors).forEach((errorText) => {
|
||||
annotator.notification.banner(errorText, 'error');
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
this.app.start().then(() => {
|
||||
this.app.annotations.load({ entry: this.entryIdValue });
|
||||
});
|
||||
}
|
||||
|
||||
disconnect() {
|
||||
this.app.destroy();
|
||||
}
|
||||
}
|
|
@ -6,9 +6,6 @@ import $ from 'jquery';
|
|||
import '@materializecss/materialize/dist/css/materialize.css';
|
||||
import '@materializecss/materialize/dist/js/materialize';
|
||||
|
||||
/* Annotations */
|
||||
import annotator from 'annotator';
|
||||
|
||||
import ClipboardJS from 'clipboard';
|
||||
import 'mathjax/es5/tex-svg';
|
||||
|
||||
|
@ -33,45 +30,7 @@ import './js/shortcuts/entry';
|
|||
/* Theme style */
|
||||
import './scss/index.scss';
|
||||
|
||||
/* ==========================================================================
|
||||
Annotations
|
||||
========================================================================== */
|
||||
|
||||
$(document).ready(() => {
|
||||
if ($('#article').length) {
|
||||
const app = new annotator.App();
|
||||
|
||||
app.include(annotator.ui.main, {
|
||||
element: document.querySelector('article'),
|
||||
});
|
||||
|
||||
const authorization = {
|
||||
permits() { return true; },
|
||||
};
|
||||
app.registry.registerUtility(authorization, 'authorizationPolicy');
|
||||
|
||||
const x = JSON.parse($('#annotationroutes').html());
|
||||
app.include(annotator.storage.http, $.extend({}, x, {
|
||||
onError(msg, xhr) {
|
||||
if (!Object.prototype.hasOwnProperty.call(xhr, 'responseJSON')) {
|
||||
annotator.notification.banner('An error occurred', 'error');
|
||||
return;
|
||||
}
|
||||
$.each(xhr.responseJSON.children, (k, v) => {
|
||||
if (v.errors) {
|
||||
$.each(v.errors, (n, errorText) => {
|
||||
annotator.notification.banner(errorText, 'error');
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
}));
|
||||
|
||||
app.start().then(() => {
|
||||
app.annotations.load({ entry: x.entryId });
|
||||
});
|
||||
}
|
||||
|
||||
document.querySelectorAll('[data-handler=tag-rename]').forEach((item) => {
|
||||
const current = item;
|
||||
current.wallabag_edit_mode = false;
|
||||
|
|
|
@ -322,7 +322,15 @@
|
|||
</div>
|
||||
|
||||
</aside>
|
||||
<article{% if entry.language is defined and entry.language is not null %} lang="{{ entry.getHTMLLanguage() }}"{% endif %} data-controller="highlight">
|
||||
<article
|
||||
{% if entry.language is defined and entry.language is not null %} lang="{{ entry.getHTMLLanguage() }}"{% endif %}
|
||||
data-controller="highlight annotations"
|
||||
data-annotations-entry-id-value="{{ entry.id }}"
|
||||
data-annotations-create-url-value="{{ path('annotations_post_annotation', {'entry': entry.id}) }}"
|
||||
data-annotations-update-url-value="{{ path('annotations_put_annotation', {'annotation': 'idAnnotation'}) }}"
|
||||
data-annotations-destroy-url-value="{{ path('annotations_delete_annotation', {'annotation': 'idAnnotation'}) }}"
|
||||
data-annotations-search-url-value="{{ path('annotations_get_annotations', {'entry': entry.id}) }}"
|
||||
>
|
||||
{{ entry.content|raw }}
|
||||
</article>
|
||||
|
||||
|
@ -343,19 +351,6 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="annotationroutes" type="application/json">
|
||||
{
|
||||
"prefix": "",
|
||||
"urls": {
|
||||
"create": "{{ path('annotations_post_annotation', {'entry': entry.id}) }}",
|
||||
"update": "{{ path('annotations_put_annotation', {'annotation': 'idAnnotation'}) }}",
|
||||
"destroy": "{{ path('annotations_delete_annotation', {'annotation': 'idAnnotation'}) }}",
|
||||
"search": "{{ path('annotations_get_annotations', {'entry': entry.id}) }}"
|
||||
},
|
||||
"entryId": "{{ entry.id }}"
|
||||
}</script>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
|
|
Loading…
Reference in a new issue