jQuery comment code in Movable Type

| 0 Comments
Byrne Reese created a jQuery comment plugin for Movable Type, which I forked and extended. As you can see from this example, the jQuery components work quite well. This is how I implemented it on the test blog. I use the Professional Website Template Set, but the JavaScript includes, CSS links, etc. are applicable to other template sets and should be placed in the header module.

<link rel="stylesheet" href="/jquery.mtcomment.css" type="text/css" />
<script type="text/javascript" src="/jquery.js"></script>
<script type="text/javascript" src="/jquery.form.js"></script>
<script type="text/javascript" src="<$mt:Link template="javascript"$>"></script>
<script type="text/javascript" src="<$mt:Link template="legacy javascript"$>"></script>
<script type="text/javascript" src="/jquery.mtauth.js"></script>
<script type="text/javascript" src="/jquery.mtgreeting.js"></script>
<mt:If name="body_class" eq="mt-entry-archive">
<script type="text/javascript" src="/jquery.mtcomment.js"></script>

<script type="text/javascript">
$(document).ready(function(){
   if ($('#comments-form')) {
      /* First, let's boot strap the comment form on the page.
       * In this one step, we take the default MT comment form and turn
       * into a fully AJAXified comment form.
       */
      var form = $('#comments-form').commentForm({
        target: '.comments-open-content'
      });
      /* Once the form is bootstrapped and we have a handle to it
       * we then pass that as a handle to the reply function which
       * provides the inline commenting ability.
       */
      $('a[title=Reply]').reply({
        sourceForm: form
      });

      $("#comments-form").onauthchange(function(evt, user) {
         var openDataDiv = $("#comments-open-data");

         if (openDataDiv && user.is_authenticated)
         {
            $("<p>Thanks for logging in, " + user.name + "</p>").insertBefore(this);
            $("#comment-author", openDataDiv).val(user.name);
            $("#comment-email", openDataDiv).val(user.email);
            $("#comment-url", openDataDiv).val(user.url);
            $(openDataDiv).fadeOut(1000);
         }
      });
   };
});
</script>
</mt:If>
In addition to that change to the header module, clone the JavaScript index template and rename the new copy to "legacy javascript" so that most plugins that rely on the official site-facing JavaScript won't be broken. Add the contents of byrne's new JavaScript template to the old JavaScript template.

Also, wrap <mt:Ignore></mt:Ignore> tags around this section of the Comments template module if you are using the Classic Blog Template Set:

<script type="text/javascript">
<!--
mtAttachEvent("load", mtEntryOnLoad);
mtAttachEvent("unload", mtEntryOnUnload);
//-->
</script>
Finally, remove the JavaScript event handlers from the commenter form module (segments like onsubmit="dothis();"). Save the changes, rebuild.

Leave a comment

March 2010

Sun Mon Tue Wed Thu Fri Sat
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      

Recent Entries

A window into the totalitarian mind of the left on freedom of religion
From Digg: Me: I'm not going to hold my breath waiting for the same liberal democrats who shriek about the…
Google's lossy compiler
Google's closure compiler service gets a little too frisky under ADVANCED_OPTIMIZATIONS. Original code: With advanced optimizations enabled, it was able…
The three purposes of the federal income tax law
Businesses will spend about 3.4 billion man-hours and individuals about 1.7 billion hours figuring out their taxes this year.…

Subscribe

Advertisements

OpenID accepted here Learn more about OpenID