RSS Reader using Javascript

After playing around with other packaged Widgets that read and display RSS feeds, I found most really didn’t do exactly what I wanted them to do.  So I checked around looking for one that used Javascript.

I found this site that had a tutorial.  And that was pretty sweet but the code was all in pieces.  So I assembled the code and to my surprise it didn’t work.  I fixed the code and thought you might like to have a copy.

// JavaScript Document
function getRSS()
{
    if (window.ActiveXObject) //IE
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    else if (window.XMLHttpRequest) //other
        xhr = new XMLHttpRequest();
    else
        alert("your browser does not support AJAX");

    xhr.open("GET",document.rssform.rssurl.value,true);

    xhr.setRequestHeader("Cache-Control", "no-cache");
    xhr.setRequestHeader("Pragma", "no-cache");
    xhr.setRequestHeader("Content-Type", "text/xml");

    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4)
        {
            if (xhr.status == 200)
            {
                if (xhr.responseText != null)
                {
                    xhr.responseXML.loadXML(xhr.responseText);
                    processRSS(xhr.responseXML);
                }
                else
                {
                    alert("Failed to receive RSS file from the server - file not found.");
                    return false;
                }
            }
            else
                alert("Error code " + xhr.status + " received: " + xhr.statusText);
        }
    }

    xhr.send(null);
}

function processRSS(rssxml)
{
    RSS = new RSS2Channel(rssxml);
    showRSS(RSS);
}
function RSS2Channel(rssxml)
{
    /*required string properties*/
    this.title;
    this.link;
    this.description;

    /*optional string properties*/
    this.language;
    this.copyright;
    this.managingEditor;
    this.webMaster;
    this.pubDate;
    this.lastBuildDate;
    this.generator;
    this.docs;
    this.ttl;
    this.rating;

    /*optional object properties*/
    this.category;
    this.image;

    /*array of RSS2Item objects*/
    this.items = new Array();

    var chanElement = rssxml.getElementsByTagName("channel")[0];
    var itemElements = rssxml.getElementsByTagName("item");

    for (var i=0; i<itemElements.length; i++)
    {
        Item = new RSS2Item(itemElements[i]);
        this.items.push(Item);
    }

    var properties = new Array("title", "link", "description", "language", "copyright", "managingEditor", "webMaster", "pubDate", "lastBuildDate", "generator", "docs", "ttl", "rating");
    var tmpElement = null;
    for (var i=0; i<properties.length; i++)
    {
        tmpElement = chanElement.getElementsByTagName(properties[i])[0];
        if (tmpElement!= null)
        {
            if (tmpElement.childNodes[0]!=null)
            {
                eval("this."+properties[i]+"=tmpElement.childNodes[0].nodeValue");
            }
            else
            {
                eval("this."+properties[i]+"=''");
            }
         }
    }

    this.category = new RSS2Category(chanElement.getElementsByTagName("category")[0]);
    this.image = new RSS2Image(chanElement.getElementsByTagName("image")[0]);
}
function RSS2Category(catElement)
{
    if (catElement == null) {
        this.domain = null;
        this.value = null;
    } else {
        this.domain = catElement.getAttribute("domain");
        this.value = catElement.childNodes[0].nodeValue;
    }
}
function RSS2Image(imgElement)
{
    if (imgElement == null) {
    this.url = null;
    this.link = null;
    this.width = null;
    this.height = null;
    this.description = null;
    } else {
        imgAttribs = new Array("url","title","link","width","height","description");
        for (var i=0; i<imgAttribs.length; i++)
            if (imgElement.getAttribute(imgAttribs[i]) != null)
                eval("this."+imgAttribs[i]+"=imgElement.getAttribute("+imgAttribs[i]+")");
    }
}
function RSS2Item(itemxml)
{
    /*required properties (strings)*/
    this.title;
    this.link;
    this.description;

    /*optional properties (strings)*/
    this.author;
    this.comments;
    this.pubDate;

    /*optional properties (objects)*/
    this.category;
    this.enclosure;
    this.guid;
    this.source;

    var properties = new Array("title", "link", "description", "author", "comments", "pubDate");
    var tmpElement = null;
    for (var i=0; i<properties.length; i++)
    {
        tmpElement = itemxml.getElementsByTagName(properties[i])[0];
        if (tmpElement != null)
        {
            if (tmpElement.childNodes[0]!=null)
            {
                eval("this."+properties[i]+"=tmpElement.childNodes[0].nodeValue");
            }
            else
            {
                eval("this."+properties[i]+"=''");
            }
         }
    }

    /*C*/
    this.category = new RSS2Category(itemxml.getElementsByTagName("category")[0]);
    this.enclosure = new RSS2Enclosure(itemxml.getElementsByTagName("enclosure")[0]);
    this.guid = new RSS2Guid(itemxml.getElementsByTagName("guid")[0]);
    this.source = new RSS2Source(itemxml.getElementsByTagName("source")[0]);
}
function RSS2Enclosure(encElement)
{
    if (encElement == null) {
        this.url = null;
        this.length = null;
        this.type = null;
    } else {
        this.url = encElement.getAttribute("url");
        this.length = encElement.getAttribute("length");
        this.type = encElement.getAttribute("type");
    }
}

