Textile Wysiwyg editor

Added by Peter Lawrence about 14 years ago

I'm playing with the idea of developing a textile wysiwyg editor plugin for redmine. The current wysiwyg editor has it use but you need to convert all your existing pages to html and you loose the macro features of a wiki.

Since textile is the wiki format which is quite close to html, I'm using a system which converts the wiki textile page to html for use in Tinymce. Then once editing is complete it is converted back to textile. For the conversion process I'm using a modified versions of html2textile and RedCloth to convert to html.

My current prototype system displays the normal redmine editor however the user can switch to Tinymce via a radio button when editing a wiki page. It seems to work reasonably well except for a few formatting problems and some embedded images are displayed as "link not found" while in the wysiwyg editor.

My question is:-
I'm using a new Conversion controller which does the conversion between the two formats for the wiki editor page. What I was wondering is do I need to set any authorization "before" functions on my methods and/or do some initial string escaping to avoid string inserting attacks. I'm not sure this is necessary since my routines don't run any SQL commands just string manipulation routines.

The routes file is defined as..

#custom routes for this plugin
ActionController::Routing::Routes.draw do |map|
  map.with_options :controller => 'convert' do |convert_routes|
    convert_routes.connect "convert/wysiwygtohtmltotextile", :conditions => { :method => [:post, :put] }, :action 

=> 'wysiwygtohtmltotextile'
    convert_routes.connect "convert/wysiwygtotextiletohtml", :conditions => { :method => [:post, :put] }, :action 

=> 'wysiwygtotextiletohtml'
  end
end

and for example the code to convert from textile to html is...

def wysiwygtotextiletohtml
    @text=params[:content][:text]
    @text=HTMLFormatter.new(@text).to_html
    File.open("after_tohtml.txt", 'w') {|g| 
        g.write(@text)
    }
    render :partial => 'convert'
  end

Replies (77)

RE: Textile Wysiwyg editor - Added by Andreas Huebner about 14 years ago

Now, i rewrote the lines containing Ajax.Request()-calls by reforming the URL.

e.g.:

new Ajax.Request('/convert/wysiwygtohtmltotextile', {asynchronous:false, evalScripts:false, method:'post', onSuccess:function(request){UpdatePreviewTextile(request)}, parameters:TheText});

got to

new Ajax.Request('/redmine/convert/wysiwygtohtmltotextile', {asynchronous:false, evalScripts:false, method:'post', onSuccess:function(request){UpdatePreviewTextile(request)}, parameters:TheText});

Seems to work, till now.

Thanks again.

RE: Textile Wysiwyg editor - Added by Andreas Huebner about 14 years ago

Laughed too soon!

Now I have an issue with mutated vowels. The conversion cuts an Ü an its preceding character off. But one step after another... ;=)

RE: Textile Wysiwyg editor - Added by Ian Epperson almost 14 years ago

I was considering doing something like this as well - particularly after doing a lot of wiki table work! I'm glad to see it's being worked on. Let us know if there's help (test, documenting or coding) we can provide to push this to completion.

RE: Textile Wysiwyg editor - Added by Peter Lawrence almost 14 years ago

Ian thanks for the offer. I think coding is the main thing at the moment where work is required.
I'm currently working on the html to textile conversion functionality, where I'm trying out a some javascript to see if it can do a better job. The current ruby routine has problems with preformatted block statements and sub-lists.

Other areas which could be worked on are

User configurable options, i.e. which editor mode is used by default.
Extending the wysiwyg editor to all sections of redmine. The main issue here is the comment update screen where two input regions are required.
Improve the user interface options for switching between editors.

Feel free to work on any area of the code you feel like, even the html to textile code if you want.
Do you have a GitHub account?

RE: Textile Wysiwyg editor - Added by provetza provetza almost 14 years ago

quick question: How can you have the selector radio button on the top of the page, instead of being on the bottom?

Very nice tool!

RE: Textile Wysiwyg editor - Added by Peter Lawrence almost 14 years ago

You need to edit the html generated in the file help.rb found in
vendor\plugins\redmine_wysiwyg_textile\app\helpers\redmine_wysiwyg_textile\
Search for

 Input type = radio"

and move the code block to a new location.

RE: Textile Wysiwyg editor - Added by provetza provetza almost 14 years ago

Thanks for the reply Peter! Any ideas where I should copy the code? I guess I have to find the template responsible for the Wiki pages editing? Sorry, I'm a new redminer!

RE: Textile Wysiwyg editor - Added by Peter Lawrence almost 14 years ago

That's a tricky one to answer. What you suggest could work. The reason I placed these options at the base of the page was that was the simplest way to include them. Currently this application is still in development so at the time I wasn't too worried about the layout.

