// Register a new CKEditor plugin. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.resourceManager.html#add CKEDITOR.plugins.add( 'footnote', { // The plugin initialization logic goes inside this method. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.pluginDefinition.html#init init: function( editor ) { // Create an editor command that stores the dialog initialization command. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.command.html // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialogCommand.html editor.addCommand( 'footnoteDialog', new CKEDITOR.dialogCommand( 'footnoteDialog' ) ); var lang = editor.lang.footnote; if(!lang) { lang = CKEDITOR.lang['default']['footnote']; } else { var lang_default = CKEDITOR.lang['default']['footnote']; for(var k in lang_default) { if(!lang[k]) { lang[k] = lang_default[k]; } } } if(!oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj) { oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj = new Object(); oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.notes = new Array(); oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.count = 0; } // Create a toolbar button that executes the plugin command defined above. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.html#addButton editor.ui.addButton( 'Footnotes', { // Toolbar button tooltip. label: lang.ToolTip, //'Insert a footnote', // Reference to the plugin command name. command: 'footnoteDialog', // Button's icon file path. icon: this.path + 'images/footnote.png' } ); // Add a new dialog window definition containing all UI elements and listeners. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialog.html#.add // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialog.dialogDefinition.html CKEDITOR.dialog.add( 'footnoteDialog', function( editor ) { return { // Basic properties of the dialog window: title, minimum size. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialog.dialogDefinition.html title : lang.Title, //'Footnote Dialog', minWidth : 400, minHeight : 200, fontSize: "14pt", onShow: function() { /* var el = this.getContentElement( 'general', 'contents').getInputElement().$.id; var ta = document.getElementById(el); */ }, // Dialog window contents. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialog.definition.content.html contents : [ { // Definition of the Settings dialog window tab (page) with its id, label and contents. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialog.contentDefinition.html id : 'general', label : lang.Settings, //'Settings', elements : [ // Dialog window UI element: HTML code field. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.html.html { type : 'html', // HTML code to be shown inside the field. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.html.html#constructor html : lang.Header, //'This dialog window lets you create and edit footnotes.' }, // Dialog window UI element: a textarea field for the link text. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.textarea.html { type : 'textarea', id : 'contents', // Text that labels the field. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.labeledElement.html#constructor label : lang.Label_1, //'Footnote Text (required)', // Validation checking whether the field is not empty. validate : CKEDITOR.dialog.validate.notEmpty(lang.Validate), //'The footnote text field cannot be empty.' // Function to be run when the commitContent method of the parent dialog window is called. // Get the value of this field and save it in the data object attribute. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dom.element.html#getValue commit : function( data ) { data.contents = this.getValue(); }, }, // Dialog window UI element: a text input field for the link URL. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.textInput.html { type : 'hbox', id: 'revisions', widths : [ '15%', '30%', '2%', '53%' ], children : [ { type: 'html', html: lang.Label_2, //'Footnote Id: ', }, { type : 'text', id : 'noteId', maxLength: "9", commit : function( data ) { data.noteId = this.getValue(); }, onChange: function(data) { }, }, { type: 'html', html: '  ', }, { type : 'button', label: lang.LoadButtonLabel, //'Load Note In Editor', id : 'id3', onClick: function () { var dialog = this.getDialog(); var el = dialog.getContentElement( 'general', 'noteId').getInputElement().$.id; var fn_id = document.getElementById(el).value; if(fn_id) { if(oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.notes[fn_id]) { var el = dialog.getContentElement( 'general', 'contents').getInputElement().$.id; var ta = document.getElementById(el); ta.value = oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.notes[fn_id]; } } }, } ] }, ] }, { id : 'info', label : 'Info', elements : [ // Dialog window UI element: HTML code field. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.html.html { type : 'html', // HTML code to be shown inside the field. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.dialog.html.html#constructor html : lang.FootNoteInfo, //html.join(""), }, ] }, ], onOk : function() { // Create a sup element and an object that will store the data entered in the dialog window. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dom.document.html#createElement var dialog = this, data = {}, sup = editor.document.createElement( 'sup' ); // Populate the data object with data entered in the dialog window. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dialog.html#commitContent this.commitContent( data ); if(data.noteId) { oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.notes[data.noteId] = data.contents; return; } // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dom.element.html#setAttribute //sup.setAttribute( 'title', data.noteId ); sup.setAttribute( 'class', "dwfcknote " ); var instance = ++oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.count; var fn_id = 'fckgL'+ instance; sup.setAttribute( 'class', "dwfcknote " + fn_id ); oDokuWiki_FCKEditorInstance.oinsertHtmlCodeObj.notes[fn_id] = data.contents // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dom.element.html#setHtml sup.setHtml( fn_id ); // Insert the sup element into the current cursor position in the editor. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#insertElement editor.insertElement( sup ); } }; } ); } } );