function RSS2Guid(guidElement)
{
    if (guidElement == null) {
        this.isPermaLink = null;
        this.value = null;
    } else {
        this.isPermaLink = guidElement.getAttribute("isPermaLink");
        this.value = guidElement.childNodes[0].nodeValue;
    }
}

function RSS2Source(souElement)
{
    if (souElement == null) {
        this.url = null;
        this.value = null;
    } else {
        this.url = souElement.getAttribute("url");
        this.value = souElement.childNodes[0].nodeValue;
    }
}

function showRSS(RSS)
{
    /*A*/
    var imageTag = "<img id='chan_image'";
    var startItemTag = "<div id='item'>";
    var startTitle = "<div id='item_title'>";
    var startLink = "<div id='item_link'>";
    var startDescription = "<div id='item_description'>";
    var endTag = "</div>";

    /*B*/
    var properties = new Array("title","link","description","pubDate","copyright");
    for (var i=0; i<properties.length; i++)
    {
        eval("document.getElementById('chan_"+properties[i]+"').innerHTML = ''"); /*B1*/
        curProp = eval("RSS."+properties[i]);
        if (curProp != null)
            eval("document.getElementById('chan_"+properties[i]+"').innerHTML = curProp"); /*B2*/
    }

    /*show the image*/
    document.getElementById("chan_image_link").innerHTML = "";
    if (RSS.image.src != null)
    {
        document.getElementById("chan_image_link").href = RSS.image.link; /*C1*/
        document.getElementById("chan_image_link").innerHTML = imageTag
            +" alt='"+RSS.image.description
            +"' width='"+RSS.image.width
            +"' height='"+RSS.image.height
            +"' src='"+RSS.image.url
            +"' "+"/>"; /*C2*/
    }

    document.getElementById("chan_items").innerHTML = "";
    for (var i=0; i<RSS.items.length; i++)
    {
        item_html = startItemTag;
        item_html += (RSS.items[i].title == null) ? "" : startTitle + RSS.items[i].title + endTag;
        item_html += (RSS.items[i].link == null) ? "" : startLink + RSS.items[i].link + endTag;
        item_html += (RSS.items[i].description == null) ? "" : startDescription + RSS.items[i].description + endTag;
        item_html += endTag;
        document.getElementById("chan_items").innerHTML += item_html; /*D1*/
    }

    return true;
}

This requires a piece of HTML that looks something like this.

<html>
<head>
    <!--B-->
    <script language="javascript" src="rssajax6.js"></script>
    <!--C-->
    <style type="text/css">
        #chan_items { margin: 20px; }
        #chan_items #item { margin-bottom: 10px; }
        #chan_items #item #item_title { font-weight: bold; }
    </style>
</head>
<body>
    <!--A-->
    <form name="rssform" onsubmit="getRSS(); return false;">
        <select name="rssurl">
            <option value="mylinkfeedrss.xml">test RSS feed</option>
            <option value="google-rss.xml">google RSS feed</option>
        </select>
        <input type="submit" value="fetch rss feed" />
    </form>

    <div id="chan">
        <div id="chan_title"></div>
        <div id="chan_link"></div>
        <div id="chan_description"></div>
        <a id="chan_image_link" href=""></a>
        <div id="chan_items"></div>
        <div id="chan_pubDate"></div>
        <div id="chan_copyright"></div>
    </div>
</body>
</html>

I played around a bit with the HTML and the output of mine and it looks something like this.

