View Issue Details

IDProjectCategoryView StatusLast Update
0012325mantisbtuipublic2024-02-02 10:29
Reportercas Assigned To 
PrioritynormalSeverityfeatureReproducibilityN/A
Status newResolutionopen 
Product Version1.2.2 
Summary0012325: Adding WYSIWYG editor to text areas
Description

Have been playing with this feature and inially it is working ok.
I used the TinyMCE editor.
What to do :
Simply copy the editor files into the javascript directory so you end up with a structure like:
Javascript
-TinyMCE
---Langs
---Plugins

In order to actyivate BBCODE install the available BBCODE plugin.
This plugin requires 3 additional lines in order to facilitate Code en Quote options.
In config_inc.php add this line:
$g_use_wysiwyg = ON ;

Steps To Reproduce

in bbcode.php From the plugin) add these 3 lines (around line 26):
$p_string = str_replace("\n","",$p_string);
$p_string = preg_replace( '/[code](.+)[\/code]/im', "<pre>\$1</pre>", $p_string );
$p_string = preg_replace( '/[quote](.+)[\/quote]/im', "<p>Quote:<br /><blockquote>\$1</blockquote></p>", $p_string );

Additional Information

Just as a very simple solution to ensure availability on all places, i added the following code to core.php (no that is not where it should be, but for this purpose, it simply worked):
if ( ON == config_get('use_wysiwyg')){
?>
<!-- TinyMCE -->
<script type="text/javascript" src="./javascript/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
theme : "advanced",
mode : "textareas",
plugins : "bbcode",
theme_advanced_buttons1 : "bold,italic,underline,undo,redo,image,forecolor,styleselect,removeformat,cleanup,code",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "bottom",
theme_advanced_toolbar_align : "center",
theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle",
content_css : "css/bbcode.css",
entity_encoding : "raw",
add_unload_trigger : false,
remove_linebreaks : false,
inline_styles : false,
convert_urls : false
});
</script>
<!-- /TinyMCE -->
<?PHP
}

TagsNo tags attached.
Attached Files
Wysiwyg100.zip (7,458 bytes)
Wysiwyg_distro101.zip (1,562,043 bytes)

Relationships

related to 0017920 closedjoel Native markdown support 
has duplicate 0012744 closeddregad WYSIWYG editor integration 
has duplicate 0020167 closedatrol Code/Syntax highlighter 
has duplicate 0022162 closedatrol WYSIWYG plugin 
has duplicate 0022365 closedatrol WYSIWYG editor And Paste Picture 
has duplicate 0029745 closedatrol Want to an text editor 

Activities

cas

cas

2010-09-13 02:36

reporter   ~0026695

Will become available as plugin. Now looking into the option of adding Highlight functionality (incorporating Geshi or another tool).

TomR

TomR

2011-01-03 11:34

reporter   ~0027786

Hello Cas,

how is this plugin progressing? I am very interested in this feature. There is another Wysiwyg plugin, but that seems to have some trouble.

Are there more features available in this TinyMCE editor, like Cut, Copy, Paste?

The only thing I do not fully understand is what you above describe in Steps to reproduce: I seem not able to use the code and blockquote options.

thomasb

thomasb

2011-01-06 01:37

reporter   ~0027818

Have a look on http://www.mantisbt.org/forums/viewtopic.php?f=4&amp;t=3086 - see thomasbrooks's note there.

cas

cas

2011-01-06 08:16

reporter   ~0027823

One of the issues I was encountering, is malformed emails after activating TinyMCE. Will try again with the suggestions from Thomas.

cas

cas

2011-01-12 07:28

reporter   ~0027911

The solution from Thomas works also only "onscreen". Once you send out emails, they are malformed with the html codes.
This is exactly the same issue I had. Incorporating such editor has more impact than initially expected.

dregad

dregad

2011-01-12 10:13

developer   ~0027912

Hi cas,

Not sure how easily this could be adapted or integrated with your plugin, but maybe you could use something like http://www.chuggnutt.com/html2text.php to convert TinyMCE html to "formatted" plain text. That would require some work on the email API (not sure if there are any usable plugin hooks in there)

