]> scripts.mit.edu Git - autoinstalls/wordpress.git/blob - wp-includes/js/tinymce/plugins/wordpress/plugin.js
968ebd9a6b2e9943ab4c2c6affd32e303757f3a4
[autoinstalls/wordpress.git] / wp-includes / js / tinymce / plugins / wordpress / plugin.js
1 /* global getUserSetting, setUserSetting */
2 ( function( tinymce ) {
3 // Set the minimum value for the modals z-index higher than #wpadminbar (100000)
4 tinymce.ui.FloatPanel.zIndex = 100100;
5
6 tinymce.PluginManager.add( 'wordpress', function( editor ) {
7         var wpAdvButton, style,
8                 DOM = tinymce.DOM,
9                 each = tinymce.each,
10                 __ = editor.editorManager.i18n.translate,
11                 $ = window.jQuery,
12                 wp = window.wp,
13                 hasWpautop = ( wp && wp.editor && wp.editor.autop && editor.getParam( 'wpautop', true ) );
14
15         if ( $ ) {
16                 $( document ).triggerHandler( 'tinymce-editor-setup', [ editor ] );
17         }
18
19         function toggleToolbars( state ) {
20                 var iframe, initial, toolbars,
21                         pixels = 0;
22
23                 initial = ( state === 'hide' );
24
25                 if ( editor.theme.panel ) {
26                         toolbars = editor.theme.panel.find('.toolbar:not(.menubar)');
27                 }
28
29                 if ( ! toolbars || toolbars.length < 2 || ( state === 'hide' && ! toolbars[1].visible() ) ) {
30                         return;
31                 }
32
33                 if ( ! state && toolbars[1].visible() ) {
34                         state = 'hide';
35                 }
36
37                 each( toolbars, function( toolbar, i ) {
38                         if ( i > 0 ) {
39                                 if ( state === 'hide' ) {
40                                         toolbar.hide();
41                                         pixels += 30;
42                                 } else {
43                                         toolbar.show();
44                                         pixels -= 30;
45                                 }
46                         }
47                 });
48
49                 if ( pixels && ! initial ) {
50                         // Resize iframe, not needed in iOS
51                         if ( ! tinymce.Env.iOS ) {
52                                 iframe = editor.getContentAreaContainer().firstChild;
53                                 DOM.setStyle( iframe, 'height', iframe.clientHeight + pixels );
54                         }
55
56                         if ( state === 'hide' ) {
57                                 setUserSetting('hidetb', '0');
58                                 wpAdvButton && wpAdvButton.active( false );
59                         } else {
60                                 setUserSetting('hidetb', '1');
61                                 wpAdvButton && wpAdvButton.active( true );
62                         }
63                 }
64
65                 editor.fire( 'wp-toolbar-toggle' );
66         }
67
68         // Add the kitchen sink button :)
69         editor.addButton( 'wp_adv', {
70                 tooltip: 'Toolbar Toggle',
71                 cmd: 'WP_Adv',
72                 onPostRender: function() {
73                         wpAdvButton = this;
74                         wpAdvButton.active( getUserSetting( 'hidetb' ) === '1' ? true : false );
75                 }
76         });
77
78         // Hide the toolbars after loading
79         editor.on( 'PostRender', function() {
80                 if ( editor.getParam( 'wordpress_adv_hidden', true ) && getUserSetting( 'hidetb', '0' ) === '0' ) {
81                         toggleToolbars( 'hide' );
82                 }
83         });
84
85         editor.addCommand( 'WP_Adv', function() {
86                 toggleToolbars();
87         });
88
89         editor.on( 'focus', function() {
90         window.wpActiveEditor = editor.id;
91     });
92
93         // Replace Read More/Next Page tags with images
94         editor.on( 'BeforeSetContent', function( event ) {
95                 var title;
96
97                 if ( event.content ) {
98                         if ( event.content.indexOf( '<!--more' ) !== -1 ) {
99                                 title = __( 'Read more...' );
100
101                                 event.content = event.content.replace( /<!--more(.*?)-->/g, function( match, moretext ) {
102                                         return '<img src="' + tinymce.Env.transparentSrc + '" data-wp-more="more" data-wp-more-text="' + moretext + '" ' +
103                                                 'class="wp-more-tag mce-wp-more" alt="" title="' + title + '" data-mce-resize="false" data-mce-placeholder="1" />';
104                                 });
105                         }
106
107                         if ( event.content.indexOf( '<!--nextpage-->' ) !== -1 ) {
108                                 title = __( 'Page break' );
109
110                                 event.content = event.content.replace( /<!--nextpage-->/g,
111                                         '<img src="' + tinymce.Env.transparentSrc + '" data-wp-more="nextpage" class="wp-more-tag mce-wp-nextpage" ' +
112                                                 'alt="" title="' + title + '" data-mce-resize="false" data-mce-placeholder="1" />' );
113                         }
114
115                         if ( event.load && event.format !== 'raw' && hasWpautop ) {
116                                 event.content = wp.editor.autop( event.content );
117                         }
118
119                         // Remove spaces from empty paragraphs.
120                         // Avoid backtracking, can freeze the editor. See #35890.
121                         // (This is also quite faster than using only one regex.)
122                         event.content = event.content.replace( /<p>([^<>]+)<\/p>/gi, function( tag, text ) {
123                                 if ( /^(&nbsp;|\s|\u00a0|\ufeff)+$/i.test( text ) ) {
124                                         return '<p><br /></p>';
125                                 }
126
127                                 return tag;
128                         });
129                 }
130         });
131
132         // Replace images with tags
133         editor.on( 'PostProcess', function( e ) {
134                 if ( e.get ) {
135                         e.content = e.content.replace(/<img[^>]+>/g, function( image ) {
136                                 var match, moretext = '';
137
138                                 if ( image.indexOf( 'data-wp-more="more"' ) !== -1 ) {
139                                         if ( match = image.match( /data-wp-more-text="([^"]+)"/ ) ) {
140                                                 moretext = match[1];
141                                         }
142
143                                         image = '<!--more' + moretext + '-->';
144                                 } else if ( image.indexOf( 'data-wp-more="nextpage"' ) !== -1 ) {
145                                         image = '<!--nextpage-->';
146                                 }
147
148                                 return image;
149                         });
150                 }
151         });
152
153         // Display the tag name instead of img in element path
154         editor.on( 'ResolveName', function( event ) {
155                 var attr;
156
157                 if ( event.target.nodeName === 'IMG' && ( attr = editor.dom.getAttrib( event.target, 'data-wp-more' ) ) ) {
158                         event.name = attr;
159                 }
160         });
161
162         // Register commands
163         editor.addCommand( 'WP_More', function( tag ) {
164                 var parent, html, title,
165                         classname = 'wp-more-tag',
166                         dom = editor.dom,
167                         node = editor.selection.getNode();
168
169                 tag = tag || 'more';
170                 classname += ' mce-wp-' + tag;
171                 title = tag === 'more' ? 'Read more...' : 'Next page';
172                 title = __( title );
173                 html = '<img src="' + tinymce.Env.transparentSrc + '" alt="" title="' + title + '" class="' + classname + '" ' +
174                         'data-wp-more="' + tag + '" data-mce-resize="false" data-mce-placeholder="1" />';
175
176                 // Most common case
177                 if ( node.nodeName === 'BODY' || ( node.nodeName === 'P' && node.parentNode.nodeName === 'BODY' ) ) {
178                         editor.insertContent( html );
179                         return;
180                 }
181
182                 // Get the top level parent node
183                 parent = dom.getParent( node, function( found ) {
184                         if ( found.parentNode && found.parentNode.nodeName === 'BODY' ) {
185                                 return true;
186                         }
187
188                         return false;
189                 }, editor.getBody() );
190
191                 if ( parent ) {
192                         if ( parent.nodeName === 'P' ) {
193                                 parent.appendChild( dom.create( 'p', null, html ).firstChild );
194                         } else {
195                                 dom.insertAfter( dom.create( 'p', null, html ), parent );
196                         }
197
198                         editor.nodeChanged();
199                 }
200         });
201
202         editor.addCommand( 'WP_Code', function() {
203                 editor.formatter.toggle('code');
204         });
205
206         editor.addCommand( 'WP_Page', function() {
207                 editor.execCommand( 'WP_More', 'nextpage' );
208         });
209
210         editor.addCommand( 'WP_Help', function() {
211                 var access = tinymce.Env.mac ? __( 'Ctrl + Alt + letter:' ) : __( 'Shift + Alt + letter:' ),
212                         meta = tinymce.Env.mac ? __( 'Cmd + letter:' ) : __( 'Ctrl + letter:' ),
213                         table1 = [],
214                         table2 = [],
215                         header, html, dialog, $wrap;
216
217                 each( [
218                         { c: 'Copy',      x: 'Cut'              },
219                         { v: 'Paste',     a: 'Select all'       },
220                         { z: 'Undo',      y: 'Redo'             },
221                         { b: 'Bold',      i: 'Italic'           },
222                         { u: 'Underline', k: 'Insert/edit link' }
223                 ], function( row ) {
224                         table1.push( tr( row ) );
225                 } );
226
227                 each( [
228                         { 1: 'Heading 1',             2: 'Heading 2'                     },
229                         { 3: 'Heading 3',             4: 'Heading 4'                     },
230                         { 5: 'Heading 5',             6: 'Heading 6'                     },
231                         { l: 'Align left',            c: 'Align center'                  },
232                         { r: 'Align right',           j: 'Justify'                       },
233                         { d: 'Strikethrough',         q: 'Blockquote'                    },
234                         { u: 'Bullet list',           o: 'Numbered list'                 },
235                         { a: 'Insert/edit link',      s: 'Remove link'                   },
236                         { m: 'Insert/edit image',     t: 'Insert Read More tag'          },
237                         { h: 'Keyboard Shortcuts',    x: 'Code'                          },
238                         { p: 'Insert Page Break tag', w: 'Distraction-free writing mode' }
239                 ], function( row ) {
240                         table2.push( tr( row ) );
241                 } );
242
243                 function tr( row ) {
244                         var out = '<tr>';
245
246                         each( row, function( text, key ) {
247                                 if ( ! text ) {
248                                         out += '<td></td><td></td>';
249                                 } else {
250                                         out += '<td><kbd>' + key + '</kbd></td><td>' + __( text ) + '</td>';
251                                 }
252                         });
253
254                         return out + '</tr>';
255                 }
256
257                 header = [ __( 'Letter' ), __( 'Action' ), __( 'Letter' ), __( 'Action' ) ];
258                 header = '<tr><th>' + header.join( '</th><th>' ) + '</th></tr>';
259
260                 html = '<div class="wp-editor-help">';
261
262                 // Main section, default and additional shortcuts
263                 html = html +
264                         '<h2>' + __( 'Default shortcuts,' ) + ' ' + meta + '</h2>' +
265                         '<table class="wp-help-th-center fixed">' +
266                                 header +
267                                 table1.join('') +
268                         '</table>' +
269                         '<h2>' + __( 'Additional shortcuts,' ) + ' ' + access + '</h2>' +
270                         '<table class="wp-help-th-center fixed">' +
271                                 header +
272                                 table2.join('') +
273                         '</table>';
274
275                 if ( editor.plugins.wptextpattern && ( ! tinymce.Env.ie || tinymce.Env.ie > 8 ) ) {
276                         // Text pattern section
277                         html = html +
278                                 '<h2>' + __( 'When starting a new paragraph with one of these formatting shortcuts followed by a space, the formatting will be applied automatically. Press Backspace or Escape to undo.' ) + '</h2>' +
279                                 '<table class="wp-help-th-center fixed">' +
280                                         tr({ '*':  'Bullet list', '1.':  'Numbered list' }) +
281                                         tr({ '-':  'Bullet list', '1)':  'Numbered list' }) +
282                                 '</table>';
283
284                         html = html +
285                                 '<h2>' + __( 'The following formatting shortcuts are replaced when pressing Enter. Press Escape or the Undo button to undo.' ) + '</h2>' +
286                                 '<table class="wp-help-single">' +
287                                         tr({ '>': 'Blockquote' }) +
288                                         tr({ '##': 'Heading 2' }) +
289                                         tr({ '###': 'Heading 3' }) +
290                                         tr({ '####': 'Heading 4' }) +
291                                         tr({ '#####': 'Heading 5' }) +
292                                         tr({ '######': 'Heading 6' }) +
293                                         tr({ '---': 'Horizontal line' }) +
294                                 '</table>';
295                 }
296
297                 // Focus management section
298                 html = html +
299                         '<h2>' + __( 'Focus shortcuts:' ) + '</h2>' +
300                         '<table class="wp-help-single">' +
301                                 tr({ 'Alt + F8':  'Inline toolbar (when an image, link or preview is selected)' }) +
302                                 tr({ 'Alt + F9':  'Editor menu (when enabled)' }) +
303                                 tr({ 'Alt + F10': 'Editor toolbar' }) +
304                                 tr({ 'Alt + F11': 'Elements path' }) +
305                         '</table>' +
306                         '<p>' + __( 'To move focus to other buttons use Tab or the arrow keys. To return focus to the editor press Escape or use one of the buttons.' ) + '</p>';
307
308                 html += '</div>';
309
310                 dialog = editor.windowManager.open( {
311                         title: 'Keyboard Shortcuts',
312                         items: {
313                                 type: 'container',
314                                 classes: 'wp-help',
315                                 html: html
316                         },
317                         buttons: {
318                                 text: 'Close',
319                                 onclick: 'close'
320                         }
321                 } );
322
323                 if ( dialog.$el ) {
324                         dialog.$el.find( 'div[role="application"]' ).attr( 'role', 'document' );
325                         $wrap = dialog.$el.find( '.mce-wp-help' );
326
327                         if ( $wrap[0] ) {
328                                 $wrap.attr( 'tabindex', '0' );
329                                 $wrap[0].focus();
330                                 $wrap.on( 'keydown', function( event ) {
331                                         // Prevent use of: page up, page down, end, home, left arrow, up arrow, right arrow, down arrow
332                                         // in the dialog keydown handler.
333                                         if ( event.keyCode >= 33 && event.keyCode <= 40 ) {
334                                                 event.stopPropagation();
335                                         }
336                                 });
337                         }
338                 }
339         } );
340
341         editor.addCommand( 'WP_Medialib', function() {
342                 if ( wp && wp.media && wp.media.editor ) {
343                         wp.media.editor.open( editor.id );
344                 }
345         });
346
347         // Register buttons
348         editor.addButton( 'wp_more', {
349                 tooltip: 'Insert Read More tag',
350                 onclick: function() {
351                         editor.execCommand( 'WP_More', 'more' );
352                 }
353         });
354
355         editor.addButton( 'wp_page', {
356                 tooltip: 'Page break',
357                 onclick: function() {
358                         editor.execCommand( 'WP_More', 'nextpage' );
359                 }
360         });
361
362         editor.addButton( 'wp_help', {
363                 tooltip: 'Keyboard Shortcuts',
364                 cmd: 'WP_Help'
365         });
366
367         editor.addButton( 'wp_code', {
368                 tooltip: 'Code',
369                 cmd: 'WP_Code',
370                 stateSelector: 'code'
371         });
372
373         // Menubar
374         // Insert->Add Media
375         if ( wp && wp.media && wp.media.editor ) {
376                 editor.addMenuItem( 'add_media', {
377                         text: 'Add Media',
378                         icon: 'wp-media-library',
379                         context: 'insert',
380                         cmd: 'WP_Medialib'
381                 });
382         }
383
384         // Insert "Read More..."
385         editor.addMenuItem( 'wp_more', {
386                 text: 'Insert Read More tag',
387                 icon: 'wp_more',
388                 context: 'insert',
389                 onclick: function() {
390                         editor.execCommand( 'WP_More', 'more' );
391                 }
392         });
393
394         // Insert "Next Page"
395         editor.addMenuItem( 'wp_page', {
396                 text: 'Page break',
397                 icon: 'wp_page',
398                 context: 'insert',
399                 onclick: function() {
400                         editor.execCommand( 'WP_More', 'nextpage' );
401                 }
402         });
403
404         editor.on( 'BeforeExecCommand', function(e) {
405                 if ( tinymce.Env.webkit && ( e.command === 'InsertUnorderedList' || e.command === 'InsertOrderedList' ) ) {
406                         if ( ! style ) {
407                                 style = editor.dom.create( 'style', {'type': 'text/css'},
408                                         '#tinymce,#tinymce span,#tinymce li,#tinymce li>span,#tinymce p,#tinymce p>span{font:medium sans-serif;color:#000;line-height:normal;}');
409                         }
410
411                         editor.getDoc().head.appendChild( style );
412                 }
413         });
414
415         editor.on( 'ExecCommand', function( e ) {
416                 if ( tinymce.Env.webkit && style &&
417                         ( 'InsertUnorderedList' === e.command || 'InsertOrderedList' === e.command ) ) {
418
419                         editor.dom.remove( style );
420                 }
421         });
422
423         editor.on( 'init', function() {
424                 var env = tinymce.Env,
425                         bodyClass = ['mceContentBody'], // back-compat for themes that use this in editor-style.css...
426                         doc = editor.getDoc(),
427                         dom = editor.dom;
428
429                 if ( env.iOS ) {
430                         dom.addClass( doc.documentElement, 'ios' );
431                 }
432
433                 if ( editor.getParam( 'directionality' ) === 'rtl' ) {
434                         bodyClass.push('rtl');
435                         dom.setAttrib( doc.documentElement, 'dir', 'rtl' );
436                 }
437
438                 dom.setAttrib( doc.documentElement, 'lang', editor.getParam( 'wp_lang_attr' ) );
439
440                 if ( env.ie ) {
441                         if ( parseInt( env.ie, 10 ) === 9 ) {
442                                 bodyClass.push('ie9');
443                         } else if ( parseInt( env.ie, 10 ) === 8 ) {
444                                 bodyClass.push('ie8');
445                         } else if ( env.ie < 8 ) {
446                                 bodyClass.push('ie7');
447                         }
448                 } else if ( env.webkit ) {
449                         bodyClass.push('webkit');
450                 }
451
452                 bodyClass.push('wp-editor');
453
454                 each( bodyClass, function( cls ) {
455                         if ( cls ) {
456                                 dom.addClass( doc.body, cls );
457                         }
458                 });
459
460                 // Remove invalid parent paragraphs when inserting HTML
461                 editor.on( 'BeforeSetContent', function( event ) {
462                         if ( event.content ) {
463                                 event.content = event.content.replace( /<p>\s*<(p|div|ul|ol|dl|table|blockquote|h[1-6]|fieldset|pre)( [^>]*)?>/gi, '<$1$2>' )
464                                         .replace( /<\/(p|div|ul|ol|dl|table|blockquote|h[1-6]|fieldset|pre)>\s*<\/p>/gi, '</$1>' );
465                         }
466                 });
467
468                 if ( $ ) {
469                         $( document ).triggerHandler( 'tinymce-editor-init', [editor] );
470                 }
471
472                 if ( window.tinyMCEPreInit && window.tinyMCEPreInit.dragDropUpload ) {
473                         dom.bind( doc, 'dragstart dragend dragover drop', function( event ) {
474                                 if ( $ ) {
475                                         // Trigger the jQuery handlers.
476                                         $( document ).trigger( new $.Event( event ) );
477                                 }
478                         });
479                 }
480
481                 if ( editor.getParam( 'wp_paste_filters', true ) ) {
482                         editor.on( 'PastePreProcess', function( event ) {
483                                 // Remove trailing <br> added by WebKit browsers to the clipboard
484                                 event.content = event.content.replace( /<br class="?Apple-interchange-newline"?>/gi, '' );
485
486                                 // In WebKit this is handled by removeWebKitStyles()
487                                 if ( ! tinymce.Env.webkit ) {
488                                         // Remove all inline styles
489                                         event.content = event.content.replace( /(<[^>]+) style="[^"]*"([^>]*>)/gi, '$1$2' );
490
491                                         // Put back the internal styles
492                                         event.content = event.content.replace(/(<[^>]+) data-mce-style=([^>]+>)/gi, '$1 style=$2' );
493                                 }
494                         });
495
496                         editor.on( 'PastePostProcess', function( event ) {
497                                 // Remove empty paragraphs
498                                 each( dom.select( 'p', event.node ), function( node ) {
499                                         if ( dom.isEmpty( node ) ) {
500                                                 dom.remove( node );
501                                         }
502                                 });
503                         });
504                 }
505         });
506
507         editor.on( 'SaveContent', function( event ) {
508                 // If editor is hidden, we just want the textarea's value to be saved
509                 if ( ! editor.inline && editor.isHidden() ) {
510                         event.content = event.element.value;
511                         return;
512                 }
513
514                 // Keep empty paragraphs :(
515                 event.content = event.content.replace( /<p>(?:<br ?\/?>|\u00a0|\uFEFF| )*<\/p>/g, '<p>&nbsp;</p>' );
516
517                 if ( hasWpautop ) {
518                         event.content = wp.editor.removep( event.content );
519                 }
520         });
521
522         editor.on( 'preInit', function() {
523                 var validElementsSetting = '@[id|accesskey|class|dir|lang|style|tabindex|' +
524                         'title|contenteditable|draggable|dropzone|hidden|spellcheck|translate],' + // Global attributes.
525                         'i,' + // Don't replace <i> with <em> and <b> with <strong> and don't remove them when empty.
526                         'b,' +
527                         'script[src|async|defer|type|charset|crossorigin|integrity]'; // Add support for <script>.
528
529                 editor.schema.addValidElements( validElementsSetting );
530
531                 if ( tinymce.Env.iOS ) {
532                         editor.settings.height = 300;
533                 }
534
535                 each( {
536                         c: 'JustifyCenter',
537                         r: 'JustifyRight',
538                         l: 'JustifyLeft',
539                         j: 'JustifyFull',
540                         q: 'mceBlockQuote',
541                         u: 'InsertUnorderedList',
542                         o: 'InsertOrderedList',
543                         s: 'unlink',
544                         m: 'WP_Medialib',
545                         z: 'WP_Adv',
546                         t: 'WP_More',
547                         d: 'Strikethrough',
548                         h: 'WP_Help',
549                         p: 'WP_Page',
550                         x: 'WP_Code'
551                 }, function( command, key ) {
552                         editor.shortcuts.add( 'access+' + key, '', command );
553                 } );
554
555                 editor.addShortcut( 'meta+s', '', function() {
556                         if ( wp && wp.autosave ) {
557                                 wp.autosave.server.triggerSave();
558                         }
559                 } );
560
561                 if ( window.getUserSetting( 'editor_plain_text_paste_warning' ) > 1 ) {
562                         editor.settings.paste_plaintext_inform = false;
563                 }
564         } );
565
566         editor.on( 'PastePlainTextToggle', function( event ) {
567                 // Warn twice, then stop.
568                 if ( event.state === true ) {
569                         var times = parseInt( window.getUserSetting( 'editor_plain_text_paste_warning' ), 10 ) || 0;
570
571                         if ( times < 2 ) {
572                                 window.setUserSetting( 'editor_plain_text_paste_warning', ++times );
573                         }
574                 }
575         });
576
577         /**
578          * Experimental: create a floating toolbar.
579          * This functionality will change in the next releases. Not recommended for use by plugins.
580          */
581         editor.on( 'preinit', function() {
582                 var Factory = tinymce.ui.Factory,
583                         settings = editor.settings,
584                         activeToolbar,
585                         currentSelection,
586                         timeout,
587                         container = editor.getContainer(),
588                         wpAdminbar = document.getElementById( 'wpadminbar' ),
589                         mceIframe = document.getElementById( editor.id + '_ifr' ),
590                         mceToolbar,
591                         mceStatusbar,
592                         wpStatusbar;
593
594                         if ( container ) {
595                                 mceToolbar = tinymce.$( '.mce-toolbar-grp', container )[0];
596                                 mceStatusbar = tinymce.$( '.mce-statusbar', container )[0];
597                         }
598
599                         if ( editor.id === 'content' ) {
600                                 wpStatusbar = document.getElementById( 'post-status-info' );
601                         }
602
603                 function create( buttons, bottom ) {
604                         var toolbar,
605                                 toolbarItems = [],
606                                 buttonGroup;
607
608                         each( buttons, function( item ) {
609                                 var itemName;
610
611                                 function bindSelectorChanged() {
612                                         var selection = editor.selection;
613
614                                         if ( itemName === 'bullist' ) {
615                                                 selection.selectorChanged( 'ul > li', function( state, args ) {
616                                                         var i = args.parents.length,
617                                                                 nodeName;
618
619                                                         while ( i-- ) {
620                                                                 nodeName = args.parents[ i ].nodeName;
621
622                                                                 if ( nodeName === 'OL' || nodeName == 'UL' ) {
623                                                                         break;
624                                                                 }
625                                                         }
626
627                                                         item.active( state && nodeName === 'UL' );
628                                                 } );
629                                         }
630
631                                         if ( itemName === 'numlist' ) {
632                                                 selection.selectorChanged( 'ol > li', function( state, args ) {
633                                                         var i = args.parents.length,
634                                                                 nodeName;
635
636                                                         while ( i-- ) {
637                                                                 nodeName = args.parents[ i ].nodeName;
638
639                                                                 if ( nodeName === 'OL' || nodeName === 'UL' ) {
640                                                                         break;
641                                                                 }
642                                                         }
643
644                                                         item.active( state && nodeName === 'OL' );
645                                                 } );
646                                         }
647
648                                         if ( item.settings.stateSelector ) {
649                                                 selection.selectorChanged( item.settings.stateSelector, function( state ) {
650                                                         item.active( state );
651                                                 }, true );
652                                         }
653
654                                         if ( item.settings.disabledStateSelector ) {
655                                                 selection.selectorChanged( item.settings.disabledStateSelector, function( state ) {
656                                                         item.disabled( state );
657                                                 } );
658                                         }
659                                 }
660
661                                 if ( item === '|' ) {
662                                         buttonGroup = null;
663                                 } else {
664                                         if ( Factory.has( item ) ) {
665                                                 item = {
666                                                         type: item
667                                                 };
668
669                                                 if ( settings.toolbar_items_size ) {
670                                                         item.size = settings.toolbar_items_size;
671                                                 }
672
673                                                 toolbarItems.push( item );
674
675                                                 buttonGroup = null;
676                                         } else {
677                                                 if ( ! buttonGroup ) {
678                                                         buttonGroup = {
679                                                                 type: 'buttongroup',
680                                                                 items: []
681                                                         };
682
683                                                         toolbarItems.push( buttonGroup );
684                                                 }
685
686                                                 if ( editor.buttons[ item ] ) {
687                                                         itemName = item;
688                                                         item = editor.buttons[ itemName ];
689
690                                                         if ( typeof item === 'function' ) {
691                                                                 item = item();
692                                                         }
693
694                                                         item.type = item.type || 'button';
695
696                                                         if ( settings.toolbar_items_size ) {
697                                                                 item.size = settings.toolbar_items_size;
698                                                         }
699
700                                                         item = Factory.create( item );
701
702                                                         buttonGroup.items.push( item );
703
704                                                         if ( editor.initialized ) {
705                                                                 bindSelectorChanged();
706                                                         } else {
707                                                                 editor.on( 'init', bindSelectorChanged );
708                                                         }
709                                                 }
710                                         }
711                                 }
712                         } );
713
714                         toolbar = Factory.create( {
715                                 type: 'panel',
716                                 layout: 'stack',
717                                 classes: 'toolbar-grp inline-toolbar-grp',
718                                 ariaRoot: true,
719                                 ariaRemember: true,
720                                 items: [ {
721                                         type: 'toolbar',
722                                         layout: 'flow',
723                                         items: toolbarItems
724                                 } ]
725                         } );
726
727                         toolbar.bottom = bottom;
728
729                         function reposition() {
730                                 if ( ! currentSelection ) {
731                                         return this;
732                                 }
733
734                                 var scrollX = window.pageXOffset || document.documentElement.scrollLeft,
735                                         scrollY = window.pageYOffset || document.documentElement.scrollTop,
736                                         windowWidth = window.innerWidth,
737                                         windowHeight = window.innerHeight,
738                                         iframeRect = mceIframe ? mceIframe.getBoundingClientRect() : {
739                                                 top: 0,
740                                                 right: windowWidth,
741                                                 bottom: windowHeight,
742                                                 left: 0,
743                                                 width: windowWidth,
744                                                 height: windowHeight
745                                         },
746                                         toolbar = this.getEl(),
747                                         toolbarWidth = toolbar.offsetWidth,
748                                         toolbarHeight = toolbar.offsetHeight,
749                                         selection = currentSelection.getBoundingClientRect(),
750                                         selectionMiddle = ( selection.left + selection.right ) / 2,
751                                         buffer = 5,
752                                         margin = 8,
753                                         spaceNeeded = toolbarHeight + margin + buffer,
754                                         wpAdminbarBottom = wpAdminbar ? wpAdminbar.getBoundingClientRect().bottom : 0,
755                                         mceToolbarBottom = mceToolbar ? mceToolbar.getBoundingClientRect().bottom : 0,
756                                         mceStatusbarTop = mceStatusbar ? windowHeight - mceStatusbar.getBoundingClientRect().top : 0,
757                                         wpStatusbarTop = wpStatusbar ? windowHeight - wpStatusbar.getBoundingClientRect().top : 0,
758                                         blockedTop = Math.max( 0, wpAdminbarBottom, mceToolbarBottom, iframeRect.top ),
759                                         blockedBottom = Math.max( 0, mceStatusbarTop, wpStatusbarTop, windowHeight - iframeRect.bottom ),
760                                         spaceTop = selection.top + iframeRect.top - blockedTop,
761                                         spaceBottom = windowHeight - iframeRect.top - selection.bottom - blockedBottom,
762                                         editorHeight = windowHeight - blockedTop - blockedBottom,
763                                         className = '',
764                                         iosOffsetTop = 0,
765                                         iosOffsetBottom = 0,
766                                         top, left;
767
768                                 if ( spaceTop >= editorHeight || spaceBottom >= editorHeight ) {
769                                         this.scrolling = true;
770                                         this.hide();
771                                         this.scrolling = false;
772                                         return this;
773                                 }
774
775                                 // Add offset in iOS to move the menu over the image, out of the way of the default iOS menu.
776                                 if ( tinymce.Env.iOS && currentSelection.nodeName === 'IMG' ) {
777                                         iosOffsetTop = 54;
778                                         iosOffsetBottom = 46;
779                                 }
780
781                                 if ( this.bottom ) {
782                                         if ( spaceBottom >= spaceNeeded ) {
783                                                 className = ' mce-arrow-up';
784                                                 top = selection.bottom + iframeRect.top + scrollY - iosOffsetBottom;
785                                         } else if ( spaceTop >= spaceNeeded ) {
786                                                 className = ' mce-arrow-down';
787                                                 top = selection.top + iframeRect.top + scrollY - toolbarHeight - margin + iosOffsetTop;
788                                         }
789                                 } else {
790                                         if ( spaceTop >= spaceNeeded ) {
791                                                 className = ' mce-arrow-down';
792                                                 top = selection.top + iframeRect.top + scrollY - toolbarHeight - margin + iosOffsetTop;
793                                         } else if ( spaceBottom >= spaceNeeded && editorHeight / 2 > selection.bottom + iframeRect.top - blockedTop ) {
794                                                 className = ' mce-arrow-up';
795                                                 top = selection.bottom + iframeRect.top + scrollY - iosOffsetBottom;
796                                         }
797                                 }
798
799                                 if ( typeof top === 'undefined' ) {
800                                         top = scrollY + blockedTop + buffer + iosOffsetBottom;
801                                 }
802
803                                 left = selectionMiddle - toolbarWidth / 2 + iframeRect.left + scrollX;
804
805                                 if ( selection.left < 0 || selection.right > iframeRect.width ) {
806                                         left = iframeRect.left + scrollX + ( iframeRect.width - toolbarWidth ) / 2;
807                                 } else if ( toolbarWidth >= windowWidth ) {
808                                         className += ' mce-arrow-full';
809                                         left = 0;
810                                 } else if ( ( left < 0 && selection.left + toolbarWidth > windowWidth ) || ( left + toolbarWidth > windowWidth && selection.right - toolbarWidth < 0 ) ) {
811                                         left = ( windowWidth - toolbarWidth ) / 2;
812                                 } else if ( left < iframeRect.left + scrollX ) {
813                                         className += ' mce-arrow-left';
814                                         left = selection.left + iframeRect.left + scrollX;
815                                 } else if ( left + toolbarWidth > iframeRect.width + iframeRect.left + scrollX ) {
816                                         className += ' mce-arrow-right';
817                                         left = selection.right - toolbarWidth + iframeRect.left + scrollX;
818                                 }
819
820                                 // No up/down arrows on the menu over images in iOS.
821                                 if ( tinymce.Env.iOS && currentSelection.nodeName === 'IMG' ) {
822                                         className = className.replace( / ?mce-arrow-(up|down)/g, '' );
823                                 }
824
825                                 toolbar.className = toolbar.className.replace( / ?mce-arrow-[\w]+/g, '' ) + className;
826
827                                 DOM.setStyles( toolbar, {
828                                         'left': left,
829                                         'top': top
830                                 } );
831
832                                 return this;
833                         }
834
835                         toolbar.on( 'show', function() {
836                                 this.reposition();
837                         } );
838
839                         toolbar.on( 'keydown', function( event ) {
840                                 if ( event.keyCode === 27 ) {
841                                         this.hide();
842                                         editor.focus();
843                                 }
844                         } );
845
846                         editor.on( 'remove', function() {
847                                 toolbar.remove();
848                         } );
849
850                         toolbar.reposition = reposition;
851                         toolbar.hide().renderTo( document.body );
852
853                         return toolbar;
854                 }
855
856                 editor.shortcuts.add( 'alt+119', '', function() {
857                         var node;
858
859                         if ( activeToolbar ) {
860                                 node = activeToolbar.find( 'toolbar' )[0];
861                                 node && node.focus( true );
862                         }
863                 } );
864
865                 editor.on( 'nodechange', function( event ) {
866                         var collapsed = editor.selection.isCollapsed();
867
868                         var args = {
869                                 element: event.element,
870                                 parents: event.parents,
871                                 collapsed: collapsed
872                         };
873
874                         editor.fire( 'wptoolbar', args );
875
876                         currentSelection = args.selection || args.element;
877
878                         if ( activeToolbar && activeToolbar !== args.toolbar ) {
879                                 activeToolbar.hide();
880                         }
881
882                         if ( args.toolbar ) {
883                                 if ( activeToolbar !== args.toolbar ) {
884                                         activeToolbar = args.toolbar;
885                                         activeToolbar.show();
886                                 } else {
887                                         activeToolbar.reposition();
888                                 }
889                         } else {
890                                 activeToolbar = false;
891                         }
892                 } );
893
894                 editor.on( 'focus', function() {
895                         if ( activeToolbar ) {
896                                 activeToolbar.show();
897                         }
898                 } );
899
900                 function hide( event ) {
901                         if ( activeToolbar ) {
902                                 if ( activeToolbar.tempHide || event.type === 'hide' ) {
903                                         activeToolbar.hide();
904                                         activeToolbar = false;
905                                 } else if ( ( event.type === 'resize' || event.type === 'scroll' ) && ! activeToolbar.blockHide ) {
906                                         clearTimeout( timeout );
907
908                                         timeout = setTimeout( function() {
909                                                 if ( activeToolbar && typeof activeToolbar.show === 'function' ) {
910                                                         activeToolbar.scrolling = false;
911                                                         activeToolbar.show();
912                                                 }
913                                         }, 250 );
914
915                                         activeToolbar.scrolling = true;
916                                         activeToolbar.hide();
917                                 }
918                         }
919                 }
920
921                 DOM.bind( window, 'resize scroll', hide );
922                 editor.dom.bind( editor.getWin(), 'resize scroll', hide );
923
924                 editor.on( 'remove', function() {
925                         DOM.unbind( window, 'resize scroll', hide );
926                         editor.dom.unbind( editor.getWin(), 'resize scroll', hide );
927                 } );
928
929                 editor.on( 'blur hide', hide );
930
931                 editor.wp = editor.wp || {};
932                 editor.wp._createToolbar = create;
933         }, true );
934
935         function noop() {}
936
937         // Expose some functions (back-compat)
938         return {
939                 _showButtons: noop,
940                 _hideButtons: noop,
941                 _setEmbed: noop,
942                 _getEmbed: noop
943         };
944 });
945
946 }( window.tinymce ));