You won't get the full effect of this because of the width, but you should get a general idea of how it works.  This is my feed from eclectic-screenplays.blogspot.com.

One thing to note, you cannot get a cross domain XML file.  Therefore you either have to generate the RSS on that domain, get a server proxy that will move the RSS to your server, or just ftp the RSS file to your server.  I’m doing the latter at the moment.

Enjoy!

Photos on Freewebs

As if there weren’t enough places on the web to keep your photos, you can also keep some on Freewebs? The interface is fairly easy to use. First thing you need to do is log in. Once you are logged in go to the Site Manager. Or you can even go there from the Site Builder. If we were to continue from the Calendar tutorial it would looks something like this.

Select Photos from the drop down located at the top left hand corner of the screen.

You can either select an Album to edit or select Add album, which is exactly what we are going to do.

Enter a New Album in the space provided or if you decide you really wanted to put it in an Existing Album then select that option and choose the album from the list.

Then Upload your photos. You can do this from you local computer by selecting Upload Photos.

You’ll get a familiar file dialog. Choose the file you want to upload from your local computer and select Open.

You can also put photos you have already uploaded into your album by selecting My Images. This tab will list all the images you have already uploaded to Freewebs.

Choose the images you want to add. Choosen images will be highlighted. Once you have the correct images for the album click Submit.

Congratulations, you have an album with some photos in it on Freewebs.

You can edit the album from this screen. Choosing which Photo to use for the album cover. Adding titles and description for the Photos and the album. You can even do some minor photo manipulations, like rotate, from this screen. Don’t forget to select Save when you are done.

Select this link to see this album on Freewebs.

Calendars on Freewebs

Were you wondering how to use the calendars on Freewebs? It’s very easy. First thing you need to do is log in. Once you are logged in go to the Site Manager. Or you can even go there from the Site Builder. If we were to continue from the Blogging tutorial it would look something like this.

Select Calendar from the drop down located at the top left hand corner of the screen.

And you will be presented with the Calendar screen. Select Add Event to add an event to the calendar.

Enter a Title for the event an any rich text Description you desire for the details. Set a Start Time and an End Time. You can also select All Day Event if the event is going to be a long one. Once you have the Add a Calendar event form filled out, then select Submit.

And your event will be recorded for posterity.

Next up: Photos

Blogging on Freewebs

Or I should call it webs now.

www.freewebs.com was a site I used to use for file storage. I never actually cared that you could actually create a website there and didn’t use that functionality. This year I started using it and they have also been improving it. Now you can get a pretty full featured website up pretty quickly.

I figured I’d put up some tutorials at using some of the features. One because I’m always looking for something to blog about lately and two because I think these tutorials will help someone out.

The first tutorial is blogging and the first step is to log into freewebs by typing your username and password in the boxes provided.

You will be presented with the dashboard for your account.

Move your mouse over Edit My Site and a drop down menu will appear. Select Site Manager from the drop down menu.

Since we are blogging select Blog from the list of pages.

And you will be presented with the Site Builder for you Blog. Select Post New Entry.

Enter a Title and use the rich text box to enter the body for your blog entry. You have a lot of formatting control over the rich text box and you can add images or embed video.

Select the Publish button when you are finished.

And you’ll have your first blog entry on Freewebs. Here is a link to the actual blog entry. Next up: Calendars

WARNING: Webs.com has been freezing sites for very little reason and often don’t respond to inquires about the freeze.  Just letting you know.

Blidgets

Not only can you find interesting widgets at WidgetBox, but you can also create your own.

Click this link to Make a Widget. You will be presented with the following screen.

Choose Blog/Feed and you will be prompted for your blog feed url.

Enter your feed url and continue and it attempts to generate your blidget but I don’t think it will be exactly what you want, you’ll need to customize it.

Customize the blidget. By choosing the Appearance – I went for the leopard skin.

And the content – I went for the slide show.

And finally the cataloguing details. People can search for your finished widget – if you want them to.

Once you save the widget, you will get the widget screen. This is the screen that anyone who wants your widget will see. You can further customize your widget here and then “Get Widget”

And you will be given a little box that has the javascript you need to publish your widget on any page.

My javascript looks like this.

<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script>

<script>if (WIDGETBOX) WIDGETBOX.renderWidget('6468a97f-3334-484d-923f-7bbc75305463');</script>

<noscript></noscript>

