WYSIWYG Post Editor v1.0

WYSIWYG Post Editor

Description:
Lets you have a Microsoft Word/FrontPage-like editing box when you reply to threads, create new threads, and/or edit posts.

Features:
- Supports BBCode
- HTML is converted to BBCode
- Gives user a visual layout of what he/she is typing
- Supports dynamic bolding/underlining/etc.
- Has cool-looking Office XP-styled buttons.:bunny:
- Allows users to choose wether to use this editor, or vB's default one.
- Makes BBCodes obsolete
- And many more...:bunny:

Installation Time:
About 20-30 minutes.

Credits:
Toolbar, Original Coding and Design: eiSecure (http://www.eisecure.com)
Debugging & HTML to BBCode Conversion: Superman53142 (http://www.aoaforums.com)
User Options for WYSIWYG: Velocd (http://www.diffusion4.com)

NOTE:UNLIKE PREVIOUS VERSIONS, THIS ONE DOES NOT REQUIRE THAT YOUR FORUM HAS HTML ENABLED IN POSTS!

You can view a demo of the hack in action here: http://forums.eisecure.com

If you encounter any problems or if anything doesn't work right, or if the instructions aren't correct, then please post them here.

If you want to limit this hack to people who are using IE5.5 or above, click here for instructions.

Thanks,
Alex

[Martin CX]

When doing updates please remember that less is more in regards to size. It's enough that what was less than a 2K page (creating a new thread) is now more than 4K (horrific sizes, I know) - but the script runs slower the bigger it gets.

It would be very cool if your script was modular in the sense that it is easy to suss out what to delete because you don't need it, and it won't wreck the script. For example, I don't use smilies at all in my forums (my users vehemently abhors them!) so I don't need lots of extra code to do them properly - thus that is a part of the script I would delete.

[Erwin]

Thanks for the updates - works real well.

[memobug]

This is a great hack, but I'd love to see some kind of image handling, not necessarily an upload feature, which is kind of redundant, but maybe something similar to the links button that will let you insert an image already on the web.

Pops up an http://_____________ box, accepts a url and inserts it in a wyswig way.

It's the first thing I looked for when I saw your post. sniff

Oh well, this is about 100x better than the standard stoneage editor!

Regards,

Matt

[WallStreat]

Originally posted by Velocd
Great job Wallstreet, that defiantly helps! Alot of my members still didn't really know about the WYSIWYG editor because they had to switch it on, mostly the new registered users. One small problem is this WYSIWYG still has some bugs I and my members have noticed, if a member just doesn't want to use it I don't want to force them to install some older browser, I like to give them the option of turning it off....but that requires calling some queries.

as per birdie 501, incorp my mod & the user table hack, nake enabling wysiwyg as the default. hence for users who dun want to use it, they need to explicity trun it off:

if ( ($enableHTMLEdit == 1) AND ( ($bbuserinfo['enablewysiwyg']) ) ) {
eval("dooutput(\"".gettemplate("newthread_wysiwyg" )."\");");
} else {
eval("dooutput(\"".gettemplate("newthread")."\");" );
}

Another problem though, you said it checks if the browser is older than IE 5.5, but what about other browsers? I know alot of people use Mozilla, and as I last heard Mozilla 1.0 isn't compatible with the WYSIWYG, will it also check this and bypass it?

my code checks for browers that are MS IE & running under Windows OS & version is 5.5 & 6.x . I'm still researching on a way to make this evern more foolproof

[Boofo]

Is there any way to have it check for their browser and if it isn't IE 5.5 or 6.0, not even show the option to turn it on or off?

[Birdie501]

Originally posted by Boofo
Is there any way to have it check for their browser and if it isn't IE 5.5 or 6.0, not even show the option to turn it on or off?

i got it, just have to write instructions!

[Birdie501]

Originally posted by Boofo
Is there any way to have it check for their browser and if it isn't IE 5.5 or 6.0, not even show the option to turn it on or off?

Here we go:

Add a new template called wysiwyg_modifyoption:
Sorry but you have to translate back in english

PHP Code:

<tr>
<td bgcolor="#1D6AA0" colspan="2"><normalfont color="#EEEEFF"><b>WYSIWYG Modul</b></normalfont></td>
</tr>
<tr>
    <td bgcolor="#1C5780"><normalfont><b>M?chtest Du dasWYSIWYG Modul benutzen?</b></normalfont><br>
    <smallfont>Wenn Du ja w?hlst, kannst du den Text beim schreiben/?ndern eines Beitrages nach deinen W?nschen formatieren, ?hnlich wie in MS Word. (WYSIWYG = What You See Is What You Get) <br><b><u>Achtung:</u> Funktioniert nicht mit allen Internet browser. IE 6+ empfohlen!</b>
</smallfont></td>
    <td bgcolor="#1C5780"><normalfont>
        <input type="radio" name="enablewysiwyg" value="yes" $enablewysiwygchecked> ja
        <input type="radio" name="enablewysiwyg" value="no" $enablewysiwygnotchecked> nein
    </normalfont></td>
</tr> 


in template modifyoptions

find:

PHP Code:

<tr>
<td bgcolor="#1D6AA0" colspan="2"><normalfont color="#EEEEFF"><b>WYSIWYG Modul</b></normalfont></td>
</tr>
<tr>
    <td bgcolor="#1C5780"><normalfont><b>M?chtest Du dasWYSIWYG Modul benutzen?</b></normalfont><br>
    <smallfont>Wenn Du ja w?hlst, kannst du den Text beim schreiben/?ndern eines Beitrages nach deinen W?nschen formatieren, ?hnlich wie in MS Word. (WYSIWYG = What You See Is What You Get) <br><b><u>Achtung:</u> Funktioniert nicht mit allen Internet browser. IE 6+ empfohlen!</b>
</smallfont></td>
    <td bgcolor="#1C5780"><normalfont>
        <input type="radio" name="enablewysiwyg" value="yes" $enablewysiwygchecked> ja
        <input type="radio" name="enablewysiwyg" value="no" $enablewysiwygnotchecked> nein
    </normalfont></td>
</tr> 


and replace with

PHP Code:

$wysiwyg_option 


in member.php

find:

PHP Code:


if ($bbuserinfo[userid]==0 or $permissions['canmodifyprofile']==0) {
    show_nopermission();
  } 


after that add:

PHP Code:


if ($enableHTMLEdit == 1) {
    if ($bbuserinfo[enablewysiwyg]) {
     $enablewysiwygchecked="checked";
     $enablewysiwygnotchecked="";
  } else {
     $enablewysiwygchecked="";
     $enablewysiwygnotchecked="checked";
  }
    eval ("\$wysiwyg_option .= "".gettemplate("wysiwyg_modifyoption")."";");
    } else {
    $wysiwyg_option="";
  } 


Thats all.

It works for me, i just tested with Navigator 6.0 and nothing was shown!

[Boofo]

I hate to be a pain here, but can somebaody translate this part for me?

PHP Code:

<tr>
<td bgcolor="#1D6AA0" colspan="2"><normalfont color="#EEEEFF"><b>WYSIWYG Modul</b></normalfont></td>
</tr>
<tr>
    <td bgcolor="#1C5780"><normalfont><b>M?chtest Du dasWYSIWYG Modul benutzen?</b></normalfont><br>
    <smallfont>Wenn Du ja w?hlst, kannst du den Text beim schreiben/?ndern eines Beitrages nach deinen W?nschen formatieren, ?hnlich wie in MS Word. (WYSIWYG = What You See Is What You Get) <br><b><u>Achtung:</u> Funktioniert nicht mit allen Internet browser. IE 6+ empfohlen!</b>
</smallfont></td>
    <td bgcolor="#1C5780"><normalfont>
        <input type="radio" name="enablewysiwyg" value="yes" $enablewysiwygchecked> ja
        <input type="radio" name="enablewysiwyg" value="no" $enablewysiwygnotchecked> nein
    </normalfont></td>
</tr> 


[Birdie501]

just use this part from the original instruction file

[Boofo]

Which section should this go under? I put it under the start modify options section.

if ($enableHTMLEdit == 1) {
    if ($bbuserinfo[enablewysiwyg]) {
     $enablewysiwygchecked="checked";
     $enablewysiwygnotchecked="";
  } else {
     $enablewysiwygchecked="";
     $enablewysiwygnotchecked="checked";
  }
    eval ("\$wysiwyg_option .= \"".gettemplate("wysiwyg_modifyoption")."\";");
    } else {
    $wysiwyg_option="";
  }

There are 4 sections in there with:

if ($bbuserinfo[userid]==0 or $permissions['canmodifyprofile']==0) {
    show_nopermission();
  }

Originally posted by Birdie501
just use this part from the original instruction file