31 lines
733 B
JavaScript
31 lines
733 B
JavaScript
import { modifier } from 'ember-modifier';
|
|
|
|
export default modifier((element, [url]) => {
|
|
if (!url) return;
|
|
|
|
// Remove classes when URL changes
|
|
element.classList.remove('loaded');
|
|
element.classList.remove('loaded-instant');
|
|
|
|
// Create an off-DOM image to reliably check cache status
|
|
// without waiting for the actual DOM element to load it
|
|
const img = new Image();
|
|
img.src = url;
|
|
|
|
if (img.complete) {
|
|
// Already in browser cache, skip the animation
|
|
element.classList.add('loaded-instant');
|
|
return;
|
|
}
|
|
|
|
const handleLoad = () => {
|
|
element.classList.add('loaded');
|
|
};
|
|
|
|
element.addEventListener('load', handleLoad);
|
|
|
|
return () => {
|
|
element.removeEventListener('load', handleLoad);
|
|
};
|
|
});
|