Book Review: jQuery in Action

September 28, 2010 by

jQuery in Action, First Edition is written by Bear Bibeault and Yehuda Katz and is probably the simplest and easiest to understand programming book available. Target reader is somebody that already is using javascript in projects and is looking to push the limits of their web applications by using jQuery and many of it’s great plugins.

I found the book and its appendices to be extremely well written. I found the examples to be superbly written and extremely usable in my projects: there aren’t a lot of examples on basic things like selectors but there are a ton of great examples on much more advanced concepts. An additional feature that I found really helpful was the interactive lab exercises that begin around chapter two.

As a reference, which I don’t think was the primary intent, it would be difficult to use the book as some of the API is randomly spread throughout the book. The random spread does make the book a lot better though, because each chapter definitely builds well upon the previous chapter.

I completely recommend this book and can only imagine that the Second Edition improves upon the First Edition. I haven’t really found much negative about the book other than wishing the API wasn’t spread out so much, but the index is very good.

Filed Under: Book Review, JavaScript, jQuery Tagged With: , , ,

Handling Programming Errors

August 24, 2010 by

Handling errors, sometimes called defensive programming, isn’t really something I have been taught very well at Athabasca or Niagara College. Over the last few years, while handling customer support and internal user support I have come to realize that what the dialog box says and the frequency of errors is probably the single biggest user experience issue.

I use the following guidelines for developing and when to show error messages.

Visual Attributes The error message should immediately grab the user’s attention: on a web application it should be exactly in the middle of the screen using some sort of popup, in regular desktop applications it should be in the middle of the screen in a log box. For text, I usually use a bold and red coloured font.

Message The error message must be clear to your average user: if the printer is out of paper tell them that! Don’t give your user just an error code, because they won’t know what that means and they won’t want to read your manual or contact support.

Where? Your user wants to know where it occurred, and how to fix the error. If possible some sort of visual attribute should also be set if the error occurred on a data entry screen. Set the border of the element reg, set it bold if the text is invalid, or even use some sort of icon.

Always make sure your error messages are clear: users don’t want to have to search through some user manual for software they bought, or have to pick up the phone and call for technical support. Apple has really shown us that users just want things to work, and it should of course look pretty. :)

Filed Under: Experience, Programming Tagged With: , ,

How To Post Great Freelance Gigs

July 12, 2010 by

I have been trolling Craigslist and Kijiji lately in hopes of finding some additional freelance work to add to my portfolio before I become a full time freelancer/consultant. Read the advertisements has proven to be a terribly frustrating experience. Advertisers need to always remember that the more details they provide will lead to a much more realistic budget and a system that better meets their needs.

Advertisements need to be as detailed and as short as possible. If the programmer is expected to modify or write plugins for an existing application or website you need to provide details on how the previous system is implemented. Ideally, you will answer all of the following questions. What programming language? What database is it using? Who is hosting it? Is there any sort of documentation? Do you have programming guidelines?

Regarding the actual project or changes to an existing project require you to answer additional questions. Is it completely new project? Who will own the work (source code, graphics, etc)? What’s the timeline? What should the application do? What is the scope of the project?

Always remember that you also get what you pay for and that if you pay minimum wage or outsource to another country (China,India, Brazil, etc) you will likely get inflexible crap that will have to be redone if your site or application goes through some sort of expansion.

Filed Under: Experience, Programming Tagged With: , , , ,

Learning Drupal

July 9, 2010 by

For the last couple of weeks, I have began playing around with Drupal because I’m so sick of fighting proprietary CMS. The proprietary CMS suffers from the vendor updating only updating the CMS when convenient for them and this ends up holding the purchaser hostage. Rolling your own CMS is a terrible idea when there are at least 100s of other CMS that often include 100s of plugins that can perform a lot of the needed functionality.

So far, I haven’t really found anything negative with Drupal’s community or documentation. I am very impressed with the Drupal Handbook and so far have found it sufficient for most of my needs. Drupal doesn’t seem to really suffer from a lack of documentation found in open source software or seem to have any large splits in the community.

