Accueil
English
JCE Editor & Google Chrome fix
Virtuemart - SEF
Mercredi, 21 Décembre 2011 08:58

Finally... Here is a fix for JCE Editor being greyed out in Google Chrome

This Joomla/Virtuemart hack fixes the bug of the JCE editor not being correctly displayed with Google Chrome. The content is greyed out and no edit is possible.
This is due to tabs being loaded/processed AFTER the editor itself. 
This patch will first address the tabbing issue that is present in with Joomla native Tabs and will then change Virtuemart to use the Jomla tabbing functionality instead.
Patch was created out of the latest versions available at that time : 

  • Joomla 1.5.25
  • Virtuemmart 1.1.9 


###########
# WARNING #
###########
This is a hack to Joomla and Virtuemart. You may have to re-apply changes if you upgrade either Joomla or Virtuemart.

The fix

Joomla Tabs

Edit file located in /media/system/js/tabs.js
Replace this code starting on line 26 :

onActive: function(title, description){
    description.setStyle('display', 'block');
    title.addClass('open').removeClass('closed');
},

onBackground: function(title, description){
    description.setStyle('display', 'none');
    title.addClass('closed').removeClass('open');
}

with this one :

onActive: function(title, description){
    description.setStyle('display', 'block');
    title.addClass('open').removeClass('closed');
    description.getElements('textarea.wfEditor').each(function(elem) { tinyMCE.execCommand('mceAddControl',false,elem.id);})
},

onBackground: function(title, description){
    description.setStyle('display', 'none');
    title.addClass('closed').removeClass('open');
    description.getElements('textarea.wfEditor').each(function(elem) { if(tinyMCE.get(elem.id)) tinyMCE.execCommand('mceRemoveControl',false,elem.id);})
}

Now the Virtuemart part

Edit file located in /administrator/components/com_virtuemart/classes/htmlTools.class.php
Replace this code starting on line 374 :

class vmTabPanel {
	...
}

With this one:

class vmTabPanel {
	/** @var int Use cookies */
	var $useCookies = 0;
    
    /** @var string Panel ID */
    var $panel_id;
    var $tabs;
    
	/**
	* Constructor
	* Includes files needed for displaying tabs and sets cookie options
	* @param int useCookies, if set to 1 cookie will hold last used tab between page refreshes
	* @param int show_js, if set to 1 the Javascript Link and Stylesheet will not be printed
	*/
	function vmTabPanel($useCookies, $show_js, $panel_id) {		
		jimport('joomla.html.pane');
		$this->panel_id =& JPane::getInstance('tabs', array('startOffset'=>0)); 
	}

	/**
	* creates a tab pane and creates JS obj
	* @param string The Tab Pane Name
	*/
	function startPane($id) {		
		$this->panel_id->startPane( $id ); 
	}

	/**
	* Ends Tab Pane
	*/
	function endPane() {
		$this->panel_id->endPane();
	}

	/*
	* Creates a tab with title text and starts that tabs page
	* @param tabText - This is what is displayed on the tab
	* @param paneid - This is the parent pane to build this tab on
	*/
	function startTab( $tabText, $paneid ) {
		$this->panel_id->startPanel($tabText, $paneid);
	}

	/*
	* Ends a tab page
	*/
	function endTab() {
		$this->panel_id->endPanel();
	}
}

zipJCEEditor-Chrome-Fix.zip19.64 KB