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.js',
    'js/app/index.js',
    'js/app/endpoints/index.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/jobs.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 -%}

<script>
  // TODO: Implement an app.run method and use this for all of the following
  const app = new nopaque.App();
  app.init();

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

  app.userHub.add(currentUserId)
    .catch((error) => {throw JSON.stringify(error);});

  {% if not current_user.terms_of_use_accepted %}
  M.Modal.getInstance(document.querySelector('#terms-of-use-modal')).open();
  {% endif %}
  {% else %}
  const currentUserId = null;
  {% endif %}

  // Display flashed messages
  for (let [category, message] of {{ get_flashed_messages(with_categories=True)|tojson }}) {
    app.ui.flash(message, message);
  }
</script>

<script>
  let languageModalSwitch = document.querySelector('#terms-of-use-modal-switch');
  let termsOfUseModalContent = document.querySelectorAll('.terms-of-use-modal-content');
  if (languageModalSwitch) {
    languageModalSwitch.addEventListener('change', () => {
      termsOfUseModalContent.forEach(content => {
        content.classList.toggle('hide');
      });
    });
  }
</script>