[Plugin] EditArea
Tags: plugin, manager, editing, file management
Submitted:
Released:
Downloads: 237
License: LGPL
[Plugin] EditArea 0.5.0-beta
Works with the following Version(s): 0.9.5 | 0.9.6 | 0.9.6.1 | 0.9.6.2 | 0.9.6.3
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 through 8, Firefox 1.5 through 3, Chrome 1 & 2, Safari 3, 3.1, and 4, Opera 9 & 9.5, plus Camino 1.2. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
Updated! Check out the new Plugin configuration options
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey while EditArea is focused, and now Word Wrap is enabled by default!
Download
- editarea_plugin_v0.5.0_core_v0.8.0.0.zip (237 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
1. Install EditArea files:
Extract the downloaded archive and move the "edit_area" folder in to "assets/plugins/"
NOTE:
If needed, chmod 755 for folders and chmod 644 for *.*
2. Create a new plugin (or edit if already exists):
Title: EditArea
Description: 0.5.0 - Allows text formatting, search and replace and real-time syntax highlighting
Code : Copy the code from "assets/plugins/edit_area/editarea.plugin.tpl" that was inside the archive.
3. Copy and Paste ALL of the following into "Plugin configuration" on the Configuration tab:
&eadbg=Debug Enabled?;list;true,false;false &word_wrap=Word Wrap Enabled?;list;true,false;true &font_size=Font Size;list;8,9,10,11,12;9 &defaultHeight=Initialize editor height;list;300px,400px,500px,600px,700px;500px &min_height=Minimum editor height;list;200,300,400;400 &start_highlight=Initialize with highlighting enabled?;list;true,false;true &allow_toggle=Allow editor toggling?;list;true,false;true &allow_resize=Allow editor resizing?;list;y,n;y &fullscreen=Initialize editor in fullscreen mode?;list;true,false;false &replace_tab_with_spaces=Replace tab with spaces?;list;// No,/* Yes */;/* Yes */ &tab_as_spaces=How many spaces per tab?;list;3,4,5;4 &plugins=Active Plugins;string;modx &catchunload=Try/Catch on Unload?;list;yes,no;yes
3a. If you want to add support for the PHP compressor, you need to append this to the "Plugin configuration":
&compressor=PHP Compressor Enabled?;list;0,1;0
4. Select one or more system events from this list on the System Events tab:
OnChunkFormRender (chunk editor - html highlighting)
OnDocFormRender (Document editor if you are not using an RTE - html highlighting)
OnModFormRender (module editor - php highlighting)
OnPluginFormRender (plugin editor - php highlighting)
OnSnipFormRender (Snippet editor - php highlighting)
OnTempFormRender (template editor - html highlighting)
EditArea Plugin Code:
Open "assets/plugins/edit_area/editarea.plugin.tpl" from the download (don't forget the README!)
NOTES:
- 0.5.0 Introduces Word Wrap support, improved cross-browser support, code size reduction, and new licensing options, not to mention various bug fixes
- This plugin utilizes "Plugin Configuration Parameters." Please ensure that you accurately Copy & Paste the parameters from the README.txt Installation section for this Plugin to work correctly. Have fun, and Enjoy!Updatespixelchutes - 0.5.0 - 4/11/2009 Updated edit_area core files to the complete 0.8.0.0 package (0.8.0 branch => 0.5.0), including documentation and examples
pixelchutes - 0.5.0 - 4/11/2009 Enabled Word Wrap support (by default)
pixelchutes - 0.5.0 - 4/11/2009 Confirmed new highlight functionality for Mac/Win Firefox (Improved contrast for text selections)
pixelchutes - 0.5.0 - 4/11/2009 Updated documentation, bugs, and history files to prepare for repository release.
From C.Dolivet's EditArea Changelog
**** v 0.8 ****
- Word-wrap is now supported (except for opera...). The new init() option is 'word_wrap' to set to 'true' (default is false). A new button appears in the default toolbar (button_code: 'word_wrap' )
- We can now clearly see the selected text
- Add Internet explorer 8 support (but sadly I must use IE7 emulate mode in iframe due to a bug with tabulation width not beeing resized in IE's textarea)
- Add Safari 4 support
- Add Chrome 2 support
- Better support of Opera 9.6
- Add Simplified Chinese translation "zh" (thanks to Abentian)
- Add Bulgariane translation "bg" (thanks to Valentin Hristov)
- Rename internal function $() by _$()
- Delete EditArea.add_event() method (duplicate af editAreaLoader.add_event() method)
- Do some code cleanup-up
- Bug fix: highlight optimisation process was not working under IE (don't known how long it remain broken but must be since a long time)
- Bug fix: EditArea.update_size sometimes uses undefined variable (fix this possibility and cleanup events)
- Bug fix: Template.html was not valid XHTML
- Bug fix: The checked attribute of the toogle button was not defined in xhtml syntax
- Bug fix: If the editArea was loaded on a page related to a domain which was itself an iframe comming from another domain a JS error was thrown on load
- Bug fix: When EditArea is used to replace a textarea which has style="visibility:hidden;", switching off EditArea would throw an error under IE
Sub-Packages
Previous Releases
0.4.0 - EditArea v0.7.1.3
Votes: 38
Tags: plugin, manager, editing, file management
Submitted: Dec 12, 2007
Released: Dec 12, 2007
Downloads: 2478
License: LGPL
Package Website
[Plugin] EditArea 0.4.0 - EditArea v0.7.1.3
Works with the following Version(s): 0.9.5 | 0.9.6
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1735.zip (2478 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
1. Upload EditArea:
Upload /assets/plugins/edit_area
NOTE:
If needed, chmod 755 for folders and chmod 644 for *.*
2. Create a new plugin (or edit if already exists):
Title: EditArea
Description: <strong>0.4.0</strong> - Allows text formatting, search and replace and real-time syntax highlighting
3. Copy and Paste ALL of the following into "Plugin configuration" on the Configuration tab:
&eadbg=Debug Enabled?;list;true,false;false &font_size=Font Size;list;8,9,10,11,12;9 &defaultHeight=Initialize editor height;list;300px,400px,500px,600px,700px;500px &min_height=Minimum editor height;list;200,300,400;400 &start_highlight=Initialize with highlighting enabled?;list;true,false;true &allow_toggle=Allow editor toggling?;list;true,false;true &allow_resize=Allow editor resizing?;list;y,n;y &fullscreen=Initialize editor in fullscreen mode?;list;true,false;false &replace_tab_with_spaces=Replace tab with spaces?;list;// No,/* Yes */;/* Yes */ &tab_as_spaces=How many spaces per tab?;list;3,4,5;4 &plugins=Active Plugins;string;modx &catchunload=Try/Catch on Unload?;list;yes,no;yes
3a. If you want to add support for the PHP compressor, you need to append this to the "Plugin configuration":
&compressor=PHP Compressor Enabled?;list;0,1;0
4. Select one or more system events from this list on the System Events tab:
OnChunkFormRender (chunk editor - html highlighting)
OnDocFormRender (Document editor if you are not using an RTE - html highlighting)
OnModFormRender (module editor - php highlighting)
OnPluginFormRender (plugin editor - php highlighting)
OnSnipFormRender (Snippet editor - php highlighting)
OnTempFormRender (template editor - html highlighting)
EditArea Plugin Code:
Open "editarea.plugin.php" from the download (don't forget the README!)
NOTES:
- 0.4.0 Introduces better cross-browser support, code size reduction, and new licensing options, not to mention various bug fixes
- This plugin utilizes "Plugin Configuration Parameters." Please ensure that you accurately Copy & Paste the parameters from the README.txt Installation section for this Plugin to work correctly. Have fun, and Enjoy!Updates pixelchutes - 0.4.0 - 7/24/2008 Updated edit_area core files to the complete 0.7.1.3 package (0.7.1 branch => 0.4.0), including documentation and examples
pixelchutes - 0.4.0 - 7/24/2008 Updated documentation, bugs, and history files to prepare for repository release.
From C.Dolivet's EditArea Changelog
**** v 0.7.1.3 ****
- Fix a bug introduced in Firefox 3.0.1 => the browser is no more able to render properly "pre" element with left padding...
- Add Robots.txt (thanks to Pavle Ggardijan) and T-SQL syntax definition files (thanks to Miladin Joksic)
**** v 0.7.1.2 ****
- Fix a bug on the full screen mode (regression added on 0.7.1.1)
**** v 0.7.1.1 ****
- Firefox 3 RC1 compatibility
- Code size reduction: 120Ko => 107Ko for edit_area_full.js
**** v 0.7.1 ****
- released under both LGPL and Apache license (you can use the one you prefer)
- it's now possible to get a readonly mode:
* new EditAreaLoader.init()'s option: "is_editable": true/false
* Possibility to switch edition mode by using the execCommand function: editAreaLoader.execCommand('editor_id', 'set_editable', !editAreaLoader.execCommand('editor_id', 'is_editable'));
- Added Ruby syntax (thanks to Patrice De Saint Steban)
- Fix a bug where the textarea lose the focus under firefox for Mac
- Minor other bug fixes
0.3.2 - EditArea v0.6.7
Votes: 36
Tags: plugin, manager, editing, file management
Submitted: May 22, 2007
Released: May 22, 2007
Downloads: 1362
License: LGPL
Package Website
[Plugin] EditArea 0.3.2 - EditArea v0.6.7
Works with the following Version(s): 0.9.5
This version has been marked as deprecated. Please use a newer version.
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1485.zip (1362 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
1. Upload EditArea:
Upload /assets/plugins/edit_area
NOTE:
If needed, chmod 755 for folders and chmod 644 for *.*
2. Create a new plugin (or edit if already exists):
Title: EditArea
Description: <strong>0.3.2</strong> - Allows text formatting, search and replace and real-time syntax highlighting
3. Copy and Paste ALL of the following into "Plugin configuration" on the Configuration tab:
&eadbg=Debug Enabled?;list;true,false;false &font_size=Font Size;list;8,9,10,11,12;9 &defaultHeight=Initialize editor height;list;300px,400px,500px,600px,700px;500px &min_height=Minimum editor height;list;200,300,400;400 &start_highlight=Initialize with highlighting enabled?;list;true,false;true &allow_toggle=Allow editor toggling?;list;true,false;true &allow_resize=Allow editor resizing?;list;y,n;y &fullscreen=Initialize editor in fullscreen mode?;list;true,false;false &replace_tab_with_spaces=Replace tab with spaces?;list;// No,/* Yes */;/* Yes */ &tab_as_spaces=How many spaces per tab?;list;3,4,5;4 &plugins=Active Plugins;string;modx
3a. If you want to add support for the PHP compressor, you need to append this to the "Plugin configuration":
&compressor=PHP Compressor Enabled?;list;true,false;true
4. Select one or more system events from this list on the System Events tab:
OnTempFormRender (template editor - html highlighting)
OnChunkFormRender (chunk editor - html highlighting)
OnDocFormRender (Document editor if you are not using an RTE - html highlighting)
OnSnipFormRender (Snippet editor - php highlighting)
OnPluginFormRender (plugin editor - php highlighting)
OnModFormRender (module editor - php highlighting)
EditArea Plugin Code:
Open "editarea.plugin.php" from the download (don't forget the README!)
NOTE:
As of version 0.3, the plugin now utilizes "plugin configuration parameters." Please ensure that you accurately Copy & Paste the parameters from the README.txt Installation section for this Plugin to work correctly. Have fun, and Enjoy!UpdatesPlease see most recent version.
0.3.1 - EditArea v0.6.5.1
Votes: 36
Tags: plugin, manager, editing, file management
Submitted: Apr 2, 2007
Released: Apr 2, 2007
Downloads: 913
License: LGPL
Package Website
[Plugin] EditArea 0.3.1 - EditArea v0.6.5.1
Works with the following Version(s): 0.9.5
This version has been marked as deprecated. Please use a newer version.
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1416.zip (913 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
1. Upload EditArea:
Upload /assets/plugins/edit_area
NOTE:
If needed, chmod 755 for folders and chmod 644 for *.*
2. Create a new plugin (or edit if already exists):
Title: EditArea
Description: <strong>0.3</strong> - Allows text formatting, search and replace and real-time syntax highlighting
3. Copy and Paste ALL of the following into "Plugin configuration" on the Configuration tab:
&eadbg=Debug Enabled?;list;true,false;false &font_size=Font Size;list;8,9,10,11,12;9 &defaultHeight=Initialize editor height;list;300px,400px,500px,600px,700px;500px &min_height=Minimum editor height;list;200,300,400;400 &start_highlight=Initialize with highlighting enabled?;list;true,false;true &allow_toggle=Allow editor toggling?;list;true,false;true &allow_resize=Allow editor resizing?;list;y,n;y &fullscreen=Initialize editor in fullscreen mode?;list;true,false;false &replace_tab_with_spaces=Replace tab with spaces?;list;// No,/* Yes */;/* Yes */ &tab_as_spaces=How many spaces per tab?;list;3,4,5;4 &plugins=Active Plugins;string;modx
4. Select one or more system events from this list on the System Events tab:
OnTempFormRender (template editor - html highlighting)
OnChunkFormRender (chunk editor - html highlighting)
OnDocFormRender (Document editor if you are not using an RTE - html highlighting)
OnSnipFormRender (Snippet editor - php highlighting)
OnPluginFormRender (plugin editor - php highlighting)
OnModFormRender (module editor - php highlighting)
EditArea Plugin Code:
Open "editarea.plugin.php" from the download (don't forget the README!)
NOTE:
As of version 0.3, the plugin now utilizes "plugin configuration parameters." Please ensure that you accurately Copy & Paste the parameters from the README.txt Installation section for this Plugin to work correctly. Have fun, and Enjoy!UpdatesPlease see most recent version.
0.3 - EditArea v0.6.5.1
Votes: 36
Tags: plugin, manager, editing, file management
Submitted: Feb 25, 2007
Released: Feb 25, 2007
Downloads: 1128
License: LGPL
Package Website
[Plugin] EditArea 0.3 - EditArea v0.6.5.1
Works with the following Version(s): 0.9.5
This version has been marked as deprecated. Please use a newer version.
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1341.zip (1128 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
1. Upload EditArea:
Upload /assets/plugins/edit_area
NOTE:
If needed, chmod 755 for folders and chmod 644 for *.*
2. Create a new plugin (or edit if already exists):
Title: EditArea
Description: <strong>0.3</strong> - Allows text formatting, search and replace and real-time syntax highlighting
3. Copy and Paste ALL of the following into "Plugin configuration" on the Configuration tab:
&eadbg=Debug Enabled?;list;true,false;false &font_size=Font Size;list;8,9,10,11,12;9 &defaultHeight=Initialize editor height;list;300px,400px,500px,600px,700px;500px &min_height=Minimum editor height;list;200,300,400;400 &start_highlight=Initialize with highlighting enabled?;list;true,false;true &allow_toggle=Allow editor toggling?;list;true,false;true &allow_resize=Allow editor resizing?;list;y,n;y &fullscreen=Initialize editor in fullscreen mode?;list;true,false;false &replace_tab_with_spaces=Replace tab with spaces?;list;// No,/* Yes */;/* Yes */ &tab_as_spaces=How many spaces per tab?;list;3,4,5;4 &plugins=Active Plugins;string;modx
4. Select one or more system events from this list on the System Events tab:
OnTempFormRender (template editor - html highlighting)
OnChunkFormRender (chunk editor - html highlighting)
OnDocFormRender (Document editor if you are not using an RTE - html highlighting)
OnSnipFormRender (Snippet editor - php highlighting)
OnPluginFormRender (plugin editor - php highlighting)
OnModFormRender (module editor - php highlighting)
EditArea Plugin Code:
Open "editarea.plugin.php" from the download (don't forget the README!)
NOTE:
As of version 0.3, the plugin now utilizes "plugin configuration parameters." Please ensure that you accurately Copy & Paste the parameters from the README.txt Installation section for this Plugin to work correctly. Have fun, and Enjoy!UpdatesPlease see most recent version.
0.2 RC4 - EditArea v0.6.4
Votes: 37
Tags: plugin, manager, editing, file management
Submitted: Jan 24, 2007
Released: Jan 24, 2007
Downloads: 755
License: LGPL
Package Website
[Plugin] EditArea 0.2 RC4 - EditArea v0.6.4
Works with the following Version(s): 0.9.5
This version has been marked as deprecated. Please use a newer version.
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1292.zip (755 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
Please see most recent version.
0.2 RC2 - EditArea v0.6.4
Votes: 36
Tags: plugin, manager, editing, file management
Submitted: Jan 11, 2007
Released: Jan 11, 2007
Downloads: 680
License: LGPL
Package Website
[Plugin] EditArea 0.2 RC2 - EditArea v0.6.4
Works with the following Version(s): 0.9.5
This version has been marked as deprecated. Please use a newer version.
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1273.zip (680 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
Please see most recent version.UpdatesPlease see most recent version.
0.2 RC1 - EditArea v0.6.3.1
Votes: 37
Tags: plugin, manager, editing, file management
Submitted: Jan 6, 2007
Released: Jan 6, 2007
Downloads: 692
License: LGPL
Package Website
[Plugin] EditArea 0.2 RC1 - EditArea v0.6.3.1
Works with the following Version(s): 0.9.5
This version has been marked as deprecated. Please use a newer version.
EditArea, a free javascript editor designed to edit source code files in a textarea. The main goal is to allow text formatting, search and replace and real-time syntax highlighting.
Download
- repo-1265.zip (692 downloads)
Description
Huge Props to Gildas for his dynamic plugin implementation and user testing. Wouldn't be so easy if not for him! :)
Download consists of edit_area plugin content + license, plugin code, and README for instructions. Open README if unsure where to begin.
It works on IE 6 & 7, Firefox 1.5 & 2 and Opera 9. More information available in the Browser Compatibility Chart
To view a live example, click here.
Or view this screen shot:
New! Check out the new Plugin configuration
Did you know that you can now save directly from EditArea using either the toolbar save icon, or the CTRL+S hotkey?
Instructions
Please see most recent version.UpdatesPlease see most recent version.

I think this is a mindblowing plug-in, and I don't understand that it's not (1) getting more credit and attention, and (2) is included in the DEFAULT installation of ModX. I was going crazy trying to edit PHP and HTML and CSS in the normal browser edit boxes (TinyMCE is fine as a WYSIWYG editor but a joke as a code editor). Given that ModX specifically advertises itself as a developer's system, and a PHP friendly system, which is both true and good, it would behoove ModX tremendously to have a proper code-editor as a standard option. With EditArea, I can now completely drop Dreamweaver and go 100% web-based. This plug-in absolutely rocks, thank you for writing it.