Index: typo3/sysext/rtehtmlarea/htmlarea/locallang_dialogs.xml
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/locallang_dialogs.xml	(révision 7092)
+++ typo3/sysext/rtehtmlarea/htmlarea/locallang_dialogs.xml	(copie de travail)
@@ -87,6 +87,7 @@
 			<label index="About HTMLArea">About htmlArea RTE</label>
 			<label index="About">About</label>
 			<label index="free_editor">A free and open-source editor for &lt;textarea&gt; fields, featuring integration with TYPO3.</label>
+			<label index="Browser support">Browser support</label>
 			<label index="Mozilla_or_IE">For Firefox 1.5+, SeaMonkey 1.0+, Safari 3.0.4+, Google Chrome 1.0+ and Opera 9.62+ on any platform, and for Internet Explorer 6.0+ on Windows.</label>
 			<label index="product_documentation">For more information, please visit:</label>
 			<label index="All rights reserved.">All Rights Reserved.</label>
Index: typo3/sysext/rtehtmlarea/htmlarea/plugins/AboutEditor/about-editor.js
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/plugins/AboutEditor/about-editor.js	(révision 7092)
+++ typo3/sysext/rtehtmlarea/htmlarea/plugins/AboutEditor/about-editor.js	(copie de travail)
@@ -1,7 +1,7 @@
 /***************************************************************
 *  Copyright notice
 *
-*  (c) 2008-2009 Stanislas Rolland <stanislas.rolland(arobas)fructifor.ca>
+*  (c) 2008-2010 Stanislas Rolland <typo3(arobas)sjbr.ca>
 *  All rights reserved
 *
 *  This script is part of the TYPO3 project. The TYPO3 project is
@@ -27,52 +27,57 @@
 *  This copyright notice MUST APPEAR in all copies of the script!
 ***************************************************************/
 /*
- * Character Map Plugin for TYPO3 htmlArea RTE
+ * About Plugin for TYPO3 htmlArea RTE
  *
  * TYPO3 SVN ID: $Id$
  */
 AboutEditor = HTMLArea.Plugin.extend({
-
-	constructor : function(editor, pluginName) {
+	constructor: function(editor, pluginName) {
 		this.base(editor, pluginName);
 	},
-
 	/*
 	 * This function gets called by the class constructor
 	 */
-	configurePlugin : function(editor) {
-
+	configurePlugin: function(editor) {
 		/*
 		 * Registering plugin "About" information
 		 */
 		var pluginInformation = {
-			version		: "1.0",
-			developer	: "Stanislas Rolland",
-			developerUrl	: "http://www.fructifor.ca/",
-			copyrightOwner	: "Stanislas Rolland",
-			sponsor		: "Fructifor Inc.",
-			sponsorUrl	: "http://www.fructifor.ca/",
-			license		: "GPL"
+			version		: '2.0',
+			developer	: 'Stanislas Rolland',
+			developerUrl	: 'http://www.sjbr.ca/',
+			copyrightOwner	: 'Stanislas Rolland',
+			sponsor		: 'SJBR',
+			sponsorUrl	: 'http://www.sjbr.ca/',
+			license		: 'GPL'
 		};
 		this.registerPluginInformation(pluginInformation);
-
 		/*
 		 * Registering the button
 		 */
-		var buttonId = "About";
+		var buttonId = 'About';
 		var buttonConfiguration = {
 			id		: buttonId,
 			tooltip		: this.localize(buttonId.toLowerCase()),
-			action		: "onButtonPress",
+			action		: 'onButtonPress',
 			textMode	: true,
 			dialog		: true
 		};
 		this.registerButton(buttonConfiguration);
-
 		return true;
 	 },
-
 	/*
+	 * Supported browsers
+	 */
+	browsers: [
+	 	 'Firefox 1.5+',
+	 	 'Google Chrome 1.0+',
+	 	 'Internet Explorer 6.0+',
+	 	 'Opera 9.62+',
+	 	 'Safari 3.0.4+',
+	 	 'SeaMonkey 1.0+'
+	],
+	/*
 	 * This function gets called when the button was pressed.
 	 *
 	 * @param	object		editor: the editor instance
@@ -80,14 +85,140 @@
 	 *
 	 * @return	boolean		false if action is completed
 	 */
-	onButtonPress : function(editor, id) {
-
-					// Could be a button or its hotkey
+	onButtonPress: function (editor, id) {
+			// Could be a button or its hotkey
 		var buttonId = this.translateHotKey(id);
 		buttonId = buttonId ? buttonId : id;
-
-		this.dialog = this.openDialog("About", this.makeUrlFromPopupName("about"), null, null, {width:475, height:350});
+		this.openDialogue(
+			buttonId,
+			'About HTMLArea',
+			this.getWindowDimensions({width:450, height:350}, 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
+	 *
+	 * @return	void
+	 */
+	openDialogue: function (buttonId, title, dimensions, tabItems) {
+		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('Close', this.onCancel)
+			]
+		});
+		this.show();
+	},
+	/*
+	 * Build the configuration of the the tab items
+	 *
+	 * @return	array	the configuration array of tab items
+	 */
+	buildTabItems: function () {
+		var tabItems = [];
+			// About tab
+		tabItems.push({
+			xtype: 'panel',
+			cls: 'about',
+			title: this.localize('About'),
+			html: '<h1 id="version">htmlArea RTE ' +  RTEarea[0].version + '</h1>'
+				+ '<p>' + this.localize('free_editor').replace('<', '&lt;').replace('>', '&gt;') + '</p>'
+				+ '<p><br />' + this.localize('Browser support') + ': ' + this.browsers.join(', ') + '.</p>'
+				+ '<p><br />' + this.localize('product_documentation') + '&nbsp;<a href="http://typo3.org/extensions/repository/view/rtehtmlarea_manual/current/">typo3.org</a></p>'
+				+ '<p style="text-align: center;">'
+					+ '<br />'
+					+ '&copy; 2002-2004 <a href="http://interactivetools.com" target="_blank">interactivetools.com, inc.</a><br />'
+					+ '&copy; 2003-2004 <a href="http://dynarch.com" target="_blank">dynarch.com LLC.</a><br />'
+					+ '&copy; 2004-2010 <a href="http://www.sjbr.ca" target="_blank">Stanislas Rolland</a><br />'
+					+ this.localize('All rights reserved.')
+				+ '</p>'
+		});
+			// Plugins tab
+		if (!this.store) {
+			this.store = new Ext.data.ArrayStore({
+				fields: [{ name: 'name'}, { name: 'developer'},  { name: 'sponsor'}],
+				sortInfo: {
+					field: 'name',
+					direction: 'ASC'
+				},
+				data: this.getPluginsInfo()
+			});
+		}
+		tabItems.push({
+			xtype: 'panel',
+			cls: 'about-plugins',
+			height: 200,
+			title: this.localize('Plugins'),
+			autoScroll: true,
+			items: {
+				xtype: 'listview',
+				store: this.store,
+				reserveScrollOffset: true,
+				columns: [{
+					header: this.localize('Name'),
+					dataIndex: 'name',
+					width: .33
+				    },{
+					header: this.localize('Developer'),
+					dataIndex: 'developer',
+					width: .33
+				    },{
+					header: this.localize('Sponsored by'),
+					dataIndex: 'sponsor'
+				}]
+			}
+		});
+		return tabItems;
+	},
+	/*
+	 * Format an arry of information on each configured plugin
+	 *
+	 * @return	array		array of data objects
+	 */
+	getPluginsInfo: function () {
+		var pluginsInfo = [];
+		Ext.iterate(this.editor.plugins, function (pluginId, plugin) {
+			pluginsInfo.push([
+				plugin.name + ' ' + plugin.version,
+				'<a href="' + plugin.developer_url + '" target="_blank">' + plugin.developer + '</a>',
+				'<a href="' + plugin.sponsor_url + '" target="_blank">' + plugin.sponsor + '</a>'
+			]);
+		}, this);
+		return pluginsInfo;
 	}
 });
-
Index: typo3/sysext/rtehtmlarea/htmlarea/plugins/AboutEditor/popups/about.html
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/plugins/AboutEditor/popups/about.html	(révision 7092)
+++ typo3/sysext/rtehtmlarea/htmlarea/plugins/AboutEditor/popups/about.html	(copie de travail)
@@ -1,166 +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) 2002-2004 interactivetools.com, inc.
-*  (c) 2003-2004 dynarch.com
-*  (c) 2004-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!
-***************************************************************/
-/*
- * About window for TYPO3 htmlArea RTE
- *
- * TYPO3 SVN ID: $Id$
- */
- -->
-<head>
-	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-	<meta http-equiv="Content-Style-Type" content="text/css" />
-	<title>About HTMLArea</title>
-	<script type="text/javascript">
-		/*<![CDATA[*/
-		<!--
-		var HTMLArea = window.opener.HTMLArea;
-		var dialog = HTMLArea.Dialog.AboutEditor;
-
-		function Init() {
-			initDocument();
-			dialog.initialize();
-		}
-
-		var TABS = [];
-		var CURRENT_TAB = 0;
-
-		function selectTab(idx) {
-			var ct = TABS[CURRENT_TAB];
-			HTMLArea._removeClass(ct, "tab-current");
-			ct = TABS[CURRENT_TAB = idx];
-			HTMLArea._addClass(ct, "tab-current");
-			for (var i = TABS.length; --i >= 0;) {
-				var area = document.getElementById("tab-area-" + i);
-				if (CURRENT_TAB == i) area.style.display = "block";
-					else area.style.display = "none";
-			}
-			document.body.style.visibility = "hidden";
-			document.body.style.visibility = "visible";
-			document.cookie = "HTMLAREA-ABOUT-TAB=" + idx;
-		}
-
-		function initDocument() {
-			var editor = dialog.plugin.editor;
-			var version = document.getElementById("version");
-			version.innerHTML = "htmlArea RTE v " +  window.opener.RTEarea[0]["version"];
-			var plugins = document.getElementById("plugins");
-			var j = 0, i, info;
-			var html = "<table width='99%' cellpadding='0' style='border-collapse: collapse; border: 1px solid #8b8;'>" +
-				"<thead><tr>" +
-				"<td>Name</td>" +
-				"<td>Developer</td>" +
-				"<td>Sponsored by</td>" +
-				"</tr></thead><tbody>";
-			for (i in editor.plugins) {
-				info = editor.plugins[i];
-				html += "<tr><td>" + info.name + " v" + info.version + "</td>" +
-					"<td><a href='" + info.developer_url + "' target='_blank' >" +
-					info.developer + "</a></td>" +
-					"<td><a href='" + info.sponsor_url + "' target='_blank' >" +
-					info.sponsor + "</a></td>" +
-					"</tr>";
-				++j;
-			}
-
-			if (j) {
-				html += "</tbody></table>";
-				plugins.innerHTML = "<p><span>The following plugins have been loaded.</span></p>" + html;
-			} else {
-				plugins.innerHTML = "<p><span>No plugins have been loaded.</span></p>";
-			}
-			plugins.innerHTML += "<p><span>User agent reports:</span><br/>" + navigator.userAgent + "</p>";
-
-			var bar = document.getElementById("tabbar");
-			j = 0;
-			for (i = bar.firstChild; i; i = i.nextSibling) {
-				if(i.nodeType == 1) {
-					TABS.push(i);
-					i.__msh_tab = j;
-					i.onmousedown = function(ev) { selectTab(this.__msh_tab); HTMLArea._stopEvent(ev || window.event); };
-					var area = document.getElementById("tab-area-" + j);
-					if (/tab-current/.test(i.className)) {
-						CURRENT_TAB = j;
-						area.style.display = "block";
-					} else {
-						area.style.display = "none";
-					}
-					++j;
-				}
-			}
-			if (document.cookie.match(/HTMLAREA-ABOUT-TAB=([0-1]+)/)) selectTab(RegExp.$1);
-		}
-		function onCancel() {
-			dialog.close();
-			return false;
-		}
-		// -->
-		/*]]>*/
-	</script>
-</head>
-<body class="popupwin htmlarea-about" onload="Init();">
-<div id="content">
-	<div class="title" style="cursor: pointer;" onclick="window.open('http://typo3.org/extensions/repository/view/rtehtmlarea_manual/current/');">About HTMLArea</div>
-	<div style="overflow: auto; height: 250px;" id="tab-areas-content">
-		<div id="tab-areas">
-			<div id="tab-area-0">
-				<h1 id="version">htmlArea RTE v 1.1.3</h1>
-				<p><span>free_editor</span></p>
-				<p><span>Mozilla_or_IE</span></p>
-				<p><span>product_documentation</span>&nbsp;<a href="http://typo3.org/extensions/repository/view/rtehtmlarea_manual/current/">typo3.org</a></p>
-				<p style="text-align: center;">
-					<br />
-					&copy; 2002-2004 <a href="http://interactivetools.com" target="_blank">interactivetools.com, inc.</a><br />
-					&copy; 2003-2004 <a href="http://dynarch.com" target="_blank">dynarch.com LLC.</a><br />
-					&copy; 2004-2008 <a href="http://www.fructifor.ca" target="_blank">Stanislas Rolland</a><br />
-					<span>All rights reserved.</span>
-				</p>
-			</div>
-			<div id="tab-area-1">
-				<h1>Plugins</h1>
-				<div id="plugins"></div>
-			</div>
-		</div>
-	</div>
-	<div class="buttons">
-		<div id="tabbar">
-			<div class="tab tab-current">About</div>
-			<div class="tab">Plugins</div>
-		</div>
-		<button type="button" onclick="onCancel();">Close</button>
-	</div>
-</div>
-</body>
-</html>
\ No newline at end of file
Index: typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css	(révision 7092)
+++ typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css	(copie de travail)
@@ -431,6 +431,11 @@
 .popupwin input.shorter-value {
 	width:17em;
 }
+/* Selectors for the About dialogue */
+.htmlarea-window .about-plugins .x-list-body dt {
+    overflow: auto;
+    white-space: normal;
+}
 /* Selectors for the Default Image dialogue */
 .htmlarea-default-image #image, .htmlarea-default-image #alt {
 	white-space:nowrap;
Index: typo3/sysext/t3skin/rtehtmlarea/htmlarea.css
===================================================================
--- typo3/sysext/t3skin/rtehtmlarea/htmlarea.css	(révision 7092)
+++ typo3/sysext/t3skin/rtehtmlarea/htmlarea.css	(copie de travail)
@@ -438,6 +438,11 @@
 .popupwin input.shorter-value {
 	width:17em;
 }
+/* Selectors for the About dialogue */
+.htmlarea-window .about-plugins .x-list-body dt {
+    overflow: auto;
+    white-space: normal;
+}
 /* Selectors for the Default Image dialogue */
 .htmlarea-default-image #image, .htmlarea-default-image #alt {
 	white-space:nowrap;