Mailing List Archive: Catalyst: Users

HTML editor plugin

Index | Next | Previous | View Threaded

paul at cassens

Feb 3, 2010, 5:02 AM

Post #1 of 12 (2256 views)
Permalink

HTML editor plugin

I'm looking to create a little app to edit/create HTML strings to store
in a mysql table. These strings are going to be displayed on a web page for annoucements
for a youth baseball league. Before I went about creating one I thought I'd ask
if there is a plugin/example out there I should use as a starting point.
Basically, I need a Catalyst html editor plugin if such a thing exists.

Thanks in Advance!

-Paul

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

2010 at denny

Feb 3, 2010, 5:32 AM

Post #2 of 12 (2191 views)
Permalink

Re: HTML editor plugin [In reply to]

On Wed, 2010-02-03 at 07:02 -0600, Paul Falbe wrote:
> I'm looking to create a little app to edit/create HTML strings to
> store in a mysql table. These strings are going to be displayed on
> a web page for annoucements for a youth baseball league. Before I
> went about creating one I thought I'd ask if there is a plugin/example
> out there I should use as a starting point. Basically, I need a
> Catalyst html editor plugin if such a thing exists.

Not Catalyst specific, but I've used ckeditor* in the past - it's a
drop-in replacement for <textarea> with a load of configuration options.

Bear in mind the obvious security risks of letting people input HTML and
then injecting it directly into your site - at a bare minimum you want
to strip out javascript stuff, including onclick etc.

* used to be called fckeditor, seems to have changed recently.

Attachments:

signature.asc (0.19 KB)

webmaster at cosmicperl

Feb 3, 2010, 5:45 AM

Post #3 of 12 (2197 views)
Permalink

Re: HTML editor plugin [In reply to]

Paul Falbe wrote:
> I'm looking to create a little app to edit/create HTML strings to store
> in a mysql table. These strings are going to be displayed on a web page for annoucements
> for a youth baseball league. Before I went about creating one I thought I'd ask
> if there is a plugin/example out there I should use as a starting point.
> Basically, I need a Catalyst html editor plugin if such a thing exists.
>

I was looking at doing something like this recently. Was going to use a
load of code from MojoMojo to deal with revisions, etc, from a SQLite
DB. Then TinyMCE on the front.

Lyle

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

tobias.kremer at gmail

Feb 3, 2010, 5:51 AM

Post #4 of 12 (2197 views)
Permalink

Re: HTML editor plugin [In reply to]

> I was looking at doing something like this recently. Was going to use a load
> of code from MojoMojo to deal with revisions, etc, from a SQLite DB. Then
> TinyMCE on the front.

I'll second that. TinyMCE has proven to be very configurable,
extensible, easy to use and produces quite clean markup.

--Tobias

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

troy at digissance

Feb 3, 2010, 5:54 AM

Post #5 of 12 (2190 views)
Permalink

Re: HTML editor plugin [In reply to]

Paul Falbe wrote:
> I'm looking to create a little app to edit/create HTML strings to store
> in a mysql table. These strings are going to be displayed on a web page for annoucements
> for a youth baseball league. Before I went about creating one I thought I'd ask
> if there is a plugin/example out there I should use as a starting point.
> Basically, I need a Catalyst html editor plugin if such a thing exists.

Be sure to take a look at Xinha:

http://trac.xinha.org/

I reviewed most of the editors mentioned in this thread while at a previous job, and found Xinha to have the richest set of usable features.

Cheers,
Troy

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

davewood at gmx

Feb 3, 2010, 6:56 AM

Post #6 of 12 (2189 views)
Permalink

Re: HTML editor plugin [In reply to]

On Wed, Feb 3, 2010 at 2:32 PM, Denny <2010 [at] denny> wrote:
> On Wed, 2010-02-03 at 07:02 -0600, Paul Falbe wrote:
>> I'm looking to create a little app to edit/create HTML strings to
>> store in a mysql table. These strings are going to be displayed on
>> a web page for annoucements for a youth baseball league. Before I
>> went about creating one I thought I'd ask if there is a plugin/example
>> out there I should use as a starting point. Basically, I need a
>> Catalyst html editor plugin if such a thing exists.
>
> Not Catalyst specific, but I've used ckeditor* in the past - it's a
> drop-in replacement for <textarea> with a load of configuration options.
>
> Bear in mind the obvious security risks of letting people input HTML and
> then injecting it directly into your site - at a bare minimum you want
> to strip out javascript stuff, including onclick etc.

I use TinyMCE and HTMLScrubber to define the allowed html tags.
http://search.cpan.org/~cfranks/HTML-FormFu-0.06001/lib/HTML/FormFu/Filter/HTMLScrubber.pm

- type: Textarea
name: 'description'
filters:
- type: HTMLScrubber
allow: [. 'a', 'p', 'br', 'strong', 'em', 'h1', 'h2', 'h3',
'img', 'ul', 'ol', 'li' ]

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

paul at cassens

Mar 1, 2010, 7:03 PM

