Merge pull request #2824 from Hypolite/Issue-#2823
Fix Issue #2823 - Ugly scrollbars in oembed iframes and broken resizing
This commit is contained in:
commit
40fbe1644d
3 changed files with 30 additions and 25 deletions
|
@ -209,25 +209,32 @@ function oembed_format_object($j){
|
|||
return mb_convert_encoding($ret, 'HTML-ENTITIES', mb_detect_encoding($ret));
|
||||
}
|
||||
|
||||
function oembed_iframe($src,$width,$height) {
|
||||
|
||||
if(! $width || strstr($width,'%'))
|
||||
$width = '640';
|
||||
if(! $height || strstr($height,'%')) {
|
||||
$height = '300';
|
||||
$resize = 'onload="resizeIframe(this);"';
|
||||
} else
|
||||
$resize = '';
|
||||
|
||||
// try and leave some room for the description line.
|
||||
$height = intval($height) + 80;
|
||||
$width = intval($width) + 40;
|
||||
/**
|
||||
* Generates the iframe HTML for an oembed attachment. Width and height are given
|
||||
* by the remote, and are regularly too small for the generated iframe.
|
||||
*
|
||||
* The width is entirely discarded for the actual width of the post, while fixed
|
||||
* height is used as a starting point before the inevitable resizing.
|
||||
*
|
||||
* Since the iframe is automatically resized on load, there are no need for ugly
|
||||
* and impractical scrollbars.
|
||||
*
|
||||
* @param string $src Original remote URL to embed
|
||||
* @param string $width
|
||||
* @param string $height
|
||||
* @return string
|
||||
*
|
||||
* @see oembed_format_object()
|
||||
*/
|
||||
function oembed_iframe($src, $width, $height) {
|
||||
if (!$height || strstr($height,'%')) {
|
||||
$height = '200';
|
||||
}
|
||||
$width = '100%';
|
||||
|
||||
$a = get_app();
|
||||
|
||||
$s = $a->get_baseurl()."/oembed/".base64url_encode($src);
|
||||
return '<iframe '.$resize.' class="embed_rich" height="'.$height.'" width="'.$width.'" src="'.$s.'" frameborder="no">'.t('Embedded content').'</iframe>';
|
||||
|
||||
$s = $a->get_baseurl() . '/oembed/'.base64url_encode($src);
|
||||
return '<iframe onload="resizeIframe(this);" class="embed_rich" height="' . $height . '" width="' . $width . '" src="' . $s . '" scrolling="no" frameborder="no">' . t('Embedded content') . '</iframe>';
|
||||
}
|
||||
|
||||
|
||||
|
|
13
js/main.js
13
js/main.js
|
@ -5,17 +5,14 @@
|
|||
|
||||
function _resizeIframe(obj, desth) {
|
||||
var h = obj.style.height;
|
||||
var ch = obj.contentWindow.document.body.scrollHeight + 'px';
|
||||
if (h==ch) {
|
||||
var ch = obj.contentWindow.document.body.scrollHeight;
|
||||
if (h == (ch + 'px')) {
|
||||
return;
|
||||
}
|
||||
//console.log("_resizeIframe", obj, desth, ch);
|
||||
if (desth!=ch) {
|
||||
setTimeout(_resizeIframe, 500, obj, ch);
|
||||
} else {
|
||||
if (ch>0) obj.style.height = ch;
|
||||
setTimeout(_resizeIframe, 1000, obj, ch);
|
||||
if (desth == ch && ch>0) {
|
||||
obj.style.height = ch + 'px';
|
||||
}
|
||||
setTimeout(_resizeIframe, 100, obj, ch);
|
||||
}
|
||||
|
||||
function openClose(theID) {
|
||||
|
|
|
@ -115,6 +115,7 @@ span.connector {
|
|||
|
||||
.embed_rich {
|
||||
display: block;
|
||||
transition: height .75s;
|
||||
}
|
||||
|
||||
/* Shared Messages */
|
||||
|
|
Loading…
Reference in a new issue