OpenKnowledgeMaps · chreman · Dec 10, 2021 · Nov 15, 2021 · Nov 15, 2021 · Nov 16, 2021
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -0,0 +1,36 @@
+# Changelog
+
+## 2021-12-09
+
+### New features
+
+- added abbreviation to list entry items (heading, source, authors)
+
+### Changes
+
+- refactored list entries code
+- heading & list UI changes
+    - moved info button to the context line
+    - moved pdf button
+    - minor list changes
+- major CSS changes (restyled the whole Headstart)
+
+### Removed
+
+- link buttons from list
+
+## 2021-11-25
+
+### New features
+
+- zooming and selecting papers with browser's back/forward buttons
+- adding a zoomed bubble/selected paper name to the page title
+
+### Changes
+
+- improved hot reloading in webpack
+- urls of local examples have changed
+
+### Removed
+
+- dead tracking code (Google Analytics, our custom endpoint) and related config parameter
diff --git a/examples/project_website/base.html b/examples/project_website/base.html
@@ -86,8 +86,10 @@
     <link rel="stylesheet" href="./css/main.css">
     <script>
         data_config.files = [{
-            title: "digital education",
-            file: "./data/digital-education.json"
+            //title: "digital education",
+            title: "calcium",
+            //file: "./data/digital-education.json"
+            file: "./data/calcium.json"
         }]
         data_config.server_url = window.location.href.replace(/[^/]*$/, '') + "./headstart/server/";
     </script>

diff --git a/examples/project_website/data-config_base.js b/examples/project_website/data-config_base.js
@@ -47,4 +47,5 @@ var data_config = {
   show_cite_button: true,
 
   highlight_query_terms: true,
+  show_context_oa_number: false,
 };
diff --git a/examples/project_website/data-config_pubmed.js b/examples/project_website/data-config_pubmed.js
@@ -45,6 +45,7 @@ var data_config = {
 
     show_cite_button: true,
 
-    highlight_query_terms: true
+    highlight_query_terms: true,
+    show_context_oa_number: false,
 
 };
diff --git a/examples/project_website/pubmed.html b/examples/project_website/pubmed.html
@@ -54,23 +54,6 @@
 </head>
 
 <body class="vis">
-
-    <link rel="stylesheet" href="//localhost/project-website/search-flow/css/search-flow.css">
-    <script type="text/javascript" src="//localhost/project-website/search-flow/lib/browser-detect.js"></script>
-    <script>
-        var browser = BrowserDetect.browser;
-        var is_supported_browser = false;
-        if ((browser === "Firefox" || browser === "Safari" || browser === "Chrome")) {
-            is_supported_browser = true;
-        }
-    </script>
-
-
-    <script src="//localhost/project-website/search-flow/js/visualization.js"></script>
-    <script>
-    </script>
-
-
     <div class="overflow-vis">
 
         <div id="visualization" style="background-color:white;"></div>