D

cas

cas

2011-01-12 10:43

reporter   ~0027913

Currently the only hooks available are to include/exclude people from the recipients list. It looks like it can be handled by simply(?) adjusting the function "email_send".
I will give this another shot once i find some time. Sofar the only problem area is with the mail function. If people see other possible issues, please list them out.

cas

cas

2011-01-13 06:07

reporter   ~0027924

Last edited: 2011-01-13 06:08

Here is the plugin for mantis 1.2.* to achieve wysiwyg functionality in Mantis.
In order to keep the emails ok, I have defined an event in email_api.php which allows to handle the body of the email. Using indeed (thanks dregad) html2text, the body is converted to plain text.
Apparently there is an option to send out HTML enabled email but this has been hardcoded set to 'false'. Not sure why this was hardcoded as such (if time permits, will investigate it).
tiny_mce needs to be downloaded and placed within the mantis javascript directory. Please see doc for correct place.
There is nothing to configure to this plugin, should work out of the box, after proper installation.

Highlighting is not part of this plugin, not even sure if it makes sense to add it anyway.

thomasb

thomasb

2011-01-13 16:18

reporter   ~0027930

Hello cas!
Thanks for the plugin!
I've noticed the email problem and same problem exists by RSS as well.
Using html2text, ot isHTML(true), solves the html tags problem, but detroyes the entire design of the email, which is meaningful in the Issue History part, for example.

We should find a way to translate only the html tags inside text areas, such as Description, Steps to Reproduce, Notes etc. to text, without the price of destroying the mail design.

html2text may be considered for the RSS, where there isn't any special design.

cas

cas

2011-01-17 04:01

reporter   ~0027960

Last edited: 2011-01-17 04:02

I need to check the linebreak functionality, that is where something is going wrong.
To be continued.....

yar

yar

2011-01-29 16:06

reporter   ~0028113

Last edited: 2011-01-29 16:08

Hi cas and MantisBT community,
yes, i also met extra linebreak (br /) problem when I inserted TinyMCE. To solve it I simply commented all lines like this
$t_string = string_nl2br( $t_string );
in plugins\MantisCoreFormatting\MantisCoreFormatting.php
(3 times in that file). The database does not have this (br /) in fields. This is just a problem of output formatting. (I used round braces as replacement of angle braces in my post ) HTH.

cas

cas

2011-01-31 05:01

reporter   ~0028116

Attached a full WYSIWYG set, version 1.01, which should cover most of the issues mentioned so far.
The solution given by yar works perfectly (till now)on the linebreaks.
Added a solution on RSS which needs to be verified.
In the distro also the main 2 core files that i have changed including the Tiny_mce set.

TomR

TomR

2011-02-01 05:18

reporter   ~0028139

Last edited: 2011-02-01 05:31

When I now use this: the remove of all formatting in the email Fix_body function will result in 1 long line for my email ( it seems NewLines and BReaks are removed ). So my email is not readable anymore.

What I am missing?

cas

cas

2011-02-01 06:07

reporter   ~0028140

Last edited: 2011-02-01 06:12

Tom,
did you made the adjustment to the MantisCoreFormatting plugin as described in the docs (or in note 0012325:0028113 )?

TomR

TomR

2011-02-01 06:32

reporter   ~0028141

Last edited: 2011-02-01 08:02

Cas, I tried that without luck.

I am now testing with HTLM on in the emails:

$mail->IsHTML( true );

However the only thing not working is: line 1358 email_api.php

return utf8_str_pad( lang_get( $attribute_id ) . ': ', config_get( 'email_padding_length' ), ' ', STR_PAD_RIGHT ) . $p_visible_bug_data[$attribute_id] . "\n";

It is not filling with spaces aligned to the right. It only uses 1 space. However if you take another character, it seems to work. Strange?

TomR

TomR

2011-02-01 14:05

reporter   ~0028142

Can anyone verify if this plugin does disables you graphs? Both my relationship graphs as well as the other graphs are not working anymore with this plugin installed.

cas

cas

