vanilla ckeditor-3.0

[ckeditor.git] / _source / plugins / specialchar / dialogs / specialchar.js

diff --git a/_source/plugins/specialchar/dialogs/specialchar.js b/_source/plugins/specialchar/dialogs/specialchar.js
new file mode 100644 (file)
index 0000000..5b6e622
--- /dev/null
+++ b/_source/plugins/specialchar/dialogs/specialchar.js
@@ -0,0 +1,362 @@
+/*\r
+Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.\r
+For licensing, see LICENSE.html or http://ckeditor.com/license\r
+*/\r
+\r
+CKEDITOR.dialog.add( 'specialchar', function( editor )\r
+{\r
+       /**\r
+        * Simulate "this" of a dialog for non-dialog events.\r
+        * @type {CKEDITOR.dialog}\r
+        */\r
+       var dialog;\r
+       var onChoice = function( evt )\r
+       {\r
+               var target, value;\r
+               if ( evt.data )\r
+                       target = evt.data.getTarget();\r
+               else\r
+                       target = new CKEDITOR.dom.element( evt );\r
+\r
+               if ( target.getName() == 'a' && ( value = target.getChild( 0 ).getHtml() ) )\r
+               {\r
+                       target.removeClass( "cke_light_background" );\r
+                       dialog.hide();\r
+                       editor.insertHtml( value );\r
+               }\r
+       };\r
+\r
+       var onClick = CKEDITOR.tools.addFunction( onChoice );\r
+\r
+       var focusedNode;\r
+\r
+       var onFocus = function( evt, target )\r
+       {\r
+               var value;\r
+               target = target || evt.data.getTarget();\r
+\r
+               if ( target.getName() == 'span' )\r
+                       target = target.getParent();\r
+\r
+               if ( target.getName() == 'a' && ( value = target.getChild( 0 ).getHtml() ) )\r
+               {\r
+                       // Trigger blur manually if there is focused node.\r
+                       if ( focusedNode )\r
+                               onBlur( null, focusedNode );\r
+\r
+                       var htmlPreview = dialog.getContentElement( 'info', 'htmlPreview' ).getElement();\r
+\r
+                       dialog.getContentElement( 'info', 'charPreview' ).getElement().setHtml( value );\r
+                       htmlPreview.setHtml( CKEDITOR.tools.htmlEncode( value ) );\r
+                       target.getParent().addClass( "cke_light_background" );\r
+\r
+                       // Memorize focused node.\r
+                       focusedNode = target;\r
+               }\r
+       };\r
+\r
+       var onBlur = function( evt, target )\r
+       {\r
+               target = target || evt.data.getTarget();\r
+\r
+               if ( target.getName() == 'span' )\r
+                       target = target.getParent();\r
+\r
+               if ( target.getName() == 'a' )\r
+               {\r
+                       dialog.getContentElement( 'info', 'charPreview' ).getElement().setHtml( ' ' );\r
+                       dialog.getContentElement( 'info', 'htmlPreview' ).getElement().setHtml( ' ' );\r
+                       target.getParent().removeClass( "cke_light_background" );\r
+\r
+                       focusedNode = undefined;\r
+               }\r
+       };\r
+\r
+       var onKeydown = CKEDITOR.tools.addFunction( function( ev )\r
+       {\r
+               ev = new CKEDITOR.dom.event( ev );\r
+\r
+               // Get an Anchor element.\r
+               var element = ev.getTarget();\r
+               var relative, nodeToMove;\r
+               var keystroke = ev.getKeystroke();\r
+\r
+               switch ( keystroke )\r
+               {\r
+                       // RIGHT-ARROW\r
+                       case 39 :\r
+                               // relative is TD\r
+                               if ( ( relative = element.getParent().getNext() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( 0 );\r
+                                       if ( nodeToMove.type == 1 )\r
+                                       {\r
+                                               nodeToMove.focus();\r
+                                               onBlur( null, element );\r
+                                               onFocus( null, nodeToMove );\r
+                                       }\r
+                               }\r
+                               ev.preventDefault();\r
+                               break;\r
+                       // LEFT-ARROW\r
+                       case 37 :\r
+                               // relative is TD\r
+                               if ( ( relative = element.getParent().getPrevious() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( 0 );\r
+                                       nodeToMove.focus();\r
+                                       onBlur( null, element );\r
+                                       onFocus( null, nodeToMove );\r
+                               }\r
+                               ev.preventDefault();\r
+                               break;\r
+                       // UP-ARROW\r
+                       case 38 :\r
+                               // relative is TR\r
+                               if ( ( relative = element.getParent().getParent().getPrevious() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( [element.getParent().getIndex(), 0] );\r
+                                       nodeToMove.focus();\r
+                                       onBlur( null, element );\r
+                                       onFocus( null, nodeToMove );\r
+                               }\r
+                               ev.preventDefault();\r
+                               break;\r
+                       // DOWN-ARROW\r
+                       case 40 :\r
+                               // relative is TR\r
+                               if ( ( relative = element.getParent().getParent().getNext() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( [ element.getParent().getIndex(), 0 ] );\r
+                                       if ( nodeToMove && nodeToMove.type == 1 )\r
+                                       {\r
+                                               nodeToMove.focus();\r
+                                               onBlur( null, element );\r
+                                               onFocus( null, nodeToMove );\r
+                                       }\r
+                               }\r
+                               ev.preventDefault();\r
+                               break;\r
+                       // SPACE\r
+                       // ENTER is already handled as onClick\r
+                       case 32 :\r
+                               onChoice( { data: ev } );\r
+                               ev.preventDefault();\r
+                               break;\r
+                       // TAB\r
+                       case 9 :\r
+                               // relative is TD\r
+                               if ( ( relative = element.getParent().getNext() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( 0 );\r
+                                       if ( nodeToMove.type == 1 )\r
+                                       {\r
+                                               nodeToMove.focus();\r
+                                               onBlur( null, element );\r
+                                               onFocus( null, nodeToMove );\r
+                                               ev.preventDefault( true );\r
+                                       }\r
+                                       else\r
+                                               onBlur( null, element );\r
+                               }\r
+                               // relative is TR\r
+                               else if ( ( relative = element.getParent().getParent().getNext() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( [ 0, 0 ] );\r
+                                       if ( nodeToMove && nodeToMove.type == 1 )\r
+                                       {\r
+                                               nodeToMove.focus();\r
+                                               onBlur( null, element );\r
+                                               onFocus( null, nodeToMove );\r
+                                               ev.preventDefault( true );\r
+                                       }\r
+                                       else\r
+                                               onBlur( null, element );\r
+                               }\r
+                               break;\r
+                       // SHIFT + TAB\r
+                       case CKEDITOR.SHIFT + 9 :\r
+                               // relative is TD\r
+                               if ( ( relative = element.getParent().getPrevious() ) )\r
+                               {\r
+                                       nodeToMove = relative.getChild( 0 );\r
+                                       nodeToMove.focus();\r
+                                       onBlur( null, element );\r
+                                       onFocus( null, nodeToMove );\r
+                                       ev.preventDefault( true );\r
+                               }\r
+                               // relative is TR\r
+                               else if ( ( relative = element.getParent().getParent().getPrevious() ) )\r
+                               {\r
+                                       nodeToMove = relative.getLast().getChild( 0 );\r
+                                       nodeToMove.focus();\r
+                                       onBlur( null, element );\r
+                                       onFocus( null, nodeToMove );\r
+                                       ev.preventDefault( true );\r
+                               }\r
+                               else\r
+                                       onBlur( null, element );\r
+                               break;\r
+                       default :\r
+                               // Do not stop not handled events.\r
+                               return;\r
+               }\r
+       });\r
+\r
+       return {\r
+               title : editor.lang.specialChar.title,\r
+               minWidth : 430,\r
+               minHeight : 280,\r
+               buttons : [ CKEDITOR.dialog.cancelButton ],\r
+               charColumns : 17,\r
+               chars :\r
+                       [\r
+                               '!','"','#','$','%','&',"'",'(',')','*','+','-','.','/',\r
+                               '0','1','2','3','4','5','6','7','8','9',':',';',\r
+                               '<','=','>','?','@',\r
+                               'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O',\r
+                               'P','Q','R','S','T','U','V','W','X','Y','Z',\r
+                               '[',']','^','_','`',\r
+                               'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p',\r
+                               'q','r','s','t','u','v','w','x','y','z',\r
+                               '{','|','}','~','€','‘','’','’','“',\r
+                               '”','–','—','¡','¢','£',\r
+                               '¤','¥','¦','§','¨','©','ª',\r
+                               '«','¬','®','¯','°','±','²',\r
+                               '³','´','µ','¶','·','¸',\r
+                               '¹','º','»','¼','½','¾',\r
+                               '¿','À','Á','Â','Ã','Ä',\r
+                               'Å','Æ','Ç','È','É','Ê',\r
+                               'Ë','Ì','Í','Î','Ï','Ð',\r
+                               'Ñ','Ò','Ó','Ô','Õ','Ö',\r
+                               '×','Ø','Ù','Ú','Û','Ü',\r
+                               'Ý','Þ','ß','à','á','â',\r
+                               'ã','ä','å','æ','ç','è',\r
+                               'é','ê','ë','ì','í','î',\r
+                               'ï','ð','ñ','ò','ó','ô',\r
+                               'õ','ö','÷','ø','ù','ú',\r
+                               'û','ü','ü','ý','þ','ÿ',\r
+                               'Œ','œ','Ŵ','&#374','&#373','ŷ','‚',\r
+                               '‛','„','…','™','►','•',\r
+                               '→','⇒','⇔','♦','≈'\r
+                       ],\r
+               onLoad :  function()\r
+               {\r
+                       var columns = this.definition.charColumns,\r
+                               chars = this.definition.chars;\r
+\r
+                       var html = [ '<table style="width: 320px; height: 100%; border-collapse: separate;" align="center" cellspacing="2" cellpadding="2" border="0">' ];\r
+\r
+                       var i = 0 ;\r
+                       while ( i < chars.length )\r
+                       {\r
+                               html.push( '<tr>' ) ;\r
+\r
+                               for( var j = 0 ; j < columns ; j++, i++ )\r
+                               {\r
+                                       if ( chars[ i ] )\r
+                                       {\r
+                                               html.push(\r
+                                                       '<td class="cke_dark_background" style="cursor: default">' +\r
+                                                       '<a href="javascript: void(0);" style="cursor: inherit; display: block; height: 1.25em; margin-top: 0.25em; text-align: center;" title="', chars[i].replace( /&/g, '&amp;' ), '"' +\r
+                                                       ' onkeydown="CKEDITOR.tools.callFunction( ' + onKeydown + ', event, this )"' +\r
+                                                       ' onclick="CKEDITOR.tools.callFunction(' + onClick + ', this); return false;"' +\r
+                                                       ' tabindex="-1">' +\r
+                                                       '<span style="margin: 0 auto;cursor: inherit">' +\r
+                                                       chars[i] +\r
+                                                       '</span></a>');\r
+                                       }\r
+                                       else\r
+                                               html.push( '<td class="cke_dark_background">&nbsp;' );\r
+\r
+                                       html.push( '</td>' );\r
+                               }\r
+                               html.push( '</tr>' );\r
+                       }\r
+\r
+                       html.push( '</tbody></table>' );\r
+\r
+                       this.getContentElement( 'info', 'charContainer' ).getElement().setHtml( html.join( '' ) );\r
+               },\r
+               contents : [\r
+                       {\r
+                               id : 'info',\r
+                               label : editor.lang.common.generalTab,\r
+                               title : editor.lang.common.generalTab,\r
+                               padding : 0,\r
+                               align : 'top',\r
+                               elements : [\r
+                                       {\r
+                                               type : 'hbox',\r
+                                               align : 'top',\r
+                                               widths : [ '320px', '90px' ],\r
+                                               children :\r
+                                               [\r
+                                                       {\r
+                                                               type : 'html',\r
+                                                               id : 'charContainer',\r
+                                                               html : '',\r
+                                                               onMouseover : onFocus,\r
+                                                               onMouseout : onBlur,\r
+                                                               focus : function()\r
+                                                               {\r
+                                                                       var firstChar = this.getElement().getChild( [0, 0, 0, 0, 0] );\r
+                                                                       setTimeout(function()\r
+                                                                       {\r
+                                                                               firstChar.focus();\r
+                                                                               onFocus( null, firstChar );\r
+                                                                       });\r
+                                                               },\r
+                                                               // Needed only for webkit.\r
+                                                               onShow : function()\r
+                                                               {\r
+                                                                       var firstChar = this.getElement().getChild( [0, 0, 0, 0, 0] );\r
+                                                                       setTimeout(function()\r
+                                                                       {\r
+                                                                               firstChar.focus();\r
+                                                                               onFocus( null, firstChar );\r
+                                                                       });\r
+                                                               },\r
+                                                               onLoad : function( event )\r
+                                                               {\r
+                                                                       dialog = event.sender;\r
+                                                               }\r
+                                                       },\r
+                                                       {\r
+                                                               type : 'hbox',\r
+                                                               align : 'top',\r
+                                                               widths : [ '100%' ],\r
+                                                               children :\r
+                                                               [\r
+                                                                       {\r
+                                                                               type : 'vbox',\r
+                                                                               align : 'top',\r
+                                                                               children :\r
+                                                                               [\r
+                                                                                       {\r
+                                                                                               type : 'html',\r
+                                                                                               html : '<div></div>'\r
+                                                                                       },\r
+                                                                                       {\r
+                                                                                               type : 'html',\r
+                                                                                               id : 'charPreview',\r
+                                                                                               style : 'border:1px solid #eeeeee;background-color:#EAEAD1;font-size:28px;height:40px;width:70px;padding-top:9px;font-family:\'Microsoft Sans Serif\',Arial,Helvetica,Verdana;text-align:center;',\r
+                                                                                               html : '<div>&nbsp;</div>'\r
+                                                                                       },\r
+                                                                                       {\r
+                                                                                               type : 'html',\r
+                                                                                               id : 'htmlPreview',\r
+                                                                                               style : 'border:1px solid #eeeeee;background-color:#EAEAD1;font-size:14px;height:20px;width:70px;padding-top:2px;font-family:\'Microsoft Sans Serif\',Arial,Helvetica,Verdana;text-align:center;',\r
+                                                                                               html : '<div>&nbsp;</div>'\r
+                                                                                       }\r
+                                                                               ]\r
+                                                                       }\r
+                                                               ]\r
+                                                       }\r
+                                               ]\r
+                                       }\r
+                               ]\r
+                       }\r
+               ]\r
+       };\r
+} );\r