@@ -87,20 +70,19 @@
     <script>
         data_config.options = [{ "id": "time_range", "multiple": false, "name": "Time Range", "type": "dropdown", "fields": [{ "id": "any-time", "text": "All time" }, { "id": "last-month", "text": "Last month" }, { "id": "last-year", "text": "Last year" }, { "id": "user-defined", "text": "Custom range", "class": "user-defined", "inputs": [{ "id": "from", "label": "From: ", "class": "time_input" }, { "id": "to", "label": "To: ", "class": "time_input" }] }] }, { "id": "sorting", "multiple": false, "name": "Sorting", "type": "dropdown", "fields": [{ "id": "most-relevant", "text": "Most relevant" }, { "id": "most-recent", "text": "Most recent" }] }, { "id": "article_types", "multiple": true, "width": "140px", "name": "Article types", "type": "dropdown", "fields": [{ "id": "adaptive clinical trial", "text": "Adaptive Clinical Trial", "selected": true }, { "id": "address", "text": "Address", "selected": true }, { "id": "autobiography", "text": "Autobiography", "selected": true }, { "id": "bibliography", "text": "Bibliography", "selected": true }, { "id": "biography", "text": "Biography", "selected": true }, { "id": "book illustrations", "text": "Book Illustrations", "selected": true }, { "id": "case reports", "text": "Case Reports", "selected": true }, { "id": "classical article", "text": "Classical Article", "selected": true }, { "id": "clinical conference", "text": "Clinical Conference", "selected": true }, { "id": "clinical study", "text": "Clinical Study", "selected": true }, { "id": "clinical trial", "text": "Clinical Trial", "selected": true }, { "id": "clinical trial protocol", "text": "Clinical Trial Protocol", "selected": true }, { "id": "clinical trial, phase i", "text": "Clinical Trial, Phase I", "selected": true }, { "id": "clinical trial, phase ii", "text": "Clinical Trial, Phase II", "selected": true }, { "id": "clinical trial, phase iii", "text": "Clinical Trial, Phase III", "selected": true }, { "id": "clinical trial, phase iv", "text": "Clinical Trial, Phase IV", "selected": true }, { "id": "clinical trial, veterinary", "text": "Clinical Trial, Veterinary", "selected": true }, { "id": "collected work", "text": "Collected Work", "selected": true }, { "id": "collected works", "text": "Collected Works", "selected": true }, { "id": "comment", "text": "Comment", "selected": true }, { "id": "comparative study", "text": "Comparative Study", "selected": true }, { "id": "congress", "text": "Congress", "selected": true }, { "id": "consensus development conference", "text": "Consensus Development Conference", "selected": true }, { "id": "consensus development conference, nih", "text": "Consensus Development Conference, NIH", "selected": true }, { "id": "controlled clinical trial", "text": "Controlled Clinical Trial", "selected": true }, { "id": "corrected and republished article", "text": "Corrected and Republished Article", "selected": true }, { "id": "dataset", "text": "Dataset", "selected": true }, { "id": "dictionary", "text": "Dictionary", "selected": true }, { "id": "directory", "text": "Directory", "selected": true }, { "id": "duplicate publication", "text": "Duplicate publication", "selected": true }, { "id": "editorial", "text": "Editorial", "selected": true }, { "id": "electronic supplementary materials", "text": "Electronic Supplementary Materials", "selected": true }, { "id": "english abstract", "text": "English Abstract", "selected": true }, { "id": "ephemera", "text": "Ephemera", "selected": true }, { "id": "equivalence trial", "text": "Equivalence Trial", "selected": true }, { "id": "evaluation studies", "text": "Evaluation Studies", "selected": true }, { "id": "evaluation study", "text": "Evaluation Study", "selected": true }, { "id": "expression of concern", "text": "Expression of Concern", "selected": true }, { "id": "festschrift", "text": "Festschrift", "selected": true }, { "id": "government publication", "text": "Government Publication", "selected": true }, { "id": "guideline", "text": "Guideline", "selected": true }, { "id": "historical article", "text": "Historical Article", "selected": true }, { "id": "interactive tutorial", "text": "Interactive Tutorial", "selected": true }, { "id": "interview", "text": "Interview", "selected": true }, { "id": "introductory journal article", "text": "Introductory Journal Article", "selected": true }, { "id": "journal article", "text": "Journal Article", "selected": true }, { "id": "lecture", "text": "Lecture", "selected": true }, { "id": "legal case", "text": "Legal Case", "selected": true }, { "id": "legislation", "text": "Legislation", "selected": true }, { "id": "letter", "text": "Letter", "selected": true }, { "id": "manuscript", "text": "Manuscript", "selected": true }, { "id": "meta analysis", "text": "Meta Analysis", "selected": true }, { "id": "multicenter study", "text": "Multicenter Study", "selected": true }, { "id": "news", "text": "News", "selected": true }, { "id": "newspaper article", "text": "Newspaper Article", "selected": true }, { "id": "observational study", "text": "Observational Study", "selected": true }, { "id": "observational study, veterinary", "text": "Observational Study, Veterinary", "selected": true }, { "id": "overall", "text": "Overall", "selected": true }, { "id": "patient education handout", "text": "Patient Education Handout", "selected": true }, { "id": "periodical index", "text": "Periodical Index", "selected": true }, { "id": "personal narrative", "text": "Personal Narrative", "selected": true }, { "id": "pictorial work", "text": "Pictorial Work", "selected": true }, { "id": "popular work", "text": "Popular Work", "selected": true }, { "id": "portrait", "text": "Portrait", "selected": true }, { "id": "practice guideline", "text": "Practice Guideline", "selected": true }, { "id": "pragmatic clinical trial", "text": "Pragmatic Clinical Trial", "selected": true }, { "id": "preprint", "text": "Preprint", "selected": true }, { "id": "publication components", "text": "Publication Components", "selected": true }, { "id": "publication formats", "text": "Publication Formats", "selected": true }, { "id": "publication type category", "text": "Publication Type Category", "selected": true }, { "id": "published erratum", "text": "Published Erratum", "selected": true }, { "id": "randomized controlled trial", "text": "Randomized Controlled Trial", "selected": true }, { "id": "randomized controlled trial, veterinary", "text": "Randomized Controlled Trial, Veterinary", "selected": true }, { "id": "research support, american recovery and reinvestment act", "text": "Research Support, American Recovery and Reinvestment Act", "selected": true }, { "id": "research support, n i h, extramural", "text": "Research Support, NIH Extramural", "selected": true }, { "id": "research support, n i h, intramural", "text": "Research Support, NIH Intramural", "selected": true }, { "id": "research support, non u s gov't", "text": "Research Support, U.S. Gov't", "selected": true }, { "id": "research support, u s gov't, non p h s", "text": "Research Support, U.S. Gov't, Non P.H.S", "selected": true }, { "id": "research support, u s gov't, p h s", "text": "Research Support, U.S. Gov't, P.H.S", "selected": true }, { "id": "research support, u s government", "text": "Research Support, U.S. Government", "selected": true }, { "id": "retracted publication", "text": "Retracted Publication", "selected": false }, { "id": "retraction of publication", "text": "Retraction of Publication", "selected": true }, { "id": "review", "text": "Review", "selected": true }, { "id": "scientific integrity review", "text": "Scientific Integrity Review", "selected": true }, { "id": "study characteristics", "text": "Study Characteristics", "selected": true }, { "id": "support of research", "text": "Support of Research", "selected": true }, { "id": "systematic review", "text": "Systematic Review", "selected": true }, { "id": "technical report", "text": "Technical Report", "selected": true }, { "id": "twin study", "text": "Twin Study", "selected": true }, { "id": "validation study", "text": "Validation Study", "selected": true }, { "id": "video audio media", "text": "Video Audio Media", "selected": true }, { "id": "webcasts", "text": "Webcasts", "selected": true }] }];
 
