htmlArea

A directory of browser-based WYSIWYG editors

  MAIN
INDEX
SEARCH
POSTS
WHO'S
ONLINE
LOG
IN

Home: htmlArea 2: htmlArea 2 & 3 archive (read only): htmlArea v2.0:
I would like a UBB editor


The htmlArea 2 & 3 editors have been discontinued.

We've made these forums available as a read-only reference and knowledge-base for people using or developing editors based on htmlArea 2 or 3.

Anyone who is interested in taking over version 2 or 3 is free to do so. All we ask is that you choose a new name that doesn't have "htmlarea" in it to avoid confusion with this site. We'll even give you a link in the directory to make it easier for people to find you. If you are developing or hosting an htmlArea based-editor under a new name, please submit it to our directory.

 


Dave6625
Novice

Jun 2, 2003, 6:26 PM

Post #1 of 21 (3996 views)
Shortcut
I would like a UBB editor Can't Post

Hi Everyone,I love htmlarea, but I'd like to implement it onto my forum where it uses[b] and [/b] tags etc.

Can it be done to read UBB and output UBB??

Oh wait, I think the thing I'm typing in now does almost what I want.....Can I get a copy?

Thanks!


Benjamin
Staff


Jun 2, 2003, 6:46 PM

Post #2 of 21 (3988 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Hey Dave,

The WYSIWYG editor that's built-into our forums is actually produced by Gossamer Threads, not us, so I'm afraid we can't give you a copy! However, it shouldn't be too hard to replace simple HTML elements with their BB equivalents.

I'm sure this sort of thing has come up before. Are there any ready-made solutions out there?
Ben
interactivetools.com

(This post was edited by Benjamin on Jun 2, 2003, 6:47 PM)


Dave6625
Novice

Jun 2, 2003, 7:13 PM

Post #3 of 21 (3982 views)
Shortcut
Re: [Benjamin] I would like a UBB editor [In reply to] Can't Post

/*
* =================================================================
* HTML Editor - A wysiwyg web based editor for IE5.5+
* Website : http://gossamer-threads.com/
* Revision : $Id: editor.js,v 1.8 2002/05/15 02:03:36 jagerman Exp $
*
* Copyright (c) 2002 Gossamer Threads Inc. All Rights Reserved.
* Redistribution in part or in whole strictly prohibited. Please
* see LICENSE file for full details.
* =================================================================
*
* Description: Common functions needed to display the toolbar for an
* HTML-editing iframe, as used in Gossamer Forum.
*/

/* -- Javascript needed to write a post -- */




So I won't just copy it.



I'm an ASP Programmer (No Cert's, I'm just a 14yr kid) so I think I can figure out the JS stuff.

Where might I look to find where the HTML is read/outputted?



Thanks,

Dave


Luis
Veteran

Jun 2, 2003, 7:16 PM

Post #4 of 21 (3981 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Hi Dave6625:

I have not implemented it myself, but I'm pretty sure that editor.js is prepared to integrate vbcode.

Make a search for

// convert to vbCode

and uncomment the lines below. Then, you can add other tags following the same criteria.


Don't give up!!
http://webstationone.com/test/htmlarea


Benjamin
Staff


Jun 2, 2003, 7:17 PM

Post #5 of 21 (3980 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Hey Dave,

Sure - just look in the editor_filterOutput() function. This is called whenever the htmlArea is submitted along with a form, so you'll need to tweak the code there to replace the HTML tags with the new ones.

Good luck with this! Post us back if you have any luck / problems.
Ben
interactivetools.com


Dave6625
Novice

Jun 2, 2003, 9:02 PM

Post #6 of 21 (3973 views)
Shortcut
Re: [Benjamin] I would like a UBB editor [In reply to] Can't Post

OK, But I must need one to inturpret the input, correct? Like when the page is edited, the UBB has to be converted back to HTML for it to be displayed....or is that in 'editor_filterOutput() ' ?


Luis
Veteran

Jun 2, 2003, 9:51 PM

Post #7 of 21 (3964 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Sure. You need to make the conversions in the opposite way to convert bb code back to html.

search for:

// create editor
editor_obj.outerHTML = RichEdit;
editor_obj = document.all["_" +objname + "_editor"];
contents = contents.replace(/\[b\]/gi, '<b>');
contents = contents.replace(/\[\/b\]/gi, '<\/b>');

// get iframe document object


and follow the same criteria to add the substitutions.


Don't give up!!
http://webstationone.com/test/htmlarea


Dave6625
Novice

Jun 3, 2003, 2:29 PM

Post #8 of 21 (3931 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

