Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1
YUI.add('frame', function (Y, NAME) {
2
 
3
    /*jshint maxlen: 500 */
4
    /**
5
     * Creates a wrapper around an iframe. It loads the content either from a local
6
     * file or from script and creates a local YUI instance bound to that new window and document.
7
     * @class Frame
8
     * @for Frame
9
     * @extends Base
10
     * @constructor
11
     * @module editor
12
     * @submodule frame
13
     */
14
 
15
    var Lang = Y.Lang,
16
 
17
        EVENT_CONTENT_READY = 'contentready',
18
 
19
        HOST = 'host',
20
 
21
    Frame = function() {
22
        Frame.superclass.constructor.apply(this, arguments);
23
    };
24
 
25
 
26
    Y.extend(Frame, Y.Plugin.Base, {
27
        /**
28
        * @private
29
        * @property _ready
30
        * @description Internal reference set when the content is ready.
31
        * @type Boolean
32
        */
33
        _ready: null,
34
        /**
35
        * @private
36
        * @property _rendered
37
        * @description Internal reference set when render is called.
38
        * @type Boolean
39
        */
40
        _rendered: null,
41
        /**
42
        * @private
43
        * @property _iframe
44
        * @description Internal Node reference to the iFrame or the window
45
        * @type Node
46
        */
47
        _iframe: null,
48
        /**
49
        * @private
50
        * @property _instance
51
        * @description Internal reference to the YUI instance bound to the iFrame or window
52
        * @type YUI
53
        */
54
        _instance: null,
55
        /**
56
        * @private
57
        * @method _create
58
        * @description Create the iframe or Window and get references to the Document & Window
59
        * @return {Object} Hash table containing references to the new Document & Window
60
        */
61
        _create: function(cb) {
62
            var res, html = '', timer,
63
                //if the src attr is different than the default, don't create the document
64
                create = (this.get('src') === Frame.ATTRS.src.value),
65
                extra_css = ((this.get('extracss')) ? '<style id="extra_css">' + this.get('extracss') + '</style>' : '');
66
 
67
            this._iframe = Y.one(Y.config.doc.createElement('iframe'));
68
            this._iframe.setAttrs(Frame.IFRAME_ATTRS);
69
 
70
            this._iframe.setStyle('visibility', 'hidden');
71
            this._iframe.set('src', this.get('src'));
72
            this.get('container').append(this._iframe);
73
            this._iframe.set('height', '99%');
74
 
75
            if (create) {
76
                Y.log('Creating the document from javascript', 'info', 'frame');
77
                html = Y.Lang.sub(Frame.PAGE_HTML, {
78
                    DIR: this.get('dir'),
79
                    LANG: this.get('lang'),
80
                    TITLE: this.get('title'),
81
                    META: Frame.META,
82
                    LINKED_CSS: this.get('linkedcss'),
83
                    CONTENT: this.get('content'),
84
                    BASE_HREF: this.get('basehref'),
85
                    DEFAULT_CSS: Frame.DEFAULT_CSS,
86
                    EXTRA_CSS: extra_css
87
                });
88
                if (Y.config.doc.compatMode !== 'BackCompat') {
89
                    Y.log('Adding Doctype to frame: ' + Frame.getDocType(), 'info', 'frame');
90
 
91
                    //html = Frame.DOC_TYPE + "\n" + html;
92
                    html = Frame.getDocType() + "\n" + html;
93
                } else {
94
                    Y.log('DocType skipped because we are in BackCompat Mode.', 'warn', 'frame');
95
                }
96
 
97
                Y.log('Injecting content into iframe', 'info', 'frame');
98
            }
99
 
100
            res = this._resolveWinDoc();
101
 
102
            if (html) {
103
                Y.log('Writing HTML to new document', 'info', 'frame');
104
                res.doc.open();
105
                res.doc.write(html);
106
                res.doc.close();
107
            }
108
 
109
            if (!res.doc.documentElement) {
110
                Y.log('document.documentElement was not found, running timer', 'warn', 'frame');
111
                timer = Y.later(1, this, function() {
112
                    if (res.doc && res.doc.documentElement) {
113
                        Y.log('document.documentElement found inside timer', 'info', 'frame');
114
                        cb(res);
115
                        timer.cancel();
116
                    }
117
                }, null, true);
118
            } else {
119
                Y.log('document.documentElement found', 'info', 'frame');
120
                cb(res);
121
            }
122
 
123
        },
124
        /**
125
        * @private
126
        * @method _resolveWinDoc
127
        * @description Resolves the document and window from an iframe or window instance
128
        * @param {Object} c The YUI Config to add the window and document to
129
        * @return {Object} Object hash of window and document references, if a YUI config was passed, it is returned.
130
        */
131
        _resolveWinDoc: function(c) {
132
            var config = (c) ? c : {};
133
            config.win = Y.Node.getDOMNode(this._iframe.get('contentWindow'));
134
            config.doc = Y.Node.getDOMNode(this._iframe.get('contentWindow.document'));
135
            if (!config.doc) {
136
                config.doc = Y.config.doc;
137
            }
138
            if (!config.win) {
139
                config.win = Y.config.win;
140
            }
141
            return config;
142
        },
143
        /**
144
        * @private
145
        * @method _onDomEvent
146
        * @description Generic handler for all DOM events fired by the iframe or window. This handler
147
        * takes the current EventFacade and augments it to fire on the Frame host. It adds two new properties
148
        * to the EventFacade called frameX and frameY which adds the scroll and xy position of the iframe
149
        * to the original pageX and pageY of the event so external nodes can be positioned over the frame.
150
        * @param {EventFacade} e
151
        */
152
        _onDomEvent: function(e) {
153
            var xy, node;
154
 
155
            if (!Y.Node.getDOMNode(this._iframe)) {
156
                //The iframe is null for some reason, bail on sending events.
157
                return;
158
            }
159
 
160
            //Y.log('onDOMEvent: ' + e.type, 'info', 'frame');
161
            e.frameX = e.frameY = 0;
162
 
163
            if (e.pageX > 0 || e.pageY > 0) {
164
                if (e.type.substring(0, 3) !== 'key') {
165
                    node = this._instance.one('win');
166
                    xy = this._iframe.getXY();
167
                    e.frameX = xy[0] + e.pageX - node.get('scrollLeft');
168
                    e.frameY = xy[1] + e.pageY - node.get('scrollTop');
169
                }
170
            }
171
 
172
            e.frameTarget = e.target;
173
            e.frameCurrentTarget = e.currentTarget;
174
            e.frameEvent = e;
175
 
176
            this.fire('dom:' + e.type, e);
177
        },
178
        initializer: function() {
179
            var host = this.get(HOST);
180
 
181
            if (host) {
182
                host.frame = this;
183
            }
184
 
185
            this.publish('ready', {
186
                emitFacade: true,
187
                defaultFn: this._defReadyFn
188
            });
189
        },
190
        destructor: function() {
191
            var inst = this.getInstance();
192
 
193
            inst.one('doc').detachAll();
194
            inst = null;
195
            this._iframe.remove();
196
        },
197
        /**
198
        * @private
199
        * @method _DOMPaste
200
        * @description Simple pass thru handler for the paste event so we can do content cleanup
201
        * @param {EventFacade} e
202
        */
203
        _DOMPaste: function(e) {
204
            var inst = this.getInstance(),
205
                data = '', win = inst.config.win;
206
 
207
            if (e._event.originalTarget) {
208
                data = e._event.originalTarget;
209
            }
210
            if (e._event.clipboardData) {
211
                data = e._event.clipboardData.getData('Text');
212
            }
213
 
214
            if (win.clipboardData) {
215
                data = win.clipboardData.getData('Text');
216
                if (data === '') { // Could be empty, or failed
217
                    // Verify failure
218
                    if (!win.clipboardData.setData('Text', data)) {
219
                        data = null;
220
                    }
221
                }
222
            }
223
 
224
 
225
            e.frameTarget = e.target;
226
            e.frameCurrentTarget = e.currentTarget;
227
            e.frameEvent = e;
228
 
229
            if (data) {
230
                e.clipboardData = {
231
                    data: data,
232
                    getData: function() {
233
                        return data;
234
                    }
235
                };
236
            } else {
237
                Y.log('Failed to collect clipboard data', 'warn', 'frame');
238
                e.clipboardData = null;
239
            }
240
 
241
            this.fire('dom:paste', e);
242
        },
243
        /**
244
        * @private
245
        * @method _defReadyFn
246
        * @description Binds DOM events, sets the iframe to visible and fires the ready event
247
        */
248
        _defReadyFn: function() {
249
            var inst = this.getInstance();
250
 
251
            Y.each(Frame.DOM_EVENTS, function(v, k) {
252
                var fn = Y.bind(this._onDomEvent, this),
253
                    kfn = ((Y.UA.ie && Frame.THROTTLE_TIME > 0) ? Y.throttle(fn, Frame.THROTTLE_TIME) : fn);
254
 
255
                if (!inst.Node.DOM_EVENTS[k]) {
256
                    inst.Node.DOM_EVENTS[k] = 1;
257
                }
258
                if (v === 1) {
259
                    if (k !== 'focus' && k !== 'blur' && k !== 'paste') {
260
                        //Y.log('Adding DOM event to frame: ' + k, 'info', 'frame');
261
                        if (k.substring(0, 3) === 'key') {
262
                            //Throttle key events in IE
263
                            inst.on(k, kfn, inst.config.doc);
264
                        } else {
265
                            inst.on(k, fn, inst.config.doc);
266
                        }
267
                    }
268
                }
269
            }, this);
270
 
271
            inst.Node.DOM_EVENTS.paste = 1;
272
 
273
            inst.on('paste', Y.bind(this._DOMPaste, this), inst.one('body'));
274
 
275
            //Adding focus/blur to the window object
276
            inst.on('focus', Y.bind(this._onDomEvent, this), inst.config.win);
277
            inst.on('blur', Y.bind(this._onDomEvent, this), inst.config.win);
278
 
279
            inst.__use = inst.use;
280
            inst.use = Y.bind(this.use, this);
281
            this._iframe.setStyles({
282
                visibility: 'inherit'
283
            });
284
            inst.one('body').setStyle('display', 'block');
285
        },
286
        /**
287
        * It appears that having a BR tag anywhere in the source "below" a table with a percentage width (in IE 7 & 8)
288
        * if there is any TEXTINPUT's outside the iframe, the cursor will rapidly flickr and the CPU would occasionally
289
        * spike. This method finds all <BR>'s below the sourceIndex of the first table. Does some checks to see if they
290
        * can be modified and replaces then with a <WBR> so the layout will remain in tact, but the flickering will
291
        * no longer happen.
292
        * @method _fixIECursors
293
        * @private
294
        */
295
        _fixIECursors: function() {
296
            var inst = this.getInstance(),
297
                tables = inst.all('table'),
298
                brs = inst.all('br'), si;
299
 
300
            if (tables.size() && brs.size()) {
301
                //First Table
302
                si = tables.item(0).get('sourceIndex');
303
                brs.each(function(n) {
304
                    var p = n.get('parentNode'),
305
                        c = p.get('children'), b = p.all('>br');
306
 
307
                    if (p.test('div')) {
308
                        if (c.size() > 2) {
309
                            n.replace(inst.Node.create('<wbr>'));
310
                        } else {
311
                            if (n.get('sourceIndex') > si) {
312
                                if (b.size()) {
313
                                    n.replace(inst.Node.create('<wbr>'));
314
                                }
315
                            } else {
316
                                if (b.size() > 1) {
317
                                    n.replace(inst.Node.create('<wbr>'));
318
                                }
319
                            }
320
                        }
321
                    }
322
 
323
                });
324
            }
325
        },
326
        /**
327
        * @private
328
        * @method _onContentReady
329
        * @description Called once the content is available in the frame/window and calls the final use call
330
        * on the internal instance so that the modules are loaded properly.
331
        */
332
        _onContentReady: function(e) {
333
            if (!this._ready) {
334
                this._ready = true;
335
                var inst = this.getInstance(),
336
                    args = Y.clone(this.get('use'));
337
 
338
                this.fire('contentready');
339
 
340
                Y.log('On available for body of iframe', 'info', 'frame');
341
                if (e) {
342
                    inst.config.doc = Y.Node.getDOMNode(e.target);
343
                }
344
                //TODO Circle around and deal with CSS loading...
345
                args.push(Y.bind(function() {
346
                    Y.log('Callback from final internal use call', 'info', 'frame');
347
                    if (inst.EditorSelection) {
348
                        inst.EditorSelection.DEFAULT_BLOCK_TAG = this.get('defaultblock');
349
                    }
350
                    //Moved to here so that the iframe is ready before allowing editing..
351
                    if (this.get('designMode')) {
352
                        if(Y.UA.ie) {
353
                            inst.config.doc.body.contentEditable = 'true';
354
                            this._ieSetBodyHeight();
355
                            inst.on('keyup', Y.bind(this._ieSetBodyHeight, this), inst.config.doc);
356
                        } else {
357
                            inst.config.doc.designMode = 'on';
358
                        }
359
                    }
360
                    this.fire('ready');
361
                }, this));
362
                Y.log('Calling use on internal instance: ' + args, 'info', 'frame');
363
                inst.use.apply(inst, args);
364
 
365
                inst.one('doc').get('documentElement').addClass('yui-js-enabled');
366
            }
367
        },
368
        _ieHeightCounter: null,
369
        /**
370
        * Internal method to set the height of the body to the height of the document in IE.
371
        * With contenteditable being set, the document becomes unresponsive to clicks, this
372
        * method expands the body to be the height of the document so that doesn't happen.
373
        * @private
374
        * @method _ieSetBodyHeight
375
        */
376
        _ieSetBodyHeight: function(e) {
377
            if (!this._ieHeightCounter) {
378
                this._ieHeightCounter = 0;
379
            }
380
            this._ieHeightCounter++;
381
            var run = false, inst, h, bh;
382
            if (!e) {
383
                run = true;
384
            }
385
            if (e) {
386
                switch (e.keyCode) {
387
                    case 8:
388
                    case 13:
389
                        run = true;
390
                        break;
391
                }
392
                if (e.ctrlKey || e.shiftKey) {
393
                    run = true;
394
                }
395
            }
396
            if (run) {
397
                try {
398
                    inst = this.getInstance();
399
                    h = this._iframe.get('offsetHeight');
400
                    bh = inst.config.doc.body.scrollHeight;
401
                    if (h > bh) {
402
                        h = (h - 15) + 'px';
403
                        inst.config.doc.body.style.height = h;
404
                    } else {
405
                        inst.config.doc.body.style.height = 'auto';
406
                    }
407
                } catch (e) {
408
                    if (this._ieHeightCounter < 100) {
409
                        Y.later(200, this, this._ieSetBodyHeight);
410
                    } else {
411
                        Y.log('Failed to set body height in IE', 'error', 'frame');
412
                    }
413
                }
414
            }
415
        },
416
        /**
417
        * @private
418
        * @method _resolveBaseHref
419
        * @description Resolves the basehref of the page the frame is created on. Only applies to dynamic content.
420
        * @param {String} href The new value to use, if empty it will be resolved from the current url.
421
        * @return {String}
422
        */
423
        _resolveBaseHref: function(href) {
424
            if (!href || href === '') {
425
                href = Y.config.doc.location.href;
426
                if (href.indexOf('?') !== -1) { //Remove the query string
427
                    href = href.substring(0, href.indexOf('?'));
428
                }
429
                href = href.substring(0, href.lastIndexOf('/')) + '/';
430
            }
431
            return href;
432
        },
433
        /**
434
        * @private
435
        * @method _getHTML
436
        * @description Get the content from the iframe
437
        * @param {String} html The raw HTML from the body of the iframe.
438
        * @return {String}
439
        */
440
        _getHTML: function(html) {
441
            if (this._ready) {
442
                var inst = this.getInstance();
443
                html = inst.one('body').get('innerHTML');
444
            }
445
            return html;
446
        },
447
        /**
448
        * @private
449
        * @method _setHTML
450
        * @description Set the content of the iframe
451
        * @param {String} html The raw HTML to set the body of the iframe to.
452
        * @return {String}
453
        */
454
        _setHTML: function(html) {
455
            if (this._ready) {
456
                var inst = this.getInstance();
457
                inst.one('body').set('innerHTML', html);
458
            } else {
459
                this.once(EVENT_CONTENT_READY, Y.bind(this._setHTML, this, html));
460
            }
461
 
462
            return html;
463
        },
464
        /**
465
        * @private
466
        * @method _getLinkedCSS
467
        * @description Get the linked CSS on the instance.
468
        */
469
        _getLinkedCSS: function(urls) {
470
            if (!Y.Lang.isArray(urls)) {
471
                urls = [urls];
472
            }
473
            var str = '';
474
            if (!this._ready) {
475
                Y.each(urls, function(v) {
476
                    if (v) {
477
                        str += '<link rel="stylesheet" href="' + v + '" type="text/css">';
478
                    }
479
                });
480
            } else {
481
                str = urls;
482
            }
483
            return str;
484
        },
485
        /**
486
        * @private
487
        * @method _setLinkedCSS
488
        * @description Sets the linked CSS on the instance..
489
        */
490
        _setLinkedCSS: function(css) {
491
            if (this._ready) {
492
                var inst = this.getInstance();
493
                inst.Get.css(css);
494
            }
495
            return css;
496
        },
497
        /**
498
        * @private
499
        * @method _setExtraCSS
500
        * @description Set's the extra CSS on the instance..
501
        */
502
        _setExtraCSS: function(css) {
503
            if (this._ready) {
504
                var inst = this.getInstance(),
505
                    node = inst.one('#extra_css');
506
 
507
                if (node) {
508
                    node.remove();
509
                }
510
 
511
                inst.one('head').append('<style id="extra_css">' + css + '</style>');
512
            } else {
513
                //This needs to be wrapped in a contentready callback for the !_ready state
514
                this.once(EVENT_CONTENT_READY, Y.bind(this._setExtraCSS, this, css));
515
            }
516
 
517
            return css;
518
        },
519
        /**
520
        * @private
521
        * @method _instanceLoaded
522
        * @description Called from the first YUI instance that sets up the internal instance.
523
        * This loads the content into the window/frame and attaches the contentready event.
524
        * @param {YUI} inst The internal YUI instance bound to the frame/window
525
        */
526
        _instanceLoaded: function(inst) {
527
            this._instance = inst;
528
            this._onContentReady();
529
 
530
            var doc = this._instance.config.doc;
531
 
532
            if (this.get('designMode')) {
533
                if (!Y.UA.ie) {
534
                    try {
535
                        //Force other browsers into non CSS styling
536
                        doc.execCommand('styleWithCSS', false, false);
537
                        doc.execCommand('insertbronreturn', false, false);
538
                    } catch (err) {}
539
                }
540
            }
541
        },
542
        //BEGIN PUBLIC METHODS
543
        /**
544
        * @method use
545
        * @description This is a scoped version of the normal YUI.use method & is bound to this frame/window.
546
        * At setup, the inst.use method is mapped to this method.
547
        */
548
        use: function() {
549
            Y.log('Calling augmented use after ready', 'info', 'frame');
550
            var inst = this.getInstance(),
551
                args = Y.Array(arguments),
552
                cb = false;
553
 
554
            if (Y.Lang.isFunction(args[args.length - 1])) {
555
                cb = args.pop();
556
            }
557
            if (cb) {
558
                args.push(function() {
559
                    Y.log('Internal callback from augmented use', 'info', 'frame');
560
                    cb.apply(inst, arguments);
561
 
562
                });
563
            }
564
 
565
            return inst.__use.apply(inst, args);
566
        },
567
        /**
568
        * @method delegate
569
        * @description A delegate method passed to the instance's delegate method
570
        * @param {String} type The type of event to listen for
571
        * @param {Function} fn The method to attach
572
        * @param {String} cont The container to act as a delegate, if no "sel" passed, the body is assumed as the container.
573
        * @param {String} sel The selector to match in the event (optional)
574
        * @return {EventHandle} The Event handle returned from Y.delegate
575
        */
576
        delegate: function(type, fn, cont, sel) {
577
            var inst = this.getInstance();
578
            if (!inst) {
579
                Y.log('Delegate events can not be attached until after the ready event has fired.', 'error', 'iframe');
580
                return false;
581
            }
582
            if (!sel) {
583
                sel = cont;
584
                cont = 'body';
585
            }
586
            return inst.delegate(type, fn, cont, sel);
587
        },
588
        /**
589
        * @method getInstance
590
        * @description Get a reference to the internal YUI instance.
591
        * @return {YUI} The internal YUI instance
592
        */
593
        getInstance: function() {
594
            return this._instance;
595
        },
596
        /**
597
        * @method render
598
        * @description Render the iframe into the container config option or open the window.
599
        * @param {String/HTMLElement/Node} node The node to render to
600
        * @return {Frame}
601
        * @chainable
602
        */
603
        render: function(node) {
604
            if (this._rendered) {
605
                Y.log('Frame already rendered.', 'warn', 'frame');
606
                return this;
607
            }
608
            this._rendered = true;
609
            if (node) {
610
                this.set('container', node);
611
            }
612
 
613
            this._create(Y.bind(function(res) {
614
 
615
                var inst, timer,
616
                    cb = Y.bind(function(i) {
617
                        Y.log('Internal instance loaded with node-base', 'info', 'frame');
618
                        this._instanceLoaded(i);
619
                    }, this),
620
                    args = Y.clone(this.get('use')),
621
                    config = {
622
                        debug: false,
623
                        win: res.win,
624
                        doc: res.doc
625
                    },
626
                    fn = Y.bind(function() {
627
                        Y.log('New Modules Loaded into main instance', 'info', 'frame');
628
                        config = this._resolveWinDoc(config);
629
                        inst = YUI(config);
630
                        inst.host = this.get(HOST); //Cross reference to Editor
631
                        inst.log = Y.log; //Dump the instance logs to the parent instance.
632
 
633
                        Y.log('Creating new internal instance with node-base only', 'info', 'frame');
634
                        try {
635
                            inst.use('node-base', cb);
636
                            if (timer) {
637
                                clearInterval(timer);
638
                            }
639
                        } catch (e) {
640
                            timer = setInterval(function() {
641
                                Y.log('[TIMER] Internal use call failed, retrying', 'info', 'frame');
642
                                fn();
643
                            }, 350);
644
                            Y.log('Internal use call failed, retrying', 'info', 'frame');
645
                        }
646
                    }, this);
647
 
648
                args.push(fn);
649
 
650
                Y.log('Adding new modules to main instance: ' + args, 'info', 'frame');
651
                Y.use.apply(Y, args);
652
 
653
            }, this));
654
 
655
            return this;
656
        },
657
        /**
658
        * @private
659
        * @method _handleFocus
660
        * @description Does some tricks on focus to set the proper cursor position.
661
        */
662
        _handleFocus: function() {
663
            var inst = this.getInstance(),
664
                sel = new inst.EditorSelection(),
665
                n, c, b, par;
666
 
667
            if (sel.anchorNode) {
668
                Y.log('_handleFocus being called..', 'info', 'frame');
669
                n = sel.anchorNode;
670
 
671
                if (n.test('p') && n.get('innerHTML') === '') {
672
                    n = n.get('parentNode');
673
                }
674
                c = n.get('childNodes');
675
 
676
                if (c.size()) {
677
                    if (c.item(0).test('br')) {
678
                        sel.selectNode(n, true, false);
679
                    } else if (c.item(0).test('p')) {
680
                        n = c.item(0).one('br.yui-cursor');
681
                        if (n) {
682
                            n = n.get('parentNode');
683
                        }
684
                        if (!n) {
685
                            n = c.item(0).get('firstChild');
686
                        }
687
                        if (!n) {
688
                            n = c.item(0);
689
                        }
690
                        if (n) {
691
                            sel.selectNode(n, true, false);
692
                        }
693
                    } else {
694
                        b = inst.one('br.yui-cursor');
695
                        if (b) {
696
                            par = b.get('parentNode');
697
                            if (par) {
698
                                sel.selectNode(par, true, false);
699
                            }
700
                        }
701
                    }
702
                }
703
            }
704
        },
705
        /**
706
        * Validates linkedcss property
707
        *
708
        * @method _validateLinkedCSS
709
        * @private
710
        */
711
        _validateLinkedCSS: function(value) {
712
            return Lang.isString(value) || Lang.isArray(value);
713
        },
714
        /**
715
        * @method focus
716
        * @description Set the focus to the iframe
717
        * @param {Function} fn Callback function to execute after focus happens
718
        * @return {Frame}
719
        * @chainable
720
        */
721
        focus: function(fn) {
722
            if (Y.UA.ie && Y.UA.ie < 9) {
723
                try {
724
                    Y.one('win').focus();
725
                    if (this.getInstance()) {
726
                        if (this.getInstance().one('win')) {
727
                            this.getInstance().one('win').focus();
728
                        }
729
                    }
730
                } catch (ierr) {
731
                    Y.log('Frame focus failed', 'warn', 'frame');
732
                }
733
                if (fn === true) {
734
                    this._handleFocus();
735
                }
736
                if (Y.Lang.isFunction(fn)) {
737
                    fn();
738
                }
739
            } else {
740
                try {
741
                    Y.one('win').focus();
742
                    Y.later(100, this, function() {
743
                        if (this.getInstance()) {
744
                            if (this.getInstance().one('win')) {
745
                                this.getInstance().one('win').focus();
746
                            }
747
                        }
748
                        if (fn === true) {
749
                            this._handleFocus();
750
                        }
751
                        if (Y.Lang.isFunction(fn)) {
752
                            fn();
753
                        }
754
                    });
755
                } catch (ferr) {
756
                    Y.log('Frame focus failed', 'warn', 'frame');
757
                }
758
            }
759
            return this;
760
        },
761
        /**
762
        * @method show
763
        * @description Show the iframe instance
764
        * @return {Frame}
765
        * @chainable
766
        */
767
        show: function() {
768
            this._iframe.setStyles({
769
                position: 'static',
770
                left: ''
771
            });
772
            if (Y.UA.gecko) {
773
                try {
774
                    if (this.getInstance()) {
775
                        this.getInstance().config.doc.designMode = 'on';
776
                    }
777
                } catch (e) { }
778
                this.focus();
779
            }
780
            return this;
781
        },
782
        /**
783
        * @method hide
784
        * @description Hide the iframe instance
785
        * @return {Frame}
786
        * @chainable
787
        */
788
        hide: function() {
789
            this._iframe.setStyles({
790
                position: 'absolute',
791
                left: '-999999px'
792
            });
793
            return this;
794
        }
795
    }, {
796
        /**
797
        * @static
798
        * @property THROTTLE_TIME
799
        * @description The throttle time for key events in IE
800
        * @type Number
801
        * @default 100
802
        */
803
        THROTTLE_TIME: 100,
804
        /**
805
        * @static
806
        * @property DOM_EVENTS
807
        * @description The DomEvents that the frame automatically attaches and bubbles
808
        * @type Object
809
        */
810
        DOM_EVENTS: {
811
            dblclick: 1,
812
            click: 1,
813
            paste: 1,
814
            mouseup: 1,
815
            mousedown: 1,
816
            keyup: 1,
817
            keydown: 1,
818
            keypress: 1,
819
            activate: 1,
820
            deactivate: 1,
821
            beforedeactivate: 1,
822
            focusin: 1,
823
            focusout: 1
824
        },
825
 
826
        /**
827
        * @static
828
        * @property DEFAULT_CSS
829
        * @description The default css used when creating the document.
830
        * @type String
831
        */
832
        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; }',
833
        /**
834
        * The template string used to create the iframe, deprecated to use DOM instead of innerHTML
835
        * @static
836
        * @property HTML
837
        * @type String
838
        * @deprecated
839
        */
840
        //HTML: '<iframe border="0" frameBorder="0" marginWidth="0" marginHeight="0" leftMargin="0" topMargin="0" allowTransparency="true" width="100%" height="99%"></iframe>',
841
        /**
842
        * Attributes to auto add to the dynamic iframe under the hood
843
        * @static
844
        * @property IFRAME_ATTRS
845
        * @type Object
846
        */
847
        IFRAME_ATTRS: {
848
            border: '0',
849
            frameBorder: '0',
850
            marginWidth: '0',
851
            marginHeight: '0',
852
            leftMargin: '0',
853
            topMargin: '0',
854
            allowTransparency: 'true',
855
            width: "100%",
856
            height: "99%"
857
        },
858
        /**
859
        * @static
860
        * @property PAGE_HTML
861
        * @description The template used to create the page when created dynamically.
862
        * @type String
863
        */
864
        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>',
865
 
866
        /**
867
        * @static
868
        * @method getDocType
869
        * @description Parses document.doctype and generates a DocType to match the parent page, if supported.
870
        * For IE8, it grabs document.all[0].nodeValue and uses that. For IE < 8, it falls back to Frame.DOC_TYPE.
871
        * @return {String} The normalized DocType to apply to the iframe
872
        */
873
        getDocType: function() {
874
            var dt = Y.config.doc.doctype,
875
                str = Frame.DOC_TYPE;
876
 
877
            if (dt) {
878
                str = '<!DOCTYPE ' + dt.name + ((dt.publicId) ? ' ' + dt.publicId : '') + ((dt.systemId) ? ' ' + dt.systemId : '') + '>';
879
            } else {
880
                if (Y.config.doc.all) {
881
                    dt = Y.config.doc.all[0];
882
                    if (dt.nodeType) {
883
                        if (dt.nodeType === 8) {
884
                            if (dt.nodeValue) {
885
                                if (dt.nodeValue.toLowerCase().indexOf('doctype') !== -1) {
886
                                    str = '<!' + dt.nodeValue + '>';
887
                                }
888
                            }
889
                        }
890
                    }
891
                }
892
            }
893
            return str;
894
        },
895
        /**
896
        * @static
897
        * @property DOC_TYPE
898
        * @description The DOCTYPE to prepend to the new document when created. Should match the one on the page being served.
899
        * @type String
900
        */
901
        DOC_TYPE: '<!DOCTYPE HTML PUBLIC "-/'+'/W3C/'+'/DTD HTML 4.01/'+'/EN" "http:/'+'/www.w3.org/TR/html4/strict.dtd">',
902
        /**
903
        * @static
904
        * @property META
905
        * @description The meta-tag for Content-Type to add to the dynamic document
906
        * @type String
907
        */
908
        META: '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/><meta http-equiv="X-UA-Compatible" content="IE=7">',
909
        //META: '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>',
910
        /**
911
        * @static
912
        * @property NAME
913
        * @description The name of the class (frame)
914
        * @type String
915
        */
916
        NAME: 'frame',
917
        /**
918
        * The namespace on which Frame plugin will reside.
919
        *
920
        * @property NS
921
        * @type String
922
        * @default 'frame'
923
        * @static
924
        */
925
        NS: 'frame',
926
        ATTRS: {
927
            /**
928
            * @attribute title
929
            * @description The title to give the blank page.
930
            * @type String
931
            */
932
            title: {
933
                value: 'Blank Page'
934
            },
935
            /**
936
            * @attribute dir
937
            * @description The default text direction for this new frame. Default: ltr
938
            * @type String
939
            */
940
            dir: {
941
                value: 'ltr'
942
            },
943
            /**
944
            * @attribute lang
945
            * @description The default language. Default: en-US
946
            * @type String
947
            */
948
            lang: {
949
                value: 'en-US'
950
            },
951
            /**
952
            * @attribute src
953
            * @description The src of the iframe/window. Defaults to javascript:;
954
            * @type String
955
            */
956
            src: {
957
                //Hackish, IE needs the false in the Javascript URL
958
                value: 'javascript' + ((Y.UA.ie) ? ':false' : ':') + ';'
959
            },
960
            /**
961
            * @attribute designMode
962
            * @description Should designMode be turned on after creation.
963
            * @writeonce
964
            * @type Boolean
965
            */
966
            designMode: {
967
                writeOnce: true,
968
                value: false
969
            },
970
            /**
971
            * @attribute content
972
            * @description The string to inject into the body of the new frame/window.
973
            * @type String
974
            */
975
            content: {
976
                validator: Lang.isString,
977
                value: '<br>',
978
                setter: '_setHTML',
979
                getter: '_getHTML'
980
            },
981
            /**
982
            * @attribute basehref
983
            * @description The base href to use in the iframe.
984
            * @type String
985
            */
986
            basehref: {
987
                value: false,
988
                getter: '_resolveBaseHref'
989
            },
990
            /**
991
            * @attribute use
992
            * @description Array of modules to include in the scoped YUI instance at render time. Default: ['none', 'selector-css2']
993
            * @writeonce
994
            * @type Array
995
            */
996
            use: {
997
                writeOnce: true,
998
                value: ['node', 'node-style', 'selector-css3']
999
            },
1000
            /**
1001
            * @attribute container
1002
            * @description The container to append the iFrame to on render.
1003
            * @type String/HTMLElement/Node
1004
            */
1005
            container: {
1006
                value: 'body',
1007
                setter: function(n) {
1008
                    return Y.one(n);
1009
                }
1010
            },
1011
            /**
1012
            * @attribute node
1013
            * @description The Node instance of the iframe.
1014
            * @type Node
1015
            */
1016
            node: {
1017
                readOnly: true,
1018
                value: null,
1019
                getter: function() {
1020
                    return this._iframe;
1021
                }
1022
            },
1023
            /**
1024
            * @attribute id
1025
            * @description Set the id of the new Node. (optional)
1026
            * @type String
1027
            * @writeonce
1028
            */
1029
            id: {
1030
                writeOnce: true,
1031
                getter: function(id) {
1032
                    if (!id) {
1033
                        id = 'iframe-' + Y.guid();
1034
                    }
1035
                    return id;
1036
                }
1037
            },
1038
            /**
1039
            * @attribute linkedcss
1040
            * @description An array of url's to external linked style sheets
1041
            * @type String|Array
1042
            */
1043
            linkedcss: {
1044
                validator: '_validateLinkedCSS',
1045
                getter: '_getLinkedCSS',
1046
                setter: '_setLinkedCSS'
1047
            },
1048
            /**
1049
            * @attribute extracss
1050
            * @description A string of CSS to add to the Head of the Editor
1051
            * @type String
1052
            */
1053
            extracss: {
1054
                validator: Lang.isString,
1055
                setter: '_setExtraCSS'
1056
            },
1057
            /**
1058
            * @attribute defaultblock
1059
            * @description The default tag to use for block level items, defaults to: p
1060
            * @type String
1061
            */
1062
            defaultblock: {
1063
                value: 'p'
1064
            }
1065
        }
1066
    });
1067
 
1068
    Y.namespace('Plugin');
1069
 
1070
    Y.Plugin.Frame = Frame;
1071
 
1072
    Y.Frame = Frame;
1073
 
1074
 
1075
 
1076
}, '3.18.1', {"requires": ["base", "node", "plugin", "selector-css3", "yui-throttle"]});