Singpolyma

Archive for May, 2006

Archive for May, 2006

Virtually Synonymous Tags

Posted on

Most of us are aware of the problem. If I tag this post ‘web2.0’ and you monitor Technorati for the tag ‘web20’ then we’re sunk. You’ll never find me. If I tag a webpage on del.icio.us as ‘hacks’ and you monitor the page for ‘hack’, you may never see it. These tags are virtually synonymous, but a computer can’t tell that.

Enter Tagging, a new Ning app designed to solve this very problem. The app stores groups of virtually synonymous tags (or TagGroups) that are defined by the community and provides easy access to them via both XOXO and JSON(P) APIs. With space to clearly define and describe TagGroups and a coComment catch-all discussion system the community solves their own problem by defining for the system what tags mean the same thing.

For more information see the Tagging About Page.

Slide Shows with XOXO (S5)

Posted on

If you combine S5 with XOXO you get a format you can use to build simple slideshows for the internet and that makes sense to microformats parsers. S5 is a simple slideshow system with many features that can pull the data for slides right out of an XOXO block. To use S5 you will have to download the JavaScript and CSS files from the homepage and then build a page with slide content that links in these files. While there is a quite adequate S5-with-XOXO reference, the format will be summarised here for completeness.

Notes
S5 documents must be DOCTYPE XHTML 1.0 Strict, and there are certain <meta> tags that are required. See the specification for more details.

Meta Data
Meta data in S5 is encapsulated in a set of <meta> tags. This means that the data will not be available to XOXO-only processors. The page <title> must be the title of the presentation and the <meta name=”version” content=”S5 1.1″ /> element is also required, along with the tags to include the JavaScript and basic CSS.

There is also a controls/header/footer section that must be present first in the <body> tag before the XOXO data. The code for this section follows:

<div class=”layout”>
<div id=”controls”><!– DO NOT EDIT –></div>
<div id=”currentSlide”><!– DO NOT EDIT –></div>
<div id=”header”>
SLIDESHOW HEADER
</div>
<div id=”footer”>
SLIDESHOW FOOTER
</div>

Where SLIDESHOW HEADER and SLIDESHOW FOOTER are the contents for the header and footer of the slideshow, respectively.

Classes
In order for the S5 code to interface with your data properly the class ‘presentation’ must be present on the main <ol> or <ul> tag. The class ‘xoxo’ is also reccomended in accordance with the XOXO specification.

Nodes
Each root node in the XOXO tree for the slides must have the class ‘slide’. The direct contents of the node (along with any XHTML markup) are considered to be the text (/images etc.) of the slide. If the first element in the node is an <h1> element the contents of that tag are considred the title of the slide. Subnodes are rendered as points in the presentation. If the <ul> or <ol> root tag for the subpoints has the class ‘incremental’ the points will be introduced one at a time. Additionally a <div> element of class ‘handout’ will not be rendered on-screen but only when the presentation is printed.

Tags:

Yurnet : When You Don’t Know Where to Look

Posted on

Yurnet is a search engine with an interesting model — search for things instead of in places. If you want to search for DVDs, but don’t know what engine to use to do that, you could search Google for an appropriate engine, then search that engine, or just go to Yurnet and pick ‘dvd’.

Yurnet takes awhile to get your head around. That’s because at first it looks like a cheesy metasearch engine. If you’re still thinking search where it seems almost rediculous. Which is faster : going to Google Images and searching for what you want or going to Yurnet, picking Google Images, and searching? The answer is they’re basically the same. After corrospondence back and forth to the site creator, however, I finally came to understand that the real point of Yurnet is search what for when you don’t know what site to search.

That said, the site is rather ugly. The final resolved URL is http://ww2.yurnet.com:8080/ — not exactly something that looks pretty in bookmarks. The drop-down select box is a mélange of capitalization schemes, and the ‘vs’ searches (which really are out of the scope of the site) are listed first, giving an initial illusion that alphabetical order is not preserved. Also, some things are listed as wheres still (ie Google Image). Realistically the box should be cleaned up to use the same capitalization schemes throughout and be only a list of whats in alphabetical order, without engine names and the like getting in the way.

Going Down

Posted on

