MyBB Community Forums

Full Version: [1.6.x] Fix Editor & TextArea
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3 4 5 6 7 8 9 10
(2010-08-06, 01:11 PM)Warmonger Wrote: [ -> ]If your like me you'd hate for your forums to not look half way decent. If you get sick and tired of looking at this, with the text area all hanging out of the editor, then scroll down.

[Image: 90djtl.png]

Then follow these steps below.

Open (jscripts/editor.js)

Find:
		// Determine the overall height and width - messy, but works
		w = oldTextarea.getDimensions().width+"px";
		if(!w || parseInt(w) < 400)
		{
			w = "400px";
		}
		if(this.options && this.options.height)
		{
			h = this.options.height;
		}
		else if(oldTextarea.offsetHeight)
		{
			h = oldTextarea.offsetHeight+"px";
		}
		else if(oldTextarea.clientHeight)
		{
			h = oldTextarea.clientHeight+"px";
		}
		else if(oldTextarea.style.height)
		{
			h = oldTextarea.style.height;
		}
		else
		{
			h = "400px";
		}
		this.editor.style.width = w;
		this.editor.style.height = h;
Replace With:
		// Determine the overall height and width - messy, but works
		w = "550px";
		h = "300px";
		this.editor.style.width = w;
		this.editor.style.height = h;

Find:
		textInput.style.height = parseInt(areaContainer.style.height)+"px";
		textInput.style.width = parseInt(areaContainer.style.width)+"px";
Replace With:
		textInput.style.height = "229px";
		textInput.style.width = "544px";

And you should end up with a fixed editor and textarea that looks like this.

[Image: 141qyr7.png]

You can play around with the height and width to your liking/size. This works and looks the same on IE, Firefox, and Chrome.

Still having problems applying the patch? Download a original copy of editor.js with this patch applied below.

If you like push the [Image: postbit_reputation.gif] button!
-Warmonger

UPDATED FOR 1.6.3!



I just edited the first php code and couldnt find the second set
(with textInput.style.height = parseInt(areaContainer.style.height)+"px"Wink
in my 1.6.9 editor file. Just editing the first part seemed to fix the problem.
what if I want to edit "textarea" on "profile comment" ?
You don't have to do anything. It fixes every textarea by default.
I use jQuery "tabs profile" and it looks irregular to section tabs "profile comment"
but I have found the solution itself Big Grin
(2013-04-13, 10:46 AM)SunDi3yansyah Wrote: [ -> ]but I have found the solution itself Big Grin

Thats great. But how about letting others know how you fixed it, that might have the same issue. Wink

Just a thought.

Wolfseye
I have completed my problems and succeed Big Grin
Has anyone ever figured out how to make the rest of the page resize around the Edit Post/New Reply textarea like it's supposed to?

EDIT: Well, I figured out a fix of my own that allows the textarea to resize without breaking the rest of the page (provided the browser window itself is ~840 pixels wide or greater).

In editor.js I commented out the lines that attempt to set the height attributes.

//		this.editor.style.width = w;
//		this.editor.style.height = h;

//		textInput.style.height = parseInt(areaContainer.style.height)+"px";
//		textInput.style.width = parseInt(areaContainer.style.width)+"px";

This causes the container that wraps the buttons and text area to fill the table cell (minus padding), and when the textarea is then resized, it pushes the following table rows downward like it is supposed to. Mind you, it is still possible to drag the width of the textarea to exceed the width of your browser window, but at that point I figure it's more of a personal issue. Wink

Hope this helps!
Hello,

Does anyone know how to just apply the javascript only to the 'newreply' template?

Because throughout the site, I need to have different text editor widths.

For example, the edit signature text area needs to be much smaller than the new reply text area.

So is there any way to apply this to just one text area box, instead of all of them?
Yo don't need all those edits.
in templates, find:
rows="20" cols="70"

replace with:
style="width: 100%; height: 300px;"

Adjust width % value and height pixel value as you need. For example, you can use height: 100px; for signatures.
How do i edit the editor.js?
Pages: 1 2 3 4 5 6 7 8 9 10