WYSIWYG
[h2]WYSIWYG features[/h2]
[url=http://xinha.python-hosting.com/]Xinha WYSIWYG editor[/url] is a very useful tool for edit and create html;
Image:xinha.jpg
the very useful tool is your Image Manager:
it is possible to upload, view, edit and delete all images on the folder server. Use it in Code Igniter is very easy, but it is necessary to edit some line of the code of the original tool.
[b]First[/b], download the code from [url=http://xinha.python-hosting.com/]Xinha wed site[/url] and copy the xinha folder in the root of Code Igniter, as
[code] htdocs |-----CodeIgniter |------xinha |------system |------- controllers |-------- etc [/code]
[b]Second[/b], you need to create the plugin code as
[code] <?php if (!defined('BASEPATH')) exit('No direct script access allowed');
/**
-
Print the javascript
-
@param string $textarea Arry with the name of textareas to turn in xinha area
-
@return script javascript for enable xinha text area */ function javascript_xihna( $textarea ) { $obj =& get_instance(); $base = $obj->config->item('base_url', 1); ob_start(); ?>
_editor_url = "<?=$base?>xinha/" // (preferably absolute) URL (including trailing slash) where Xinha is installed _editor_lang = "it"; // And the language we need to use in the editor. </script> </script> <link rel="StyleSheet" href="<?=$base?>xinha/skins/titan/skin.css" type="text/css"> //change the ref to css for other style
xinha_editors = null; xinha_init = null; xinha_config = null; xinha_plugins = null; // This contains the names of textareas we will make into Xinha editors xinha_init = xinha_init ? xinha_init : function() { xinha_plugins = xinha_plugins ? xinha_plugins : [ 'CharacterMap', 'ContextMenu', 'FullScreen', 'ListType', 'ImageManager', 'TableOperations' ]; // THIS BIT OF JAVASCRIPT LOADS THE PLUGINS, NO TOUCHING :) if(!HTMLArea.loadPlugins(xinha_plugins, xinha_init)) return; /** STEP 2 *************************************************************** * Now, what are the names of the textareas you will be turning into * editors? ************************************************************************/ xinha_editors = xinha_editors ? xinha_editors : [ <? $area=''; foreach ($textarea as $item){ $area.= "'$item',"; } $area=substr($area,0,-1); echo $area; ?> ]; xinha_config = xinha_config ? xinha_config() : new HTMLArea.Config(); xinha_config.pageStyle = 'body { font-family: verdana,arial,sans-serif; font-size: .9em; }'; xinha_editors = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins); HTMLArea.startEditors(xinha_editors); } window.onload = xinha_init;</script> <? $r = ob_get_contents(); ob_end_clean(); return $r; } ?> [/code] and save it in the plugins folder as xinha_pi.php. The file use the data in config file of CodeIgniter for link the javascript and css files at the xinha area.
And finaly, add a controller
[code] <?php class Editor extends Controller{
function index()
{
$this->load->plugin('xinha');
$dati['xinha_java']= javascript_xihna(array('txt')); // this line for the xinha
$this->load->view('xinha', $dati);
}
?> [/code]
and the view file
[code]
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Example of Xinha</title> <?=$xinha_java;?> </head> <body> <form action="editor/test" method="POST">
<? $data = array( 'name' => 'txt', 'id' => 'txt', 'value' => 'Try', 'rows' => '30', 'cols' => '50', 'style' => 'width:100%', );
echo form_textarea($data);
?> <input type="Submit"> </form> </body> </html> [/code]
In the controller the [code]$dati['xinha_java']= javascript_xihna(array('txt')); [/code] point to txt textarea, but if you need two xinha area, edit the line as [code]$dati['xinha_java']= javascript_xihna(array('txt1','txt2')); [/code] and modify the view.
That's all!