On March 26, 2019 we launched new MODX Forums. Please join us at the new MODX Community Forums.
Subscribe: RSS
  • This is an auto-generated support/comment thread for Xinha.

    Use this forum to post any comments about this addition or any questions you have regarding its use.

    Brief Description:
    Adds the Xinha richtext editor to MODx.
      Jeff Whitfield

      "I like my coffee hot and strong, like I like my women, hot and strong... with a spoon in them."
    • Previous threads about Xinha:
      [plugin] Xinha
        No, I don't know what OpenGeek's saying half the time either.
        MODx Documentation: The Wiki | My Wiki contributions | Main MODx Documentation
        Forum: Where to post threads about add-ons | Forum Rules
        Like MODx? donate (and/or share your resources)
        Like me? See my Amazon wishlist
        MODx "Most Promising CMS" - so appropriate!
      • Is Xinha working well for you?


        I’m looking at switching, because TINYMCE is not letting me or my client change font colors.
        • Xinha is great!

          It is doing one funny thing though.

          It thinks the base url for everything (images, links) is .... /manager/

          So, something in the configuration code needs to be changed.

          Here’s a look:

          /**
           * Xinha - RichText Editor Plugin
           * Written By Jeff Whitfield - July 19, 2005
           *
           * Version 0.3 Beta (November 16, 2005)
           *
           * Based on Xinha revision 421
           */
          
          // No frontend interface provided
          if (isset($forfrontend) || $modx->isFrontEnd()){
          	return;
          }
          
          // getXinhaSettings function
          if (!function_exists('getXinhaSettings')) {
          	function getXinhaSettings() {
          		global $_lang;
          		global $use_editor;
          		global $displayStyle;
          		global $xinha_strip_base_url;
          		global $xinha_plugins_selected;
          		global $xinha_plugins_custom;
          		global $xinha_use_stylist;
          		global $xinha_editor_skin;
          
          		// language settings
          		$_lang['Xinha_settings'] = "Xinha Settings";
          		$_lang['xinha_editor_skin_title'] = "Editor Skin:";
          		$_lang["xinha_editor_skin_message"] = "Select the editor skin you wish to use.";
          		$_lang['xinha_strip_base_url_title'] = "Strip base url:";
          		$_lang["xinha_strip_base_url_message"] = "If you would like the editor to remove the base url from links and images, select 'Yes'. NOTE: This only seems to affect Xinha in Firefox and IE. If you intend to use the Resource Browser, or encounter problems with your links being changed, set this to 'No'. Example: If enabled, http://www.myserver.com/link.html will become link.html.";
          		$_lang['xinha_stylist_plugin_title'] = "Stylist Plugin:";
          		$_lang["xinha_stylist_plugin_message"] = "If you would like to use the Stylist plugin, select 'Yes'. NOTE: You must have a CSS path entered in the 'Path to CSS file' box for the Stylist plugin to work.";
          		$_lang['xinha_plugins_title'] = "Xinha Plugins:";
          		$_lang['xinha_plugins_message'] = "Select the plugins you wish to enable in the document editor. By default the FullScreen plugin is enabled.";
          		$_lang['xinha_plugins_custom_title'] = "Custom Plugins:";
          		$_lang['xinha_plugins_custom_message'] = "If you have added additional plugins to the Xinha plugins directory, enter the names of the plugins here separated by commas (Example: 'CharacterMap,ContextMenu,FullScreen,ListType,SuperClean').";
          
          		$display = $use_editor==1 ? $displayStyle : 'none';
          		
          		// Editor Skin setting
          		$xinha_editor_skin = !empty($xinha_editor_skin) ? $xinha_editor_skin : "xp-blue";
          		$xinha_editor_skin_options = array("blue-look","blue-metallic","green-look","inditreuse","xp-blue","xp-green");
          		reset($xinha_editor_skin_options);
          		$xinha_editor_skin_settings = "<select name=\"xinha_editor_skin\" id=\"xinha_editor_skin\">\n";
          		foreach ($xinha_editor_skin_options as $skinopt) {
          			$skinopt_sel = $xinha_editor_skin==$skinopt ? " selected" : "";
          			$xinha_editor_skin_settings .= "<option value=\"".$skinopt."\"".$skinopt_sel.">".$skinopt."</option>\n";
          		}
          		$xinha_editor_skin_settings .= "</select>\n";
          				
          		// Strip base url setting
          		$xinha_strip_base_url_yes = $xinha_strip_base_url==1 ? "checked='checked'" : "";
          		$xinha_strip_base_url_no = $xinha_strip_base_url==0 ? "checked='checked'" : "";
          
          		// Stylist plugin setting
          		$xinha_use_stylist_yes = $xinha_use_stylist==1 ? "checked='checked'" : "";
          		$xinha_use_stylist_no = $xinha_use_stylist==0 ? "checked='checked'" : "";
          
          		// Plugin settings:		
          		
          		// Create array of selected plugins
          		$xinha_plugins_selected = !empty($xinha_plugins_selected) ? split(",",$xinha_plugins_selected) : "";
          		
          		// Set array for default, builtin plugins and sort alphabetically
          		$xinha_plugins_default = array(
          			"Abbreviation","CharacterMap","CharCounter","ClientsideSpellcheck","ContextMenu","DoubleClick","EditTag","EnterParagraphs","Equation","FindReplace",
          			"GetHtml","HorizontalRule","InsertAnchor","InsertMarquee","InsertSmiley","InsertWords","LangMarks","ListType","NoteServer","PasteText",
          			"QuickTag","SuperClean","TableOperations","UnFormat");		
          		
          		sort($xinha_plugins_default);
          		
          		// Create plugin settings output
          		$pluginsCount = count($xinha_plugins_default);		
          		$plugin_settings .= "<table>\n";
          		$loopcount = 0;
          		for($x=0; $x<$pluginsCount; $x++){
          			$plugin_selected = is_array($xinha_plugins_selected)?(in_array($xinha_plugins_default[$x],$xinha_plugins_selected) ? "checked='checked'" : ""):"";
          			$curplugin = "<td style=\"padding-right: 5px;\"><input type=\"checkbox\" name=\"xinha_plugins_selected[]\" id=\"xinha_plugins_selected\" value=\"".$xinha_plugins_default[$x]."\" ".$plugin_selected."><label for=\"xinha_plugins_selected\">".$xinha_plugins_default[$x]."</label></td>\n";
          			switch ($loopcount) {
          			case 0:
          				$plugin_settings .= "<tr>\n".$curplugin;
          				$loopcount++;
          				break;
          			case 3:
          				$plugin_settings .= $curplugin."</tr>\n";
          				$loopcount = 0;
          				break;
          			default:
          				$plugin_settings .= $curplugin;
          				$loopcount++;
          			}
          		}
          		$plugin_settings .= "</table>\n";
          		// End plugin settings
          		
          		return <<<Xinha_HTML_Settings
          		<script type="text/javascript">
          		function xp_select(state) {
          		  var all = document.getElementsByTagName( "INPUT" );
          		    var l = all.length;
          		  for ( var i = 0; i < l; i++ ) {
          		    el = all[i];
          		    type = el.type;
          		    name = el.name;
          		    if (type=="checkbox"&&name.indexOf('xinha_plugins_selected')==0) {
          		      if (state=='all') {
          		        el.checked = 1;
          		      } else {
          		        el.checked = 0;
          		      }
          		    }
          		  }
          		}
          		</script>
          		<table id='editorRow_Xinha' style="width:inherit;" border="0" cellspacing="0" cellpadding="3"> 
          		  <tr class='row1' style="display: $display;"> 
                      <td colspan="2" class="warning" style="color:#707070; background-color:#eeeeee"><h4>{$_lang["Xinha_settings"]}<h4></td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td nowrap class="warning"><b>{$_lang["xinha_editor_skin_title"]}</b></td> 
                      <td>
                      $xinha_editor_skin_settings
          			</td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td width="200"> </td> 
                      <td class='comment'>{$_lang["xinha_editor_skin_message"]}</td> 
                    </tr> 
          		  <tr class='row1' style="display: $display"> 
                      <td colspan="2"><div class='split'></div></td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td nowrap class="warning"><b>{$_lang["xinha_strip_base_url_title"]}</b></td> 
                      <td>
          	            <input onChange="documentDirty=true;" type="radio" name="xinha_strip_base_url" id="xinha_strip_base_url_yes" value="1" $xinha_strip_base_url_yes>
          	            <label for="xinha_strip_base_url_yes">Yes</label><br />
          	            <input onChange="documentDirty=true;" type="radio" name="xinha_strip_base_url" id="xinha_strip_base_url_no" value="0" $xinha_strip_base_url_no>
          	            <label for="xinha_strip_base_url_no">No</label>
          			</td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td width="200"> </td> 
                      <td class='comment'>{$_lang["xinha_strip_base_url_message"]}</td> 
                    </tr> 
          		  <tr class='row1' style="display: $display"> 
                      <td colspan="2"><div class='split'></div></td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td nowrap class="warning"><b>{$_lang["xinha_stylist_plugin_title"]}</b></td> 
                      <td>
          	            <input onChange="documentDirty=true;" type="radio" name="xinha_use_stylist" id="xinha_use_stylist_yes" value="1" $xinha_use_stylist_yes>
          	            <label for="xinha_use_stylist_yes">Yes</label><br />
          	            <input onChange="documentDirty=true;" type="radio" name="xinha_use_stylist" id="xinha_use_stylist_no" value="0" $xinha_use_stylist_no>
          	            <label for="xinha_use_stylist_no">No</label>
          			</td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td width="200"> </td> 
                      <td class='comment'>{$_lang["xinha_stylist_plugin_message"]}</td> 
                    </tr> 
          		  <tr class='row1' style="display: $display"> 
                      <td colspan="2"><div class='split'></div></td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td nowrap class="warning"><b>{$_lang["xinha_plugins_title"]}</b></td> 
                      <td>
                      $plugin_settings
                      <input name="xinha_plugins_selected[]" type="hidden" id="xinha_plugins_selected" value="novalue">
           			</td>
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td width="200"> </td> 
                      <td><input type="button" onclick="javascript:xp_select('all')" value="Select All" /> <input type="button" onclick="javascript:xp_select('none')" value="Clear Selected"/></td> 
                    </tr> 
                    <tr class='row1' style="display: $display"> 
                      <td width="200"> </td> 
                      <td class='comment'>{$_lang["xinha_plugins_message"]}</td> 
                    </tr> 
          		  <tr class='row1' style="display: $display"> 
                      <td colspan="2"><div class='split'></div></td> 
                    </tr> 
          		  <tr class='row1' style="display:$display;"> 
          			<td nowrap class="warning"><b>{$_lang["xinha_plugins_custom_title"]}</b></td> 
          			<td><input onChange="documentDirty=true;" type='text' maxlength='65000' style="width: 300px;" name="xinha_plugins_custom" value="$xinha_plugins_custom" /> 
          			</td> 
          		  </tr> 
          		  <tr class='row1' style="display: $display;"> 
          			<td width="200"> </td> 
          			<td class='comment'>{$_lang["xinha_plugins_custom_message"]}</td> 
          		  </tr> 
          		  <tr class='row1' style="display: $display;"> 
          			<td colspan="2"><div class='split'></div></td> 
          		  </tr> 
          		</table>
          Xinha_HTML_Settings;
          	}
          }		
          
          // getXinhaScript function
          if (!function_exists('getXinhaScript')) {
          	function getXinhaScript($elementList) {
          		global $base_url;
          		global $use_browser;
          		global $editor_css_path;
          		global $xinha_strip_base_url;
          		global $xinha_use_stylist;
          		global $xinha_editor_skin;
          		global $xinha_plugins_selected;
          		global $xinha_plugins_custom;
          				
          		$elementCount = count($elementList);		
          		for($x=0; $x<$elementCount; $x++){
          			if($x==($elementCount-1)){ 
          			  $XinhaInstances .= "'".$elementList[$x]."'";
          			} else {
          			  $XinhaInstances .= "'".$elementList[$x]."',";
          			}
          		}
          
          		$xinha_editor_skin = !empty($xinha_editor_skin) ? $xinha_editor_skin : "xp-blue";
          		$strip_base_href = $xinha_strip_base_url==1 ? "true" : "false";
          		$modx_image_plugin = $use_browser==1 ? "xinha_plugins.push('ModxImage');" : "";
          		$modx_link_plugin = $use_browser==1 ? "xinha_plugins.push('ModxLink');" : "";
          
          		if($xinha_use_stylist==1 && !empty($editor_css_path)){
          			$stylist_plugin_push = "xinha_plugins.push('Stylist');";
          			$stylist_plugin_settings .= <<<STYLIST_PLUGIN
          				
          				if(typeof Stylist != 'undefined')
          				{
          					config.stylistLoadStylesheet('$editor_css_path');
          					config.pageStyle = "@import url({$editor_css_path});";
          					config.registerButton({
          							id       : "stylist",
          							tooltip  : "Toggle Stylist",
          							image    : "media/xinha/plugins/Stylist/img/ed_style.gif",
          							textMode : false,
          							action   : function(editor) {
          								editor._toggleStylist(editor);
          							}
          					})
          			
          					config.toolbar[1].splice(1, 0, "separator");
          					config.toolbar[1].splice(1, 0, "stylist");
          			
          					HTMLArea.prototype._toggleStylist = function(editor) {
          						if (editor._stylistVisible == true) { 
          							editor.hidePanel(editor._stylist);
          							editor._stylistVisible = false;
          						} else {
          							editor.showPanel(editor._stylist);
          							editor._stylistVisible = true;
          						}
          					}
          			  
          					HTMLArea.prototype._stylistVisible = true;
          				}			
          STYLIST_PLUGIN;
          		}
          		
          		//Push plugins
          		$xinha_plugins = array();
          		if(!empty($xinha_plugins_selected)){
          			$xinha_plugins = split(",",$xinha_plugins_selected);
          		}
          		if($xinha_plugins_custom){
          			$xinha_plugins_custom = split(",", $xinha_plugins_custom);
          			$xinha_plugins = array_merge($xinha_plugins,$xinha_plugins_custom);
          		}
          
          		$xinha_plugins = array_unique($xinha_plugins);
          		
          		foreach($xinha_plugins as $key=>$value){
          			if($value != "novalue"){
          				$xp_plugins .= "			xinha_plugins.push('".$value."');\n";
          			}
          		}
          
          		$xinha_script = <<<XINHA_SCRIPT
          		<script type="text/javascript">
          			_editor_url  = "{$base_url}assets/plugins/xinha/"; 
          			_editor_lang = "en"; 
          			_editor_skin = "{$xinha_editor_skin}"; 
          		</script>
          		<script type="text/javascript" src="{$base_url}assets/plugins/xinha/htmlarea.js"></script>
          		<script>
          			xinha_editors = null;
          			xinha_init    = null;
          			xinha_config  = null;
          			xinha_plugins = null;
          			
          			xinha_init =  function()
          			{
          				xinha_plugins = xinha_plugins ? xinha_plugins :
          				[
          				'FullScreen',
          				];
          				if(!HTMLArea.loadPlugins(xinha_plugins, xinha_init)) return;
          				
          				xinha_editors = xinha_editors ? xinha_editors :
          				[
          				$XinhaInstances
          				];
          		
          				xinha_config = xinha_config ? xinha_config() : new HTMLArea.Config();
          				xinha_config.height = '420px';
          				xinha_config.width = '100%';
          					
          				xinha_editors = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins);
          		
          				HTMLArea.startEditors(xinha_editors);
          			}
          		  
          		  
          			xinha_config = function()
          			{
          				var config = new HTMLArea.Config();
          			
          				config.stripBaseHref = $strip_base_href;
          				config.ManagerPath = "{$base_url}manager/media/browser/mcpuk/browser.html";
          				config.ManagerConn = "{$base_url}manager/media/browser/mcpuk/connectors/php/connector.php";
          				config.ServerPath = "{$base_url}";
          
          				$stylist_plugin_settings
          
          				return config;
          			}
          			// load the plugins	
          			xinha_plugins = [ ];
          			$modx_image_plugin
          			$modx_link_plugin
          			$stylist_plugin_push
          $xp_plugins			
          
          			window.onload = xinha_init;
          		</script>
          		<link type="text/css" rel="alternate stylesheet" title="{$xinha_editor_skin}" href="{$base_url}assets/plugins/xinha/skins/{$xinha_editor_skin}/skin.css" /> 
          XINHA_SCRIPT;
          	return $xinha_script;
          	}
          }
          
          // Event Handlers
          
          $e = &$modx->Event; 
          switch ($e->name) { 
          	case "OnRichTextEditorRegister":
          		$e->output("Xinha");
          		break;
          
          	case "OnRichTextEditorInit":
          		if($editor=="Xinha") {
          			$html = getXinhaScript($elements);
          			$e->output($html);
          		}		
          		break;
          
          	case "OnInterfaceSettingsRender":
          		$html = getXinhaSettings();
          		$e->output($html);
          		break;
          		
             default :    
                return; // stop here - this is very important. 
                break; 
          }
          • Hi
            Been using Xinha as the RTE of choice for a site have been developing.
            Have moved the site to its live server after developing locally and whilst Xinha is turning up in resource > manage resources > plugins, it is not coming up as an option for when editing a document or in Tools > Configuration > Editor to use
            Have tried reinstalling the plugin but with no success.
            Any ideas?

            Cole

            #####
            MODx v0.9.6/rev 2767
            PHP 5.1.4/Apache 2.2.2 (Windows)
            MySQL 5.0.21
            • Quote from: coleh at Aug 05, 2008, 10:17 AM

              Been using Xinha as the RTE of choice for a site have been developing.
              Have moved the site to its live server after developing locally and whilst Xinha is turning up in resource > manage resources > plugins, it is not coming up as an option for when editing a document or in Tools > Configuration > Editor to use

              To update, I am also no longer able to access the TinyMCE editor.

              Cole
              • Hi Cole,
                Did you check your Resource Path, Resource URL and File Manager Path settings in Tools > Configuration after moving the site?
                  Mike Schell
                  Lead Developer, MODX Cloud
                  Email: mike@modx.com
                  GitHub: https://github.com/netProphET/
                  Twitter: @mkschell
                • Quote from: netProphET at Aug 06, 2008, 03:50 AM

                  Did you check your Resource Path, Resource URL and File Manager Path settings in Tools > Configuration after moving the site?

                  Checked and all pointing to the right place,

                  Cole
                  • s9consulting Reply #9, 11 years ago
                    I’m still experiencing the issue where Xinha and/or FCKeditor adds /manager to the Base URL for images.

                    If I aim to add an image to a page, Xinha opens the upload window. If I press "browse," Xinha opens the FCKeditor to locate the image.

                    In the address bar this is what shows:

                    http://www.mywebsite.net/manager/media/browser/mcpuk/browser.html?Connector=/manager/media/browser/mcpuk/connectors/php/connector.php&ServerPath=/&Type=images

                    So its looking in the /manager/media directory instead of the assets/images directory, and I don’t know where I’m supposed to look to change this. It won’t navigate to any other folder.

                    Resource path and resource URL are set to http://www.mywebsite.net/assets/

                    File manager path is set to http://www.mywebsite.net/


                    I just located this bit of code in the Xinha plugin. Is this part of the problem or is this okay?


                    xinha_config = function()
                    			{
                    				var config = new HTMLArea.Config();
                    			
                    				config.stripBaseHref = $strip_base_href;
                    				config.ManagerPath = "{$base_url}manager/media/browser/mcpuk/browser.html";
                    				config.ManagerConn = "{$base_url}manager/media/browser/mcpuk/connectors/php/connector.php";
                    				config.ServerPath = "{$base_url}";
                    
                    				$stylist_plugin_settings
                    
                    				return config;
                    			}


                    • Something found out that may be useful to someone else:

                      I was very happy with Xinha so I elected to use it exclusively on several new MODx installs.

                      Not knowing the cause, I found several functionalities in MODx not working.

                      It turns out MODx requires TinyMCE in order to perform certain functions (add manager users, etc.)

                      So I had to also install TinyMCE just for back-end admin functions.


                      Not too thrilled with that, mostly because now I have to install two editors that take lots of time to FTP up when I do a fresh install. But, I’m pleased that things are again working.

                      Found this out thanks to Greg Swaney at Nexcess.net my webhosting company - they took a fresh look at it when I was completely stuck.

                      I’m also bumping this thread to try to get some answers about the post immediately above this one. No thoughts/responses on this (the folder issue)?

                      Thanks,
                      John