-
         data_config.credit_embed = true;
     </script>
 
 
     <link rel="stylesheet" href="./css/main.css">
     <script>
         data_config.files = [{
-            //title: "&quot;climate change&quot;",
-            //file: "./data/climate-change.json",
-            title: "covid",
-            file: "./data/covid.json",
+            title: "&quot;climate change&quot;",
+            //title: "covid",
+            file: "./data/climate-change.json",
+            //file: "./data/covid.json",
         }]
-        data_config.server_url = "//localhost/project-website/headstart/server/";
+        data_config.server_url = window.location.href.replace(/[^/]*$/, '') + "./headstart/server/";
     </script>
 
 

diff --git a/vis/js/components/ContextLine.js b/vis/js/components/ContextLine.js
@@ -18,6 +18,7 @@ import Timestamp from "../templates/contextfeatures/Timestamp";
 import MetadataQuality from "../templates/contextfeatures/MetadataQuality";
 import Modifier from "../templates/contextfeatures/Modifier";
 import { trackMatomoEvent } from "../utils/useMatomo";
+import MoreInfoLink from "../templates/contextfeatures/MoreInfoLink";
 
 const defined = (param) => param !== undefined && param !== null;
 
@@ -87,6 +88,7 @@ class ContextLine extends React.Component {
         {defined(params.searchLanguage) && (
           <SearchLang>{params.searchLanguage}</SearchLang>
         )}
+        <MoreInfoLink />
       </ContextLineTemplate>
     );
   }

diff --git a/.../components/listentries/EntriesWrapper.js → vis/js/components/EntriesWrapper.js b/.../components/listentries/EntriesWrapper.js → vis/js/components/EntriesWrapper.js
diff --git a/vis/js/components/Heading.js b/vis/js/components/Heading.js
@@ -4,8 +4,6 @@ import { connect } from "react-redux";
 import ZoomedInHeadingTemplate from "../templates/ZoomedInHeading";
 import ZoomedOutHeadingTemplate from "../templates/ZoomedOutHeading";
 
