Skip to content

Commit

Permalink
MediaEmbed: limit the width of dynamically-sized embeds to 100%
Browse files Browse the repository at this point in the history
  • Loading branch information
@JoshyPHP
JoshyPHP committed Jul 21, 2017
1 parent 6e82a26 commit 2d3cc9b
Show file tree
Hide file tree
Showing 4 changed files with 15 additions and 9 deletions.
4 changes: 2 additions & 2 deletions src/Bundles/MediaPack/Renderer.php
View file

Large diffs are not rendered by default.

10 changes: 8 additions & 2 deletions src/Plugins/MediaEmbed/Configurator/TemplateGenerator.php
View file
Expand Up @@ -60,8 +60,9 @@ public function getTemplate(array $attributes)
}
else
{
$this->attributes['style']['width'] = '100%';
$this->attributes['style']['height'] = $this->attributes['height'] . 'px';
$this->attributes['style']['width'] = '100%';
$this->attributes['style']['height'] = $this->attributes['height'] . 'px';
$this->attributes['style']['max-width'] = '100%';

if (isset($this->attributes['max-width']))
{
Expand All @@ -72,6 +73,11 @@ public function getTemplate(array $attributes)
$property = ($this->hasDynamicWidth()) ? 'width' : 'max-width';
$this->attributes['style'][$property] = $this->attributes['width'] . 'px';
}

if ($this->attributes['style']['width'] === $this->attributes['style']['max-width'])
{
unset($this->attributes['style']['max-width']);
}
}

return $prepend . $this->getContentTemplate() . $append;
Expand Down
2 changes: 1 addition & 1 deletion tests/Plugins/MediaEmbed/Configurator/TemplateGenerators/IframeTest.php
View file
Expand Up @@ -77,7 +77,7 @@ public function getGetTemplateTests()
'src' => 'foo',
'onload' => 'this.style.height=$height;this.style.width=$width'
],
'<iframe allowfullscreen="" onload="this.style.height=$height;this.style.width=$width" scrolling="no" src="foo" style="border:0;height:300px;width:500px"/>'
'<iframe allowfullscreen="" onload="this.style.height=$height;this.style.width=$width" scrolling="no" src="foo" style="border:0;height:300px;max-width:100%;width:500px"/>'
],
[
[
Expand Down
8 changes: 4 additions & 4 deletions tests/Plugins/MediaEmbed/ParserTest.php
View file
Expand Up @@ -1414,7 +1414,7 @@ function ($configurator)
],
[
'https://imgur.com/a/9UGCL',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#a/9UGCL"></iframe>',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;max-width:100%;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#a/9UGCL"></iframe>',
[],
function ($configurator)
{
Expand Down Expand Up @@ -3834,7 +3834,7 @@ function ($configurator)
],
[
'https://imgur.com/AsQ0K3P',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#AsQ0K3P"></iframe>',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;max-width:100%;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#AsQ0K3P"></iframe>',
[],
function ($configurator)
{
Expand All @@ -3843,7 +3843,7 @@ function ($configurator)
],
[
'http://i.imgur.com/u7Yo0Vy.gifv',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#u7Yo0Vy"></iframe>',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;max-width:100%;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#u7Yo0Vy"></iframe>',
[],
function ($configurator)
{
Expand All @@ -3852,7 +3852,7 @@ function ($configurator)
],
[
'http://i.imgur.com/u7Yo0Vy.mp4',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#u7Yo0Vy"></iframe>',
'<iframe data-s9e-mediaembed="imgur" allowfullscreen="" onload="var b=Math.random();window.addEventListener(\'message\',function(a){a.data.id==b&amp;&amp;(style.height=a.data.height+\'px\',style.width=a.data.width+\'px\')});contentWindow.postMessage(\'s9e:\'+b,\'https://s9e.github.io\')" scrolling="no" style="border:0;height:450px;max-width:100%;width:568px" src="https://s9e.github.io/iframe/imgur.min.html#u7Yo0Vy"></iframe>',
[],
function ($configurator)
{
Expand Down

0 comments on commit 2d3cc9b

Please sign in to comment.