Skip to content

Commit

Permalink
add paging mode as default
Browse files Browse the repository at this point in the history
  • Loading branch information
jamesmisson committed May 31, 2024
1 parent 0f0a20e commit 38a9b2e
Show file tree
Hide file tree
Showing 6 changed files with 673 additions and 13 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -288,13 +288,13 @@
"autocompleteAllowWords": false,
"galleryButtonEnabled": true,
"imageSelectionBoxEnabled": false,
"pageModeEnabled": false,
"pageModeEnabled": true,
"pagingToggleEnabled": true,
"centerOptionsEnabled": true,
"localeToggleEnabled": false,
"settingsButtonEnabled": true,
"helpEnabled": true,
"modeOptionsEnabled": true
"modeOptionsEnabled": false
},
"content": {
"close": "$close",
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
const $ = require("jquery");
import { AutoComplete } from "../uv-shared-module/AutoComplete";
import { PagingAutoComplete } from "../uv-shared-module/PagingAutoComplete";
import { IIIFEvents } from "../../IIIFEvents";
import { OpenSeadragonExtensionEvents } from "../../extensions/uv-openseadragon-extension/Events";
import { HeaderPanel } from "../uv-shared-module/HeaderPanel";
Expand Down Expand Up @@ -135,20 +135,25 @@ export class PagingHeaderPanel extends HeaderPanel<
);
this.$search.append(this.$autoCompleteBox);

new AutoComplete(
new PagingAutoComplete(
//element
this.$autoCompleteBox,

//autoCompleteFunc
(term: string, cb: (results: string[]) => void) => {
const results: string[] = [];
const canvases: Canvas[] = this.extension.helper.getCanvases();


// if in page mode, get canvases by label.
if (this.isPageModeEnabled()) {

for (let i = 0; i < canvases.length; i++) {
const canvas: Canvas = canvases[i];
const label: string | null = LanguageMap.getValue(
canvas.getLabel()
);
if (label && label.startsWith(term)) {
if (label && label.includes(term)) {
results.push(label);
}
}
Expand All @@ -163,14 +168,27 @@ export class PagingHeaderPanel extends HeaderPanel<
}
cb(results);
},

//parseResultsFunc
(results: any) => {
return results;
},

//onSelect
(terms: string) => {
this.search(terms);
},
300,

//delay
0,

// minChars
0,

//positionAbove
false,

//allowWords
Bools.getBool(this.options.autocompleteAllowWords, false)
);
} else if (Bools.getBool(this.options.imageSelectionBoxEnabled, true)) {
Expand Down Expand Up @@ -418,6 +436,13 @@ export class PagingHeaderPanel extends HeaderPanel<
if (this.options.modeOptionsEnabled === false) {
this.$modeOptions.hide();
this.$centerOptions.addClass("modeOptionsDisabled");

//JM also hide other parts of the panel otherwise viewable in imageMode
this.$searchButton.hide();
this.$total.hide();

//JM and add class to autocomplate input to re-style
this.$autoCompleteBox.addClass("pageMode");
}

// Search is shown as default
Expand Down Expand Up @@ -456,6 +481,16 @@ export class PagingHeaderPanel extends HeaderPanel<
if (!Bools.getBool(this.options.pagingToggleEnabled, true)) {
this.$pagingToggleButtons.hide();
}

$(document).on("click", (e) => {
if (
!this.$autoCompleteBox.is($(e.target)[0]) &&
this.$autoCompleteBox.has($(e.target)[0]).length === 0
) {
this.setSearchFieldValue(this.extension.helper.canvasIndex);
}
})

}

openGallery(): void {
Expand Down Expand Up @@ -753,5 +788,8 @@ export class PagingHeaderPanel extends HeaderPanel<
if (this.pagingToggleIsVisible()) this.$pagingToggleButtons.show();
if (this.galleryIsVisible()) this.$galleryButton.show();
}
}
};


}

Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@

.search {
float: left;
margin: 6px 0 0 5px;
margin: 6px 5px 0 5px;
width: 113px;

.searchText {
Expand Down Expand Up @@ -102,13 +102,22 @@
padding: 0;
margin-top: 6px;
color: black;

&.pageMode {
width: 113px;
text-align: center;
height: 25px;
margin-top: 1px;
}

}

.autocomplete {
position: absolute;
background: #fff;
width: 60px;
border: 2px solid @brand-primary-lighter;
width: 113px;
// border: 2px solid @brand-primary-lighter;
border: 0px;
list-style-type: none;
-webkit-margin-before: 0px;
-webkit-margin-after: 0px;
Expand All @@ -123,7 +132,8 @@
z-index: 1000;

.result {
padding: 4px;
padding: 0 0 0 5px;
height: 25px;
width: 270px;
overflow: hidden;

Expand All @@ -137,6 +147,26 @@
&.selected {
background: @gray-lighter;
}

&:hover {
background: @gray-lighter;
}

a {
display: block;
height: 25px;
line-height: 2.2em;
border: 0;

&:hover {
text-decoration: none;
}

&:active, &:focus {
outline: 0;
border: none;
}
}
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@ export class AutoComplete {

// if there are more than x chars
// update the autocomplete list.
if (val && val.length > that._minChars && that._searchForWords(val)) {
if (val && val.length >= that._minChars && that._searchForWords(val)) {
that._search(val);
} else {
// otherwise, hide the autocomplete list.
Expand Down Expand Up @@ -166,7 +166,7 @@ export class AutoComplete {
}

private _getTerms(): string {
return this._$element.val().trim();
return this._$element.val().trim();
}

private _setSelectedResultIndex(direction: number): void {
Expand Down
Loading

0 comments on commit 38a9b2e

Please sign in to comment.