So far, I really only have two major complaints or issues with Drupal and both are really more of my fault than anybody else’s. I haven’t exactly found documentation or examples on how to migrate from a different CMS or WordPress: I’m hoping to move away from using a separate templating engine and a separate WordPress blog and combining them in a single instance of Drupal. Migrating completely to one system should allow me to have a single website instead of two distinct entities that only share a domain name: I never really planned to ever have a blog and sort of just bolted it on in hopes of doing something later on.

Drupal’s core is extremely well documented if you happen to start reading the documentation first. I sort of just glanced over the documentation quickly after I did my first install and started tinkering, adding modules, modifying settings, etc. I always seem to learn best by doing. My learning by doing always results in me heading into completely unknown territory and potentially damaging things that already work but again this really helps me to learn a lot about how the software or code performs. I was a little disappointed about the structure of drupal’s core being in multiple “root” folders and thought it would have made more sense to be in a folder like /core to discourage programmers to modify the files. Immediately, I started dropping modules I wanted to use in /module and only realized after reading a little more about the core that modules shouldn’t just be added to /modules and instead should be added to /sites/SITENAMEHERE/modules

Overall, I know that drupal has enough of the functionality that I need in modules and the core to significantly improve the efficiency of my programming and possibly offer a large learning opportunity on software architecture.

Filed Under: Drupal, PHP, Programming Tagged With: , , , , , , ,

Determine if Skype is Installed

May 25, 2010 by

The easiest method of checking whether Skype is installed is actually to check for a Registry Key. We, of course, can’t check C:Program Files for a Skype Directory because the user could have installed elsewhere (or maybe if 64 bit the operating system did?)

Skype’s API Document provides us with the following information:

To check if Skype is installed, in regedit check if the following key exists: HKCUSoftwareSkypePhone, SkypePath . This key points to the location of the skype.exe file. If this key does not exist, check if the HKLMSoftwareSkypePhone, SkypePath key exists. If the HKCU key does not exist but the HKLM key is present, Skype has been installed from an administrator account but not been used from the current account.

Generally, I only care if the Current User has configured Skype, so I will ignore the HKEY_LOCAL_Machine information and instead rely entirely on the HKEY_CURRENT_USER information.

You must make sure you reference: Microsoft.Win32 for the registry functions or modify the snippet slightly.

        using Microsoft.Win32;

        //Function uses Microsoft.Win32 to check registry value of 
        //HKEY_CURRENT_USERSoftwareSkypePhoneSkypePath and returns false if
        //the key is null
        private bool isSkypeUser()
        {
            RegistryKey skype = Registry.CurrentUser.OpenSubKey(@"SoftwareSkypePhone");

            if (skype != null && skype.GetValue("SkypePath") != null)
            {
                return true;
            }
            else
            {
                return false;
            }
        }
Filed Under: .NET Framework, C#.NET, Programming Tagged With: , , , , ,

Mouse Overs For ASP.NET

June 24, 2009 by

Have you ever wanted to have the ability for the colour of a row to change when your user moves the mouse over top of a particular row, and then change the colour back whenever the cursor is moved back off?

Well, this process isn’t very difficult in fact using some knowledge of JavaScript & the Document Object Model (DOM) we can dynamically change the background colour.

We need to override the Render class and then add some attributes to each GridViewRow before the page is finally output to the browser.

In this example, I have called the gridview we are adding the mouseovers and mouseouts “gvClients” because it displays a list of my fictional company’s clients. Wherever you see gvClients you need to make sure that you change this to your respective gridview’s name.

protected override void Render(System.Web.UI.HtmlTextWriter writer)
{
   /*Using a simple foreach we iterate through the Rows and use the row.Attributes.Add() and pass in the javascript property we want to output as    html, along with the function we will use and then because asp.net usually dynmically creates the names for each item we need to use    the row.ClientID as this will exist only on the client side.
*/
foreach (GridViewRow row in gvClients.Rows)
{
  row.Attributes.Add(“onmouseout”, “ColorGridForMouseOut(‘” + row.ClientID + “‘);”);
  row.Attributes.Add(“onmouseover”, “ColorGridForMouseOver(‘” + row.ClientID + “‘);”);
}

//We finally just pass in the html that’s now been created.
base.Render(writer);
}