Often on weekends a thought pops into my head — ‘I should do a personal post on all that’s happening!’. I begin to mentally catalogue what the post will contain so I’m ready. By the time Monday comes and I sit to write… nothing comes. Aint that the way of it? I guess a breif update on the state of affairs in Chad is in order. Elections went well and rebel activity seems to be back to normal. Of course that’s all unpredictable, but everything’s looking fine as of now. I burned a backup of all our data onto DVD the other day, which took forever, but is well worth it to have all our data on a nice small disk 🙂 I’ve done almost no school today. All I have left is my English final and Math stuff. Yup, kinda cool.

We watched The Sound of Music on Saturday — really funny! J’adore ces anciens films! 😉 We also got this new season pack from Uncle Larry… 24. It’s 24 1-hour episodes that each cover 1 hour of time over a whole day. Really well done, and really addicting. They always leave you hanging!

Man it’s hot here! Blah! The time to Chels’ return is approaching, but it still a fair ways off. Of course we’ll get but a breif time to talk and then both will be off to Canada and readjustment scedules. Deputation for her (bleagh!) and random whoknowswhat for me. mmm. *thinks* I should say something else, but my mind has gone blank… maybe I’ll go write a chapter in my book, hehe, I got some inpiration the other day so it should be easier 😉

’til I next do post or chat or whatever avec thou

Comment Photos and Highlighting

Posted on

PurpleMoggy has created a set of instructions for using this on Blogger BETA. I have updated my hack to support his new features and fix the bugs he found. There is also now a new ‘no image’ image.

Awhile back I wrote a post detailing my hack for adding profile photos to comments. Unfortunately that post was rather technical in its explanation. This post attempts to deal with adding the hack to your blog in a more user-friendly fashion and also with using the hack to highlight blog-contributor comments.

Step 1 – The first thing you need to do is find the comment section in your blog template. Edit your template and scroll down until you find the <BlogItemComments> tag. The code inside should look something like this:

<div class=”comment-poster” id=”c<$BlogCommentNumber$>”>
<a name=”c<$BlogCommentNumber$>”></a>
<$BlogCommentAuthor$> said…
</div>

<div class=”comment-body”>
<div class=”innerCmntBody”><$BlogCommentBody$></div>
</div>

<div class=”comment-timestamp”>
<a href=”#c<$BlogCommentNumber$>” title=”comment permalink”>4/26/2006 07:49:51 PM</a>
</div>

Step 2 – If you plan to use comment highlighting (so that the comments made by blog authors look different from those of users) this must be wrapped in another tag so that all of the code for each comment is in one tag. Like so:

<div class=”commentelem”>

<div class=”comment-poster” id=”c<$BlogCommentNumber$>”>
<a name=”c<$BlogCommentNumber$>”></a>
<$BlogCommentAuthor$> said…
</div>

<div class=”comment-body”>
<div class=”innerCmntBody”><$BlogCommentBody$></div>
</div>

<div class=”comment-timestamp”>
<a href=”#c<$BlogCommentNumber$>” title=”comment permalink”>4/26/2006 07:49:51 PM</a>
</div>

</div>

Some blog templates will already have a tag around their comments, as will those using the ‘standard’ comment markup. If you have one of those templates just write down the class of the wrapping tag or add one (the underlined section above).

Step 3 – Next we need the class of the element where we can look for the link to the author. In the example code above this would be comment-poster. When in doubt use the class of the overall wrapping tag. Once you have it, write it down. Count the number of <a> tags there are before the <$BlogCommentAuthor$> tag and write this number down (in the above example it is 1).

Step 4 – The only thing left to do in this part of the code is to insert the element where the profile photo will go. Add this code right before the <$BlogCommentBody$> tag: <div class=”commentphoto”></div>

Step 5 – Now go to the <head> section of your blog and add the following code:

<script type=”text/javascript” src=”http://jscripts.ning.com/get.php?xn_auth=no&amp;id=830605;
<script type=”text/javascript”>
//<![CDATA[
function thisblog_showCommentPhotos() {showCommentPhotos(‘commentphoto’,’class of author wrapper‘,# of a tags,’main wrapper class‘,'<$BlogURL$>’,’highlighted text colour‘,’highlighted text background‘;}
addLoadEvent(thisblog_showCommentPhotos);});
//]]>
</script>

Where class of author wrapper is the class you wrote down in step 3, the # of a tags is the number you wrote down in step 3, and the main wrapper class is the class you wrote down in step 2. If you are not going to use comment highlighting the last for parameters can be left off (from main wrapper class to highlighted tex background) otherwise you have to fill in the color you with the text and background of highlighted comments to be in their appropriate spots above.

Step 6 – Save and Republish!