One of the things that kept us busy in the past month has been this bug. Basically we were rendering awfully on IE.

We’d had this issue for a while and it was just time to get dirty on it. Working with Jan has been really instructive and, beside reminding me that developers suck at designing UIs, I’ve learnt that supporting IE6 it’s not really a matter of throwing fixes or using javascript libraries reporting to support it (we use JQuery here).

We could get the basic layout fixed, but we didn’t get anywhere near solving all the issues we had so, after two days spent on black magic css-ing, we took the decision: Atalaya (at least in its 1.x versions) won’t support IE6.

IE6 has still 30% of browser share, but it’s been constantly declining over the past here and especially after IE7 was released. Also, our target users are probably the least likely to have IE6 on their corporate computers, which makes this decision reasonable after all.

This decision aligns with our objective of taking a fresh look at our UI for Atalaya 2.0 (hold on:)), thus not spending a lot of time on the current look&feel (yes, the JFreeChart charts really suck we know).

Ah, the online demo has been updated with the fixes, and contains some new features also. Go check it out:)

I’ve finally decided to post another no-brainer JQuery plugin: a simple news box fed by an RSS feed. You can see an example on our project’s home page. I had found the idea on the JQuery mailing list but loving plugins (although not really good at it) I decided to wrap it up a bit.

The result is quite simple: just place a div somewhere and initialize it with a feed URL:

<script language="JavaScript" type="text/javascript">
$('#rightcolumn').feedreader({
targeturl: 'http://blogs.atalayasec.org/atalaya/?feed=rss2'
});
</script>
...
<div id="rightcolumn">
</div>

There are two other configuration options available; how many posts to put in the news box and the length of the text to be displayed for each item. A complete initialization would be then like the following:

$('#rightcolumn').feedreader({
targeturl: 'http://blogs.atalayasec.org/atalaya/?feed=rss2',
items: 3,
descLength: 15
});

The code is pretty rough (and not really js-style) but functional. In case it’s useful to someone.

The original code, from Stoyan Stefanov, is here. I’ve simply wrapped it in a jquery plugin. It’s enough to wrap the canvas and table elements in a div:

<div id="pie">
	  <table id="mydata">
	    <tr><th>Lang</th><th>Value</th</tr>
	    <tr><td>JavaScript</td><td>100</td></tr>
	    <tr><td>CSS</td><td>200</td></tr>
	    <tr><td>HTML</td><td>300</td></tr>
	    <tr><td>PHP</td><td>50</td></tr>
	    <tr><td>MySQL</td><td>30</td></tr>
	    <tr><td>Apache</td><td>10</td></tr>
	    <tr><td>Linux</td><td>30</td></tr>
	  </table>
	  <canvas id="canvas" width="300" height="300"></canvas>
</div>

and to initialize the plugin:

 $(function() {
         $(‘#pie‘).canvaspie({table: ‘#mydata‘,canvas: ‘#canvas‘})
 });

The plugin hides the table and shows the pie. An example (and the plugin itself) can be found here, in case someone finds it useful.

P.S: yes, I do need a code highlighter, sorry.

P.P.S: Thanks Stoyan for pointing me to hiliteme.

Update: I’ve updated the test page to use ExplorerCanvas, so now the test page should work on IE as well.