client/posts: fix resize modes on chrome

This commit is contained in:
rr- 2017-01-03 20:00:41 +01:00
parent e2fcd08ce9
commit 4340b4d9b2
4 changed files with 12 additions and 15 deletions

View file

@ -8,16 +8,7 @@
margin: 0 auto
position: relative
img, object, video, .post-overlay
position: absolute
height: 100%
width: 100%
left: 0
right: 0
top: 0
bottom: 0
.post-overlay>*
.resize-listener
position: absolute
left: 0
right: 0

View file

@ -1,11 +1,11 @@
<div class='post-content post-type-<%- ctx.post.type %>'>
<% if (['image', 'animation'].includes(ctx.post.type)) { %>
<img alt='' src='<%- ctx.post.contentUrl %>'/>
<img class='resize-listener' alt='' src='<%- ctx.post.contentUrl %>'/>
<% } else if (ctx.post.type === 'flash') { %>
<object width='<%- ctx.post.canvasWidth %>' height='<%- ctx.post.canvasHeight %>' data='<%- ctx.post.contentUrl %>'>
<object class='resize-listener' width='<%- ctx.post.canvasWidth %>' height='<%- ctx.post.canvasHeight %>' data='<%- ctx.post.contentUrl %>'>
<param name='wmode' value='opaque'/>
<param name='movie' value='<%- ctx.post.contentUrl %>'/>
</object>
@ -14,6 +14,7 @@
<%= ctx.makeElement(
'video', {
class: 'resize-listener',
controls: true,
loop: (ctx.post.flags || []).includes('loop'),
autoplay: ctx.autoplay,
@ -27,6 +28,6 @@
<% } else { console.log(new Error('Unknown post type')); } %>
<div class='post-overlay'>
<div class='post-overlay resize-listener'>
</div>
</div>

View file

@ -86,8 +86,12 @@ class PostContentControl {
}
_resize(width, height) {
this._postContentNode.style.width = width + 'px';
this._postContentNode.style.height = height + 'px';
const resizeListenerNodes = [this._postContentNode].concat(
...this._postContentNode.querySelectorAll('.resize-listener'));
for (let node of resizeListenerNodes) {
node.style.width = width + 'px';
node.style.height = height + 'px';
}
}
_refreshSize() {

View file

@ -547,6 +547,7 @@ class PostNotesOverlayControl extends events.EventTarget {
this._hostNode = hostNode;
this._svgNode = document.createElementNS(svgNS, 'svg');
this._svgNode.classList.add('resize-listener');
this._svgNode.classList.add('notes-overlay');
this._svgNode.setAttribute('preserveAspectRatio', 'none');
this._svgNode.setAttribute('viewBox', '0 0 1 1');