tonyair/silverstripe-iframe
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-iframe synced 2024-10-22 11:05:51 +02:00
Code Issues Projects Releases Wiki Activity

ENHANCEMENT: add auto-sizing iframes, cleanup

Browse Source
This commit is contained in:
Mateusz Uzdowski 2012-06-01 17:21:05 +12:00
parent 3f01e07af6
commit 70cc4427d0
5 changed files with 36 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
_config.php
View File

@ -1,5 +1,2 @@
<?php <?php
?>

44
code/IFramePage.php
View File

@ -12,28 +12,38 @@ class IFramePage extends Page {
function getCMSFields() { function getCMSFields() {
$fields = parent::getCMSFields(); $fields = parent::getCMSFields();
$fields->removeFieldFromTab('Root.Content.Main', 'Content'); $fields->removeFieldFromTab('Root.Main', 'Content');
$fields->addFieldToTab('Root.Content.Main', new TextField('IFrameUrl', 'IFrame URL')); $fields->addFieldToTab('Root.Main', new TextField('IFrameUrl', 'IFrame URL'));
//$fields->addFieldToTab('Root.Content.Main', new CheckboxField('DynamicHeight', 'Dynamically resize the IFrame height (this doesn\'t work if IFrame URL is on a different domain)')); $fields->addFieldToTab('Root.Main', new CheckboxField('DynamicHeight', 'Dynamically resize the IFrame height (this doesn\'t work if IFrame URL is on a different domain)'));
$fields->addFieldToTab('Root.Content.Main', new NumericField('FixedHeight', 'Fixed Height (in pixels)')); $fields->addFieldToTab('Root.Main', new NumericField('FixedHeight', 'Fixed Height (in pixels)'));
$fields->addFieldToTab('Root.Content.Main', new HtmlEditorField('Content', 'Content (appears above IFrame)')); $fields->addFieldToTab('Root.Main', new HtmlEditorField('Content', 'Content (appears above IFrame)'));
$fields->addFieldToTab('Root.Content.Main', new HtmlEditorField('BottomContent', 'Content (appears below IFrame)')); $fields->addFieldToTab('Root.Main', new HtmlEditorField('BottomContent', 'Content (appears below IFrame)'));
$fields->addFieldToTab('Root.Content.Main', new HtmlEditorField('AlternateContent', 'Alternate Content (appears when user has IFrames disabled)')); $fields->addFieldToTab('Root.Main', new HtmlEditorField('AlternateContent', 'Alternate Content (appears when user has IFrames disabled)'));
return $fields; return $fields;
} }
} }
class IFramePage_Controller extends Page_Controller { class IFramePage_Controller extends Page_Controller {
function Height() { function init() {
/*if($this->DynamicHeight) { parent::init();
return 'class="iframeautosize"';
} else {*/ if ($this->DynamicHeight) {
return 'style="height: ' . $this->FixedHeight . 'px;"'; Requirements::customScript(<<<SCRIPT
//}
if (typeof jQuery!=='undefined') {
jQuery(function($) {
var iframe = $('iframe.iframeautosize');
iframe.load(function() {
var iframeSize = $(iframe[0].contentWindow.document.body).height();
iframeSize = (parseInt(iframeSize)+100)+'px';
iframe.attr('height', iframeSize);
});
});
}
SCRIPT
);
}
} }
} }
?>

8
css/IFramePage.css
View File

@ -1,8 +0,0 @@
#IFramePageIFrame {
width: 100%;
border: none;
}
#IFramePage {
padding: 10px;
}

46
javascript/IFramePage.js
View File

@ -1,46 +0,0 @@
$(document).ready(function()
{
// Set specific variable to represent all iframe tags.
var iFrames = document.getElementsByTagName('iframe');
// Resize heights.
function iResize()
{
// Iterate through all iframes in the page.
for (var i = 0, j = iFrames.length; i < j; i++)
{
// Set inline style to equal the body height of the iframed content.
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';
}
}
// Check if browser is Safari or Opera.
if (jquery.browser.safari || $.browser.opera)
{
// Start timer when loaded.
$('iframe').load(function()
{
setTimeout(iResize, 0);
}
);
// Safari and Opera need a kick-start.
for (var i = 0, j = iFrames.length; i < j; i++)
{
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
}
else
{
// For other good browsers.
$('iframe').load(function()
{
// Set inline style to equal the body height of the iframed content.
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
}
);
}
}
);

12
templates/Layout/IFramePage.ss
View File

@ -1,13 +1,11 @@
<% require ThemedCSS(IFramePage) %>
<% require javascript(jsparty/jquery/jquery.js) %>
<% require javascript(iframe/javascript/IFramePage.js) %>
<div class="typography"> <div class="typography">
<h2>$Title</h2> <h2>$Title</h2>
$Content $Content
<iframe id="IFramePageIFrame" src="$IFrameUrl" $Height> <% if DynamicHeight %>
$AlternateContent <iframe src="$IFrameUrl" class="iframeautosize" style="width: 100%;">$AlternateContent</iframe>
</iframe> <% else %>
<iframe src="$IFrameUrl" style="width: 100%; height: {$FixedHeight}px;">$AlternateContent</iframe>
<% end_if %>
$BottomContent $BottomContent
</div> </div>