Once you have the Javascript, just place it wherever you can place html. I use one in my forum signatures.

Creating Tag Clouds for your Blogger page.

I was flipping through blogs today and I noticed someone had a tag cloud for their labels.  I looked and looked through the widgets and couldn't find one.  Then I tried Google and found this. There were about twelve other results but the one I'm linking to seems like it might be the original.

I followed the instructions in the post carefully and I had a tag cloud on my page.  I did have to set cloudMin = 0 in order to get all my tags to display but once I did that I had a perfect cloud.

Enjoy!

A date with malware

Nasty little trojan worm viruses. I spent the entire last couple of days trying to rid my system of them and according to my software they are all gone but I'm still having the problems.

What started this was that my pdf writer (PDF995) stopped working - it just kind of stopped printing pdfs. So I reinstalled it. Still the same problem. I reinstalled a different pdf writer (CutePDF) and I install it. And it doesn't work. It just isn't writing the pdfs. It goes through all the motions but there isn't a pdf on my disk when I'm done.

So I tried to update my adobe reader. And the install just hangs. So I uninstall the previous reader. And the install just hangs. So I download the newest adobe reader. And the install just hangs. Now I'm without Adobe reader.

This is where I start panicking because I use my pdf writer to create pdfs of the scripts I write and I use the pdf reader to read other peoples scripts. So I create a forum post about the problem on Adobe and I'm still waiting for a reply.

Meanwhile as I'm searching I'm noticing this problem with the results. Whenever I click on a Google search result it goes to some random search page. This is happening all the time whether I'm using Firefox or IE.

Finally I discover that this happens to lots of Google users. The malware replaces the google links, I think I read that they called it hit stealing or something like that. I just tried to recreate this for you but of course google worked this time, maybe my massive clean-up fixed it.

However this is the popup screen of nastiness that I think infected me the first time. If you get this screen watch out. It came up when I viewed my Google results. This screen has also been know to change your desktop background to look like a dialog box that says run a virus scan.

You can fix this problem by deleting the randomly named image file that they put in your system32 directory. You can find it with thumbnails, you will recognize the picture.

Just tried google again. It seems much slower but it seems to be working. The seems much slower part could be my patience running thin. I may just use Yahoo after this, like others have suggested.

Google must have really pissed someone off for them to go to the bother of creating such a horrible, hard to get rid of bug that specifically goes after Google. It could have been Yahoo, but it's more likely someone they fired that wrote this piece of malware.

Anyway, have a non-adobe reader now and my script prog has pdf writing built-in, it works but it make a sluggish pdf, so I'm set for scriptwriting. I'm still having weirdness with the internet but that could just be the internet or it could even be my wireless. Hopefully this will post.

Downloaded Windows Live Mail

Just when you thought it was safe to go back into the virtual zone, Microsoft gets rid of Outlook Express and replaces it with a monstrous agent. One that takes care of all your virtual activities -- even blogging. I forgot that I had a blog on Live Spaces or whatever the heck it's call but MS reminded me and even gave me some software to update it.

Will I continue to update it? That's always the question because I can't depend on MS to remind me -- or maybe I can. I haven't found the function yet. But what I did find with Live Mail is:

A new email client - one that allows Mail Rules and also lets me receive from my GMail account.

This blogging software - which, depending on how this goes, will let me easily update my blog.

A photo thingy - which I have very little use for but is probably functional.

A new version of messenger - I never use messenger anyway so who cares.

If you wanted to download Live Mail and reap the "benefits" as I am right now. Just look for the link in the email that Microsoft sent me. I have it right here:

Dear Microsoft Outlook Express customer,

You may have received an e-mail from us letting you know 
that Microsoft is planning to retire the DAV protocol that 
Outlook Express uses to access Windows Live Hotmail. In 
response to customer feedback requesting more time to evaluate 
alternative solutions, we have decided to postpone retiring 
DAV and we are investigating other alternatives for accessing 
Windows Live Hotmail via Outlook Express. This means that if 
you use Outlook Express to access your Windows Live Hotmail 
account, you will continue to be able to do so beyond the 
previously announced June 30 transition deadline. We will be 
sure to update you once we have additional plans to share and 
early enough in advance to help ensure a smooth transition in 
the future. 
Additionally, Outlook Express customers that use Windows Vista 
or Windows XP are always welcome to download and use our next 
generation free email client, Windows Live Mail, providing the 
familiarity of Outlook Express and much more. You can download 
the new client at http://get.live.com/wlmail/overview.

