Added feature #13748: htmlArea RTE: Extjize character map
authorStanislas Rolland <typo3@sjbr.ca>
Fri, 5 Mar 2010 00:45:18 +0000 (00:45 +0000)
committerStanislas Rolland <typo3@sjbr.ca>
Fri, 5 Mar 2010 00:45:18 +0000 (00:45 +0000)
git-svn-id: https://svn.typo3.org/TYPO3v4/Core/trunk@7078 709f56b5-9817-0410-a4d7-c38de5d9e867

ChangeLog
typo3/sysext/rtehtmlarea/ChangeLog
typo3/sysext/rtehtmlarea/htmlarea/plugins/CharacterMap/character-map.js
typo3/sysext/rtehtmlarea/htmlarea/plugins/CharacterMap/locallang.xml
typo3/sysext/rtehtmlarea/htmlarea/plugins/CharacterMap/popups/select_character.html [deleted file]
typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css
typo3/sysext/t3skin/rtehtmlarea/htmlarea.css

index bc58920..a94416e 100755 (executable)
--- a/ChangeLog
+++ b/ChangeLog
@@ -1,3 +1,7 @@
+2010-03-04  Stanislas Rolland  <typo3@sjbr.ca>
+
+       * Added feature #13748: htmlArea RTE: Extjize character map
+
 2010-03-04  Ernesto Baschny  <ernst@cron-it.de>
 
        * Fixed bug #13554: Web>View on mount pages via backend (thanks to Georg Ringer)
index 58f6ed0..939c9b8 100644 (file)
@@ -1,3 +1,7 @@
+2010-03-04  Stanislas Rolland  <typo3@sjbr.ca>
+
+       * Added feature #13748: htmlArea RTE: Extjize character map
+
 2010-02-25  Stanislas Rolland  <typo3@sjbr.ca>
 
        * Fixed bug #13651: htmlArea RTE: Table insertion is broken in IE8