2011-02-02 06:04

reporter   ~0028143

Tom,
yep you are right, it "screws" the graphs.
Need to dive into that.

atrol

atrol

2011-02-02 06:38

developer   ~0028144

Last edited: 2011-02-02 06:44

just a guess, I didn't try
remove the tabs at the beginning of line 55 of Wysiwyg.php (in front of <?PHP)

cas

cas

2011-02-02 08:47

reporter   ~0028146

Tried that but, unfortunately, no effect.
Once Tiny_mce loaded the graphs fail.
Actually unloaded the plugin and loaded tiny_mce within core.php directly, same effect.
Somewhere a compatibility issue.
Currently also looking at alternate editor

cas

cas

2011-02-03 03:27

reporter   ~0028147

Last edited: 2011-02-03 04:01

Using WYZZ, NICEDIT, CKEDITOR or XINHA has the same effect.
Looks like that any java script editor is messing with the graphs.
Anyone a suggestion for an editor that i could try ?

cas

cas

2011-02-07 02:52

reporter   ~0028172

Contacted the graphviz guys if they receognized this incompatibility but unfortunately they do not.
Noticed there is someone else working on a similar thing ( 0012744 ).

If someone has a clue, let us know.

yar

yar

2011-02-07 03:00

reporter   ~0028173

Hi cas and MantisBT community,
I met 2 more painful bugs if I use TinyMCE in Mantis.
The problem appears in IE7 (only) or if you set up IE8 to
work in a mode of IE7 (Tools, Developer Tools, Browser Mode: IE7).
(If standard mode IE8 is on, than this bug does not appears, all works fine).

bug 1. On page Report Issue (bug_report_page.php), I full-fill Summary
and Description as mandatory fields. I enter some text to both fields but when I press [Submit Report] button, than this error message appears:

APPLICATION ERROR #11
A necessary field "Description" was empty. Please recheck your inputs.
Please use the "Back" button in your web browser to return to the previous page. ...

And the Issue is not saved and if I click [Back] button, than field 'Description' (where TinyMCE is placed) is blank (field Summary has the entered text).
So, I suppose on [Submit Report] there is no text comes from TinyMCE, so this result this error.

bug 2. On page Updating Issue Information (bug_update_page.php), where I can update all information related to the issue, only field Description has TinyMCE editor. Fields Steps To Reproduce, Additional Information, Add Note has simple text box area. (not TinyMCE as it should be). And, the Description field is blank (it should be populated with the text (entered earlier in another browser)).
If I click [Update Information] than no message appears, but fields Description
is not saved.

Any suggestion how to fix this will be appreciated.

cas

cas

2011-02-07 03:52

reporter   ~0028174

@yar,
I cannot reproduce this behavior. Have tried this in ie8 with & without compatibility mode. You are also using 1.2.4?

Nevertheless as long as the issue with the graphs is not solved, this plugin is not suitable for production systems.

yar

yar

2011-02-07 04:11

reporter   ~0028175

Last edited: 2011-02-13 08:25

@cas,
thanks for quick answer. Yes, I use 1.2.4. I simply met this when I have to use IE7 (and no other browser were available at that place). And than reproduced this in IE8 working in IE7 mode. Not sure however that I use exactly the same configuration/files/etc. of this plugin (may be something custom made) - will check at the week.
Update: I checked, it looks like the configuration is the same. But my problem is that mantisbt (and TinyMCE) is installed in subdomain, like sub.domain.info. It looks like it results to problems. I tried to use parameters like
script_url: 'javascript/tiny_mce/tiny_mce.js',
document.domain : 'sub.domain.info',
document_base_url : \"http://sub.domain.info/\&quot;
in tinyMCE.init() (in function html_head_begin()), and played a bit with different combination (also without document.domain for example), but it does not helped. (I used versions of TinyMCE: 3.3.9.3 and the latest 3.4b3)

Mete

Mete

2011-10-18 15:38

reporter   ~0029988

Last edited: 2011-10-18 15:41

@cas

Is it possible to have a setting that can be instantly display completely. The default is yes, the small toolbar or reduced (no picture uploading, code php, etc.) to see.

