dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * Creates a wrapper around an iframe. It loads the content either from a local
daeb6d531149c45a2ceb543ae2cf1e56e5235bbeDav Glass * file or from script and creates a local YUI instance bound to that new window and document.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @class Frame
09c638a157dd9d2ed9027215d9e254badfa019b8Dav Glass * @for Frame
09c638a157dd9d2ed9027215d9e254badfa019b8Dav Glass * @extends Base
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @constructor
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @module editor
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @submodule frame
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass Frame.superclass.constructor.apply(this, arguments);
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @property _ready
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Internal reference set when the content is ready.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @type Boolean
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @property _rendered
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Internal reference set when render is called.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @type Boolean
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @property _iframe
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Internal Node reference to the iFrame or the window
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @type Node
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @property _instance
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Internal reference to the YUI instance bound to the iFrame or window
0083a85467aaec586c9609a224503db91ddc238dDav Glass * @method _create
b357b56da58949fa86ab8e56983972e0db5cbffbDav Glass * @description Create the iframe or Window and get references to the Document & Window
b357b56da58949fa86ab8e56983972e0db5cbffbDav Glass * @return {Object} Hash table containing references to the new Document & Window
b9bc793332c43ca5a4d2c836f912781c5d3974f7Dav Glass extra_css = ((this.get('extracss')) ? '<style id="extra_css">' + this.get('extracss') + '</style>' : '');
1e44d35dd310d594ecc977ee4ed7cf6ef3746045Dav Glass //if the src attr is different than the default, don't create the document
1e44d35dd310d594ecc977ee4ed7cf6ef3746045Dav Glass var create = (this.get('src') === Frame.ATTRS.src.value);
6e43f558138d36538a82459ec79e0279ffae22e0Dav Glass Y.log('Creating the document from javascript', 'info', 'frame');
if (html) {
* @return {Object} Object hash of window and document references, if a YUI config was passed, it is returned.
_resolveWinDoc: function(c) {
var config = (c) ? c : {};
return config;
* takes the current EventFacade and augments it to fire on the Frame host. It adds two new properties
_onDomEvent: function(e) {
e.frameEvent = e;
initializer: function() {
emitFacade: true,
destructor: function() {
inst = null;
_DOMPaste: function(e) {
data = null;
e.frameEvent = e;
if (data) {
e.clipboardData = {
getData: function() {
return data;
e.clipboardData = null;
_defReadyFn: function() {
* It appears that having a BR tag anywhere in the source "below" a table with a percentage width (in IE 7 & 8)
* if there is any TEXTINPUT's outside the iframe, the cursor will rapidly flickr and the CPU would occasionally
* spike. This method finds all <BR>'s below the sourceIndex of the first table. Does some checks to see if they
* can be modified and replaces then with a <WBR> so the layout will remain in tact, but the flickering will
_fixIECursors: function() {
if (b.size()) {
* @description Called once the content is available in the frame/window and calls the final use call
_onContentReady: function(e) {
if (!this._ready) {
this._ready = true;
this._ieSetBodyHeight();
_ieHeightCounter: null,
_ieSetBodyHeight: function(e) {
if (!this._ieHeightCounter) {
this._ieHeightCounter++;
var run = false;
run = true;
switch (e.keyCode) {
run = true;
run = true;
if (run) {
if (h > bh) {
* @description Resolves the basehref of the page the frame is created on. Only applies to dynamic content.
return href;
if (this._ready) {
return html;
if (this._ready) {
}, this, html));
return html;
if (!this._ready) {
return str;
if (this._ready) {
return css;
if (this._ready) {
return css;
this._onContentReady();
} catch (err) {}
* @description This is a scoped version of the normal YUI.use method & is bound to this frame/window.
use: function() {
cb = false;
if (cb) {
* @param {String} cont The container to act as a delegate, if no "sel" passed, the body is assumed as the container.
if (!inst) {
Y.log('Delegate events can not be attached until after the ready event has fired.', 'error', 'iframe');
if (!sel) {
getInstance: function() {
return this._instance;
* @param {String/HTMLElement/Node} node The node to render to
if (this._rendered) {
this._rendered = true;
if (node) {
this._instanceLoaded(i);
config = {
debug: false,
if (timer) {
fn();
_handleFocus: function() {
if (c.size()) {
if (par) {
if (this.getInstance()) {
} catch (ierr) {
if (fn === true) {
this._handleFocus();
fn();
if (this.getInstance()) {
if (fn === true) {
this._handleFocus();
fn();
} catch (ferr) {
show: function() {
if (this.getInstance()) {
this.focus();
hide: function() {
DOM_EVENTS: {
//DEFAULT_CSS: 'html { height: 95%; } body { padding: 7px; background-color: #fff; font: 13px/1.22 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small; } a, a:visited, a:hover { color: blue !important; text-decoration: underline !important; cursor: text !important; } img { cursor: pointer !important; border: none; }',
DEFAULT_CSS: 'body { background-color: #fff; font: 13px/1.22 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small; } a, a:visited, a:hover { color: blue !important; text-decoration: underline !important; cursor: text !important; } img { cursor: pointer !important; border: none; }',
//HTML: '<iframe border="0" frameBorder="0" marginWidth="0" marginHeight="0" leftMargin="0" topMargin="0" allowTransparency="true" width="100%" height="99%"></iframe>',
HTML: '<iframe border="0" frameBorder="0" marginWidth="0" marginHeight="0" leftMargin="0" topMargin="0" allowTransparency="true" width="100%" height="99%"></iframe>',
PAGE_HTML: '<html dir="{DIR}" lang="{LANG}"><head><title>{TITLE}</title>{META}<base href="{BASE_HREF}"/>{LINKED_CSS}<style id="editor_css">{DEFAULT_CSS}</style>{EXTRA_CSS}</head><body>{CONTENT}</body></html>',
* @description Parses document.doctype and generates a DocType to match the parent page, if supported.
* For IE8, it grabs document.all[0].nodeValue and uses that. For IE < 8, it falls back to Frame.DOC_TYPE.
getDocType: function() {
if (dt) {
str = '<!DOCTYPE ' + dt.name + ((dt.publicId) ? ' ' + dt.publicId : '') + ((dt.systemId) ? ' ' + dt.systemId : '') + '>';
return str;
* @description The DOCTYPE to prepend to the new document when created. Should match the one on the page being served.
DOC_TYPE: '<!DOCTYPE HTML PUBLIC "-/'+'/W3C/'+'/DTD HTML 4.01/'+'/EN" "http:/'+'/www.w3.org/TR/html4/strict.dtd">',
META: '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/><meta http-equiv="X-UA-Compatible" content="IE=7">',
ATTRS: {
title: {
dir: {
lang: {
src: {
designMode: {
writeOnce: true,
value: false
content: {
basehref: {
value: false,
* @description Array of modules to include in the scoped YUI instance at render time. Default: ['none', 'selector-css2']
use: {
writeOnce: true,
* @type String/HTMLElement/Node
container: {
setter: function(n) {
return Y.one(n);
node: {
readOnly: true,
value: null,
getter: function() {
return this._iframe;
id: {
writeOnce: true,
if (!id) {
return id;
linkedcss: {
extracss: {
host: {
value: false
defaultblock: {