index a0fd544..455479e 100644 (file)
  * TYPO3 SVN ID: $Id$
  */
 CharacterMap = HTMLArea.Plugin.extend({
-
        constructor : function(editor, pluginName) {
                this.base(editor, pluginName);
        },
-
        /*
         * This function gets called by the class constructor
         */
        configurePlugin : function(editor) {
-
                /*
                 * Registering plugin "About" information
                 */
                var pluginInformation = {
-                       version         : "1.3",
-                       developer       : "Holger Hees, Bernhard Pfeifer, Stanislas Rolland",
-                       developerUrl    : "http://www.fructifor.ca/",
-                       copyrightOwner  : "Holger Hees, Bernhard Pfeifer, Stanislas Rolland",
-                       sponsor         : "System Concept GmbH, Bernhard Pfeifer, Fructifor Inc.",
-                       sponsorUrl      : "http://www.fructifor.ca/",
-                       license         : "GPL"
+                       version         : '2.0',
+                       developer       : 'Holger Hees, Bernhard Pfeifer, Stanislas Rolland',
+                       developerUrl    : 'http://www.sjbr.ca/',
+                       copyrightOwner  : 'Holger Hees, Bernhard Pfeifer, Stanislas Rolland',
+                       sponsor         : 'System Concept GmbH, Bernhard Pfeifer, SJBR',
+                       sponsorUrl      : 'http://www.sjbr.ca/',
+                       license         : 'GPL'
                };
                this.registerPluginInformation(pluginInformation);
-
                /*
                 * Registering the button
                 */
-               var buttonId = "InsertCharacter";
+               var buttonId = 'InsertCharacter';
                var buttonConfiguration = {
                        id              : buttonId,
-                       tooltip         : this.localize(buttonId + "-Tooltip"),
-                       action          : "onButtonPress",
+                       tooltip         : this.localize(buttonId + '-Tooltip'),
+                       action          : 'onButtonPress',
                        dialog          : true
                };
                this.registerButton(buttonConfiguration);
 
                return true;
         },
-
+       /*
+        * Character maps
+        */
+       maps: {
+               general: [
+                       ['&nbsp;', '&amp;nbsp;'],
+                       ['&Agrave;', '&amp;Agrave;'],
+                       ['&agrave;', '&amp;agrave;'],
+                       ['&Aacute;', '&amp;Aacute;'],
+                       ['&aacute;', '&amp;aacute;'],
+                       ['&Acirc;', '&amp;Acirc;'],
+                       ['&acirc;', '&amp;acirc;'],
+                       ['&Atilde;', '&amp;Atilde;'],
+                       ['&atilde;', '&amp;atilde;'],
+                       ['&Auml;', '&amp;Auml;'],
+                       ['&auml;', '&amp;auml;'],
+                       ['&Aring;', '&amp;Aring;'],
+                       ['&aring;', '&amp;aring;'],
+                       ['&AElig;', '&amp;AElig;'],
+                       ['&aelig;', '&amp;aelig;'],
+                       ['&ordf;', '&amp;ordf;'],
+                       ['&Ccedil;', '&amp;Ccedil;'],
+                       ['&ccedil;', '&amp;ccedil;'],
+                       ['&ETH;', '&amp;ETH;'],
+                       ['&eth;', '&amp;eth;'],
+                       ['&Egrave;', '&amp;Egrave;'],
+                       ['&egrave;', '&amp;egrave;'],
+                       ['&Eacute;', '&amp;Eacute;'],
+                       ['&eacute;', '&amp;eacute;'],
+                       ['&Ecirc;', '&amp;Ecirc;'],
+                       ['&ecirc;', '&amp;ecirc;'],
+                       ['&Euml;', '&amp;Euml;'],
+                       ['&euml;', '&amp;euml;'],
+                       ['&Igrave;', '&amp;Igrave;'],
+                       ['&igrave;', '&amp;igrave;'],
+                       ['&Iacute;', '&amp;Iacute;'],
+                       ['&iacute;', '&amp;iacute;'],
+                       ['&Icirc;', '&amp;Icirc;'],
+                       ['&icirc;', '&amp;icirc;'],
+                       ['&Iuml;', '&amp;Iuml;'],
+                       ['&iuml;', '&amp;iuml;'],
+                       ['&Ntilde;', '&amp;Ntilde;'],
+                       ['&ntilde;', '&amp;ntilde;'],
+                       ['&Ograve;', '&amp;Ograve;'],
+                       ['&ograve;', '&amp;ograve;'],
+                       ['&Oacute;', '&amp;Oacute;'],
+                       ['&oacute;', '&amp;oacute;'],
+                       ['&Ocirc;', '&amp;Ocirc;'],
+                       ['&ocirc;', '&amp;ocirc;'],
+                       ['&Otilde;', '&amp;Otilde;'],
+                       ['&otilde;', '&amp;otilde;'],
+                       ['&Ouml;', '&amp;Ouml;'],
+                       ['&ouml;', '&amp;ouml;'],
+                       ['&Oslash;', '&amp;Oslash;'],
+                       ['&oslash;', '&amp;oslash;'],
+                       ['&OElig;', '&amp;OElig;'],
+                       ['&oelig;', '&amp;oelig;'],
+                       ['&ordm;', '&amp;ordm;'],
+                       ['&Scaron;', '&amp;Scaron;'],
+                       ['&scaron;', '&amp;scaron;'],
+                       ['&szlig;', '&amp;szlig;'],
+                       ['&THORN;', '&amp;THORN;'],
+                       ['&thorn;', '&amp;thorn;'],
+                       ['&Ugrave;', '&amp;Ugrave;'],
+                       ['&ugrave;', '&amp;ugrave;'],
+                       ['&Uacute;', '&amp;Uacute;'],
+                       ['&uacute;', '&amp;uacute;'],
+                       ['&Ucirc;', '&amp;Ucirc;'],
+                       ['&ucirc;', '&amp;ucirc;'],
+                       ['&Uuml;', '&amp;Uuml;'],
+                       ['&uuml;', '&amp;uuml;'],
+                       ['&Yacute;', '&amp;Yacute;'],
+                       ['&yacute;', '&amp;yacute;'],
+                       ['&Yuml;', '&amp;Yuml;'],
+                       ['&yuml;', '&amp;yuml;'],
+                       ['&acute;', '&amp;acute;'],
+                       ['&circ;', '&amp;circ;'],
+                       ['&tilde;', '&amp;tilde;'],
+                       ['&uml;', '&amp;uml;'],
+                       ['&cedil;', '&amp;cedil;'],
+                       ['&ndash;', '&amp;ndash;'],
+                       ['&mdash;', '&amp;mdash;'],
+                       ['&lsquo;', '&amp;lsquo;'],
+                       ['&rsquo;', '&amp;rsquo;'],
+                       ['&sbquo;', '&amp;sbquo;'],
+                       ['&ldquo;', '&amp;ldquo;'],
+                       ['&rdquo;', '&amp;rdquo;'],
+                       ['&bdquo;', '&amp;bdquo;'],
+                       ['&lsaquo;', '&amp;lsaquo;'],
+                       ['&rsaquo;', '&amp;rsaquo;'],
+                       ['&laquo;', '&amp;laquo;'],
+                       ['&raquo;', '&amp;raquo;'],
+                       ['&quot;', '&amp;quot;'],
+                       ['&hellip;', '&amp;hellip;'],
+                       ['&iquest;', '&amp;iquest;'],
+                       ['&iexcl;', '&amp;iexcl;'],
+                       ['&bull;', '&amp;bull;'],
+                       ['&dagger;', '&amp;dagger;'],
+                       ['&Dagger;', '&amp;Dagger;'],
+                       ['&brvbar;', '&amp;brvbar;'],
+                       ['&para;', '&amp;para;'],
+                       ['&sect;', '&amp;sect;'],
+                       ['&loz;', '&amp;loz;'],
+                       ['&#064;', '&amp;#064;'],
+                       ['&copy;', '&amp;copy;'],
+                       ['&reg;', '&amp;reg;'],
+                       ['&trade;', '&amp;trade;'],
+                       ['&curren;', '&amp;curren;'],
+                       ['&cent;', '&amp;cent;'],
+                       ['&euro;', '&amp;euro;'],
+                       ['&pound;', '&amp;pound;'],
+                       ['&yen;', '&amp;yen;'],
+                       ['&emsp;', '&amp;emsp;'],
+                       ['&ensp;', '&amp;ensp;'],
+                       ['&thinsp;', '&amp;thinsp;'],
+                       ['&zwj;', '&amp;zwj;'],
+                       ['&zwnj;', '&amp;zwnj;']
+               ],
+               mathematical: [
+                       ['&minus;', '&amp;minus;'],
+                       ['&plusmn;', '&amp;plusmn;'],
+                       ['&times;', '&amp;times;'],
+                       ['&divide;', '&amp;divide;'],
+                       ['&radic;', '&amp;radic;'],
+                       ['&sdot;', '&amp;sdot;'],
+                       ['&otimes;', '&amp;otimes;'],
+                       ['&lowast;', '&amp;lowast;'],
+                       ['&ge;', '&amp;ge;'],
+                       ['&le;', '&amp;le;'],
+                       ['&ne;', '&amp;ne;'],
+                       ['&asymp;', '&amp;asymp;'],
+                       ['&sim;', '&amp;sim;'],
+                       ['&prop;', '&amp;prop;'],
+                       ['&deg;', '&amp;deg;'],
+                       ['&prime;', '&amp;prime;'],
+                       ['&Prime;', '&amp;Prime;'],
+                       ['&micro;', '&amp;micro;'],
+                       ['&ang;', '&amp;ang;'],
+                       ['&perp;', '&amp;perp;'],
+                       ['&permil;', '&amp;permil;'],
+                       ['&frasl;', '&amp;frasl;'],
+                       ['&frac14;', '&amp;frac14;'],
+                       ['&frac12;', '&amp;frac12;'],
+                       ['&frac34;', '&amp;frac34;'],
+                       ['&sup1;', '&amp;sup1;'],
+                       ['&sup2;', '&amp;sup2;'],
+                       ['&sup3;', '&amp;sup3;'],
+                       ['&not;', '&amp;not;'],
+                       ['&and;', '&amp;and;'],
+                       ['&or;', '&amp;or;'],
+                       ['&there4;', '&amp;there4;'],
+                       ['&cong;', '&amp;cong;'],
+                       ['&isin;', '&amp;isin;'],
+                       ['&ni;', '&amp;ni;'],
+                       ['&notin;', '&amp;notin;'],
+                       ['&sub;', '&amp;sub;'],
+                       ['&sube;', '&amp;sube;'],
+                       ['&nsub;', '&amp;nsub;'],
+                       ['&sup;', '&amp;sup;'],
+                       ['&supe;', '&amp;supe;'],
+                       ['&cap;', '&amp;cap;'],
+                       ['&cup;', '&amp;cup;'],
+                       ['&oplus;', '&amp;oplus;'],
+                       ['&nabla;', '&amp;nabla;'],
+                       ['&empty;', '&amp;empty;'],
+                       ['&equiv;', '&amp;equiv;'],
+                       ['&sum;', '&amp;sum;'],
+                       ['&prod;', '&amp;prod;'],
+                       ['&weierp;', '&amp;weierp;'],
+                       ['&exist;', '&amp;exist;'],
+                       ['&forall;', '&amp;forall;'],
+                       ['&infin;', '&amp;infin;'],
+                       ['&alefsym;', '&amp;alefsym;'],
+                       ['&real;', '&amp;real;'],
+                       ['&image;', '&amp;image;'],
+                       ['&fnof;', '&amp;fnof;'],
+                       ['&int;', '&amp;int;'],
+                       ['&part;', '&amp;part;'],
+                       ['&Alpha;', '&amp;Alpha;'],
+                       ['&alpha;', '&amp;alpha;'],
+                       ['&Beta;', '&amp;Beta;'],
+                       ['&beta;', '&amp;beta;'],
+                       ['&Gamma;', '&amp;Gamma;'],
+                       ['&gamma;', '&amp;gamma;'],
+                       ['&Delta;', '&amp;Delta;'],
+                       ['&delta;', '&amp;delta;'],
+                       ['&Epsilon;', '&amp;Epsilon;'],
+                       ['&epsilon;', '&amp;epsilon;'],
+                       ['&Zeta;', '&amp;Zeta;'],
+                       ['&zeta;', '&amp;zeta;'],
+                       ['&Eta;', '&amp;Eta;'],
+                       ['&eta;', '&amp;eta;'],
+                       ['&Theta;', '&amp;Theta;'],
+                       ['&theta;', '&amp;theta;'],
+                       ['&thetasym;', '&amp;thetasym;'],
+                       ['&Iota;', '&amp;Iota;'],
+                       ['&iota;', '&amp;iota;'],
+                       ['&Kappa;', '&amp;Kappa;'],
+                       ['&kappa;', '&amp;kappa;'],
+                       ['&Lambda;', '&amp;Lambda;'],
+                       ['&lambda;', '&amp;lambda;'],
+                       ['&Mu;', '&amp;Mu;'],
+                       ['&mu;', '&amp;mu;'],
+                       ['&Nu;', '&amp;Nu;'],
+                       ['&nu;', '&amp;nu;'],
+                       ['&Xi;', '&amp;Xi;'],
+                       ['&xi;', '&amp;xi;'],
+                       ['&Omicron;', '&amp;Omicron;'],
+                       ['&omicron;', '&amp;omicron;'],
+                       ['&Pi;', '&amp;Pi;'],
+                       ['&pi;', '&amp;pi;'],
+                       ['&piv;', '&amp;piv;'],
+                       ['&Rho;', '&amp;Rho;'],
+                       ['&rho;', '&amp;rho;'],
+                       ['&Sigma;', '&amp;Sigma;'],
+                       ['&sigma;', '&amp;sigma;'],
+                       ['&sigmaf;', '&amp;sigmaf;'],
+                       ['&Tau;', '&amp;Tau;'],
+                       ['&tau;', '&amp;tau;'],
+                       ['&Upsilon;', '&amp;Upsilon;'],
+                       ['&upsih;', '&amp;upsih;'],
+                       ['&upsilon;', '&amp;upsilon;'],
+                       ['&Phi;', '&amp;Phi;'],
+                       ['&phi;', '&amp;phi;'],
+                       ['&Chi;', '&amp;Chi;'],
+                       ['&chi;', '&amp;chi;'],
+                       ['&Psi;', '&amp;Psi;'],
+                       ['&psi;', '&amp;psi;'],
+                       ['&Omega;', '&amp;Omega;'],
+                       ['&omega;', '&amp;omega;'],
+                       ['&nbsp;', '&amp;nbsp;']
+               ],
+               graphical: [
+                       ['&crarr;', '&amp;crarr;'],
+                       ['&uarr;', '&amp;uarr;'],
+                       ['&darr;', '&amp;darr;'],
+                       ['&larr;', '&amp;larr;'],
+                       ['&rarr;', '&amp;rarr;'],
+                       ['&harr;', '&amp;harr;'],
+                       ['&uArr;', '&amp;uArr;'],
+                       ['&dArr;', '&amp;dArr;'],
+                       ['&lArr;', '&amp;lArr;'],
+                       ['&rArr;', '&amp;rArr;'],
+                       ['&hArr;', '&amp;hArr;'],
+                       ['&nbsp;', '&amp;nbsp;'],
+                       ['&nbsp;', '&amp;nbsp;'],
+                       ['&nbsp;', '&amp;nbsp;'],
+                       ['&nbsp;', '&amp;nbsp;'],
+                       ['&nbsp;', '&amp;nbsp;'],
+                       ['&clubs;', '&amp;clubs;'],
+                       ['&diams;', '&amp;diams;'],
+                       ['&hearts;', '&amp;hearts;'],
+                       ['&spades;', '&amp;spades;']
+               ]
+       },
        /*
         * This function gets called when the button was pressed.
         *
@@ -81,36 +331,128 @@ CharacterMap = HTMLArea.Plugin.extend({
         *
         * @return      boolean         false if action is completed
         */
-       onButtonPress : function(editor, id) {
-               this.dialog = this.openDialog("InsertCharacter", this.makeUrlFromPopupName("select_character"), "insertCharacter", null, {width:485, height:330});
+       onButtonPress: function (editor, id) {
+                       // Could be a button or its hotkey
+               var buttonId = this.translateHotKey(id);
+               buttonId = buttonId ? buttonId : id;
+               this.openDialogue(
+                       buttonId,
+                       'Insert special character',
+                       this.getWindowDimensions({width:462, height:330}, buttonId),
+                       this.buildTabItems()
+               );
                return false;
        },
-
+       /*
+        * Open the dialogue window
+        *
+        * @param       string          buttonId: the button id
+        * @param       string          title: the window title
+        * @param       integer         dimensions: the opening width of the window
+        * @param       object          tabItems: the configuration of the tabbed panel
+        * @param       function        handler: handler when the OK button if clicked
+        *
+        * @return      void
+        */
+       openDialogue: function (buttonId, title, dimensions, tabItems, handler) {
+               this.dialog = new Ext.Window({
+                       title: this.localize(title),
+                       cls: 'htmlarea-window',
+                       border: false,
+                       width: dimensions.width,
+                       height: 'auto',
+                               // As of ExtJS 3.1, JS error with IE when the window is resizable
+                       resizable: !Ext.isIE,
+                       iconCls: buttonId,
+                       listeners: {
+                               close: {
+                                       fn: this.onClose,
+                                       scope: this
+                               }
+                       },
+                       items: {
+                               xtype: 'tabpanel',
+                               activeTab: 0,
+                               listeners: {
+                                       activate: {
+                                               fn: this.resetFocus,
+                                               scope: this
+                                       },
+                                       tabchange: {
+                                               fn: this.syncHeight,
+                                               scope: this
+                                       }
+                               },
+                               items: tabItems
+                       },
+                       buttons: [
+                               this.buildButtonConfig('Cancel', this.onCancel)
+                       ]
+               });
+               this.show();
+       },
+       /*
+        * Build the configuration of the the tab items
+        *
+        * @return      array   the configuration array of tab items
+        */
+       buildTabItems: function () {
+               var tabItems = [];
+               Ext.iterate(this.maps, function (id, map) {
+                       tabItems.push({
+                               xtype: 'box',
+                               cls: 'character-map',
+                               title: this.localize(id),
+                               itemId: id,
+                               tpl: new Ext.XTemplate(
+                                       '<tpl for="."><a href="#" title="{1}" class="character" hidefocus="on" ext:qtitle"{1}">{0}</a></tpl>'
+                               ),
+                               listeners: {
+                                       render: {
+                                               fn: this.renderMap,
+                                               scope: this
+                                       }
+                               }
+                       });
+               }, this);
+               return tabItems;
+       },
+       /*
+        * Render an array of characters
+        *
+        * @param       object          component: the box containing the characters
+        *
+        * @return      void
+        */
+       renderMap: function (component) {
+               component.tpl.overwrite(component.el, this.maps[component.itemId]);
+               component.mon(component.el, 'click', this.insertCharacter, this, {delegate: 'a'});
+       },
        /*
         * Insert the selected entity
         *
-        * @param       object          entity: the chosen entity
+        * @param       object          event: the Ext event
+        * @param       HTMLelement     target: the html element target
         *
-        * @return      boolean         false
+        * @return      void
         */
-       insertCharacter : function(entity) {
-               if (typeof(entity) != "undefined") {
+       insertCharacter: function (event, target) {
+               this.editor.focus();
+               this.restoreSelection();
+               var entity = Ext.get(target).dom.innerHTML;
+               if (Ext.isIE) {
                        this.editor.insertHTML(entity);
-                       this.dialog.focus();
+                       this.saveSelection();
+               } else {
+                       this.editor.insertNodeAtSelection(this.editor.document.createTextNode(entity));
                }
-               return false;
        },
-
        /*
-        * This function gets called when the toolbar is updated
+        * Reset focus on the the current selection, if at all possible
         *
-        * @return      void
         */
-       onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
-                       // Reclaim focus
-               if (this.dialog) {
-                       this.dialog.focus();
-               }
+       resetFocus: function () {
+               this.editor.focus();
+               this.restoreSelection();
        }
 });
-
index a8fa3e5..f4a2c18 100644 (file)
@@ -9,6 +9,9 @@
                        <label index="CharacterMapTooltip">Insert special character</label>
                        <label index="InsertCharacter-Tooltip">Insert special character</label>
                        <label index="Insert special character">Insert special character</label>
+                       <label index="general">General</label>
+                       <label index="mathematical">Mathematical</label>
+                       <label index="graphical">Shapes and arrows</label>
                        <label index="HTML value:">HTML value:</label>
                        <label index="Close">Close</label>
                </languageKey>
diff --git a/typo3/sysext/rtehtmlarea/htmlarea/plugins/CharacterMap/popups/select_character.html b/typo3/sysext/rtehtmlarea/htmlarea/plugins/CharacterMap/popups/select_character.html
deleted file mode 100644 (file)
index ba86777..0000000
+++ /dev/null
@@ -1,240 +0,0 @@
-<!DOCTYPE html
-     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html>
-<!--
-/***************************************************************
-*  Copyright notice
-*
-*  (c) 2004 Bernhard Pfeifer novocaine@gmx.net
-*  (c) 2004 systemconcept.de. Authored by Holger Hees based on HTMLArea XTD 1.5 (http://mosforge.net/projects/htmlarea3xtd/).
-*  (c) 2005-2008 Stanislas Rolland <typo3(arobas)sjbr.ca>
-*  All rights reserved
-*
-*  This script is part of the TYPO3 project. The TYPO3 project is
-*  free software; you can redistribute it and/or modify
-*  it under the terms of the GNU General Public License as published by
-*  the Free Software Foundation; either version 2 of the License, or
-*  (at your option) any later version.
-*
-*  The GNU General Public License can be found at
-*  http://www.gnu.org/copyleft/gpl.html.
-*  A copy is found in the textfile GPL.txt and important notices to the license
-*  from the author is found in LICENSE.txt distributed with these scripts.
-*
-*
-*  This script is distributed in the hope that it will be useful,
-*  but WITHOUT ANY WARRANTY; without even the implied warranty of
-*  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-*  GNU General Public License for more details.
-*
-*  This script is a modified version of a script published under the htmlArea License.
-*  A copy of the htmlArea License may be found in the textfile HTMLAREA_LICENSE.txt.
-*
-*  This copyright notice MUST APPEAR in all copies of the script!
-***************************************************************/
-/*
- * Character Map Plugin for TYPO3 htmlArea RTE
- *
- * TYPO3 SVN ID: $Id$
- */
--->
-<head>
-       <title>Insert special character</title>
-       <meta http-equiv="Content-Style-Type" content="text/css" />
-       <script type="text/javascript">
-               /*<![CDATA[*/
-               <!--
-               var dialog = window.opener.HTMLArea.Dialog.CharacterMap;
-               function Init() {
-                       dialog.initialize();
-                       var character = '';
-                       View(null, character);
-                       return false;
-               };
-
-               var oldView = null;
-               function View(td, character) {
-                       if (oldView) {
-                               oldView.className = oldView.className.replace(/\s+character-hilite/, '');
-                       }
-                       document.getElementById("characterPreview").value = character;
-                       document.getElementById("showCharacter").value = character;
-                       if (td) {
-                               oldView = td;
-                               oldView.className += " character-hilite";
-                       }
-               };
-
-               function Set(string) {
-                       var character = string;
-                       dialog.performAction(character);
-                       return false;
-               };
-
-               function onCancel() {
-                       dialog.close();
-                       return false;
-               };
-               // -->
-               /*]]>*/
-       </script>
-</head>
-<body class="popupwin htmlarea-character-map" onload="Init();">
-<div id="content">
-<div class="title">Insert special character</div>
-<form method="get" onSubmit="Set(document.getElementById('showCharacter').value); return false;">
-       <div id="selectedCharacter">HTML value:<div id="characterPreview"></div>&nbsp;<input type="text" name="showcharacter" id="showCharacter" value="" size="15" /></div>
-       <table cellspacing="0" cellpadding="3">
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;nbsp;')" onClick="Set('&nbsp;')">&nbsp;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Agrave;')" onClick="Set('&Agrave;')">&Agrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;agrave;')" onClick="Set('&agrave;')">&agrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Aacute;')" onClick="Set('&Aacute;')">&Aacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;aacute;')" onClick="Set('&aacute;')">&aacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Acirc;')" onClick="Set('&Acirc;')">&Acirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;acirc;')" onClick="Set('&acirc;')">&acirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Atilde;')" onClick="Set('&Atilde;')">&Atilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;atilde;')" onClick="Set('&atilde;')">&atilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Auml;')" onClick="Set('&Auml;')">&Auml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;auml;')" onClick="Set('&auml;')">&auml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Aring;')" onClick="Set('&Aring;')">&Aring;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;aring;')" onClick="Set('&aring;')">&aring;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;AElig;')" onClick="Set('&AElig;')">&AElig;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;aelig;')" onClick="Set('&aelig;')">&aelig;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ordf;')" onClick="Set('&ordf;')">&ordf;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;Ccedil;')" onClick="Set('&Ccedil;')">&Ccedil;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ccedil;')" onClick="Set('&ccedil;')">&ccedil;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ETH;')" onClick="Set('&ETH;')">&ETH;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;eth;')" onClick="Set('&eth;')">&eth;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Egrave;')" onClick="Set('&Egrave;')">&Egrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;egrave;')" onClick="Set('&egrave;')">&egrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Eacute;')" onClick="Set('&Eacute;')">&Eacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;eacute;')" onClick="Set('&eacute;')">&eacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ecirc;')" onClick="Set('&Ecirc;')">&Ecirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ecirc;')" onClick="Set('&ecirc;')">&ecirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Euml;')" onClick="Set('&Euml;')">&Euml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;euml;')" onClick="Set('&euml;')">&euml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Igrave;')" onClick="Set('&Igrave;')">&Igrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;igrave;')" onClick="Set('&igrave;')">&igrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Iacute;')" onClick="Set('&Iacute;')">&Iacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;iacute;')" onClick="Set('&iacute;')">&iacute;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;Icirc;')" onClick="Set('&Icirc;')">&Icirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;icirc;')" onClick="Set('&icirc;')">&icirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Iuml;')" onClick="Set('&Iuml;')">&Iuml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;iuml;')" onClick="Set('&iuml;')">&iuml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ntilde;')" onClick="Set('&Ntilde;')">&Ntilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ntilde;')" onClick="Set('&ntilde;')">&ntilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ograve;')" onClick="Set('&Ograve;')">&Ograve;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ograve;')" onClick="Set('&ograve;')">&ograve;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Oacute;')" onClick="Set('&Oacute;')">&Oacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;oacute;')" onClick="Set('&oacute;')">&oacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ocirc;')" onClick="Set('&Ocirc;')">&Ocirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ocirc;')" onClick="Set('&ocirc;')">&ocirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Otilde;')" onClick="Set('&Otilde;')">&Otilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;otilde;')" onClick="Set('&otilde;')">&otilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ouml;')" onClick="Set('&Ouml;')">&Ouml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ouml;')" onClick="Set('&ouml;')">&ouml;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;Oslash;')" onClick="Set('&Oslash;')">&Oslash;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;oslash;')" onClick="Set('&oslash;')">&oslash;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;OElig;')" onClick="Set('&OElig;')">&OElig;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;oelig;')" onClick="Set('&oelig;')">&oelig;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ordm;')" onClick="Set('&ordm;')">&ordm;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Scaron;')" onClick="Set('&Scaron;')">&Scaron;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;scaron;')" onClick="Set('&scaron;')">&scaron;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;szlig;')" onClick="Set('&szlig;')">&szlig;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;THORN;')" onClick="Set('&THORN;')">&THORN;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;thorn;')" onClick="Set('&thorn;')">&thorn;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ugrave;')" onClick="Set('&Ugrave;')">&Ugrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ugrave;')" onClick="Set('&ugrave;')">&ugrave;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Uacute;')" onClick="Set('&Uacute;')">&Uacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;uacute;')" onClick="Set('&uacute;')">&uacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Ucirc;')" onClick="Set('&Ucirc;')">&Ucirc;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ucirc;')" onClick="Set('&ucirc;')">&ucirc;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;Uuml;')" onClick="Set('&Uuml;')">&Uuml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;uuml;')" onClick="Set('&uuml;')">&uuml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Yacute;')" onClick="Set('&Yacute;')">&Yacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;yacute;')" onClick="Set('&yacute;')">&yacute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Yuml;')" onClick="Set('&Yuml;')">&Yuml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;yuml;')" onClick="Set('&yuml;')">&yuml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;acute;')" onClick="Set('&acute;')">&acute;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;circ;')" onClick="Set('&circ;')">&circ;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;tilde;')" onClick="Set('&tilde;')">&tilde;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;uml;')" onClick="Set('&uml;')">&uml;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;cedil;')" onClick="Set('&cedil;')">&cedil;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;ndash;')" onClick="Set('&ndash;')">&ndash;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;mdash;')" onClick="Set('&mdash;')">&mdash;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;lsquo;')" onClick="Set('&lsquo;')">&lsquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;rsquo;')" onClick="Set('&rsquo;')">&rsquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;sbquo;')" onClick="Set('&sbquo;')">&sbquo;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;ldquo;')" onClick="Set('&ldquo;')">&ldquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;rdquo;')" onClick="Set('&rdquo;')">&rdquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;bdquo;')" onClick="Set('&bdquo;')">&bdquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;lsaquo;')" onClick="Set('&lsaquo;')">&lsaquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;rsaquo;')" onClick="Set('&rsaquo;')">&rsaquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;laquo;')" onClick="Set('&laquo;')">&laquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;raquo;')" onClick="Set('&raquo;')">&raquo;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;quot;')" onClick="Set('&quot;')">&quot;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;hellip;')" onClick="Set('&hellip;')">&hellip;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;iquest;')" onClick="Set('&iquest;')">&iquest;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;iexcl;')" onClick="Set('&iexcl;')">&iexcl;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;bull;')" onClick="Set('&bull;')">&bull;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;dagger;')" onClick="Set('&dagger;')">&dagger;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Dagger;')" onClick="Set('&Dagger;')">&Dagger;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;para;')" onClick="Set('&para;')">&para;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;sect;')" onClick="Set('&sect;')">&sect;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;#064;')" onClick="Set('&#064;')">@</td>
-                       <td class="character" onMouseOver="View(this,'&amp;copy;')" onClick="Set('&copy;')">&copy;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;reg;')" onClick="Set('&reg;')">&reg;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;trade;')" onClick="Set('&trade;')">&trade;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;curren;')" onClick="Set('&curren;')">&curren;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;cent;')" onClick="Set('&cent;')">&cent;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;euro;')" onClick="Set('&euro;')">&euro;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;pound;')" onClick="Set('&pound;')">&pound;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;yen;')" onClick="Set('&yen;')">&yen;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;plusmn;')" onClick="Set('&plusmn;')">&plusmn;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;times;')" onClick="Set('&times;')">&times;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;divide;')" onClick="Set('&divide;')">&divide;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;permil;')" onClick="Set('&permil;')">&permil;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;frac14;')" onClick="Set('&frac14;')">&frac14;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;frac12;')" onClick="Set('&frac12;')">&frac12;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;frac34;')" onClick="Set('&frac34;')">&frac34;</td>
-               </tr>
-               <tr>
-                       <td class="character" onMouseOver="View(this,'&amp;deg;')" onClick="Set('&deg;')">&deg;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;sup1;')" onClick="Set('&sup1;')">&sup1;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;sup2;')" onClick="Set('&sup2;')">&sup2;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;sup3;')" onClick="Set('&sup3;')">&sup3;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;fnof;')" onClick="Set('&fnof;')">&fnof;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;not;')" onClick="Set('&not;')">&not;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;and;')" onClick="Set('&and;')">&and;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;or;')" onClick="Set('&or;')">&or;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;alpha;')" onClick="Set('&alpha;')">&alpha;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;beta;')" onClick="Set('&beta;')">&beta;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;gamma;')" onClick="Set('&gamma;')">&gamma;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;delta;')" onClick="Set('&delta;')">&delta;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;micro;')" onClick="Set('&micro;')">&micro;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;pi;')" onClick="Set('&pi;')">&pi;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;Omega;')" onClick="Set('&Omega;')">&Omega;</td>
-                       <td class="character" onMouseOver="View(this,'&amp;nbsp;')" onClick="Set('&nbsp;')">&nbsp;</td>
-               </tr>
-       </table>
-       <div class="buttons">
-               <button type="button" name="cancel" onclick="return onCancel();">Close</button>
-       </div>
-</form>
-</div>
-</body>
-</html>
index c535013..87ff24b 100644 (file)
        width: 150px;
 }
 .htmlarea-window .emoticon {
-    display: block;
-    float: left;
-    padding: 5px;
-    width: 20px;
-    height: 20px;
-    vertical-align: middle;
+       display: block;
+       float: left;
+       padding: 5px;
+       width: 20px;
+       height: 20px;
+       vertical-align: middle;
 }
 /* Selectors for the FindReplace dialogue */
 .htmlarea-find-replace .long-label {
        width:30em;
 }
 /* Selectors for the CharacterMap dialogue */