— Sample javascript

//Change Color of Gridview on MouseOut
function ColorGridForMouseOver(id) {
var el = document.getElementById(id);

if(el.currentStyle) // for msie
{
if (el.style.backgroundColor !=’orange’)
{
el.style.backgroundColor=’lightblue’;
el.style.cursor=’hand’;
}
}
else // for real browsers ;)
{
if (el.style.backgroundColor != ‘Orange’)
{
el.style.backgroundColor = ‘lightblue’;
el.style.cursor = ‘pointer’;
}
}
}

function ColorGridForMouseOut(id)
{
var el = document.getElementById(id);

if(el.currentStyle) // for msie
{
if (el.style.backgroundColor !=’orange’)
{
el.style.backgroundColor=’White’;
el.style.textDecoration=’none’;
}
}
else // for real browsers ;)
{
if (el.style.backgroundColor != ‘Orange’)
{
el.style.backgroundColor = ‘White’;
el.style.textDecoration=’none’;
}
}
}

Thank you for taking the time to visit.

Filed Under: asp.net, Programming Tagged With: , , , ,

Creating a Simple RSS Feed

May 5, 2009 by

RSS is an acronym for Really Simple Syndication and is an XML specification published by the W3C. RSS became a standardized specification around June 2000. This is meant to be a very simple primer on developing an RSS feed. Please note that this is not meant to replace a detailed book or the specification created by W3C. When I first created an RSS feed for a client the specification was the only way to learn RSS.

There are required elements to meet the specification as well as some optional. Some of the elements that are option really should be included logically.

Each RSS feed begins with a tag describing what XML specification the document meets. For example:

<?xml version=”1.0″?>

After the XML Version, we need to know which version of the RSS specification this document will meet. The rss document will also have a closing </rss> tag at the end.

So far, we have:

<?xml version=”1.0″?>

<rss version=”2.0″>

</rss>

The next tag we have is for a channel. A channel is a reverse-chronological list of links to stories that includes a title, and some sort of description.

The channel has a couple of required elements that are mostly self explanatory. The first one is a title (the name of the channel, usually just the website name), a link (to the website) and a description of the service.

So, we now have:

<?xml version=”1.0″?>

<rss version=”2.0″>

<channel>

<title>Brian R. Cline’s News Feed</title>

<link>http://www.brcline.com</link>

<description>Programming Blog for a Programmer Analyst in Niagara Falls, Ontario, Canada.</description>

</channel>

</rss>

There’s many optional elements to include within the channel, but I don’t feel that most are needed to produce a great and strictly valid RSS feed.

For example, there’s image which lets you specify a GIF,JPEG, or PNG to associate with the channel but not all RSS aggregators can show it.

The bulk of the RSS feed is created by using “items” which represent the story and usually include a title, link, and description. All elements of an item are actually optional, but you should include at least a title and description.

An item is fairly simple, here is an example:

<item>

<title>New Blog Post</title>

<link>http://www.brcline.com/blog/page?=13</link>

<description>Brian R. Cline posted about how to create an RSS feed.</description>

</item>

RSS channel’s usually include more than one item and are updated fairly regularly. I’ve included a couple of different items in the final example.

<?xml version=”1.0″?>

<rss version=”2.0″>

<channel>

<title>Brian R. Cline’s News Feed</title>

<link>http://www.brcline.com</link>

<description>Programming Blog for a Programmer Analyst in Niagara Falls, Ontario, Canada.</description>

<item>

<title>New Blog Post</title>

<link>http://www.brcline.com/blog/page?=13</link>

<description>Brian R. Cline posted about how to create an RSS feed.</description>

</item>

<item>

<title>New Blog Post – Welcome</title>

<link>http://www.brcline.com/blog/page?=1</link>

<description>Brian R. Cline posted a new blog welcoming users to the blog.</description>

</item>

<item>

<title>Blog Created</title>

<link>http://www.brcline.com/blog/ </link>

<description>Brian R. Cline adds wordpress to his website.</description>

</item>

</channel>

</rss>

Filed Under: Programming Tagged With: , , ,

Slider by webdesign