Restructure some javascript

This commit is contained in:
Patrick Jentsch 2021-07-16 10:51:39 +02:00
parent 03adcdeebc
commit 096424e1e4
11 changed files with 14 additions and 9 deletions

3
.gitignore vendored
View File

@ -5,7 +5,8 @@
# Flask-Assets files # Flask-Assets files
.webassets-cache .webassets-cache
*.compiled.js *.bundle.css
*.bundle.js
# Docker related files # Docker related files
docker-compose.override.yml docker-compose.override.yml

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1 @@
{"version":3,"file":"list.min.js","sources":["webpack://List/list.min.js"],"mappings":"AAAA","sourceRoot":""}

View File

@ -28,7 +28,7 @@ class CorpusFileList extends RessourceList {
<a class="btn modal-close red waves-effect waves-light" href="${this.user.data.corpora[this.corpusId].files[corpusFileId].url}/delete"><i class="material-icons left">delete</i>Delete</a> <a class="btn modal-close red waves-effect waves-light" href="${this.user.data.corpora[this.corpusId].files[corpusFileId].url}/delete"><i class="material-icons left">delete</i>Delete</a>
</div> </div>
</div>`; </div>`;
let deleteModalParentElement = document.querySelector('main'); let deleteModalParentElement = document.querySelector('#modals');
deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML); deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML);
let deleteModalElement = deleteModalParentElement.lastChild; let deleteModalElement = deleteModalParentElement.lastChild;
let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}}); let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}});

View File

@ -26,7 +26,7 @@ class CorpusList extends RessourceList {
<a class="btn modal-close red waves-effect waves-light" href="${this.user.data.corpora[corpusId].url}/delete"><i class="material-icons left">delete</i>Delete</a> <a class="btn modal-close red waves-effect waves-light" href="${this.user.data.corpora[corpusId].url}/delete"><i class="material-icons left">delete</i>Delete</a>
</div> </div>
</div>`; </div>`;
let deleteModalParentElement = document.querySelector('main'); let deleteModalParentElement = document.querySelector('#modals');
deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML); deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML);
let deleteModalElement = deleteModalParentElement.lastChild; let deleteModalElement = deleteModalParentElement.lastChild;
let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}}); let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}});

View File

@ -26,7 +26,7 @@ class JobList extends RessourceList {
<a class="btn modal-close red waves-effect waves-light" href="${this.user.data.jobs[jobId].url}/delete"><i class="material-icons left">delete</i>Delete</a> <a class="btn modal-close red waves-effect waves-light" href="${this.user.data.jobs[jobId].url}/delete"><i class="material-icons left">delete</i>Delete</a>
</div> </div>
</div>`; </div>`;
let deleteModalParentElement = document.querySelector('main'); let deleteModalParentElement = document.querySelector('#modals');
deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML); deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML);
let deleteModalElement = deleteModalParentElement.lastChild; let deleteModalElement = deleteModalParentElement.lastChild;
let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}}); let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}});

View File

@ -26,7 +26,7 @@ class QueryResultList extends RessourceList {
<a class="btn modal-close red waves-effect waves-light" href="${this.user.data.query_results[queryResultId].url}/delete"><i class="material-icons left">delete</i>Delete</a> <a class="btn modal-close red waves-effect waves-light" href="${this.user.data.query_results[queryResultId].url}/delete"><i class="material-icons left">delete</i>Delete</a>
</div> </div>
</div>`; </div>`;
let deleteModalParentElement = document.querySelector('main'); let deleteModalParentElement = document.querySelector('#modals');
deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML); deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML);
let deleteModalElement = deleteModalParentElement.lastChild; let deleteModalElement = deleteModalParentElement.lastChild;
let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}}); let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}});

View File

@ -39,6 +39,7 @@ class RessourceList {
</div> </div>
</td> </td>
</tr>`; </tr>`;
this.list.list.style.cursor = 'pointer';
if (typeof this.onclick === 'function') {this.list.list.addEventListener('click', event => this.onclick(event));} if (typeof this.onclick === 'function') {this.list.list.addEventListener('click', event => this.onclick(event));}
} }

View File

@ -27,7 +27,7 @@ class UserList extends RessourceList {
<a class="btn modal-close red waves-effect waves-light" href="/admin/users/${userId}/delete"><i class="material-icons left">delete</i>Delete</a> <a class="btn modal-close red waves-effect waves-light" href="/admin/users/${userId}/delete"><i class="material-icons left">delete</i>Delete</a>
</div> </div>
</div>`; </div>`;
let deleteModalParentElement = document.querySelector('main'); let deleteModalParentElement = document.querySelector('#modals');
deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML); deleteModalParentElement.insertAdjacentHTML('beforeend', deleteModalHTML);
let deleteModalElement = deleteModalParentElement.lastChild; let deleteModalElement = deleteModalParentElement.lastChild;
let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}}); let deleteModal = M.Modal.init(deleteModalElement, {onCloseEnd: () => {deleteModal.destroy(); deleteModalElement.remove();}});

View File

@ -8,13 +8,13 @@
<script src="{{ url_for('static', filename='js/list.min.js') }}"></script> <script src="{{ url_for('static', filename='js/list.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/socket.io.min.js') }}"></script> <script src="{{ url_for('static', filename='js/socket.io.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/nopaque/main.js') }}"></script> <script src="{{ url_for('static', filename='js/nopaque/main.js') }}"></script>
{% assets filters='rjsmin', output="js/nopaque/RessourceDisplays.min.compiled.js", {% assets filters='rjsmin', output="js/nopaque/RessourceDisplays.min.bundle.js",
"js/nopaque/RessourceDisplays/RessourceDisplay.js", "js/nopaque/RessourceDisplays/RessourceDisplay.js",
"js/nopaque/RessourceDisplays/CorpusDisplay.js", "js/nopaque/RessourceDisplays/CorpusDisplay.js",
"js/nopaque/RessourceDisplays/JobDisplay.js" %} "js/nopaque/RessourceDisplays/JobDisplay.js" %}
<script src="{{ ASSET_URL }}"></script> <script src="{{ ASSET_URL }}"></script>
{% endassets %} {% endassets %}
{% assets filters='rjsmin', output="js/nopaque/RessourceLists.min.compiled.js", {% assets filters='rjsmin', output="js/nopaque/RessourceLists.min.bundle.js",
"js/nopaque/RessourceLists/RessourceList.js", "js/nopaque/RessourceLists/RessourceList.js",
"js/nopaque/RessourceLists/CorpusList.js", "js/nopaque/RessourceLists/CorpusList.js",
"js/nopaque/RessourceLists/CorpusFileList.js", "js/nopaque/RessourceLists/CorpusFileList.js",

View File

@ -33,9 +33,11 @@
{% block main_attribs %} class="background-color"{% endblock main_attribs %} {% block main_attribs %} class="background-color"{% endblock main_attribs %}
{% block main %} {% block main %}
{% block page_content %}{% endblock page_content %} {% block page_content %}{% endblock page_content %}
<div id="modals">
{% if current_user.is_authenticated %} {% if current_user.is_authenticated %}
{% include "_roadmap.html.j2" %} {% include "_roadmap.html.j2" %}
{% endif %} {% endif %}
</div>
{% endblock main %} {% endblock main %}
{% block footer_attribs %} class="page-footer primary-variant-color"{% endblock footer_attribs %} {% block footer_attribs %} class="page-footer primary-variant-color"{% endblock footer_attribs %}