-.htmlarea-character-map #selectedCharacter {
-       margin:5px 5px 10px 5px;
-       white-space:nowrap;
-}
-.htmlarea-character-map #selectedCharacter div {
-       display:inline;
-}
-.htmlarea-character-map #showcharacter {
-       background-color:#FFF;
-}
-.htmlarea-character-map table {
-       cursor:pointer;
-       background-color:#ADAD9C;
-       border:1px inset;
-}
-.htmlarea-character-map td.character {
-       font-size:14px;font-weight:bold;
-       text-align:center;
-       background-color:#FFF;
-}
-.htmlarea-character-map td.character-hilite {
-       background-color:Highlight;color:HighlightText;
+.htmlarea-window .character-map .character {
+       display: block;
+       float: left;
+       width: 20px;
+       font-size: 14px;
+       font-weight: bold;
+       text-align: center;
+       padding: 5px 3px;
+       border: 1px solid transparent;
+}
+.htmlarea-window .character-map .character:hover {
+       background-color: #FFFFFF;
+       border: 1px solid #A2AAB8;
 }
 /* Selectors for the SpellChecker dialogue */
 .htmlarea-spell-check .dictionaries {
index 8ab980b..98bbb40 100644 (file)
        width: 150px;
 }
 .htmlarea-window .emoticon {
-    display: block;
-    float: left;
-    padding: 5px;
-    width: 20px;
-    height: 20px;
-    vertical-align: middle;
+       display: block;
+       float: left;
+       padding: 5px;
+       width: 20px;
+       height: 20px;
+       vertical-align: middle;
 }
 /* Selectors for the FindReplace dialogue */
 .htmlarea-find-replace .long-label {
        width:30em;
 }
 /* Selectors for the CharacterMap dialogue */
-.htmlarea-character-map #selectedCharacter {
-       margin:5px 5px 10px 5px;
-       white-space:nowrap;
-}
-.htmlarea-character-map #selectedCharacter div {
-       display:inline;
-}
-.htmlarea-character-map #showcharacter {
-       background-color:#FFF;
-}
-.htmlarea-character-map table {
-       cursor:pointer;
-       background-color:#ADAD9C;
-       border:1px inset;
-}
-.htmlarea-character-map td.character {
-       font-size:14px;font-weight:bold;
-       text-align:center;
-       background-color:#FFF;
+.htmlarea-window .character-map .character {
+       display: block;
+       float: left;
+       width: 20px;
+       font-size: 14px;
+       font-weight: bold;
+       text-align: center;
+       padding: 5px 3px;
+       border: 1px solid transparent;
 }
-.htmlarea-character-map td.character-hilite {
-       background-color:Highlight;color:HighlightText;
+.htmlarea-window .character-map .character:hover {
+       background-color: #FFFFFF;
+       border: 1px solid #A2AAB8;
 }
 /* Selectors for the SpellChecker dialogue */
 .htmlarea-spell-check .dictionaries {