explorigin/gallery
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

attachmentImage should be dumber

Browse Source 
Yet, ServiceWorker a little smarter
This commit is contained in:
Timothy Farrell 2017-12-28 19:38:54 -06:00
parent 4994836f22
commit 9fd5efc4f9
3 changed files with 46 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/gallery/src/interface/components/albumPhotoTemplate.js
View File

@ -35,7 +35,8 @@ export function AlbumPhotoTemplate(vm, { doc }) {
_data: doc _data: doc
}, },
[ [
AttachmentImageView(doc, { AttachmentImageView({
src: doc.sizes.thumbnail || doc.sizes.full,
css: { css: {
transform: isSelected ? 'translateZ(-50px)' : null transform: isSelected ? 'translateZ(-50px)' : null
} }

39
packages/gallery/src/interface/components/attachmentImage.js
View File

@ -9,46 +9,35 @@ import { DEFAULT_TRANSITION } from '../styles.js';
const srcMap = new Map(); const srcMap = new Map();
async function loadImageFromBlob(doc, evt, node, vm) { async function loadImageFromBlob(srcUrl, evt, node, vm) {
const { sizes, _id } = doc;
const options = ['thumbnail', 'preview', 'full'].filter(o => sizes.hasOwnProperty(o));
for (let attempt of options) {
try { try {
const data = await FileType.getFromURL(sizes[attempt]); const src = URL.createObjectURL(await FileType.getFromURL(srcUrl));
let src = evt.target.src;
if (src.startsWith('blob:')) {
URL.revokeObjectURL(src);
}
src = URL.createObjectURL(data);
node.patch({ src }); node.patch({ src });
srcMap.set(_id, src); srcMap.set(srcUrl, src);
// node.data = attempt; } catch (e) {
break; // src is not a saved file source
} catch (err) {
continue;
}
} }
} }
function cleanup(node) { function cleanup(node) {
const src = node.el.src; const { src } = node.el;
if (src.startsWith('blob:')) { if (src.startsWith('blob:') && srcMap.has(node.key)) {
URL.revokeObjectURL(src); URL.revokeObjectURL(src);
srcMap.delete(node.key); srcMap.delete(node.key);
} }
} }
export function AttachmentImageView(doc, props) { export function AttachmentImageView(props) {
const { sizes, _id } = doc; const { src } = props;
const src = srcMap.get(_id) || sizes.thumbnail || sizes.preview || sizes.full; const cachedSrc = srcMap.get(src);
const _src = cachedSrc || src;
delete props.src;
return image( return image(
Object.assign( Object.assign(
{ {
src, src: _src,
onerror: [loadImageFromBlob, doc], onerror: !cachedSrc ? [loadImageFromBlob, _src] : null,
_key: _id,
_hooks: { _hooks: {
willRemove: cleanup willRemove: cleanup
} }

42
packages/gallery/src/sw.js
View File

@ -1,4 +1,14 @@
import { FileType } from './data/file.js'; import { FileType } from './data/file.js';
import { log } from './services/console.js';
const http404 = url => () => {
log(`ServiceWorker could not find ${url}`);
return new Response(null, {
status: 404,
statusText: 'NOT FOUND',
headers: {}
});
};
self.addEventListener('fetch', event => { self.addEventListener('fetch', event => {
const requestUrl = new URL(event.request.url); const requestUrl = new URL(event.request.url);
@ -6,30 +16,24 @@ self.addEventListener('fetch', event => {
if (requestUrl.pathname && requestUrl.pathname.startsWith('/file/')) { if (requestUrl.pathname && requestUrl.pathname.startsWith('/file/')) {
event.respondWith( event.respondWith(
FileType.getFromURL(requestUrl.pathname) FileType.getFromURL(requestUrl.pathname)
.then( .then(data => {
data => if (data) {
data log(
? new Response(data, { `ServiceWorker serving ${requestUrl.pathname} ${data.type} ${(data.size / 1024).toFixed(
2
)}kb`
);
return new Response(data, {
status: 200, status: 200,
statusText: 'OK', statusText: 'OK',
headers: { headers: {
'Content-Type': data.mimetype 'Content-Type': data.type
} }
});
}
return http404(requestUrl.pathname)();
}) })
: new Response(null, { .catch(http404(requestUrl.pathname))
status: 404,
statusText: 'NOT FOUND',
headers: {}
})
)
.catch(
() =>
new Response(null, {
status: 404,
statusText: 'NOT FOUND',
headers: {}
})
)
); );
} }
}); });