Skip to content

Fix viewport size calculation on Firefox first load #1271

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
BuildPushkar wants to merge 5 commits into
base: main
Choose a base branch
from
Open

Fix viewport size calculation on Firefox first load #1271

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
351e4e1
Fix viewport size calculation on Firefox first load
BuildPushkar Feb 19, 2026
fd155b4
Fix formatting and update cache busting IDs"
BuildPushkar Feb 23, 2026
cf3ca17
Fix code formatting and update cache busting IDs for statics files
BuildPushkar Feb 23, 2026
b3c356c
Merge branch 'main' into fix-homepage-results
BuildPushkar Feb 24, 2026
851d4a7
Merge branch 'main' into fix-homepage-results
BuildPushkar Feb 27, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 29 additions & 3 deletions static/skin/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,11 +117,37 @@
return str.replace(/[\u00A0-\u9999<>\&]/gim, (i) => `&#${i.charCodeAt(0)};`);
}

function viewPortToCount(){
const zoom = Math.floor((( window.outerWidth - 10 ) / window.innerWidth) * 100);
return Math.floor((window.innerHeight/(3*zoom) + 1)*(window.innerWidth/(2.5*zoom) + 1));
function viewPortToCount() {
// Use stable viewport size instead of outerWidth (Firefox devtools issue)
const width =
document.documentElement.clientWidth || window.innerWidth;

const height =
document.documentElement.clientHeight || window.innerHeight;

// Zoom ratio btw layout width and viewport width
let zoomRatio = 1;

if (window.innerWidth) {
zoomRatio = width / window.innerWidth || 1;
}

// Estimated card size (in viewport units)
const CARD_HEIGHT_FACTOR = 3;
const CARD_WIDTH_FACTOR = 2.5;

const rows = Math.floor(
height / (CARD_HEIGHT_FACTOR * zoomRatio) + 1
);

const cols = Math.floor(
width / (CARD_WIDTH_FACTOR * zoomRatio) + 1
);
Comment on lines -120 to +145
Copy link
Copy Markdown
Collaborator

@veloman-yunkan veloman-yunkan Feb 23, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this won't work. Before this change zoom used to be percentage, but the formulas for rows and cols have been actually preserved in spite of the fact that zoomRatio is now being used instead.

Copy link
Copy Markdown
Author

@BuildPushkar BuildPushkar Feb 23, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for pointing this out, I see what you mean.
The goal was to switch to a ratio while keeping the existing behavior stable but I agree this may not fully preserve the original scaling.
I’ll revisit the calculation and see how we can better align it with the new zoomRatio semantics.

Comment on lines -120 to +145
Copy link
Copy Markdown
Collaborator

@veloman-yunkan veloman-yunkan Mar 1, 2026 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Has this code been tested? The concern raised during the previous has not been addressed, and therefore it looks like the functionality should be utterly broken unless the return value of viewPortToCount() (which is now ~10000 larger than before the change) doesn't matter at all (which would mean a different kind of defect of the implementation).


return rows * cols;
}


function getInnerHtml(node, query) {
const queryNode = node.querySelector(query);
return queryNode != null ? queryNode.innerHTML : "";
Expand Down
Loading