We appreciate your feedback, and encourage you to continue to 
provide it.

Sincerely,
Windows Live Mail Team
 

Blogging

I've only been blogging for a short period of time so I have a limited perspective on it. But I thought I would share with you what I have learned so far about weblogs.

First you've got to decide where you are going to blog. To me, this was the most critical decision. There are plenty of places to blog out there: Blogger, Word Press, Windows Live, and Freewebs - to name a few. There is even an adult one called Thumblogger.

Plus there are a couple of micro-blogging sites such as Twitter, Plurk, or Jaiku. They're fine if you are wanting to communicate and you don't have lots to say, but we are talking about longer blogs here.

In doing a page oriented blog, it is important that you have some log writing software. Many people use Word Press - I think this is mostly the Mac contingent. I use Windows Live Writer. It came with Windows Live, it was free and it seems full featured. Again, like your blogging host, there are a number of different programs to choose from and most of them are free.

If you don't have Blog software, you can use the online page that most blog hosts have for your blog. This is usually clunky to use and allows a serious error to occur. One time while using one of these pages, I wrote my whole entry and wanted to search for some additional information. I navigated away from the page and lost everything I had written.

Blog software, like Live Writer, makes publishing your blog easy. Besides doing WSYWYG markup, they allow you to upload the content and some even allow you to upload pictures. And not just to host sites associated with the software - anywhere.

Well almost anywhere, your host site needs to support one of the many protocols available to your blogging software. Freewebs didn't, that is why I stopped blogging there. That and it seemed to have a problem with some external images.

I was going to use Windows Live as my blogging site. But you only seem to get one blog per Windows Live account. So after looking around a bit, I choose blogger. Mostly because they were there, they specialise in blogs and I liked the look of their templates. I don't want to be spending a huge amount of time customising the site, I just want to write words.

A lot of people chose Word Press. Again, I think this is because they are Mac users but there probably are other reasons.

The last thing you need with a blog is decide on you content. I'm a pretty eclectic person so I wanted to write about everything. But I'm learning quickly that you can't do that. People have to take an interest in the subject matter of your blog in order for it to get read. This is what we are trying to achieve, isn't it? To have our blog read.

So pick a subject and stick to it - or do like I did and start a number of blogs, one for each subject you like to blog about. Before you know it you'll have more posts than you expect.

A Big Snake Rant

Python.

I'm having to use Python at work. I used it maybe 10 years ago and it was pretty bad then. You know what, it's still a pretty bad language. Before you get your knickers in a knot let me explain why.

First off, there are still positional aspects to the language. Years ago I spent literally days trying to track down a 'syntax error' only to find that I didn't put the first line in the correct column. That problem seems to be corrected but there are still 'syntax errors' based on indent. Seems you can't use different indents in your script or the Python will barf.

I used to use a lot of positional languages when I wrote for the mainframe but you know what, that was twenty years ago. Get with the times Python.

Next, the actual language, kind of C-ish but not quite. Very confusing if you are used to coding C or Javascript. I think if you are going to make your language that close, you might as well make it work identically. Syntaxes that are too close confuse programmers and lower productivity. Much like the French hate learning Spanish. Que Domage!

Lastly, what the heck does it do that you can't do in any other languages? I don't see anything that I can't do in C, or Java, or VB even. If you're going to comment then please explain this one to me.

So I think the reason people use this is because it's not Microsoft, it's open source and it's free. Mostly because that's the only reason that's somewhat reasonable and still left. Well, good on ya Python, give us what we've paid for.

Crayon Physics

Crayon Physics is a great new game by Kloonigames. I gave it a test drive last night. The graphics are quite simple but that's all part of the fun. You have to get the little red ball to hit the star by drawing things on the screen to interact with it. Sometimes it's easy and sometimes it's devilishly difficult.

The guy who wrote this game, Petri, wrote it in seven days. He has improved it since - with more levels and a level editor. And the game is a winner, it has that rare quality of making you feel like a kid again, just what a game should do.

There is a certain sense of wonder at watching the things you draw on the screen come to life and act as they would in a physical world. It makes for addictive gameplay and you may even learn a bit about physics in the process.

I definitely recommend you checking the trial version out.