RE: Textile Wysiwyg editor - Added by Van Nam Nguyen over 13 years ago

Thanks you so much for this plugins. May i ask one question: do you still developing it?

RE: Textile Wysiwyg editor - Added by Peter Lawrence over 13 years ago

Yes I'm still working on this, just been tied up with work commitments.
When things ease off at work I'll get back on this.

RE: Textile Wysiwyg editor - Added by Van Nam Nguyen over 13 years ago

I had try your plugins with 1.1.1 version but it didn't work. I guest you are developing on 1.0 version?

RE: Textile Wysiwyg editor - Added by Peter Lawrence over 13 years ago

Version 1.1.1 should be a working version.
Since you didn't describe what was not working maybe checkout this previous post which may help..
http://www.redmine.org/boards/3/topics/17852?r=18982#message-18982

RE: Textile Wysiwyg editor - Added by Van Nam Nguyen over 13 years ago

I had try all previous post but can make it run properly. In wysiwyg mode it's still in html code when click Save button. I don't know why.

RE: Textile Wysiwyg editor - Added by Terence Mill over 13 years ago

I think the missing of a state of the art "Wysiwyg" in Redmine is one of the big drawbacks why many don't use it.
Such "Wysiwyg" would make it very attractive to non IT workers and spread usage away from only "hardcore" bug tracking. I think mayn use Jira because it offers such feature.
If that thing works quite well, i think mostly all people wanna see it in the trunk as part of the core.

Is there an estimation what else to do and how many days of works? Just to have an glue how far it is done?

RE: Textile Wysiwyg editor - Added by Dmitriy Belokurov over 13 years ago

Is there any way to add custom button to toolbar? It would be great!

RE: Textile Wysiwyg editor - Added by Peter Lawrence over 13 years ago

Van Nam Nguyen
Do you mean the wywsiwyg editor is not being activated. All you're getting is HTML code displayed in the editor box.

Terrence Mill,
Currently there's no estimation regarding how long this will take. The problem is I can only spend time on this project when I'm not busy with anything else. I've started writing version 2 of this software using javascript to convert from html to textile. As an estimate probably less than a weeks worth of work regarding getting the editor usable.

Dmitriy Belokurov
Yes see the TinyMCE edit website http://tinymce.moxiecode.com/

RE: Textile Wysiwyg editor - Added by Dmitriy Belokurov over 13 years ago

Thanks a lot! Good job!

RE: Textile Wysiwyg editor - Added by Alfredo Bonilla over 13 years ago

+1
I think is the right way to get wysiwyg in redmine. And as some others say, it would be great to extend this functionality to all the text fields in the application.
By the way, if the selected text formatting for redmine is "textile wysiwyg", maybe this should be the default edit option in the wiki... instead of having that select it always.

RE: Textile Wysiwyg editor - Added by Peter Lawrence over 13 years ago

Thanks for the feedback. I agree it should be extend to all fields.
However, this mod is only a prototype which needs considerable more work, hence the reason it's not currently the default option.

RE: Textile Wysiwyg editor - Added by Martti Laakso about 13 years ago

If I set it to wysiwyg and try to save (Or set it to wysiwyg and back to texil) it won't save the changes, but throws me to the login screen.

in the production log:
Filter chain halted as [:authorize] rendered_or_redirected.
Completed in 65ms (DB: 16) | 302 Found

Are there any alternatives for wysiwyg by now? Although this looks great if it fully worked.

RE: Textile Wysiwyg editor - Added by Peter Lawrence about 13 years ago

Maritti which version of Redmine are you using and what platform.
The main thing, when I get time or if someone else will volunteer, is to update this plugin for the latest release. Sorry for the lack of progress on this but been rather a busy year for me so far.

RE: Textile Wysiwyg editor - Added by Martti Laakso about 13 years ago

Hello Lawrence

I'm using the debian images from backports. The redmine version is 1.1.2
Please tell me if there is anything you'd like me to test

RE: Textile Wysiwyg editor - Added by Alexey Kalmykov about 13 years ago

Hello, Lawrence,

Currently I'm developing your plugin. I've noticied, that your plugin support standart Textile, but not Redmine Textile(wiki links, attachments,etc). I've added support for all tags(extended redcloth, changed html2textile converter and extended it also). In future, may be I'll develop support for wiki_extension plugin tags. Also, I've made an option for choosing default editor(in user options). I think I'll commit my changes on github in 1-2 weeks.

RE: Textile Wysiwyg editor - Added by Peter Lawrence about 13 years ago

Alexey,
Excellent. Let me know if you require any help/assistance? I look forward to seeing the new version.

RE: Textile Wysiwyg editor - Added by Terence Mill about 13 years ago

IS there a source code repo for this somewhere to join?

(26-50/77)

Project

General

Profile

Redmine