Tired of ads? Upgrade to paid account and never see ads again!

Previous Entry Share Next Entry
Change log entries for HTML files

Someone asked me if there was a good way to annotate the changes of an HTML file. It sounded like the person had to maintain some legacy, HTML-hell, home-brewed, template files for some business Web site.

I suggested using the ChangeLog support of Emacs, and using HTML comments to organize sections of an HTML source file. Here's a simple, made-up example of such an HTML file.

<title>Sample only</title>
<!-- begin header -->
<p>[ <a id="top" href="#bottom">bottom</a> ]</p>
<!-- end header -->
<h1>Sample title</h1>
  -- footer-bottom start -->
<p>[ <a id="bottom" href="#top">top</a> ]</p>
<!-- footer-bottom end -->

Unfortunately, support for either the above sectioning style, or even another alternative, is not provided by the HTML mode that ships with Emacs. This is understandable because there is no consistent standard of doing this, and people use other variations than even those covered in the example. Not to mention, HTML comments are used for other reasons than naming regions of the file.

Regardless, I've put together the following regular expression for add-log-current-defun-header-regexp. It handles the cases in the example above. It is set for all buffers using HTML mode. Just put the following in your .emacs file.

    (add-hook 'html-mode-hook
        (lambda ()
           (setq add-log-current-defun-header-regexp
               (concat "^[ \t]*<?!?--[ \t]*\\(?:begin\\|BEGIN\\|start\\)?"
                       "[ \t:]*\\([-_[:alnum:]]+\\)"
                       "[ \t]*\\(?:begin\\|BEGIN\\|start\\)?[ \t]*--"))))

Use it by typing `C-x 4 a' (add-change-log-entry-other-window). An entry like the following will be added in a nearby ChangeLog file:

2009-05-05  Aaron S. Hawley  <aaronhawley@livejournal.com>

        * file.html (PAGE_CONTENT): Add a test paragraph.
        (footer-bottom): Added link to "#top".

This setup will work for most cases except for scenarios where there is nested sectioning or where you've run `C-x 4 a' from a point outside of a "section" and get a false-positive.

I guess it all depends on what he means by "annotate."

Let's say you have a WYSIWYG text editor, like Xinha, where some end-user types in text that produces HTML.

Let's say you have some kind of content management system.

Now, I want to annotate the differences between two versions of the client's typed-in text, and I want to do so programmatically, so that stuff that's added is highlighted in some way (e.g.: underlined in red), and stuff that's deleted is included, but also notated as deleted (e.g.: has a strike-through style).

The point is to let the client view arbitrary changes to arbitrary amounts of text in a visual format. Like redlining a document, except with HTML.

I haven't seen any decent utilities that do that, myself.

I've seen a few, but it depends on your definition of "decent".


I predict Drupal has its things together, but I can't say I've tried this module