Integrate cgit in page layout

As mentioned in my last post cgit is a fast git repository browser written in C.
In comes with a plain and simple layout that can be easily customized with CSS.
But what if you want to embed your git repository browser into your webpage’s layout?
Well, cgit has an option for that.
In your cgit configuration file simply set embed=1 and cgit’s output will only contain the pure content without any <head> or <body> tags.
And if you want to supply a header and a footer for your cgit page simply set header=/path/to/your/header/file and footer=/path/to/you/footer/file and cgit will sandwich its content with your header and footer.

For a simple setup where the navigation and the footer doesn’t change very often this approach works very well.
But if you’re using a CMS or a website creation tool (like RapidWeaver) this simple setup might not work without any further interaction.

I tried three possible solutions to the problem:

Ajax + jQuery

It’s easy to dynamically load the cgit content into another webpage by using jQuery’s Ajax API:
$("#myContent").load("/path/to/cgit/page body");

This call loads the cgit page and insert the content of the <body> tag into an existing element with id #myContent.
Of course the result is not a fully functional cgit page. The links won’t work, so you have to add an event handler to each link.
It’s a bit of work but I think it’s feasible.

One of the main problems with the Ajax + jQuery approach is that you loose search engine support. Also the browser’s back button won’t work anymore.
So here’s the next approach:

PHP

Because cgit is executed as a CGI it is simple to call it inside a PHP script.
A simple
passthru("/path/to/cgit/cgit.cgi", "r")
will do.
Depending on your PHP setup you might have to pass some environment variable to the script (e.g. putenv("PATH_INFO=".getenv("PATH_INFO")); ), but that’s everything.

The problem with this solution is that you’re loosing cgit’s caching capabilities and the result will be much slower that a „bare“ cgit page.
So here comes the last approach:

Modifying cgit

Wouldn’t it be nice to just have to put some placeholder into an existing HTML document and cgit then replaces it with its content?
Well, that’s what my cgit modification is all about.

  1. Create an HTML template file (e.g. create a blank page with your CMS or authoring tool).
  2. Insert the HTML comment <!-- CGIT_BODY --> where ever your want cgit to place its content.
  3. In your cgit configuration add embed=1 and template=/path/to/your/html/template.

Now if you open your cgit page you will see the cgit browser nicely integrated in your website’s layout.
And this won’t hurt cgit’s cache and search engines can still index your repository pages.

You can find this modification as the template-option branch in my cgit repository. It includes the project-list-filter branch that I mentioned in my last post.

blog comments powered by Disqus