injects our attribs into iframe element

This commit is contained in:
buttle 2021-08-30 17:27:26 +02:00
parent f4d75b5b78
commit 34713d9acb
2 changed files with 53 additions and 27 deletions

View File

@ -8,8 +8,8 @@ use Omeka\Site\BlockLayout\AbstractBlockLayout;
use Laminas\View\Renderer\PhpRenderer;
use Laminas\Form\FormElementManager;
use Vimeo\Form\VimeoBlockForm;
use DOMDocument;
class Vimeo extends AbstractBlockLayout
{
@ -70,23 +70,49 @@ class Vimeo extends AbstractBlockLayout
if (!$attachments) {
return '';
}
$thumbnails = [];
static $id = 0;
$media = $attachments[0]->item()->media()[0];
$vimeo_width = $media->mediaData()['width'];
$vimeo_height = $media->mediaData()['height'];
$ratio = $vimeo_width / $vimeo_height;
$width = $media->mediaData()['width'];
$width = 100;
$height = 0;
// creates an iframe injecting our width and calculated ratio and height
$attribs=" ";
$original_width = 0;
$original_height = 0;
$doc = new DOMDocument();
$doc->loadHTML($media->mediaData()['html']);
$html_element= $doc->getElementsByTagName('iframe')->item(0);
if ($html_element->hasAttributes()) {
foreach ($html_element->attributes as $attr) {
$name = $attr->nodeName;
$value = $attr->nodeValue;
if ($name == 'height') {
$original_height = $value;
continue;
}
if ($name == 'width') {
$original_width = $value;
$attrib = $name.'="'.$width.'%"';
$attribs .= $attrib.PHP_EOL;
continue;
}
$attrib = $name.'="'.$value.'"';
$attribs .= $attrib.PHP_EOL;
}
}
if ($original_height !== 0) {
$ratio = $original_width / $original_height;
$attrib = 'ratio="'.$ratio.'"';
$attribs .= $attrib.PHP_EOL;
}
$iframe = "<iframe ".$attribs." >".PHP_EOL."</iframe>";
return $view->partial('common/block-layout/vimeo', [
'title' => $block->dataValue('title'),
'renderSourceLink' => $block->dataValue('renderSourceLink'),
'item_url' => $attachments[0]->item()->url(),
'width' => $block->dataValue('width'),
'video_id' => $media->mediaData()['video_id'],
'ratio' => $ratio,
'vimeo_iframe' => $media->mediaData()['html'],
'vimeo_iframe' => $iframe
]);
}
}
}

View File

@ -3,7 +3,8 @@ $this->headScript()->appendFile($this->assetUrl('js/height_calculator.js',
'Vimeo'));
?>
<div id="vimeo_<?= $video_id ?>" class="vimeo-embed-wrapper" style="position:relative;">
<div class="vimeo-embed-wrapper"
style="position:relative;">
<?php if ($renderSourceLink) { ?>
<div class="source-link">
@ -25,9 +26,8 @@ $this->headScript()->appendFile($this->assetUrl('js/height_calculator.js',
function adjust_height() {
$(".vimeo-embed-wrapper").each(function() {
var iframe = $(this).find('iframe')
$(iframe).prop("width", "<?= $width ?>%")
var height = get_height(iframe, <?= $ratio ?>)
$(iframe).prop("height", height)
var ratio = $(iframe).attr('ratio')
$(iframe).prop("height", get_height(iframe, ratio))
});
}
jQuery(document).ready(function() {