cas

cas

2011-10-20 08:28

reporter   ~0030006

Think that is possible but lately I have not done much work on this since it was messing up my graphics.

michael-milette

michael-milette

2014-03-27 11:11

reporter   ~0039747

Hi Cas,

Thank you for making this plugin available. I wish such functionality was integrated into the core MantisBT code.

I recently adapted the plugin for my own use. Changes include the following:

  • Updated for the latest MantisBT 1.2.17 (was 1.2.4).
  • Updated to the latest TinyMCE to 3.5.10 (was 3.3.9).
  • All modifications to MantisBT are included for easier installation. You no longer need to modify any files. Just copy in place, activate it and it works!
  • You can now easily enable/disable WYSIWYG editor by setting $g_use_wysiwyg = ON (enabled) or OFF (disabled) in config_inc.php.
  • Set the editor width to always be 100%.
  • Set minimum height to 230px.
  • Now ends container block elements when pressing enter inside an empty block.
  • Reorganized the editor's toolbar icons and added a few new ones.

In order to share these changes, I would need to know, under what license you are making your plugin available?

Both MantisBT and TinyMCE 3.x are licensed under the GNU license. Can I assume your plugin falls under the same?

Thanks again for this very useful plugin.

Best regards,

Michael

atnz

atnz

2014-05-25 15:26

reporter   ~0040636

Hi Michael, Can you upload your files? We are also really interested in WYSIWYG in the notes and description fields. Does yours work if you copy text from a web page and then paste into the text box? or do you get a whole bunch of HTML control characters?

mfernau

mfernau

2015-11-21 08:00

reporter   ~0051912

It would be nice to have such an editor in one of the upcoming Mantis releases.

Or make Mantis graphics compatible so that TinyMCE can be used as such an editor (see 0012325:0030006)

atnz

atnz

2017-01-08 15:37

reporter   ~0054980

With v2.0 and it being 2017.... Surely WYSIWYG controls for text should be standard?

kierun

kierun

2017-02-09 07:58

reporter   ~0055612

Any updates on this at all since there is markdown native support in 2.1.0?

atnz

atnz

2017-02-23 01:16

reporter   ~0055751

Any news on this?

hdueo

hdueo

2018-03-28 21:59

reporter   ~0059344

news?

Aymen Zamoum

Aymen Zamoum

2022-03-15 11:45

reporter   ~0066364

Last edited: 2022-03-15 11:49

Does someone find a solution to add a text editor for the mantis 2.X ?

martin.fernau

martin.fernau

2022-04-22 09:42

reporter   ~0066467

We use Mantis 2.25.0 and the BBCodePlus plugin. This works quite well.
However, I would be more happy to have a more complex editor which makes it possible to drag+drop images to use them inline between text

pysiek

pysiek

2023-04-12 10:15

reporter   ~0067640

I have prepared a plugin that uses TinyMCE and allows you to directly paste images.
Test it if you want.
https://github.com/pysiek634/VEditor

Best regards,
Pysiek

martin.fernau

martin.fernau

2023-04-12 11:20

reporter   ~0067641

Nice, that looks promising. Unfortunately TinyMCE seems to have problems correctly re-formatting "Code" if you edit a post.

Example:
If I insert XML as a code block for a comment and save this - all looks good. But if I edit this post again, all XML-Tags are filtered out and destroys the content. See pictures.

I didn't checked this for other languages (COBOL, JSON, C, JAVA..) but it seems that TinyMCE only support a general "code" block instead of a more complex language specific highlighting like BBCodePlus can do. This is not a big problem. I think I would likely have the possibility to use screenshots that easy like TinyMCE can do this for me as having a syntax highlighting. But at least I really need a working code block.

Furthermore the default BBCodes (like [ i], [ b], and so on) are also not ported. So if I use your plugin, all the "old" bug reports looks "ugly" as they do not have their intended formatting then. This is somewhat between a minor to major problem as this would get fixed as longer as TinyMCE would be uses.. But at the very beginning all posts are "corrupted"

pysiek

