diff --git a/app/scripts/components/results.js b/app/scripts/components/results.js index b0b9f2659..9ef766a7f 100644 --- a/app/scripts/components/results.js +++ b/app/scripts/components/results.js @@ -11,8 +11,8 @@ import "@/components/korp-error" import "@/components/kwic" import "@/components/statistics" import "@/components/sidebar" -import "@/components/tab-hash" import "@/components/word-picture" +import "@/directives/tab-hash" import "@/directives/tab-preloader" angular.module("korpApp").component("results", { @@ -21,110 +21,105 @@ angular.module("korpApp").component("results", {
- - - - KWIC - -
- - -
- - - {{'statistics' | loc:$root.lang}} - - + + + KWIC + +
- - - - - {{'word_picture' | loc:$root.lang}} - - -
- -
- - - - - - - - - + prev-request="proxy.prevRequest" + corpus-order="corpusOrder" + > +
+ + + {{'statistics' | loc:$root.lang}} + + + + + + + + {{'word_picture' | loc:$root.lang}} + + +
+ +
+ + + + + + + + diff --git a/app/scripts/components/searchtabs.js b/app/scripts/components/searchtabs.js index 2c72543c5..1d2126c7b 100644 --- a/app/scripts/components/searchtabs.js +++ b/app/scripts/components/searchtabs.js @@ -10,39 +10,37 @@ import "@/components/extended/extended-standard" import "@/components/extended/extended-parallel" import "@/components/advanced-search" import "@/components/compare-search" -import "@/components/tab-hash" import "@/directives/click-cover" import "@/directives/reduce-select" +import "@/directives/tab-hash" angular.module("korpApp").component("searchtabs", { template: html`
- - - - - - -
- - -
- - - - - - - {{'compare' | loc:$root.lang}} - {{$ctrl.savedSearches.length}} - - - -
- + + + + + +
+ +
- - + + + + + + + {{'compare' | loc:$root.lang}} + {{$ctrl.savedSearches.length}} + + + +
+ +
+
- maxTab: number - setSelected: (index: number, ignoreCheck?: boolean) => void - newDynamicTab: () => void - closeDynamicTab: () => void -} - -/** Surround a `` element with this to sync selected tab number to url parameter `key`. */ -angular.module("korpApp").component("tabHash", { - template: html`
`, - transclude: true, - bindings: { - key: "@", - }, - controller: [ - "utils", - "$element", - "$scope", - "$timeout", - function (utils: UtilsService, $element: IRootElementService, $scope: TabHashScope, $timeout: ITimeoutService) { - const $ctrl = this as TabHashController - - let tabsetScope - let contentScope - - $ctrl.$onInit = () => { - // Timeout needed to find elements created by uib-tabset - $timeout(function () { - tabsetScope = $element.find(".tabbable").scope() as any - contentScope = $element.find(".tab-content").scope() as any - - $scope.fixedTabs = {} - $scope.maxTab = -1 - for (let tab of contentScope.tabset.tabs) { - $scope.fixedTabs[tab.index] = tab - if (tab.index > $scope.maxTab) { - $scope.maxTab = tab.index - } - } - watchHash() - }, 0) - } - - const watchHash = () => - utils.setupHash($scope, { - expr: () => tabsetScope.activeTab, - val_in(val) { - $scope.setSelected(Number(val)) - return tabsetScope.activeTab - }, - key: $ctrl.key, - default: "0", - }) - - $scope.setSelected = function (index, ignoreCheck) { - if (!ignoreCheck && !(index in $scope.fixedTabs)) { - index = $scope.maxTab - } - tabsetScope.activeTab = index - } - - $scope.newDynamicTab = function () { - $timeout(function () { - $scope.setSelected($scope.maxTab + 1, true) - $scope.maxTab += 1 - }, 0) - } - - $scope.closeDynamicTab = function () { - $timeout(function () { - $scope.maxTab = -1 - for (let tab of contentScope.tabset.tabs) { - if (tab.index > $scope.maxTab) { - $scope.maxTab = tab.index - } - } - }, 0) - } - }, - ], -}) diff --git a/app/scripts/directives/tab-hash.ts b/app/scripts/directives/tab-hash.ts new file mode 100644 index 000000000..11fa58737 --- /dev/null +++ b/app/scripts/directives/tab-hash.ts @@ -0,0 +1,77 @@ +/** @format */ +import _ from "lodash" +import angular, { IScope, ITimeoutService } from "angular" +import { UtilsService } from "@/services/utils" +import { LocationService } from "@/urlparams" +import "@/services/utils" + +type TabHashScope = IScope & { + activeTab: number + fixedTabs: Record + maxTab: number + setSelected: (index: number, ignoreCheck?: boolean) => void + newDynamicTab: () => void + closeDynamicTab: () => void +} + +angular.module("korpApp").directive("tabHash", [ + "utils", + "$location", + "$timeout", + (utils: UtilsService, $location: LocationService, $timeout: ITimeoutService) => ({ + link(scope, elem, attr) { + const s = scope as TabHashScope + const contentScope = elem.find(".tab-content").scope() as any + + const watchHash = () => + utils.setupHash(s, { + expr: "activeTab", + val_in(val) { + s.setSelected(Number(val)) + return s.activeTab + }, + key: attr.tabHash, + default: "0", + }) + + s.setSelected = function (index, ignoreCheck) { + if (!ignoreCheck && !(index in s.fixedTabs)) { + index = s.maxTab + } + s.activeTab = index + } + + const initTab = parseInt($location.search()[attr.tabHash]) || 0 + $timeout(function () { + s.fixedTabs = {} + s.maxTab = -1 + for (let tab of contentScope.tabset.tabs) { + s.fixedTabs[tab.index] = tab + if (tab.index > s.maxTab) { + s.maxTab = tab.index + } + } + s.setSelected(initTab) + watchHash() + }, 0) + + s.newDynamicTab = function () { + $timeout(function () { + s.setSelected(s.maxTab + 1, true) + s.maxTab += 1 + }, 0) + } + + s.closeDynamicTab = function () { + $timeout(function () { + s.maxTab = -1 + for (let tab of contentScope.tabset.tabs) { + if (tab.index > s.maxTab) { + s.maxTab = tab.index + } + } + }, 0) + } + }, + }), +]) diff --git a/app/scripts/services/utils.ts b/app/scripts/services/utils.ts index b0d3a644b..7070b9312 100644 --- a/app/scripts/services/utils.ts +++ b/app/scripts/services/utils.ts @@ -15,7 +15,7 @@ type SetupHashConfigItem /** A function on the scope to pass value to, instead of setting `scope_name` */ scope_func?: string /** Expression to watch for changes; defaults to `scope_name` */ - expr?: string | (() => HashParams[K]) + expr?: string /** Default value of the scope variable, corresponding to the url param being empty */ default?: HashParams[K] /** Runs when the value is changed in scope or url */ @@ -56,7 +56,7 @@ angular.module("korpApp").factory("utils", [ scope.$watch(() => $location.search(), onWatch) // Sync from scope to url - scope.$watch((config.expr as any) || config.scope_name || config.key, (val: any) => { + scope.$watch(config.expr || config.scope_name || config.key, (val: any) => { val = config.val_out ? config.val_out(val) : val if (val === config.default) { val = null diff --git a/app/scripts/urlparams.ts b/app/scripts/urlparams.ts index 032864124..285b76429 100644 --- a/app/scripts/urlparams.ts +++ b/app/scripts/urlparams.ts @@ -37,8 +37,6 @@ export type HashParams = { random_seed?: `${number}` /** Whether the reading mode is enabled */ reading_mode?: boolean - /** Current tab of results */ - result_tab?: `${number}` /** * Search query for Simple or Advanced search: `|` * where `mode` can be: