Step 2 is important for convincing others, especially children, that this chore is enjoyable.

Anyways, DokuWiki is a PHP based wiki that’s powerful enough to run your entire site or integrate with whatever you already have. Setting up a different look for the wiki is simple, just a matter of changing templates. But what if you want more than one look (template)?

Let me answer that question by asking another question: Why would you possibly want to two different templates for the same wiki? Well the main reason would be if you had separate administration (intranet) and public sections of your site, each with their own custom look. It would just be weird to log into your admin site, start reading a page with one theme, click a link and then view a related page in a totally different way. Not to mention that all your admin links are now gone and just as you click the back button your remember you had previously submitted a form that sent an email to all 5000 of your clients. Well, maybe they won’t even notice…

So, where do we start?

1. Google “multiple dokuwiki templates”
2. Check the first few links
3. Ooh! Multitemplate plugin for Dokuwiki
4. Hmm, last version is from 1/1/07 (that’s older than MY posts). Also won’t let us view the same page using two different templates. No good.
5. Give up on Google, no one can code better than me!
6. Begin randomly coding

My first attempt at a solution was a simple extension of xbr plug-in. I think it originally was supposed to convert new-lines to <br />’s or something crazy like that. I modified it to check the current URL and if it contained certain magic properties (”&theme=public”, for example) it would rewrite all the links on the page to also include some magic. Then I modified my one template to check for magic as well, which loaded one of two template options boot-strap style.

This solution was ugly. A waste of a good 32 minutes. At least. Also, it didn’t work. Links like “Edit this page” and “Admin” weren’t affected and it turned out that DokuWiki is so smart that it caches all the HTML it produces and then “freezes” your links after the first page visit.

Second attempt. This time, using the old noodle! Here’s the correct way to do it:

1. Separate the original boot-strapping template into two separate templates
2. Make a symbolic link to the /wiki directory (contains DokuWiki code) in another directory (/intranet/wiki maybe?)
3. Modify the local.protected.conf file to check the URL for the alternate directory and then load appropriate template

Here’s an example of the only code you need:

if (isset($_SERVER['REQUEST_URI']) &&
strstr($_SERVER['REQUEST_URI'], '/intranet/') !== false) {
$conf['template'] = 'intranet';
}

That’s it! You only need one copy of the [DokuWiki] code, one copy of the [DokuWiki] data, a symbolic link and 2-3 lines of extra code. No caching problems, no extra plug-ins and a good excuse to blog.

A buddy emailed me from an internet cafe in Panama saying something like ‘hey brrooooo I’m emailing you from a net cafe in Panama!’ My reply: Go change your password. Better yet, tell me our password and I’ll change it for you from *my* computer.

I won’t even consider the notion that your bank account was logged in to on your cousin’s computer. Don’t  expose your webmail passwords to any device that isn’t owned and maintained by yourself.

• Improved cross-browser compatibility (tested to work the same across Firefox/Safari/IE6/IE7)
• Cache bug has been fixed that caused suggestions to “forget” to hide
• Moved some stylings from JavaScript to CSS
• Cleaned up code, started heavy commenting
• Not exactly a new feature, but jquery.suggest will soon be on jQuery’s plugin page

For more information, please see this previous post. While the plugin works in Opera, it’s not perfect (which is why I didn’t mention it above) and I’m still working on it.

Download it here (example CSS here) and give me some feedback.

Update 1: I realize the drop down is slightly off in IE 6&7, I think it has something to do with Wordpress or K2’s stylesheets. Also, I’m in the process of updating the script to work better when the window is resized. Keep checking back here for more updates.

Try it:

• autocomplete
• Interface autocompleter

Originally, I used the first library in all my code but found that it just didn’t have the flexibility I needed and it had not been maintained in a long time. The biggest missing feature is the ability to run a function upon selecting something from the drop down.

While the Interface autocompleter seems to be rather up to date, there’s still a lot of problems with it. It’s tied to the Interface 1 library (which looks dead), the <iframe> code with is supposed to help cover forms in IE doesn’t work over HTTPS and the caching system is so screwed up I ended up having to manually disabling it.

I also found that the two implementations acted differently in different browsers including IE 6&7, Firefox and Safari. Sometimes tab would select an item, sometimes it would move to the next <input> element. Sometimes typing in something (which I didn’t want to match) and hitting enter would submit the form as usual, sometimes it would force me to select the first match.

Anyways, enough complaining, here’s the feature list:

• Smart cache system that takes a maximum cache size in bytes and uses MRU list to discard items. Oh, and the caching works correcly.
• Doesn’t assume that you have to choose an item from the drop down list. If an item is selected and you hit enter or tab, that item is copied to the <input> element. Otherwise, hitting enter or tab works just like a normal <input> element.
• Event handler for selecting a drop down item.
• Works the same in Firefox, Safari, IE 6&7.

It’s really easy to use, here’s the code for the suggest box above:

jQuery(function() {
jQuery("#suggest").suggest("files/search.php",{
onSelect: function() {alert("You selected: " + this.value)}});
});

Here’s the stylesheet and the source for the PHP file (blatantly stolen from autocomplete) which returns the items. And finally, download the source to the suggest library here. You can find more information about possible options at the bottom of the source.

The only requirement is jQuery itself and the dimensions plugin, although the script will try to use the bgiframe plugin if possible (to fix IE 6).

I found this out when trying to implement a dynamically changing PlotKit graph on my companies intranet site. It worked in Firefox (of course) and IE was coaxed into working be using the DEFER attribute. But the best Safari could do was leave a big blank space where my beautiful graph should be. Even though there was probably only one other employee that used Safari, I knew there was no way this was going to stand. There must be a solution, right?

Some googling turned up this posting, where the problem was solved using a combination of cloneNode(), innerHTML and appendChild(). Fancy. It works with Opera and IE, but not with Safari.

Then, my eureka moment came. I replaced the <script> tag in the RPC with a <div class=”javacript”> tag, still keeping all the script inside the <div>. Next, I added .javascript { display: none; } to the style sheet and did some jQuery magic:

$('#ajaxLoading').ajaxStop(function() {
$('.javascript').each(function() {
eval($(this).text());
});
});

This simple function runs every time an AJAX call is completed and uses eval() to manually run the JavaScript. It’s ugly, it’s probably violating some sort of standard, but guess what? It works in Safari.