Add the ability to select a batch of QuickStatements to run

scholia/app/static/css/scholia.css

@@ -239,6 +239,11 @@ a.dropdown-item.active {
     animation-delay: 2s;
 }
 
+.large-checkbox {
+    width: 18.5px;
+    height: 18.5px;
+}
+
 @keyframes scholia {
     33% {
         border-color: var(--theme-red);

scholia/app/templates/base.html

@@ -934,7 +934,7 @@
       Tools
     </a>
     <div class="dropdown-menu" aria-labelledby="toolsDropdown">
-      <a class="dropdown-item" href="{{ url_for('app.show_arxiv_to_quickstatements') }}">Arxiv to Quickstatements</a>
+      <a class="dropdown-item" href="{{ url_for('app.show_id_to_quickstatements') }}">Identifier to Quickstatements</a>
       <a class="dropdown-item" href="{{ url_for('app.show_q_to_bibliography_templates') }}">Q to Bibliography templates</a>
       <a class="dropdown-item" href="{{ url_for('app.show_text_to_topics') }}">Text to topics</a>
     </div>

scholia/app/templates/id-to-quickstatements.html

@@ -0,0 +1,200 @@
+{% extends "base.html" %}
+
+
+{% block page_content %}
+
+<h1>Identifier to QuickStatements</h1>
+
+
+<h2>Input</h2>
+
+<form action="" id="form" method="GET" class="form-horizontal mb-3">
+  <div class="input-group">
+    {% if query %}
+    <input type="text" class="form-control" placeholder="Enter a single or list of arXiv IDs or DOIs"
+      value="{{ query }}" id="searchterm" name="query" />
+    {% else %}
+    <input type="text" class="form-control" placeholder="Enter a single or list of arXiv IDs or DOIs" id="searchterm"
+      name="query" />
+    {% endif %}
+    <span class="input-group-append">
+      <button class="btn btn-primary" type="submit">
+        Submit
+      </button>
+    </span>
+  </div>
+</form>
+
+<p>Enter a single or list of <a href="https://arxiv.org">arXiv</a> identifiers or <a href="https://doi.org">DOIs</a> to
+  retrieve their Wikidata items or QuickStatements to create items for them.</p>
+
+<p>Bare IDs (such as "1703.06103" or "10.1371/JOURNAL.PONE.0029797") or URLs (such as "https://arxiv.org/abs/1703.06103"
+  or "https://doi.org/10.1371/JOURNAL.PONE.0029797") can be used and the list can be
+  comma, space, pipe or tab separated. Note that new items in Wikidata may not be immediately found because of caching.
+</p>
+
+{% if error %}
+<div class="alert alert-warning" role="alert">
+  No results returned, potentially due to the upstream server being down. Please try again later. If the issue persists
+  <a
+    href="https://github.com/WDscholia/scholia/issues/new?assignees=&labels=bug&projects=&template=bug_report.md&title=">submit
+    a bug report on GitHub</a>.
+</div>
+{% endif %}
+
+{% if (qs|length) > 0 %}
+<h2>{{ qs|length}} Found</h2>
+{% endif %}
+
+{% if (qs|length) == 1 %}
+
+<div id="searchresult">{{ qs[0][0] }} has been entered as <a href="work/{{ qs[0][1] }}">{{ qs[0][1] }}</a></div>
+
+{% endif %}
+
+{% if (qs|length) > 1 %}
+
+<div id="searchresult">In Wikidata:
+  <ul>
+    {% for q in qs %}
+    <li>{{ q[0] }}: <a href="work/{{ q[1] }}">{{ q[1] }}</a></li>
+    {% endfor %}
+  </ul>
+</div>
+
+{% endif %}
+
+{% if (quickstatements|length) > 0 %}
+<h2>{{(quickstatements|length)}} Not Found</h2>
+
+<blockquote>Select statements which you want to contribute and use the buttons at the bottom of the section to complete
+  the action.</blockquote>
+<input type="checkbox" class="d-none" id="select-all-state" />
+<button class="btn btn-secondary select-all">Select all</button> <button class="btn btn-secondary invert-selection">Invert selection</button>
+<div class="container">
+  {% for quickstatement in quickstatements %}
+  <div class="row">
+    <div class="col-1 align-self-center">
+      <input type="checkbox" class="select-item checkbox large-checkbox" name="select-item" value="{{loop.index}}" />
+    </div>
+    <div class="col-8">
+      <pre>{{ quickstatement }}</pre>
+    </div>
+    <div class="d-none" id="qs-{{loop.index}}-url">{{ quickstatement | replace('\t', '|') | replace('\n', '||') | urlencode
+      | replace('/','%2F') }}</div>
+    <div class="d-none" id="qs-{{loop.index}}-plain">{{ quickstatement | replace('\t', '|') | replace('\n', '||') 
+      | replace('/','%2F') }}</div>
+    <div class="col-3 align-self-center">
+      <a
+        href="https://quickstatements.toolforge.org/#/v1={{ quickstatement | replace('\t', '|') | replace('\n', '||') | urlencode | replace('/','%2F') }}"><button
+          class="btn btn-outline-secondary">Submit to Quickstatements ↗</button></a>
+      <button class="btn btn-outline-secondary copy-button" name="{{loop.index}}">Copy to clipboard</button>
+    </div>
+  </div>
+  {% endfor %}
+</div>
+
+<div class="d-flex justify-content-between">
+  <div>
+    <button class="btn btn-primary select-all">Select all</button>
+    <button class="btn btn-primary invert-selection">Invert selection</button>
+  </div>
+  <div>
+    <button class="btn btn-primary ml-auto" id="submit-all-button">Submit to Quickstatements ↗</button>
+    <button class="btn btn-primary" id="copy-all-button">Copy to clipboard</button>
+  </div>
+</div>
+</div>
+
+
+{% endif %}
+
+{% if (failed|length) > 0 %}
+<h2>{{(failed|length)}} Failed</h2>
+
+<ul>
+  {% for fail in failed %}
+  <li>{{ fail[0] }}: {{ fail[1] }}</a></li>
+  {% endfor %}
+</ul>
+{% endif %}
+
+
+{% endblock %}
+
+{% block scripts %}
+{{super()}}
+<script type="text/javascript">
+  const select_alls = document.getElementsByClassName("select-all");
+  const select_all_state = document.getElementById("select-all-state");
+  for (const select_all of select_alls) {
+    select_all.addEventListener("click", () => {
+      select_all_state.checked = !select_all_state.checked;
+      const checked = select_all_state.checked;
+      const checkboxes = document.getElementsByClassName("checkbox");
+      for (const checkbox of checkboxes) {
+        checkbox.checked = checked;
+      }
+    })
+  }
+
+  const invert_selections = document.getElementsByClassName("invert-selection");
+  for (const invert_selection of invert_selections) {
+    invert_selection.addEventListener("click", () => {
+      const checkboxes = document.getElementsByClassName("checkbox");
+      for (const checkbox of checkboxes) {
+        checkbox.checked = !checkbox.checked;
+      }
+    })
+  }
+
+  const copy_buttons = document.getElementsByClassName("copy-button");
+  for (const copy_button of copy_buttons) {
+    copy_button.addEventListener("click", () => {
+      const qs_id = copy_button["name"];
+      const quickstatements = document.getElementById("qs-" + qs_id + "-plain");
+      if (navigator.clipboard) {
+        navigator.clipboard.writeText(quickstatements.innerText)
+      }
+    })
+  }
+
+  const copy_all = document.getElementById("copy-all-button");
+  copy_all.addEventListener("click", () => {
+    var items = [];
+    document.querySelectorAll("input.select-item:checked:checked").forEach((item, index) => {
+      console.log(index)
+      console.log(item)
+      const qs_id = item["value"];
+      const quickstatements = document.getElementById("qs-" + qs_id + "-plain");
+      items.push(quickstatements.innerText);
+    });
+    if (items.length < 1) {
+      const parent = copy_all.parentNode.parentNode;
+      parent.insertAdjacentHTML('afterend', `<div class="alert alert-warning" role="alert">Select at least one row using the checkbox on the left</div>`);
+    } else {
+      var values = items.join('\n\n');
+      if (navigator.clipboard) {
+        navigator.clipboard.writeText(values)
+      }
+    }
+  });
+
+  const submit_all = document.getElementById("submit-all-button");
+  submit_all.addEventListener("click", () => {
+    var items = [];
+    document.querySelectorAll("input.select-item:checked:checked").forEach((item, index) => {
+      const qs_id = item["value"];
+      const quickstatements = document.getElementById("qs-" + qs_id + "-url");
+      items.push(quickstatements.innerText);
+    });
+    if (items.length < 1) {
+      const parent = submit_all.parentNode.parentNode;
+      parent.insertAdjacentHTML('afterend', `<div class="alert alert-warning" role="alert">Select at least one row using the checkbox on the left</div>`);
+    } else {
+      const values = items.join('||');
+      window.location.href = "https://quickstatements.toolforge.org/#/v1=" + values
+    }
+  });
+</script>
+{% endblock %}