[Updated] Ext.ux.TinyMCE - TinyMCE form field (v0.7b1)

[Dumbledore]

so, after some debugging i see that the event editorcreated will be fired to early.

I change this:

			// Fix editor size when control will be visible
			(function fixEditorSize() {
			
				// If element is not visible yet, wait.
				if( !this.isVisible() ) {
					arguments.callee.defer( 50, this );
					return;
				}
				
				var size = this.getSize();
				this.withEd( function() {
					this._setEditorSize( size.width, size.height);
					
					// Indicate that editor is created
					this.fireEvent("editorcreated");  // add here
				});
			}).call( this );

			// Indicate that editor is created
			//this.fireEvent("editorcreated");   // this i remove and add this above

[xor]

Guys, please check out new version - 0.8.1:
http://blogs.byte-force.com/media/p/40520.aspx

Removed dependency on MIframe. Rewritten is the code for editor resize. Hope, now it will work correctly in all cases.

@Dumbledore
Your change is not incorporated yet. Will do it soon.

[walldorff]

Great! Thank you for sharing, xor.

[Dumbledore]

another small patch for the 0.8.1

add this in onRender:

// Create TinyMCE editor.
this.ed = new tinymce.Editor(id, this.tinymceSettings);

// Create a new Windows Group for the dialogs
this.ed.windowGroup = new Ext.WindowGroup();
this.ed.windowGroup.zseed = 12000;

and this in Window.Manager.open:

var win = new Ext.Window(
{
	title: s.name,
	width: s.width,
	height: s.height,
	minWidth: s.min_width,
	minHeight: s.min_height,
	resizable: true,
	maximizable: s.maximizable,
	minimizable: s.minimizable,
	modal: true,
	stateful: false,
	constrain: true,
	layout: "fit",
	manager : this.editor.windowGroup,
	items: [
		new Ext.BoxComponent({
			autoEl: {
				tag: 'iframe',
				src: s.url || s.file
			},
			style : 'border-width: 0px;'
		})
	]
});

Then we have a correct zindex of the dialogs when using TinyMCE inside of an Ext.Editor.

[uwolfer]

Why do you put the whole component into "(function() {"? This is not usual for a component. I have removed it and it works fine without.

You could also add the ComponentMgr registration which allows creation by xtype:

Ext.ComponentMgr.registerType("tinymce", Ext.ux.TinyMCE);

[xor]

uwolfer, registerType is there already. It is on the line 512 of my distrubution.

Outer "(function()" is intended to hide some implementation details from polluting global namespace. It allows for making some kind of private variables and functions. Why do you think you should remove it? Is there any objective reason?

[xor]

Hello!

Just released version 0.8.2. It incorporates changes offered by Dumbledore, refactored a bit.

I also redesigned component page. It has a link to download area, so grab release from there:
http://blogs.byte-force.com/xor/tinymce/

Demo package does not include demo page any more. Only test-example files and release notes. I think it is more logical, but tell me if you miss the index page.


Finally, I've made a donation button with help of Moneybookers. Some of you wanted to support the component development, so now it is possible. It is there, on the side bar of the component's page. I hope it is working. If not, please let me know.

[hansl1963]

Hello xor,

I'm using tinymce in a window containing a form panel and a tabpanel.
This tabpanel contains tree tabs with a tinymce editor inside.

If I click on each tab everything works ok, but when don't click all tabs and save the form/close the window I get the following errors in FF:

e is null
http://scada/hans/scada2/lib/own/ux/...75ebb948cf220b
Line 7537

and

el is undefined
http://scada/hans/scada2/lib/ext/ext...448bfded73d534
Line 5947

Does this sound familliar to you (or anybody else)?????
What am I doing wrong, I can't find the problem and hope somebody can help me..

I'm using Ext.ux.TinyMCE.js version v0.8.2 (without iframes)

[xor]

hansl1963, can you make little test case based on one of test.*.html files in my distribution? Put there your tab panel configuration and form submit code (no server-side is required, as error occurs immediately as I got from your explanation). I will debug it and see what's wrong.

[uwolfer]

Outer "(function()" is intended to hide some implementation details from polluting global namespace. It allows for making some kind of private variables and functions. Why do you think you should remove it? Is there any objective reason?

I remember I had some issues with the "(function()" wrapping, but I do not really remember what they were exactly. It could be something with loading order (if TinyMCE was loaded after the plugin...) But not sure. The only thing you hide is IMHO "var tmceInitialized" (and some TinyMCE stuff, which is global anyways). That could be done in another way (probably set it on the prototype).

I also have changed the code that it does not break if TinyMCE is not included in a specific page. It also improves loading performance since it does initialization (and override of TinyMCE stuff) in case of usage, not on init.

See the attached patch for some changes and improvements.