Icycoide/searxng
1
0
Fork 1
mirror of https://github.com/searxng/searxng.git synced 2025-07-19 19:29:26 +02:00
Code Issues Projects Releases Packages Wiki Activity

[mod] infinite_scroll as preference

Browse source 
* oscar theme: code from searx/plugins/infinite_scroll.py
* simple theme: new implementation

Co-authored-by: Markus Heiser <markus.heiser@darmarIT.de>
This commit is contained in:
Alexandre Flament 2022-01-23 11:37:57 +01:00
parent 36aee70c24
commit 56e34947a6
23 changed files with 314 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

95
searx/static/themes/__common__/js/image_layout.js
View file

@ -29,7 +29,8 @@
this.verticalMargin = verticalMargin;
this.horizontalMargin = horizontalMargin;
this.maxHeight = maxHeight;
this.isAlignDone = true;
this.trottleCallToAlign = null;
this.alignAfterThrotteling = false;
}
/**
@ -72,12 +73,12 @@
// not loaded image : make it square as _getHeigth said it
imgWidth = height;
}
img.style.width = imgWidth + 'px';
img.style.height = height + 'px';
img.style.marginLeft = this.horizontalMargin + 'px';
img.style.marginTop = this.horizontalMargin + 'px';
img.style.marginRight = this.verticalMargin - 7 + 'px'; // -4 is the negative margin of the inline element
img.style.marginBottom = this.verticalMargin - 7 + 'px';
img.setAttribute('width', Math.round(imgWidth));
img.setAttribute('height', Math.round(height));
img.style.marginLeft = Math.round(this.horizontalMargin) + 'px';
img.style.marginTop = Math.round(this.horizontalMargin) + 'px';
img.style.marginRight = Math.round(this.verticalMargin - 7) + 'px'; // -4 is the negative margin of the inline element
img.style.marginBottom = Math.round(this.verticalMargin - 7) + 'px';
resultNode = img.parentNode.parentNode;
if (!resultNode.classList.contains('js')) {
resultNode.classList.add('js');
@ -112,6 +113,23 @@
}
};
ImageLayout.prototype.throttleAlign = function () {
var obj = this;
if (obj.trottleCallToAlign) {
obj.alignAfterThrotteling = true;
} else {
obj.alignAfterThrotteling = false;
obj.align();
obj.trottleCallToAlign = setTimeout(function () {
if (obj.alignAfterThrotteling) {
obj.align();
}
obj.alignAfterThrotteling = false;
obj.trottleCallToAlign = null;
}, 20);
}
}
ImageLayout.prototype.align = function () {
var i;
var results_selectorNode = d.querySelectorAll(this.results_selector);
@ -141,9 +159,9 @@
}
};
ImageLayout.prototype.watch = function () {
ImageLayout.prototype._monitorImages = function () {
var i, img;
var obj = this;
var objthrottleAlign = this.throttleAlign.bind(this);
var results_nodes = d.querySelectorAll(this.results_selector);
var results_length = results_nodes.length;
@ -152,34 +170,53 @@
event.originalTarget.src = w.searxng.static_path + w.searxng.theme.img_load_error;
}
function throttleAlign () {
if (obj.isAlignDone) {
obj.isAlignDone = false;
setTimeout(function () {
obj.align();
obj.isAlignDone = true;
}, 100);
}
}
// https://developer.mozilla.org/en-US/docs/Web/API/Window/pageshow_event
w.addEventListener('pageshow', throttleAlign);
// https://developer.mozilla.org/en-US/docs/Web/API/FileReader/load_event
w.addEventListener('load', throttleAlign);
// https://developer.mozilla.org/en-US/docs/Web/API/Window/resize_event
w.addEventListener('resize', throttleAlign);
for (i = 0; i < results_length; i++) {
img = results_nodes[i].querySelector(this.img_selector);
if (img !== null && img !== undefined) {
img.addEventListener('load', throttleAlign);
if (img !== null && img !== undefined && !img.classList.contains('aligned')) {
img.addEventListener('load', objthrottleAlign);
// https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror
img.addEventListener('error', throttleAlign);
img.addEventListener('error', objthrottleAlign);
img.addEventListener('timeout', objthrottleAlign);
if (w.searxng.theme.img_load_error) {
img.addEventListener('error', img_load_error, {once: true});
}
img.classList.add('aligned');
}
}
}
ImageLayout.prototype.watch = function () {
var objthrottleAlign = this.throttleAlign.bind(this);
// https://developer.mozilla.org/en-US/docs/Web/API/Window/pageshow_event
w.addEventListener('pageshow', objthrottleAlign);
// https://developer.mozilla.org/en-US/docs/Web/API/FileReader/load_event
w.addEventListener('load', objthrottleAlign);
// https://developer.mozilla.org/en-US/docs/Web/API/Window/resize_event
w.addEventListener('resize', objthrottleAlign);
this._monitorImages();
var obj = this;
let observer = new MutationObserver(entries => {
let newElement = false;
for (let i = 0; i < entries.length; i++) {
if (entries[i].addedNodes.length > 0 && entries[i].addedNodes[0].classList.contains('result')) {
newElement = true;
break;
}
}
if (newElement) {
obj._monitorImages();
}
});
observer.observe(d.querySelector(this.container_selector), {
childList: true,
subtree: true,
attributes: false,
characterData: false,
})
};
w.searxng.ImageLayout = ImageLayout;