Many of you are project managers, and may be using Activecollab or ProjectPier.

We were tired of their lame editor, so we decided to add TinyMCE into our installed version, both for ease of client use, and internal use.

The instructions are very simple.

  1. Go to ProjectPier, grab the latest version (or svn)

  2. Install ProjectPier as you would normally

  3. Install any custom patches or addons to project pier.

  4. Download TinyMCE

  5. Uncompress TinyMCE, and enter the newly extracted directory. You will see a javascript directory. Rename this to tiny_mce.

  6. Copy your newly renamed “tiny_mce” directory to the root of your ProjectPier installation.

     # cp -R tiny_mce /var/www/yoursite/htdocs/projectpier/

  7. Now, this is the only “complicated” part. Go into your ProjectPier installation directory, and then enter the applications directory. Like this.

     # cd /var/www/yoursite/htdocs/projectpier/  
 # cd application  
 # cd layouts

  8. Now you’re going to want to edit three files

     # nano administration.php dashboard.php project_website.php

  9. Now in these files, you’re going to want to add the include for tiny_mce. Add the following code after the last “add_javascript_to_page” line at the top of each file and then you are done.

     <?php echo add_javascript_to_page('dropdown.js') ?>  
 <script language="javascript" type="text/javascript" src="http://www.yoursite.com/projectpier/tiny_mce/tiny_mce.js"></script>  
 <script language="javascript" type="text/javascript">  
 tinyMCE.init({  
 force_p_newlines: "false",  
 forced_root_block : "", 
 theme : "advanced",  
 mode : "textareas"  
 });  
 </script>

  10. That’s It! You are finished adding TinyMCE to your Project Management Installation! It should look something like this.

Enjoy!

Comments

Comment by Dennis on 2008-05-29 18:48:31 -0500

Hey, I tried installing TinyMCE with the instructions you gave here but I couldn’t get it to work, but I think I know why:

The include for tiny_mce points to a file named ‘dropdown.js’ I’ve searched the projectpier and TinyMCE directories and there are no such files.

Any ideas where I can find this file?

Comment by Matt G on 2008-05-30 01:10:26 -0500

Hi Dennis,

My File is located in

~/projectpier/public/assets/javascript

And this is the contents:

function menuFix() {
var sfEls = document.getElementById(“account_more_menu”).getElementsByTagName(“LI”);
for (var i=0; i0? " “: “”) + “sfhover”;
}
// event added to keep menu items from disappearing
sfEls[i].onMouseDown=function() {
this.className+=(this.className.length>0? " “: “”) + “sfhover”;
}
// event added to keep menu items from disappearing
sfEls[i].onMouseUp=function() {
this.className+=(this.className.length>0? " “: “”) + “sfhover”;
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(”( ?|^)sfhover\b”), “”);
}
}
}
//onload call
if (document.all) { // Load sfHover only in IE; other browsers don’t need it
if (window.attachEvent) window.attachEvent(“onload”, menuFix);
else window.onload = menuFix; // Mac IE5 needs this
}

Comment by meshach on 2008-07-28 15:35:19 -0500

only one problem I see. How do I enable HTML in posts? I’m getting the tags printed, so the data is being parsed on save. … ?

Comment by Matt G on 2008-07-28 15:44:57 -0500

Hi Meshach,

We’re also seeing this issue. Basically the way in which projectpier/activecollab was designed, nothing is being stripped.

You have to use a combination of html_entities and strip_slashes to remove this from being seen.

We are working on some patches for this, but it’s slow going unfortunately.

Thanks,
Matt

Comment by RL on 2008-09-26 19:53:33 -0500

Hi Meshach,

I have the same issue. I commented out line 333 in /library/textile/Textile.class.php and that stopped the site from escaping any raw html in some areas….

$text = $this->encode_html($text, 0);

to

//$text = $this->encode_html($text, 0);

Next, you will also need to comment out line 73 and 74 in:
/environment/functions/general.php

function clean($str) {
$str = preg_replace(’/&(?!#[0-9]+;)/s’, ‘&’, $str);
$str = str_replace(array(”, ‘"’), array(’<’, ‘>’, ‘"’), $str);

return $str;
}

to:

function clean($str) {
//$str = preg_replace(’/&(?!#[0-9]+;)/s’, ‘&’, $str);
//$str = str_replace(array(", ‘"’), array(’<’, ‘>’, ‘"’), $str);

return $str;
}

So far so good. I did some very brief testing but it’s pretty simple to comment back in if that update messes the site up.

RL

Comment by Gierad on 2008-10-03 08:06:40 -0500

For those of you planning to use the code from this tutorial, do not copy&paste the tinyMCE initialization code from above because you will get javascript errors pertaining to newline characters. Write them manually instead.

Comment by erbag on 2009-02-18 21:53:24 -0500

I found that using a WYSIWYG Editor with ProjectPier doesn’t work bcoz it uses textile markup and I found a textile editor here:
http://pxjunkie.blogspot.com/2009/02/projectpier-wysiwyg-editor.html

Comment by Marty Thornley on 2009-04-03 06:59:04 -0500

Hi Matt,

Thanks for the instructions on adding tinymce. I had used it in the past but was a little reluctant to go figuring out how to add it to ProjectPier.

@RL – great work on the commenting out those lines. All links work now!

-Marty

Comment by Marty Thornley on 2009-04-03 09:08:47 -0500

Back again.

I noticed a couple glitches but think I figured out the solution. You can read about it in
the post I wrote, rather than trying to get code to fit in here.

I noticed that commenting out those lines made the html show up on the message pages but it broke the layout on the overview page. A couple of quick tweaks fixed it.

Comment by Bram Moreinis on 2009-08-01 16:35:19 -0500

Hey, just for ease of use – any reason you can’t put ASCII quotes (") in place of the smart quotes you’ve got in that code there?

They show up as periods when one pastes them into a text editor, which then need chasing down. Thanks!

Comment by Matt G on 2009-08-03 11:04:49 -0500

Hey Bram,

Try it out now, should be fixed. Sorry about that.

Comment by shoo on 2010-04-04 14:53:51 -0500

Hi Thanks for this its superb, also thanks to RL and Marty for figuring out the fallout of this modification.

Comment by Atif on 2011-07-05 03:02:25 -0500

i would like to draw ur attention to a very little mistake:

In this below code

tinyMCE.init({
force_p_newlines: “false”,
forced_root_block : “,
theme : “advanced”,
mode : “textareas”
});

Replace this :

forced_root_block : “,

With :

forced_root_block : “”,