Post #7 of 12 (1564 views)
Permalink

Re: HTML editor plugin [In reply to]

On Wed, Feb 03, 2010 at 02:51:23PM +0100, Tobias Kremer wrote:
> > I was looking at doing something like this recently. Was going to use a load
> > of code from MojoMojo to deal with revisions, etc, from a SQLite DB. Then
> > TinyMCE on the front.
>
> I'll second that. TinyMCE has proven to be very configurable,
> extensible, easy to use and produces quite clean markup.
>

Is there a exmaple somewhere where I can see howto insert this code
into a page made made FormBuilder i.e. the "tt" file?

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

tobias.kremer at gmail

Mar 2, 2010, 2:03 AM

Post #8 of 12 (1552 views)
Permalink

Re: HTML editor plugin [In reply to]

On Tue, Mar 2, 2010 at 4:03 AM, Paul Falbe <paul [at] cassens> wrote:
> Is there a exmaple somewhere where I can see howto insert this code
> into a page made made FormBuilder i.e. the "tt" file?

Our code which uses TinyMCE is not in production yet, so unfortunately
I can't give you any online examples. But there is nothing special to
incorporating TinyMCE into your TT templates because it works in an
unobtrusive way. Just render your FormBuilder forms and add the
TinyMCE javascript which will turn every (or selected) textarea(s) on
the page into a rich-text editor without you having to alter your form
rendering process.

--Tobias

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

paul at cassens

Mar 2, 2010, 4:30 AM

Post #9 of 12 (1553 views)
Permalink

Re: HTML editor plugin [In reply to]

On Tue, Mar 02, 2010 at 11:03:28AM +0100, Tobias Kremer wrote:
> On Tue, Mar 2, 2010 at 4:03 AM, Paul Falbe <paul [at] cassens> wrote:
> > Is there a exmaple somewhere where I can see howto insert this code
> > into a page made made FormBuilder i.e. the "tt" file?
>
> Our code which uses TinyMCE is not in production yet, so unfortunately
> I can't give you any online examples. But there is nothing special to
> incorporating TinyMCE into your TT templates because it works in an
> unobtrusive way. Just render your FormBuilder forms and add the
> TinyMCE javascript which will turn every (or selected) textarea(s) on
> the page into a rich-text editor without you having to alter your form
> rendering process.

Tobias,

So, are you doing something like

<script type="text/javascript" src="/jscripts/tiny_mce/tiny_mce.js"></script>

or just putting the actual code of tiny_mce.js into the formbuilder form?
Aso, are you developing hooks to upload images also? If so I'd like to see that if possible.
Please forgive my repeated questions I don't do much web development.

-Paul

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

mamod.mehyar at gmail

Mar 2, 2010, 4:44 AM

Post #10 of 12 (1550 views)
Permalink

Re: HTML editor plugin [In reply to]

Hi

We are using CKeditor in our project but this should not be a different case
than TinyMCE as they all work the same

All you need to do is place the the javascript file location at the top of
your tt page as your example
<script type="text/javascript" src="/jscripts/tiny_mce/tiny_
mce.js"></script>

make sure the path above is located in the static folder

then at the bottom page include the rendering script as described in TinyMCE
documentation

in our case using CKeditor our tt page looks like this

------------

<script type="text/javascript" src="/static/ckeditor/ckeditor.js"></script>

<form class="form" id="form" method="post" action="/admin">

<fieldset>
<legend>HTML Page</legend>
<div>
<textarea name="htmlarea" cols="10" rows="5" id="htmlarea">[%
data.content %]</textarea>
</div>
</fieldset>

<input type="submit" value="submit>"
</form>

<script type="text/javascript">

CKEDITOR.replace( 'htmlarea' );

</script>

hope this was helpful

On Tue, Mar 2, 2010 at 3:30 PM, Paul Falbe <paul [at] cassens> wrote:

> On Tue, Mar 02, 2010 at 11:03:28AM +0100, Tobias Kremer wrote:
> > On Tue, Mar 2, 2010 at 4:03 AM, Paul Falbe <paul [at] cassens> wrote:
> > > Is there a exmaple somewhere where I can see howto insert this code
> > > into a page made made FormBuilder i.e. the "tt" file?
> >
> > Our code which uses TinyMCE is not in production yet, so unfortunately
> > I can't give you any online examples. But there is nothing special to
> > incorporating TinyMCE into your TT templates because it works in an
> > unobtrusive way. Just render your FormBuilder forms and add the
> > TinyMCE javascript which will turn every (or selected) textarea(s) on
> > the page into a rich-text editor without you having to alter your form
> > rendering process.
>
> Tobias,
>
> So, are you doing something like
>
> <script type="text/javascript"
> src="/jscripts/tiny_mce/tiny_mce.js"></script>
>
> or just putting the actual code of tiny_mce.js into the formbuilder form?
> Aso, are you developing hooks to upload images also? If so I'd like to see
> that if possible.
> Please forgive my repeated questions I don't do much web development.
>
> -Paul
>
> _______________________________________________
> List: Catalyst [at] lists
> Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
> Searchable archive:
> http://www.mail-archive.com/catalyst [at] lists/
> Dev site: http://dev.catalyst.perl.org/
>