-import { changeFile, openInfoModal } from "../actions/index";
-
 import {
   BasicTitle,
   ProjectTitle,
@@ -21,10 +19,7 @@ const Heading = ({
   query,
   bubbleTitle,
   headingParams,
-  files,
-  onFileChange,
   streamgraph,
-  onInfoModalOpen,
 }) => {
   if (zoomed) {
     let label = streamgraph ? localization.area_streamgraph : localization.area;
@@ -33,16 +28,7 @@ const Heading = ({
   }
 
   return (
-    <ZoomedOutHeadingTemplate
-      introIcon={localization.intro_icon}
-      introLabel={localization.intro_label}
-      additionalFeatures={renderAdditionalFeatures(
-        headingParams,
-        files,
-        onFileChange
-      )}
-      onInfoClick={onInfoModalOpen}
-    >
+    <ZoomedOutHeadingTemplate>
       {renderTitle(localization, query, headingParams)}
     </ZoomedOutHeadingTemplate>
   );
@@ -54,16 +40,10 @@ const mapStateToProps = (state) => ({
   query: state.query.text,
   bubbleTitle: state.selectedBubble ? state.selectedBubble.title : null,
   headingParams: state.heading,
-  files: state.files,
   streamgraph: state.chartType === STREAMGRAPH_MODE,
 });
 
-const mapDispatchToProps = (dispatch) => ({
-  onFileChange: (fileIndex) => dispatch(changeFile(fileIndex)),
-  onInfoModalOpen: () => dispatch(openInfoModal()),
-});
-
-export default connect(mapStateToProps, mapDispatchToProps)(Heading);
+export default connect(mapStateToProps)(Heading);
 
 // This should probably make its way to a more global config
 const MAX_LENGTH_VIPER = 47;
@@ -198,27 +178,3 @@ const unescapeHTML = (string) => {
     }
   );
 };
-
-const renderAdditionalFeatures = ({ showDropdown }, files, onFileChange) => {
-  if (showDropdown && files.list.length > 0) {
-    const handleChange = (e) => {
-      onFileChange(parseInt(e.target.value));
-    };
-
-    return (
-      <>
-        {" "}
-        Select dataset:{" "}
-        <select id="datasets" value={files.current} onChange={handleChange}>
-          {files.list.map((entry, index) => (
-            <option key={entry.file} value={index}>
-              {entry.title}
-            </option>
-          ))}
-        </select>
-      </>
-    );
-  }
-
-  return null;
-};
diff --git a/vis/js/components/Headstart.js b/vis/js/components/Headstart.js
@@ -48,10 +48,10 @@ const Headstart = ({
           </div>
         )}
         {renderList && <List />}
+        <Footer />
       </div>
       <Toolbar />
       <Modals />
-      <Footer />
     </LocalizationProvider>
   );
 };

diff --git a/vis/js/components/ListEntries.js b/vis/js/components/ListEntries.js
@@ -1,17 +1,18 @@
 import React from "react";
 import { connect } from "react-redux";
 
-import BasicListEntries from "./listentries/BasicListEntries";
-import ClassificationListEntries from "./listentries/ClassificationListEntries";
-import StandardListEntries from "./listentries/StandardListEntries";
-import EntriesWrapper from "./listentries/EntriesWrapper";
-
 import { useLocalizationContext } from "./LocalizationProvider";
 
 import { filterData } from "../utils/data";
 import { STREAMGRAPH_MODE } from "../reducers/chartType";
 
+import EntriesWrapper from "./EntriesWrapper";
+import BasicListEntry from "../templates/listentry/BasicListEntry";
+import ClassificationListEntry from "../templates/listentry/ClassificationListEntry";
+import StandardListEntry from "../templates/listentry/StandardListEntry";
+
 const ListEntries = ({
+  // data
   show,
   service,
   displayedData,
@@ -29,7 +30,7 @@ const ListEntries = ({
   let showEmptyMessage = displayedData.length === 0;
   if (!isStreamgraph && showEmptyMessage) {
     // we have to perform knowledge map filtering here (it's different
-    // to the filtering in the List.js component - paper selection is 
+    // to the filtering in the List.js component - paper selection is
     // not taken into account)
     // if the list is empty, but there are visible papers in the zoomed
     // bubble, the message is not displayed
@@ -47,15 +48,15 @@ const ListEntries = ({
     );
   }
 
-  if (service === null || typeof service === "undefined") {
-    return <BasicListEntries displayedData={displayedData} />;
-  }
-
-  if (service.startsWith("linkedcat")) {
-    return <ClassificationListEntries displayedData={displayedData} />;
-  }
+  const ListEntryComponent = getListEntryComponent(service);
 
-  return <StandardListEntries displayedData={displayedData} />;
+  return (
+    <EntriesWrapper>
+      {displayedData.map((paper) => (
+        <ListEntryComponent key={paper.safe_id} paper={paper} />
+      ))}
+    </EntriesWrapper>
+  );
 };
 
 const mapStateToProps = (state) => ({
@@ -78,3 +79,15 @@ const mapStateToProps = (state) => ({
 });
 
 export default connect(mapStateToProps)(ListEntries);
+
+const getListEntryComponent = (service) => {
+  if (service === null || typeof service === "undefined") {
+    return BasicListEntry;
+  }
+
+  if (service.startsWith("linkedcat")) {
+    return ClassificationListEntry;
+  }
+
+  return StandardListEntry;
+};