12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091 |
- /**
- * Reference docs for how to build a CKEditor plugin:
- * http://docs.ckeditor.com/#!/guide/plugin_sdk_sample_1
- */
- CKEDITOR.plugins.add('bootstrapTabs', {
- lang: 'en,ru',
- requires: 'dialog',
- icons: 'bootstrapTabs',
- init: function( editor ) {
- // Plugin logic goes here...
- // Create the command for the plugin.
- editor.addCommand('bootstrapTabs', new CKEDITOR.dialogCommand('bootstrapTabsDialog', {
- allowedContent: 'div ul li a[role,href,id,aria-*,data-number-of-tabs,data-tab-set-title,data-toggle](bootstrap-tabs,nav,nav-tabs,tab-link,active,tab-content,tab-pane,tab-pane-content)'
- }));
- // Add the button for the plugin.
- editor.ui.addButton('BootstrapTabs', {
- label: editor.lang.bootstrapTabs.buttonLabel,
- command: 'bootstrapTabs', // The command that was created by addCommand, above.
- toolbar: 'insert' // Defines the toolbar group. Can also specify an index for ordering: 'insert,30' or 'insert,100', or 'insert,0'.
- });
- CKEDITOR.dialog.add('bootstrapTabsDialog', this.path + 'dialogs/bootstrapTabs.js');
- // Context menu support in CKEditor is implemented by the Context Menu plugin.
- // The context menu implementation should be placed inside the init function in the plugin file,
- // following the command and button definitions.
- // The if check here is a "best practice".
- // If for some reason the Context Menu plugin will be removed or not available,
- // the menu registration should not take place (otherwise an exception is thrown).
- // http://docs.ckeditor.com/#!/guide/plugin_sdk_sample_2
- if ( editor.contextMenu ) {
- editor.addMenuGroup( 'bootstrapTabsGroup' );
- editor.addMenuItem( 'bootstrapTabsItem', {
- label: editor.lang.bootstrapTabs.contextMenuLabel,
- icon: this.path + 'icons/bootstrapTabs.png',
- command: 'bootstrapTabs',
- group: 'bootstrapTabsGroup'
- });
- editor.contextMenu.addListener( function(element) {
- // If an ascendant of the element has the nav-tabs or tab-content class,
- // enable the context menu (a button with off state for the tab)
- ascendant = element.getAscendant( function(element) {
- // NOTE: The first part of this condition determinds if we've reached the '#document' for the page.
- // If we've reached the document ascendant, then calling hasClass() will cause an error, breaking the contextMenu.
- // http://docs.ckeditor.com/#!/api/CKEDITOR.dom.document
- return !( element instanceof CKEDITOR.dom.document ) &&
- ( element.hasClass('nav-tabs') || element.hasClass('tab-content') );
- });
- if ( ascendant ) {
- return { bootstrapTabsItem: CKEDITOR.TRISTATE_OFF };
- }
- });
- }
- // Register a doubleclick event handler
- // When an element is double-clicked, the bootstrapTabsDialog
- // will be displayed for elements that are descendents part of a tab set.
- editor.on('doubleclick', function (event) {
- var element = event.data.element;
- // If an ascendant of the element has the nav-tabs or tab-content class,
- // enable the context menu (a button with off state for the tab)
- ascendant = element.getAscendant( function(element) {
- // QUESTION: How to prevent linkDialog from displaying on doubleclick in a nav-tab?
- // In the case of of a[role="tab"], the link dialog is not displayed, but the bootstrapTabsDialog
- // is not displayed as preferred.
- // NOTE: The first part of this condition determinds if we've reached the '#document' for the page.
- // If we've reached the document ascendant, then calling hasClass() will cause an error, breaking the contextMenu.
- // http://docs.ckeditor.com/#!/api/CKEDITOR.dom.document
- return !( element instanceof CKEDITOR.dom.document ) &&
- (
- ( element.name == 'a' && element.attributes.role == 'tab') ||
- element.hasClass('nav-tabs') ||
- element.hasClass('tab-content')
- );
- });
- if ( ascendant ) {
- event.data.dialog = 'bootstrapTabsDialog';
- }
- });
- }
- });
|