Adding TinyMCE to your ProjectPier or ActiveCollab Installation

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.

Capture

Enjoy!

13 Comments

  1. 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?

  2. 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
    }

  3. 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. … ?

  4. 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

  5. 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

  6. 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.

  7. 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

  8. 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.

  9. 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!

  10. Hey Bram,

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

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

  12. 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 : “”,


Add a Comment

Your email address will not be published. Required fields are marked *

Comment *
Name *
Email *
Website