pysiek

2023-04-13 04:38

reporter   ~0067645

If you want use code block in TinyMCE, probably you should enable <B>code sample</B> plugin
https://www.tiny.cloud/docs/tinymce/6/codesample/
BBCodes can be easily converted to html code. You can find many tools for this purpose.

martin.fernau

martin.fernau

2023-04-13 06:45

reporter   ~0067646

Okay thanks. the codesample Plugin is great.
However - for unknown reason the '<' and '>' are not correctly escaped and messing up the whole entry if one edit a post

Battroid

Battroid

2024-01-28 12:47

reporter   ~0068474

Last edited: 2024-01-28 14:58

Would really be great if there was a plugin working all the way (including updating the description). Looking at the history this request is 14 years old and I think it's still a great idea. The most important thing I am missing is that you cannot copy paste Text and pictures in the Description field. This is how users work nowadays: Type problem and add screenshot. Scrolling up and down to see the screenshots in "notes" and typing refernces like "see pic 1", "see pic 2" is not that user-friendly. I love MantisBT, this is something that would really improve usability for reporters.

It would be a blast if the MBT team could invest time on this. Thank you.

dregad

dregad

2024-01-28 15:02

developer   ~0068475

@Battroid I fully agree that having more modern editing capabilities in MantisBT would be great. Unfortunately, I'm (almost) the only active developer these days, and I only have very little time that I'm able to spend on this software so don't get your hopes too high. Contributions are always welcome though.

pysiek

pysiek

2024-01-29 03:26

reporter   ~0068483

My plugin https://github.com/pysiek634/VEditor
supports copy & paste for screenshots. I think it could be of interest to a fair number of Mantis users.
Maybe it's worth uploading it to the plugins page? https://www.mantisbt.org/wiki/doku.php/mantisbt:plugins:start
I could also help customize it to make it ready for inclusion in Mantis.

amphetamine

amphetamine

2024-01-29 04:25

reporter   ~0068484

Your plugin should be posted here: https://github.com/mantisbt-plugins

dregad

dregad

2024-01-29 04:41

developer   ~0068485

@pysiek

Maybe it's worth uploading it to the plugins page? https://www.mantisbt.org/wiki/doku.php/mantisbt:plugins:start

Sure. By all means feel free to update the page to add your plugin there.

Please read https://www.mantisbt.org/wiki/doku.php/mantisbt:plugins:start#the_github_mantisbt-plugins_organization to have it included in the mantisbt-plugins org.

Battroid

Battroid

2024-01-29 12:38

reporter   ~0068488

at dregad: Thanks for you answer. You and the MantisBT team are really doing a great job over all the years! Thanks for that!
at pysiek: Okay, I'd like to try it but I read something about security matters because of the third party module. I am not too deep in these things, is that something that I have to be concerned about? Wouldn't want my customers to have any breaches.

pysiek

pysiek

2024-01-30 06:21

reporter   ~0068489

Unfortunately, bugs happen in all software. For security, I use code from other developers.
This plugin is based on code provided by the TinyMCE team. HtmLawed library is used to render the output content.
However, there may be some issues which I will fix when someone reports them.
I have been using this plugin at my company for two years. This functionality is also only available if you are logged in.
You can also define which pages you want replace by visual editor and provide different set of plug-ins for TinyMCE, depending on the access level.

Battroid

Battroid

2024-02-01 13:25

reporter   ~0068496

Hi pysiek,

I installed it as described but nothing happens. What am I missing?

Thanks in advance
Bat

image.png (10,256 bytes)   
image.png (10,256 bytes)   
image-2.png (74,134 bytes)   
image-2.png (74,134 bytes)   
pysiek

pysiek

2024-02-02 10:29

reporter   ~0068498

Try login in english.
TinyMCE is not run on all pages.
Only 'bugnote_edit_page.php', 'view.php', 'bug_update_page.php', 'bug_report_page.php', 'bug_change_status_page.php' in default configuration.

If you can't run this plugin, let's try to connect remotely and see the issue together.
Let's have further discussion via email. You can contact me at http://scr.im/p2024