When the browser window is resized, a new click event listener is added
to the window but the old one is not removed. The old one ends up
preventing the newly-made dropdown from opening.
Fix this by remembering the click event listener function added to the
window, and remove it before making the new dropdown after a window
resize.
Casper comes with infinite scrolling by default. This update makes it possible to go with the default pagination style when the <html> element has a class no-infinite-scroll.
The tag archive header shares the same classes as post cards, but have different elements.
This changes the selector to target article.post-card, which ignores header.post-card
closes#634, closes#635
- use `document.importNode` to create a clone of post card elements when pulling them in from infinite scroll pages
- cloning the element means the element's owner document matches the viewed document and ensures images in the inserted post card elements are sized according to the viewed document
no issue
- replaces author hover JS that was lost during merge
- replaces `floating-header.js` with `sticky-nav-title.js` containing the relevant JS that was lost during merge with a cleanup for unused variables and unnecessary event listeners
- removes reference to non-existent `{{> floating-header}}` partial
no issue
- moved large inline JS from templates into separate JS files
- floating header
- gallery card support
- use `gulp-concat` to concatenate all JS files into a single `built/casper.js` file
- reduces external JS file requests from 3 (jquery, infinite-scroll.js, jquery.fitvids.js) down to 2 (jquery, casper.js) and reduces page size by removing repeated inline code
closes#445
- added an fn to sanitize the pathname, that might include a pagination url
- fixed an issue, where the request would still be made if the current page is bigger than max pages
- added comments
Closes https://github.com/TryGhost/Casper/issues/330
As usual Firefox is the bane of fucking everything and despite IE7 calling multiple times wanting its rendering back, here we are. Responsive video embeds insider a flexbox element do not work in Firefox and require an additional (very specific) wrapping div. I've adjusted the Fitvids.js script here to include that div in its injection along with the requisite styles. It's a horrible hack. Spent 2 hours trying to find another way but I cant.
closes#321, closes#323
- use `requestAnimationFrame` and related techniques to minimise scroll processing
- add an `isLoading` guard to ensure we don't try to process anything until the next page has been loaded+inserted
- check for a 404 as an indication we've loaded as many pages as possible at which point the scroll behaviour is removed
- sanitize `window.location.pathname` to remove hash params and any double-slashes that may result
- add a 100px buffer from the bottom of the screen so that it's not necessary to exactly hit the bottom before infinite loading is triggered
Declared all jQuery objects once where needed instead of diving into the DOM multiple times for the same object.
Added style consistency between variable declarations, if/else statements and functions.