Ok, I almost have enough info to do this...



contents = contents.replace(/\[url\]/gi, '<a href="');
contents = contents.replace(/\[\/url\]/gi, '"><\/a>');

To make the [url] and [/url] tags work, but I also need / would like it to work like this:
[url="thewebsite.com"]Visit The WebSite![/url]



Can it be done?



Thanks!,

Dave


Luis
Veteran

Jun 3, 2003, 2:55 PM

Post #9 of 21 (3928 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Try this out (not tested, just an idea)

contents = contents.replace(/\[url\]/gi, '<A HREF>');
contents = contents.replace(/\]/gi, '>');

contents = contents.replace(/\[\/url\]/gi, '<\/A>');



Don't give up!!
http://webstationone.com/test/htmlarea


Dave6625
Novice

Jun 3, 2003, 3:30 PM

Post #10 of 21 (3925 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

Hi Luis, I typed in [url]http://dave.com[/rl]
and the output was:
dave.com[/url>

I'll try to fix it, but JS is so hard for me Frown


Luis
Veteran

Jun 3, 2003, 4:06 PM

Post #11 of 21 (3922 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

I think you are missing something.
You need to convert first all <A HREF... and </A> to http://and in the first section (//convert to vbcode)
but the approach is a little bit different to the other tags. I'll give it a try for you later tonight.

Once you add the other part, you won't need to type http://anywhere. What the script will do is to convert any <A HREF="site.com">site</A> you insert to [url="site.com"]site in the output file.

By the way, which other tags are you allowing? What happen with the other tags that are not being converted to vbcode?
img, hr, tables, etc. You need to to disable those tags somehow.

Send me a list of which tags you are allowing.

Another tip. I remember have seen here in the forum a complete workaround in vbcode. Maybe its easier for you to make a search. Chances are that you find the posting in a shorter time than what you'll need to make all this hard and sensitive work.


Don't give up!!
http://webstationone.com/test/htmlarea


Dave6625
Novice

Jun 3, 2003, 4:31 PM

Post #12 of 21 (3916 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

Hi Luis,

All I did was uncomment the vbcode stuff and add the lines you gave me.

I tried myself and got this to work:

//contents = contents.replace(/\[url/, '<A HREF=');
//contents = contents.replace(/\]/gi, '>'/gi);
//contents = contents.replace(/\[\/url\]/gi, '<\/A>');

and it turns [url=whatever.com]Link text into a link correctly. I just need [url] and [url]...

I tried a search for 'vbcode' and found nothingFrown.

The tages I'm going to use are at (almost the same as this forum) http://forum.snitz.com/forum/pop_forum_code.asp
(the URL tags are not there though. ([url="link.com"]link text[/url] and [url]link.com[/url])

It won't matter if the user adds things in the htmlarea much, because it will be fixed when sent through the database (HTML '<' gets converted to '&at;'.


Dave6625
Novice

Jun 4, 2003, 1:58 PM

Post #13 of 21 (3884 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Any news?


Luis
Veteran

Jun 5, 2003, 1:44 AM

Post #14 of 21 (3871 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Here it is:

To avoid confussions, replace completely the function. Changes are in in red . Lines in blue must be a single line (no wrapping)

/* ---------------------------------------------------------------------- *\
Function : editor_filterOutput
Description :
\* ---------------------------------------------------------------------- */


function editor_filterOutput(objname) {
editor_updateOutput(objname);
var contents = document.all[objname].value;
var config = document.all[objname].config;


// ignore blank contents
if (contents.toLowerCase() == '<p>&nbsp;</p>') { contents = ""; }


// filter tag - this code is run for each HTML tag matched
var filterTag = function(tagBody,tagName,tagAttr) {
tagName = tagName.toLowerCase();
var closingTag = (tagBody.match(/^<\//)) ? true : false;


// fix placeholder URLS - remove absolute paths that IE adds
if (tagName == 'img') { tagBody = tagBody.replace(/(src\s*=\s*.)[^*]*(\*\*\*)/, "$1$2"); }


if (tagName == 'a') { tagBody = tagBody.replace(/(href\s*=\s*.)[^*]*(\*\*\*)/, "$1$2"); }


// add additional tag filtering here


//convert to vbCode
if (tagName == 'b' || tagName == 'strong') {
if (closingTag) { tagBody = ""; } else { tagBody = ""; }
}
else if (tagName == 'i' || tagName == 'em') {
if (closingTag) { tagBody = ""; } else { tagBody = ""; }
}
else if (tagName == 'u') {
if (closingTag) { tagBody = ""; } else { tagBody = ""; }
}


else if (tagName!== 'a'){
tagBody = ""; // disallow all other tags!
}


return tagBody;
};


// match tags and call filterTag
RegExp.lastIndex = 0;
var matchTag = /<\/?(\w+)((?:[^'">]*|'[^']*'|"[^"]*")*)>/g;


// this will match tags, but still doesn't handle container tags (textarea, comments,)

contents = contents.replace(matchTag, filterTag);
contents = contents.replace(/<A href/gi, "\');
contents = contents.replace(/>/gi, '\]');

// remove nextlines from output (if requested)
if (config.replaceNextlines) {
contents = contents.replace(/\r\n/g, ' ');
contents = contents.replace(/\n/g, ' ');
contents = contents.replace(/\r/g, ' ');
}


// update output with filtered content
document.all[objname].value = contents;


}


\* ---------------------------------------------------------------------- */

Then, search for // create editor

// create editor
editor_obj.outerHTML = RichEdit;
editor_obj = document.all["_" +objname + "_editor"];

contents = contents.replace(/\[b\]/gi, '<b>');
contents = contents.replace(/\[\/b\]/gi, '<\/b>');
contents = contents.replace(/\[i\]/gi, '<i>');
contents = contents.replace(/\[\/i\]/gi, '<\/i>');
contents = contents.replace(/\[u\]/gi, '<u>');
contents = contents.replace(/\[\/u\]/gi, '<\/u>');
contents = contents.replace(/\
/gi, '<\/A>');
contents = contents.replace(/\]/gi, '>');

// get iframe document object



Currently, the code takes care of bold, italics, underline and link. Any other tags are disabled until you add them. From here on, you should be able to add more tags you wish by yourself. Anyway, if you still have problems, contact me.

Good luck!!




Don't give up!!
http://webstationone.com/test/htmlarea


(This post was edited by Luis on Jun 5, 2003, 1:50 AM)


Dave6625
Novice

Jun 5, 2003, 3:43 PM

Post #15 of 21 (3845 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

Humm,

I just made the corrections and now I get a black textarea on the example.htm page.



Can you just Zip the editor.js or something...



I appreciate this!

Dave


Luis
Veteran

Jun 5, 2003, 4:56 PM

Post #16 of 21 (3842 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Something weird happened to my posting. The whole code is corrupted. I'll attach them zipped later tonight. I have the files at home and I'm at work now.


Don't give up!!
http://webstationone.com/test/htmlarea


Dave6625
Novice

Jun 5, 2003, 4:57 PM

Post #17 of 21 (3840 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

Ok Luis, thanks!



Again, I really appreciate this!


Luis
Veteran

Jun 5, 2003, 9:27 PM

Post #18 of 21 (3835 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Hope it work well this time.


Don't give up!!
http://webstationone.com/test/htmlarea


(This post was edited by Luis on Jun 5, 2003, 9:28 PM)
Attachments: editor_vb.js (83.7 KB)


Dave6625
Novice

Jun 6, 2003, 2:18 PM

Post #19 of 21 (3817 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

You added a lot of other stuff that I don't have, I don't know if that effects it or not.

It loads, but If I type [b] and [/b] it doesn't convert it.... Neither with the URLs.FrownFrown


Luis
Veteran

Jun 6, 2003, 2:41 PM

Post #20 of 21 (3816 views)
Shortcut
Re: [Dave6625] I would like a UBB editor [In reply to] Can't Post

Hey Dave:
The script works and works well. I added all the stuff I thought I should add. This is supossed to be a help for other people, not custom programming. I gladly share my mods to other people, but it's all I can do. I cannot spend all my time customizing software. In the file I attached are all the basics and it works perfectly in my end. From here on, you'll need to figure out what to do or what else you need to add or remove.

What I see here is that you have not an idea of what you are doing. You don't need to type-in the vbcode tags anywhere. What you need to do is to select the word, click on the corresponding button and when you submit the form, the output will be vbcodeA wordvbcode

Sorry for being that straight forward, but I'm convinced that the only way to learn how to do something is doing it yourself. You have the basics. Now everything depends on you and your will.


Don't give up!!
http://webstationone.com/test/htmlarea


(This post was edited by Luis on Jun 6, 2003, 2:46 PM)


Dave6625
Novice

Jun 6, 2003, 2:55 PM

Post #21 of 21 (3806 views)
Shortcut
Re: [Luis] I would like a UBB editor [In reply to] Can't Post

Boy do I feel dumbFrown

I was just using the example.htm file thatcame with it, and not submiting the form.

Thanks, It works perfectly when I submit it.

 
 
 


Search for (options)