nopaque/app/templates/_base/scripts.html.j2

<script src="{{ url_for('static', filename='external/materialize/js/materialize.min.js') }}"></script>
<script src="{{ url_for('static', filename='external/JSON-Patch/js/fast-json-patch.min.js') }}"></script>
<script src="{{ url_for('static', filename='external/list.js/js/list.min.js') }}"></script>
<script src="{{ url_for('static', filename='external/pako/js/pako_inflate.min.js') }}"></script>
<script src="{{ url_for('static', filename='external/plotly.js/js/plotly.min.js') }}"></script>
<script src="{{ url_for('static', filename='external/socket.io/js/socket.io.min.js') }}"></script>
{% assets
    filters='rjsmin',
    output='gen/nopaque.%(version)s.js',
    'js/index.js',
    'js/app/index.js',
    'js/app/client.js',
    'js/app/endpoints/index.js',
    'js/app/endpoints/corpora.js',
    'js/app/endpoints/jobs.js',
    'js/app/endpoints/settings.js',
    'js/app/endpoints/users.js',
    'js/app/extensions/index.js',
    'js/app/extensions/toaster.js',
    'js/app/extensions/ui.js',
    'js/app/extensions/user-hub.js',
    'js/utils.js',

    'js/forms/index.js',
    'js/forms/base-form.js',
    'js/forms/create-contribution-form.js',
    'js/forms/create-corpus-file-form.js',
    'js/forms/create-job-form.js',

    'js/resource-displays/index.js',
    'js/resource-displays/resource-display.js',
    'js/resource-displays/corpus-display.js',
    'js/resource-displays/job-display.js',

    'js/resource-lists/index.js',
    'js/resource-lists/resource-list.js',
    'js/resource-lists/admin-user-list.js',
    'js/resource-lists/corpus-file-list.js',
    'js/resource-lists/corpus-follower-list.js',
    'js/resource-lists/corpus-list.js',
    'js/resource-lists/corpus-text-info-list.js',
    'js/resource-lists/corpus-token-list.js',
    'js/resource-lists/detailed-public-corpus-list.js',
    'js/resource-lists/job-input-list.js',
    'js/resource-lists/job-list.js',
    'js/resource-lists/job-result-list.js',
    'js/resource-lists/public-corpus-list.js',
    'js/resource-lists/public-user-list.js',
    'js/resource-lists/spacy-nlp-pipeline-model-list.js',
    'js/resource-lists/tesseract-ocr-pipeline-model-list.js',

    'js/requests/index.js',
    'js/requests/admin.js',
    'js/requests/contributions.js',
    'js/requests/corpora.js',
    'js/requests/users.js',

    'js/corpus-analysis/index.js',
    'js/corpus-analysis/cqi/index.js',
    'js/corpus-analysis/cqi/constants.js',
    'js/corpus-analysis/cqi/errors.js',
    'js/corpus-analysis/cqi/status.js',
    'js/corpus-analysis/cqi/api/index.js',
    'js/corpus-analysis/cqi/api/client.js',
    'js/corpus-analysis/cqi/models/index.js',
    'js/corpus-analysis/cqi/models/resource.js',
    'js/corpus-analysis/cqi/models/attributes.js',
    'js/corpus-analysis/cqi/models/subcorpora.js',
    'js/corpus-analysis/cqi/models/corpora.js',
    'js/corpus-analysis/cqi/client.js',
    'js/corpus-analysis/query-builder/index.js',
    'js/corpus-analysis/query-builder/element-references.js',
    'js/corpus-analysis/query-builder/query-builder.js',
    'js/corpus-analysis/query-builder/structural-attribute-builder-functions.js',
    'js/corpus-analysis/query-builder/token-attribute-builder-functions.js',
    'js/corpus-analysis/app.js',
    'js/corpus-analysis/concordance-extension.js',
    'js/corpus-analysis/reader-extension.js',
    'js/corpus-analysis/static-visualization-extension.js'
-%}
<script src="{{ ASSET_URL }}"></script>
{% endassets -%}

{# TODO: Think about implementing the following inside a main.js(.j2) #}
<script>
  var app;
  var currentUserId;

  async function main() {
    app = new nopaque.app.Client();
    app.init();

    {% if not current_user.is_authenticated %}
    const currentUserId = null;
    {% else %}
    currentUserId = {{ current_user.hashid|tojson }};

    try {
      await app.userHub.add(currentUserId);
    } catch (error) {
      app.ui.flash('Failed to load user data.', 'error');
    }

    {% if not current_user.terms_of_use_accepted %}
    const termsOfUseModalElement = document.querySelector('#terms-of-use-modal');
    const termsOfUseModal = M.Modal.getInstance(termsOfUseModalElement);

    termsOfUseModal.open();
    {% endif %}
    {% endif %}

    const flashedMessages = {{ get_flashed_messages()|tojson }};

    for (let [category, message] of flashedMessages) {
      app.ui.flash(message, message);
    }
  }

  main();
</script>