data.coop/pinafore
8
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

fix: remove intrinsicsize in favor of width/height (#1690)

Browse source
This commit is contained in:
Nolan Lawson 2019-12-24 10:47:27 -08:00 committed by GitHub
parent f5bb8a0b14
commit 21a300bd4c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/routes/_components/dialog/components/MediaFocalPointEditor.html
View file

@ -4,7 +4,8 @@
>
<div class="media-focal-point-image-container" ref:container>
<img
{intrinsicsize}
width={intrinsicWidth}
height={intrinsicHeight}
class="media-focal-point-image"
src={previewSrc}
alt={shortName}
@ -229,14 +230,10 @@
// so fall back to the description if it was provided
get(mediaItem, ['file', 'name']) || get(mediaItem, ['description']) || 'media'
),
intrinsicsize: ({ mediaItem }) => {
const width = get(mediaItem, ['data', 'meta', 'original', 'width'])
const height = get(mediaItem, ['data', 'meta', 'original', 'height'])
if (width && height) {
return `${width} x ${height}`
}
return '' // pleroma does not give us original width/height
},
// intrinsic width/height to avoid layout shifting https://chromestatus.com/feature/5695266130755584
// note pleroma does not give us intrinsic width/height
intrinsicWidth: ({ mediaItem }) => get(mediaItem, ['data', 'meta', 'original', 'width']),
intrinsicHeight: ({ mediaItem }) => get(mediaItem, ['data', 'meta', 'original', 'height']),
scale: ({ nativeWidth, nativeHeight, containerWidth, containerHeight }) => (
intrinsicScale(containerWidth, containerHeight, nativeWidth, nativeHeight)
),

21
src/routes/_components/dialog/components/MediaInDialog.html
View file

@ -5,7 +5,8 @@
src={url}
{poster}
controls
{intrinsicsize}
width={intrinsicWidth}
height={intrinsicHeight}
ref:player
/>
{:elseif type === 'audio'}
@ -29,7 +30,8 @@
loop
webkit-playsinline
playsinline
{intrinsicsize}
width={intrinsicWidth}
height={intrinsicHeight}
/>
{:else}
<img
@ -37,7 +39,8 @@
alt={description}
title={description}
src={url}
{intrinsicsize}
width={intrinsicWidth}
height={intrinsicHeight}
/>
{/if}
<style>
@ -78,14 +81,10 @@
description: ({ media }) => media.description || '',
poster: ({ media }) => media.preview_url,
static_url: ({ media }) => media.static_url,
intrinsicsize: ({ media }) => {
const width = get(media, ['meta', 'original', 'width'])
const height = get(media, ['meta', 'original', 'height'])
if (width && height) {
return `${width} x ${height}`
}
return '' // pleroma does not give us original width/height
}
// intrinsic width/height to avoid layout shifting https://chromestatus.com/feature/5695266130755584
// note pleroma does not give us intrinsic width/height
intrinsicWidth: ({ media }) => get(media, ['meta', 'original', 'width']),
intrinsicHeight: ({ media }) => get(media, ['meta', 'original', 'height'])
},
ondestroy () {
const player = this.refs.player