Merge branch 'dev'

spraakbanken · Feb 21, 2024 · 4bcc1ad · 4bcc1ad
2 parents f0e875d + 75d21c0
commit 4bcc1ad
Show file tree

Hide file tree

Showing 22 changed files with 144 additions and 119 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,27 @@
 # Changelog
 
+## [9.5.2] - 2024-02-21
+
+### Added
+
+- Basic visitor analytics with Matomo [#149](https://github.com/spraakbanken/korp-frontend/issues/149)
+
+### Changed
+
+- The "in order" option is inverted, so it is now "in free order" and unchecked by default (but still `in_order` in the URL query param and in the API)
+- The checkbox of said option no longer gets disabled in Extended mode
+- Replaced `NODE_ENV` with our own variable `ENVIRONMENT` to properly allow the `"staging"` value
+
+### Fixed
+
+- Parallel sentence alignment [#323](https://github.com/spraakbanken/korp-frontend/issues/323)
+- Trend diagram subquery with repetition [#288](https://github.com/spraakbanken/korp-frontend/issues/288)
+- Restore lab logo
+
+### Removed
+
+- Automatic disabling of the "Show statistics" checkbox
+
 ## [9.5.1] - 2024-02-12
 
 ### Changed
@@ -87,6 +109,7 @@
 - Most bug fixes was related to the refactoring breaking things
 - Lots of bug fixes for the sidebar
 
+[9.5.2]: https://github.com/spraakbanken/korp-frontend/releases/tag/v9.5.2
 [9.5.1]: https://github.com/spraakbanken/korp-frontend/releases/tag/v9.5.1
 [9.5.0]: https://github.com/spraakbanken/korp-frontend/releases/tag/v9.5.0
 [9.4.4]: https://github.com/spraakbanken/korp-frontend/releases/tag/v9.4.4

diff --git a/app/index.js b/app/index.js
@@ -56,8 +56,6 @@ require("./lib/jquery.format.js")
 let deparam = require("jquery-deparam")
 
 window.c = console
-// __IS_LAB__ is defined in webpack and set to true if NODE_ENV is "staging"
-window.isLab = __IS_LAB__
 window.currentMode = deparam(window.location.search.slice(1)).mode || "default"
 
 try {
@@ -130,3 +128,4 @@ require("./scripts/directives.js")
 require("./scripts/directives/scroll.js")
 require("./scripts/filter_directives.js")
 require("./scripts/newsdesk.js")
+require("./scripts/matomo.js")
diff --git a/app/scripts/app.js b/app/scripts/app.js
@@ -178,8 +178,6 @@ korpApp.run([
         s._settings = settings
         window.lang = s.lang = $location.search().lang || settings["default_language"]
 
-        s.isLab = window.isLab
-
         s.extendedCQP = null
 
         s.globalFilterDef = $q.defer()

diff --git a/app/scripts/components/advanced_search.js b/app/scripts/components/advanced_search.js
@@ -34,9 +34,9 @@ export const advancedSearchComponent = {
             on-search="$ctrl.onSearch()"
             on-search-save="$ctrl.onSearchSave(name)"
         ></search-submit>
-        <input id="inOrderChkAdv" type="checkbox" ng-model="$ctrl.inOrder" />
-        <label for="inOrderChkAdv">
-            {{'in_order_chk' | loc:$root.lang}}
+        <input id="freeOrderChkAdv" type="checkbox" ng-model="$ctrl.freeOrder" />
+        <label for="freeOrderChkAdv">
+            {{'free_order_chk' | loc:$root.lang}}
             <i
                 class="fa fa-info-circle text-gray-400"
                 uib-tooltip="{{'order_help' | loc:$root.lang}}"
@@ -52,7 +52,7 @@ export const advancedSearchComponent = {
         function (compareSearches, $location, $timeout) {
             const $ctrl = this
 
-            $ctrl.inOrder = $location.search().in_order == null
+            $ctrl.freeOrder = $location.search().in_order != null
 
             if ($location.search().search && $location.search().search.split("|")) {
                 var [type, ...expr] = $location.search().search.split("|")
@@ -69,7 +69,7 @@ export const advancedSearchComponent = {
                 $location.search("search", null)
                 $location.search("page", null)
                 $location.search("within", null)
-                $location.search("in_order", !$ctrl.inOrder ? false : null)
+                $location.search("in_order", $ctrl.freeOrder ? false : null)
                 $timeout(() => $location.search("search", `cqp|${$ctrl.cqp}`), 0)
             }
 

diff --git a/app/scripts/components/extended/standard_extended.js b/app/scripts/components/extended/standard_extended.js
@@ -27,8 +27,8 @@ export const extendedStandardComponent = {
                 on-search-save="$ctrl.onSearchSave(name)"
                 disabled="$ctrl.repeatError || $ctrl.orderError"
             ></search-submit>
-            <input id="inOrderChkExt" type="checkbox" ng-model="inOrder" ng-disabled="!$ctrl.inOrderEnabled" />
-            <label for="inOrderChkExt"> {{'in_order_chk' | loc:$root.lang}}</label>
+            <input id="freeOrderChkExt" type="checkbox" ng-model="freeOrder" />
+            <label for="freeOrderChkExt"> {{'free_order_chk' | loc:$root.lang}}</label>
             <span> {{'and' | loc:$root.lang}} </span>
             <span>{{'within' | loc:$root.lang}}</span>
             <select
@@ -48,16 +48,14 @@ export const extendedStandardComponent = {
             const ctrl = this
 
             ctrl.lang = $rootScope.lang
-            $scope.inOrder = $location.search().in_order == null
-            /** Whether the "in order" option is applicable. */
-            ctrl.inOrderEnabled = true
+            $scope.freeOrder = $location.search().in_order != null
             ctrl.orderError = false
 
             // TODO this is *too* weird
             function triggerSearch() {
                 $location.search("search", null)
                 $location.search("page", null)
-                $location.search("in_order", !$scope.inOrder && ctrl.inOrderEnabled ? false : null)
+                $location.search("in_order", $scope.freeOrder ? false : null)
                 $timeout(function () {
                     $location.search("search", "cqp")
                     if (!_.keys(settings["default_within"]).includes(ctrl.within)) {
@@ -95,27 +93,21 @@ export const extendedStandardComponent = {
                     c.log("Error", e)
                 }
 
-                ctrl.validateInOrder()
+                ctrl.validateFreeOrder()
 
                 $location.search("cqp", cqp)
             }
 
-            $scope.$watch("inOrder", () => {
-                ctrl.validateInOrder()
+            $scope.$watch("freeOrder", () => {
+                ctrl.validateFreeOrder()
             })
 
-            /** Trigger error if the "in order" option is incompatible with the query */
-            ctrl.validateInOrder = () => {
+            /** Trigger error if the "free order" option is incompatible with the query */
+            ctrl.validateFreeOrder = () => {
                 const cqpObjs = CQP.parse(ctrl.cqp)
-                if (!CQP.supportsInOrder(cqpObjs)) {
-                    // If query doesn't support free word order, and the "in order" checkbox has been unchecked,
-                    // then disable search, show explanation and let user resolve the conflict
-                    ctrl.orderError = !$scope.inOrder
-                    ctrl.inOrderEnabled = !$scope.inOrder
-                } else {
-                    ctrl.orderError = false
-                    ctrl.inOrderEnabled = true
-                }
+                // If query doesn't support free word order, and the "free order" checkbox is checked,
+                // then show explanation and let user resolve the conflict
+                ctrl.orderError = !CQP.supportsInOrder(cqpObjs) && $scope.freeOrder
             }
 
             ctrl.cqp = $location.search().cqp

diff --git a/app/scripts/components/header.js b/app/scripts/components/header.js
@@ -211,10 +211,9 @@ export const headerComponent = {
             const N_VISIBLE = settings["visible_modes"]
 
             $ctrl.modes = _.filter(settings["modes"])
-            if (!isLab) {
+            if (process.env.ENVIRONMENT != "staging") {
                 $ctrl.modes = _.filter(settings["modes"], (item) => item.labOnly !== true)
             }
-            $ctrl.isLab = isLab
 
             $ctrl.visible = $ctrl.modes.slice(0, N_VISIBLE)
 

diff --git a/app/scripts/components/kwic.js b/app/scripts/components/kwic.js
@@ -168,7 +168,7 @@ export const kwicComponent = {
                     }
 
                     if (currentMode === "parallel" && !$ctrl.isReading) {
-                        centerScrollbarParallel()
+                        $timeout(() => alignParallelSentences())
                     }
                     if ($ctrl.kwic.length == 0) {
                         selectionManager.deselect()
@@ -549,36 +549,29 @@ export const kwicComponent = {
                 area.stop(true, true).scrollLeft(match - ($("body").innerWidth() - sidebarWidth) / 2)
             }
 
-            function centerScrollbarParallel() {
-                const scrollLeft = $(".table_scrollarea", $element).scrollLeft() || 0
-                let changed = true
-                const prevValues = []
-
-                // loop until the placement of linked sentences have settled
-                while (changed) {
-                    changed = false
-                    let i = 0
-                    for (let linked of $(".table_scrollarea > .kwic .linked_sentence").get()) {
-                        const mainrow = $(linked).prev()
-                        if (!mainrow.length) {
-                            continue
-                        }
-                        let firstWord = mainrow.find(".left .word:first")
-                        if (!firstWord.length) {
-                            firstWord = mainrow.find(".match .word:first")
-                        }
-                        const offset = Math.round(firstWord.position().left + scrollLeft - 25)
-                        $(linked).find(".lnk").css("padding-left", offset)
+            /** Add offsets to align each linked sentence with its main one */
+            function alignParallelSentences() {
+                /** A helper to get horizontal coordinates relative to a container. */
+                function getBounds($elements, $container) {
+                    const container = $container.get(0).getBoundingClientRect()
+                    const left = $elements.get(0).getBoundingClientRect().left - container.left
+                    const right = $elements.get(-1).getBoundingClientRect().right - container.left
+                    const width = right - left
+                    const center = left + width / 2
+                    const space = container.width - width
+                    return { left, right, width, center, space }
+                }
 
-                        const threshold = 25
-                        if (offset - (prevValues[i] || 0) > threshold) {
-                            changed = true
-                        }
+                $(".table_scrollarea > .kwic .linked_sentence").each((i, el) => {
+                    const $linkedRow = $(el)
+                    const $mainRow = $linkedRow.prev()
+                    const linked = getBounds($linkedRow.find(".word"), $linkedRow)
+                    const main = getBounds($mainRow.find(".word"), $mainRow)
 
-                        prevValues[i] = offset
-                        i++
-                    }
-                }
+                    const offset = main.center - linked.width / 2
+                    // Add offset as cell padding
+                    $linkedRow.find(".lnk").css("padding-left", Math.min(offset, linked.space))
+                })
             }
 
             function addKeydownHandler() {

diff --git a/app/scripts/components/searchtabs.js b/app/scripts/components/searchtabs.js
@@ -64,7 +64,6 @@ export const searchtabsComponent = {
                         ng-model="$ctrl.showStatistics"
                         ng-change="$ctrl.showStatisticsChange()"
                         class="mr-1"
-                        ng-disabled="!$ctrl.inOrder"
                     /><label for="show_stats">{{'show_stats' | loc:$root.lang}}</label>
                 </div>
                 <div ng-show="$ctrl.settings['word_picture'] !== false">
@@ -107,12 +106,6 @@ export const searchtabsComponent = {
                 (val) => ($ctrl.isCompareSelected = val === 3)
             )
 
-            $ctrl.inOrder = true
-            $rootScope.$watch(
-                () => $location.search().in_order,
-                (val) => ($ctrl.inOrder = val == undefined)
-            )
-
             $ctrl.savedSearches = compareSearches.savedSearches
 
             const setupWatchWordPic = function () {

diff --git a/app/scripts/components/simple_search.js b/app/scripts/components/simple_search.js
@@ -22,12 +22,12 @@ export const simpleSearchComponent = {
                     ></search-submit>
                     <div class="opts">
                         <input
-                            id="inOrderChk"
+                            id="freeOrderChk"
                             type="checkbox"
-                            ng-model="$ctrl.inOrder"
-                            ng-disabled="!$ctrl.inOrderEnabled"
+                            ng-model="$ctrl.freeOrder"
+                            ng-disabled="!$ctrl.freeOrderEnabled"
                         />
-                        <label for="inOrderChk"> {{'in_order_chk' | loc:$root.lang}}</label>
+                        <label for="freeOrderChk"> {{'free_order_chk' | loc:$root.lang}}</label>
                         <span> {{'and' | loc:$root.lang}} </span>
                         <span> {{'and_include' | loc:$root.lang}} </span>
                         <input id="prefixChk" type="checkbox" ng-model="$ctrl.prefix" />
@@ -89,9 +89,10 @@ export const simpleSearchComponent = {
                 ctrl.onChange(event.value, false)
             })
 
-            ctrl.inOrder = $location.search().in_order == null
-            /** Whether the "in order" option is applicable. */
-            ctrl.inOrderEnabled = false
+            /** Whether tokens should be matched in arbitrary order. */
+            ctrl.freeOrder = $location.search().in_order != null
+            /** Whether the "free order" option is applicable. */
+            ctrl.freeOrderEnabled = false
             ctrl.prefix = $location.search().prefix != null
             ctrl.mid_comp = $location.search().mid_comp != null
             ctrl.suffix = $location.search().suffix != null
@@ -104,7 +105,7 @@ export const simpleSearchComponent = {
 
             // triggers watch on searches.activeSearch
             ctrl.updateSearch = function () {
-                $location.search("in_order", !ctrl.inOrder && ctrl.inOrderEnabled ? false : null)
+                $location.search("in_order", ctrl.freeOrder && ctrl.freeOrderEnabled ? false : null)
                 $location.search("prefix", ctrl.prefix ? true : null)
                 $location.search("mid_comp", ctrl.mid_comp ? true : null)
                 $location.search("suffix", ctrl.suffix ? true : null)
@@ -233,7 +234,7 @@ export const simpleSearchComponent = {
                         ctrl.lemgram = search.val
                     }
                     $rootScope.simpleCQP = CQP.expandOperators(ctrl.getCQP())
-                    ctrl.updateInOrderEnabled()
+                    ctrl.updateFreeOrderEnabled()
                     ctrl.doSearch()
                 }
             })
@@ -247,12 +248,12 @@ export const simpleSearchComponent = {
                     ctrl.currentText = null
                 }
 
-                ctrl.updateInOrderEnabled()
+                ctrl.updateFreeOrderEnabled()
             }
 
-            ctrl.updateInOrderEnabled = () => {
+            ctrl.updateFreeOrderEnabled = () => {
                 const cqpObjs = CQP.parse(ctrl.getCQP() || "[]")
-                ctrl.inOrderEnabled = CQP.supportsInOrder(cqpObjs)
+                ctrl.freeOrderEnabled = CQP.supportsInOrder(cqpObjs)
             }
 
             ctrl.doSearch = function () {

diff --git a/app/scripts/components/trend_diagram.js b/app/scripts/components/trend_diagram.js
@@ -109,8 +109,7 @@ export const trendDiagramComponent = {
                     return
                 }
 
-                const nTokens = $ctrl.data.cqp.split("]").length - 2
-                const timecqp = trendUtil.getTimeCQP(time, zoom, nTokens, validZoomLevels.indexOf(zoom) < 3)
+                const timecqp = trendUtil.getTimeCQP(time, zoom, validZoomLevels.indexOf(zoom) < 3)
                 const decodedCQP = decodeURIComponent(cqp)
                 const opts = {
                     ajaxParams: {

diff --git a/app/scripts/data_init.js b/app/scripts/data_init.js
@@ -104,7 +104,7 @@ async function getConfig() {
     if (settings["corpus_config_url"]) {
         configUrl = await settings["corpus_config_url"]()
     } else {
-        const labParam = window.isLab ? "&include_lab" : ""
+        const labParam = process.env.ENVIRONMENT == "staging" ? "&include_lab" : ""
         configUrl = `${settings["korp_backend_url"]}/corpus_config?mode=${window.currentMode}${labParam}`
     }
     let response

diff --git a/app/scripts/main.js b/app/scripts/main.js
@@ -49,7 +49,7 @@ function initApp() {
         c.error("ERROR setting corpora from location", error1)
     }
 
-    if (isLab) {
+    if (process.env.ENVIRONMENT == "staging") {
         $("body").addClass("lab")
     }
 

diff --git a/app/scripts/matomo.js b/app/scripts/matomo.js
@@ -0,0 +1,20 @@
+// See: https://developer.matomo.org/guides/tracking-javascript-guide
+
+// Allow environment-specific (development/staging/production) settings or fallback to general settings
+const matomoSettings = {...settings["matomo"], ...settings["matomo"]?.[process.env.ENVIRONMENT]}
+
+if (matomoSettings?.["url"] && matomoSettings?.["site"]) {
+  /** Matomo message queue */
+  var _paq = window._paq = window._paq || [];
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+
+  // Load the Matomo client once page has been loaded.
+  (function() {
+    var u=matomoSettings["url"];
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', matomoSettings["site"]]);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.type='text/javascript'; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+  })();
+}