2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license
\r
7 * @fileOverview The "elementspath" plugin. It shows all elements in the DOM
\r
8 * parent tree relative to the current selection in the editing area.
\r
17 exec : function( editor )
\r
19 var idBase = editor._.elementsPath.idBase;
\r
20 var element = CKEDITOR.document.getById( idBase + '0' );
\r
28 var emptyHtml = '<span class="cke_empty"> </span>';
\r
30 CKEDITOR.plugins.add( 'elementspath',
\r
32 requires : [ 'selection' ],
\r
34 init : function( editor )
\r
36 var spaceId = 'cke_path_' + editor.name;
\r
38 var getSpaceElement = function()
\r
40 if ( !spaceElement )
\r
41 spaceElement = CKEDITOR.document.getById( spaceId );
\r
42 return spaceElement;
\r
45 var idBase = 'cke_elementspath_' + CKEDITOR.tools.getNextNumber() + '_';
\r
47 editor._.elementsPath = { idBase : idBase };
\r
49 editor.on( 'themeSpace', function( event )
\r
51 if ( event.data.space == 'bottom' )
\r
52 event.data.html += '<div id="' + spaceId + '" class="cke_path">' + emptyHtml + '</div>';
\r
55 editor.on( 'selectionChange', function( ev )
\r
57 var env = CKEDITOR.env;
\r
59 var selection = ev.data.selection;
\r
61 var element = selection.getStartElement(),
\r
63 elementsList = this._.elementsPath.list = [];
\r
67 var index = elementsList.push( element ) - 1;
\r
69 if ( element.getAttribute( '_cke_real_element_type' ) )
\r
70 name = element.getAttribute( '_cke_real_element_type' );
\r
72 name = element.getName();
\r
74 // Use this variable to add conditional stuff to the
\r
75 // HTML (because we are doing it in reverse order... unshift).
\r
78 // Some browsers don't cancel key events in the keydown but in the
\r
80 // TODO: Check if really needed for Gecko+Mac.
\r
81 if ( env.opera || ( env.gecko && env.mac ) )
\r
82 extra += ' onkeypress="return false;"';
\r
84 // With Firefox, we need to force the button to redraw, otherwise it
\r
85 // will remain in the focus state.
\r
87 extra += ' onblur="this.style.cssText = this.style.cssText;"';
\r
91 ' id="', idBase, index, '"' +
\r
92 ' href="javascript:void(\'', name, '\')"' +
\r
94 ' title="', editor.lang.elementsPath.eleTitle.replace( /%1/, name ), '"' +
\r
95 ( ( CKEDITOR.env.gecko && CKEDITOR.env.version < 10900 ) ?
\r
96 ' onfocus="event.preventBubble();"' : '' ) +
\r
97 ' hidefocus="true" ' +
\r
98 ' onkeydown="return CKEDITOR._.elementsPath.keydown(\'', this.name, '\',', index, ', event);"' +
\r
100 ' onclick="return CKEDITOR._.elementsPath.click(\'', this.name, '\',', index, ');">',
\r
104 if ( name == 'body' )
\r
107 element = element.getParent();
\r
110 getSpaceElement().setHtml( html.join('') + emptyHtml );
\r
113 editor.on( 'contentDomUnload', function()
\r
115 getSpaceElement().setHtml( emptyHtml );
\r
118 editor.addCommand( 'elementsPathFocus', commands.toolbarFocus );
\r
124 * Handles the click on an element in the element path.
\r
127 CKEDITOR._.elementsPath =
\r
129 click : function( instanceName, elementIndex )
\r
131 var editor = CKEDITOR.instances[ instanceName ];
\r
134 var element = editor._.elementsPath.list[ elementIndex ];
\r
135 editor.getSelection().selectElement( element );
\r
140 keydown : function( instanceName, elementIndex, ev )
\r
142 var instance = CKEDITOR.ui.button._.instances[ elementIndex ];
\r
143 var editor = CKEDITOR.instances[ instanceName ];
\r
144 var idBase = editor._.elementsPath.idBase;
\r
148 ev = new CKEDITOR.dom.event( ev );
\r
150 switch ( ev.getKeystroke() )
\r
152 case 37 : // LEFT-ARROW
\r
154 element = CKEDITOR.document.getById( idBase + ( elementIndex + 1 ) );
\r
156 element = CKEDITOR.document.getById( idBase + '0' );
\r
160 case 39 : // RIGHT-ARROW
\r
161 case CKEDITOR.SHIFT + 9 : // SHIFT + TAB
\r
162 element = CKEDITOR.document.getById( idBase + ( elementIndex - 1 ) );
\r
164 element = CKEDITOR.document.getById( idBase + ( editor._.elementsPath.list.length - 1 ) );
\r
172 case 13 : // ENTER // Opera
\r
174 this.click( instanceName, elementIndex );
\r
178 // alert( ev.getKeystroke() );
\r