tobias.kremer at gmail

Mar 2, 2010, 4:53 AM

Post #11 of 12 (1549 views)
Permalink

Re: HTML editor plugin [In reply to]

On Tue, Mar 2, 2010 at 1:30 PM, Paul Falbe <paul [at] cassens> wrote:
> Tobias,
> So, are you doing something like
> <script type="text/javascript" src="/jscripts/tiny_mce/tiny_mce.js"></script>

Exactly! We don't use FormBuilder but here's a short excerpt from our
TT template which uses TinyMCE:

$(function() {
$('textarea.wysiwyg').tinymce( {
script_url : '[% site.url.static %]js/tiny_mce/tiny_mce.js',
mode : "specific_textareas",
theme : "advanced",
} );
} );

This turns all <textarea class="wysiwyg"></textarea> fields into
TinyMCE-editors once the page is loaded.

Please note that we're using the jQuery build of TinyMCE as that's our
main JS lib. Because this is not related to Catalyst in any direct
way, I suggest you try asking on the TinyMCE mailing list if you need
any further help.

> or just putting the actual code of tiny_mce.js into the formbuilder form?

Don't do this!

> Aso, are you developing hooks to upload images also? �If so I'd like to see that if possible.

We have a separate process for uploading images (media library) which
has got nothing to do with TinyMCE. Of course, those images can later
be used from within the TinyMCE-enabled textarea.

--Tobias

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

paul at cassens

Mar 2, 2010, 5:20 AM

Post #12 of 12 (1543 views)
Permalink

Re: HTML editor plugin [In reply to]

Ah, I was missing the "static" part for sure. I will try tonite
thank you.

On Tue, Mar 02, 2010 at 03:44:56PM +0300, Mahmoud Mehyar wrote:
> Hi
>
> We are using CKeditor in our project but this should not be a different case
> than TinyMCE as they all work the same
>
> All you need to do is place the the javascript file location at the top of
> your tt page as your example
> <script type="text/javascript" src="/jscripts/tiny_mce/tiny_
> mce.js"></script>
>
> make sure the path above is located in the static folder
>
> then at the bottom page include the rendering script as described in TinyMCE
> documentation
>
> in our case using CKeditor our tt page looks like this
>
> ------------
>
> <script type="text/javascript" src="/static/ckeditor/ckeditor.js"></script>
>
> <form class="form" id="form" method="post" action="/admin">
>
> <fieldset>
> <legend>HTML Page</legend>
> <div>
> <textarea name="htmlarea" cols="10" rows="5" id="htmlarea">[%
> data.content %]</textarea>
> </div>
> </fieldset>
>
> <input type="submit" value="submit>"
> </form>
>
>
> <script type="text/javascript">
>
> CKEDITOR.replace( 'htmlarea' );
>
> </script>
>
>
> hope this was helpful
>
> On Tue, Mar 2, 2010 at 3:30 PM, Paul Falbe <paul [at] cassens> wrote:
>
> > On Tue, Mar 02, 2010 at 11:03:28AM +0100, Tobias Kremer wrote:
> > > On Tue, Mar 2, 2010 at 4:03 AM, Paul Falbe <paul [at] cassens> wrote:
> > > > Is there a exmaple somewhere where I can see howto insert this code
> > > > into a page made made FormBuilder i.e. the "tt" file?
> > >
> > > Our code which uses TinyMCE is not in production yet, so unfortunately
> > > I can't give you any online examples. But there is nothing special to
> > > incorporating TinyMCE into your TT templates because it works in an
> > > unobtrusive way. Just render your FormBuilder forms and add the
> > > TinyMCE javascript which will turn every (or selected) textarea(s) on
> > > the page into a rich-text editor without you having to alter your form
> > > rendering process.
> >
> > Tobias,
> >
> > So, are you doing something like
> >
> > <script type="text/javascript"
> > src="/jscripts/tiny_mce/tiny_mce.js"></script>
> >
> > or just putting the actual code of tiny_mce.js into the formbuilder form?
> > Aso, are you developing hooks to upload images also? If so I'd like to see
> > that if possible.
> > Please forgive my repeated questions I don't do much web development.
> >
> > -Paul
> >
> > _______________________________________________
> > List: Catalyst [at] lists
> > Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
> > Searchable archive:
> > http://www.mail-archive.com/catalyst [at] lists/
> > Dev site: http://dev.catalyst.perl.org/
> >

> _______________________________________________
> List: Catalyst [at] lists
> Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
> Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
> Dev site: http://dev.catalyst.perl.org/

_______________________________________________
List: Catalyst [at] lists
Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
Searchable archive: http://www.mail-archive.com/catalyst [at] lists/
Dev site: http://dev.catalyst.perl.org/

Index | Next | Previous | View Threaded

Interested in having your list archived? Contact Gossamer Threads