April 19, 2007

Development Tools used this Semester

I'm curious what tools were used by the different groups this semester in developing the projects and mini projects.

The tools we used for MyFavoritePlaces were:

WinSCP: Freeware SCP/FTP program for connecting to webserver and transferring files.

PSPad: Freeware text editor. This supports syntax highlighting and makes code editing much easier than using notepad. This also integrates with WinSCP so you can click to "edit" in WinSCP, edit in PSPad, and then save the file back to the server without switching between various windows that may be open.

MySQL Query Administrator: Free from the makers of MySQL. Used for creating/managing MySQL databases, tables and data.

Firefox with Firebug Plugin: This combination made troubleshooting logic errors in code and CSS a breeze. (It's still a pain to troubleshoot crossbrowser problems though)

Let us know what tools you used and what you thought of them.

Thanks!

Agile Spaghetti

I personally like Agile development. In fact I've used it agile methodologies before I even heard about Agile.

The strengths that I like include the fast development time, the focus on results over paperwork, and the collaboration between developers and end users.

The danger to Agile techniques is the lack of documentation that is necessary for large organizations. Large organizations often have a correspondingly large IT support staff and when they need to support an application, good documentation is necessary. Because Agile focuses on getting working code to the end user, this documentation is often not done, incomplete or out of date.

Another danger in Agile is the propensity to begin coding too quickly. I think design/coding should only be started after a good understanding of the project and the major components are understood. Even though Agile focuses on iterations of increased functionality, it is important to know how your early iterations will affect later iterations

In our class project, we've had to re-design and re-implement functions from earlier iterations because the early iteration did not anticipate a future need. When you need working code in a short period of time and have to re-do code from an earlier time, the tendency is to create "spaghetti code" where code is strung together in a less than optimum manner.

Spaghetti code is very hard to maintain because it is difficult for other programmers (even the original programmer) to follow the logic when doing maintenance, enhancements or troubleshooting of the system. These type of systems will usually also have less than optimized performance.

When doing an Agile project, you should plan on time for re-factoring code and documenting the system in a way that ensures that the system will perform well and be able to be supported by the end users organization.

April 14, 2007

Splagbots

From Praneeth's blog:

I guess spam guys are running a marathon. From past two days I've been getting lots of spam comments(mortgage, furniture, hotgirls and what not) to my email..Just today I recieved like 6 spam comments. Ofcourse I've deleted them..This never happend to me.Earlier, I used to get once in a while which I totally understand but 6 in a day is way too much. Did any of you face similar kinda situation? Is there any solution?

I've been getting an increased amount of comment spam also. It's hard to avoid this kind of spam because the spammers are using the same techniques that we are using for systems integration to deliver the spam.

We have been able to grab search results from sources such as Google, Yahoo and other places because we have studied their API's and know the correct way to cause the source to do something useful for us. We are also able to use proxy pages to simulate a user accessing a website via a server.

Spammers are familiar with popular blog engines such as Movable Type, WordPress, and others. Using this familiarity, spammers create robots that simulate real visitors in order to crawl through blog sites and post spam with ease.

I think I'll call these robots SPLAGBOTS. This is just a randomly created word that is just coincidently reminiscient of the words spam, blog, and robots all shoved together...just like Ajax "isn't" actually an acronym for Asynchronous Javascript And XML.

Since Splagbots try to impersonate real people in the way they submit comment spam, the best way (currently) to fight them is to have the server evaluate their behavior and respond in a way that keeps the spam at bay.

For example, splagbots are incredibly fast in their crawling and posting of comment spam. Speed is necessary because the spammer's goal is to submit spam as fast as possible (faster means more spam reaches people). The server could have a mechanism to detect activity that is occurring too fast for a human and then take actions such as automatically deleting the comment or adding the splagbots ip address to a blacklist.

Movies4Me

From Kim's blog:

I just thought it was funny some projects are actually useful in everyday life. So Jeff, are you going to keep your website up for a little bit for all to use? If so, can we get a link? :)

I hadn't thought about keeping the movie theater search up (but also hadn't thought about taking it down either). Here's the link to my mini-project http://www.myfavoriteplaces.org/movies.

m4m.jpg

After this semester is over, I'll probably add more functionality to the site but for now it is a quick way to find movie theaters and showtimes.

You're right about some of our projects being useful outside of the classroom. I get caught up sometimes on the technical details and viewing this as an assignment, that I forget that other people might be interested in what I'm doing or might have suggestions to help me improve my project.

Thanks for liking my project :)

How to Use Dynamic Javascript and JSON

Normally, you cannot use XHR to retrieve data from a server that is not at the same location as the web page that you are on. This limitation can be overcome by using Dynamic Javascript.

Dynamic javascript takes advantage of the fact that scripts can be downloaded into a web page from external websites.

Here is an example of how to do this. Feel free to make your own example using the "_jsoncount.php" page but keep in mind that useful data will only be returned if the location is in our "favorites" database. You can go to http://www.myfavoriteplaces.org and add a few favorites to ensure that you can retrieve a popularity result.

The script returns data in JSON, so take a look at how easily the getPopular function references the data compared to trying to access data from xml.

First we need to create the dynamic javascript element that is inserted into the page.
Once the script tag is created, the browser downloads the javascript from the
supplied url. Even though the url is for a *.php page, a javascript function
is actually returned from it.

This snip of javascript creates the dynamic script tag (the "title" variable in this script contains the name of a business being queried for popularity).

//-- URL of remote script to download.
var dynaurl = "http://www.myfavoriteplaces.org/scripts/_jsoncount.php?favoriteid=" + title;

//-- Create the dynamic script tag
var dScript = null;

   dScript = document.createElement("script");
   dScript.src = dynaurl;
   dScript.id = "xssScript";

//-- Find place in document to insert the new script tag. Script call is executed
//-- as soon as the script is appended into the document
var topHead = document.getElementById("head");
topHead.appendChild(dScript);

This is the script tag that the browser creates:

<script id="xssScript" src="http://www.myfavoriteplaces.org/scripts/_jsoncount.php?favoriteid=Burger King" />

This is the javascript that is returned to the browser:

getPopular([ {"title":"Burger King", "popularity":1 }]);

Now you might wonder what this javascript is supposed to do. You'll notice that this javascript is actually calling a function called "getPopular" and not declaring a function.

This means that a function called "getPopular" must already exist. The existing function is then passed the array that is passed back with the getPopular call from the returned javascript.

Here is an example of an existing function declaration that handles the data returned from the remote server:

function getPopular(popular) {
   var vLocation = popular[0].title;
   var vPopularity = popular[0].popularity;
  
   alert(vLocation + " is liked by " + vPopularity + " member(s)");
}


I hope that this is useful example of using dynamic javascript and JSON. Have fun!

April 12, 2007

Example of how to use "getElementsByTagName"

The .getElementsByTagName (GEBTN) is a very useful DOM method for navigating both HTML and XML structures.

It is important to remember that this method returns an array of dom elements that match the tag name. It is up to the developer to know the structure of the DOM in order to get the right elements in the array.

Here is an example of parsing xml data from a variable called "xml" (This data is modified from an actual Yahoo! movie feed):

<channel>
<title>Movies Opening This Week</title>
<link>http://movies.yahoo.com</link>
<description>Movies Opening in Theatres This Week</description>
<item>
<title>Perfect Stranger opens April 13th, 2007 (wide)</title>
<description>An undercover reporter tracks down a killer.</description>
</item>
<item>
<title>Pathfinder opens April 13th, 2007 (wide)</title>
<description>A legion of Vikings battles Native Americans.</description>
</item>
<item>
<title>Disturbia opens April 13th, 2007 (wide)</title>
<description>A man under house arrest witnesses a crime</description>
</item>
</channel>

Suppose we want to retrieve data from the upcoming movies and display in an alert box. In this case, we want the titles and description of the movies.

We can't just use GEBTN on "title" because that would also return the <title> node for the channel and we only want the ones related to the movies. We can see that all the movies are contained within <item> tags, so that will be our starting point.


var movies = xml.getElementsByTagName("item");

We now have the contents of all the <item> tags referenced in an array called movies. After assigning these tags to the array, we want to access the title and descriptions of the movies, so we must iterate through the array using an index.

The easiest way to iterate through is using a "for" loop.

for (var i = 0; i < movies.length; i++) {

   var vTitle = movies[i].getElementsByTagName("title")[0].firstChild.nodeValue;

   var vDescription = movies[i].getElementsByTagName("description")[0].firstChild.nodeValue;

   alert(vTitle + "\n" + vDescription);

}

The "movies[i]" is referencing a specific <item> in the zero based array. "movies[2]" for example will correspond to the <item> tag that contains the <title> tag of "Disturbia...". We again use the .getElementsByTagName to get an array of tags called "title" that are INSIDE the current <item> tag as referenced in the movies[] array.

For this example, we know that there is only one <title> tag under our selected <item> tags, so we can select it with the index of [0]. We also know that the <title> tag contains one child and that it is a text node, so we reference it with ".firstChild.nodeValue".

I hope this is useful to anyone that might be having problems using xml from javascript. This is just a basic example of getting data out of xml using dom methods, but I hope it is informative enough that a reader can understand the basic concepts.

Check those Parameters passed to PHP proxy

When using a PHP proxy, it is important to check whether it has received relevant parameters from the calling page. Some parameters might be required and some might be considered optional.

When checking for missing data, you could allow the PHP page to assign default values to missing data. This can allow you to configure default values in the PHP page for infrequently used parameters and allow the defaults to be overridden if the caller decides to send the parameter in the proxy call.

For example, if your proxy is designed to retrieve pictures, you could have your proxy automatically decide that the picture size will be 320x240 unless calling page wants something differently. Perhaps sending something like "&height=640&width=480" would cause the proxy to return images at 640x480.

Using default values for required values can be helpful in testing because the PHP page can be called without having to go through an html page. This is also helpful for testing html pages that call the proxy by allowing the proxy to be called without supplying parameters.


//-- This attempts to assign variable $loc the value from parameter "loc" if page is called with GET method

$loc = $_GET["loc"];

//-- After the attempted assignment, this line checks if $loc was actually set to a value. If it was, it keeps its assigned value, otherwise it is given a default value..in this case a default zip code of "48186"

$loc = (isset($loc) ? $loc : "48186");


I have proxy that pulls a Yahoo! weather feed. It uses "loc" as a parameter for the local zip code. If it is not supplied, the proxy uses "48197" to retrieve the data.

//-- This link specifies a zip code of "48154" and gets weather back for Livonia
http://myfavoriteplaces.org/movies/scripts/_getweather.php?loc=48154

//-- This link omits the zip code and gets weather back for Ypsilanti using "48197" as the default
http://myfavoriteplaces.org/movies/scripts/_getweather.php


This type of checking is also good for determining if this page was called from another page or if a visitor is trying to access the page directly. Some php files are not supposed to be run by themselves, so checking for valid values can allow the script to fail gracefully.

For example the following would let the user know that they shouldn't run this file directly and then stops running the script on the page.

if (!isset($loc)) { die ("You cannot access this file directly..."); }


April 4, 2007

Re: Question for team myfavoriteplaces

From Matthew's blog:

I was just curious where you are hosting it. If you of you have an individual server setup, or if you are hosting it somewhere. I would like to host a web page of my own in the future, and I'm just wondering what the route you took was.

We are using Pair Networks to host the site. I've used Pair for years and have always enjoyed their service offerings, customer support and more than reasonable pricing. Pair has several tiers of service (all based on FreeBSD servers running Apache) that is geared toward web developers.

If you need MySQL databases, humungous e-mail accounts (which you can access with either POP/SMTP or from webmail interface), PHP 4/5, Perl, Python, then Pair is the perfect place to go.

To see some of Pair's offerings, go to http://www.pair.com/services/web_hosting/. For anyone that wants to have a powerful environment for learning, building personal and professional websites, I'd recommend the "Advanced" account which provides the best service/price value. There are a couple more basic account types but they don't provide PHP or MySQL which is almost essential for building interactive websites.

For actually registering a domain name, I usually use pairNIC (a sister company of Pair Networks). Their domain registrations aren't the cheapest ($19 for one year) but I've had great service from them compared to other registrars. For this project though, I used Yahoo! Small Business to register the domain because they were running a special. In fact it looks like they are running the same one right now...$1.99 to register a domain name for the 1st year.

As a side note, LearningRemix.net runs on Pair Networks so you've already been using Pair and didn't know it :)


April 3, 2007

Re: Rosie's Frustrations

From Rosie's blog:

I have to say, I'm quite frustrated with trying to get cross compatibility with IE and Firefox running my mini-project...Anyhow, I am asking for help at this point, because I'm so frustrated!...

Rosie,

I haven't had a chance to look real deep at your examples, but the quick glance at your text-utils.js reminds of the similar experience that I had that turned out to be due to differences in how IE and FF handle namespace.

Please look at my blog posting where I described my work around. In my posting, look for the "gml:" as a guide for where to place your "aws:" ns prefix. Hope this is helpful.

April 1, 2007

Using Dynamic Javascript to Overcome XHR Limitation

Tom posted on his blog:

[Re: Logging user out of facebook] ...I guess the logout PHP on Facebook get the session or user id out of the browser variable or cookie and then deletes it. I think the only thing we might are able to do is to open a popup or an extra site which logs the user out while the main browser window displays our own login page.

Or has anybody another idea to approach this problem?

Google (and other sites) use dynamic javascript to overcome limitations on cross site access. This is done by dynamically adding script tags that point to scripts on other sites. I've briefly tested this concept against your problem by creating test page that generates a dynamic script pointing to the logout.php page. Because script tags normally contain script (go figure), the script tag needs to have it's type attribute set to text/html so that the browser doesn't get confused with the response from the remote server. I don't know how to include a POST parameter with this technique (for the confirm parameter) so this may or may not actually work if that parameter is really required.

You can access the test page at http://www.myfavoriteplaces.org/test/test.html. I'm able to verify that the script runs properly on IE and Firefox on my computer...and that the logout.php does get called. I don't have a facebook account so you'll have to see if this works against an actual logged in user.

Here is a portion of the test.html that creates the dynamic javascript:

Hope this helps.

March 30, 2007

Fixed "Unknown City" Error in My Favorite Places

I want to say thanks to Kae, Joern, Dean and everyone else that noticed that MyFavoritePlaces.org breaks when the site isn't able to determine the user's geographic location.

I think we have this fixed now. if you were getting the "(Unknown City?)" error when visiting our site, please give it another try. (and let us know if you experience any more freezeups)

The geolocator service for our website usually returns "(Unknown city)" if it cannot locate the geographic location of the user's ip. We trapped for this in phase 2 but it appears that some ip's return "(Unknown City?)" which wasn't being caught. We are trapping for this response now as well.


http://www.myfavoriteplaces.org

March 29, 2007

Review of MCubed - Iteration2 : Jeff

MCubed

This site allows visitors to locate job listings from Indeed and shows where they are located on a map. This is a very useful tool for job seekers, especially for people that are relocating.

Strengths
1. Easy to use
2. Very relevant tool for today's economy (especially here in Michigan where even the state government is talking about shutting down)


Suggestions
1. Clear the map and sidebar automatically when a new search is performed instead of separate button
2. Allow user to see # of job openings in several cities that match job type.
3. Link job type that user to information on that job...typical duties, required skills, average salary, job outlook, etc
4. Link location information to comparison of cost of livings, quality of life, etc between locations. A person taking a job in California earning $75,000 doesn't get to enjoy as much as a person making $75,000 in Ohio due to cost of living differences.

Review of Whereismycaffeine.com - Iteration2 : Jeff

Whereismycaffeine?

This is a site that selectively targets caffeine retailers in the Ann Arbor area. The site is planned to show user ratings of various retailers.

Strengths
1. Visually appealing site
2. Shows address and hours of operation
3. Data is verified by human

Suggestions
1. The separate page of pictures is not very useful by itself. Try to integrate on main page or consider removing pictures.
2. During the presentation, it was noted that Flickr can take weeks to make tags/pictures available. You might consider allowing visitors to upload pictures directly to your site and associate to caffeine retailers
3. The list of shops is a bit small, could be made bigger
4. Sort the list of shops...alphabetically maybe

Review of Team Extreme! - Iteration2 : Jeff

Team Extreme!

This is a one-stop place for finding a lot of information about basketball teams. The site displays a map with markers for basketball teams. Clicking on the team in the boxes below or from the drop down list displays a balloon with statistics, news and game schedule for that team.

Strengths
1. Nice design and layout
2. Presents a lot of information that basketball fans are likely to be looking for
3. Site makes it easy to locate information with minimal effort
4. Good use of tabs and scrolling sections to keep information contained

Suggestions
1. Interactions with map seems to be very slow. Is there any way to speed up the movement (caching, reposition map before showing balloon?)
2. Any way to allow visitors to buy tickets to games?

Review of AJACS - Iteration2 : Jeff

AJACS

This site allows visitors to see different places in India. Selecting a city from the dropdown list will display a marker on the map showing where the city is and creates a balloon showing local points of interest. Clicking on an attraction brings up a collage of pictures that the visitor can view.

Strengths
1. Selecting a city brings up current news related to the city.
2. Weather tab shows local weather
3. Picture collage allows zooming to any picture
4. Able to zoom in on map in satellite mode

Suggestions
1. Once city has been displayed once, user should be able to click on the pin and have balloon reappear.
2. Is there any narratives that can be included to give a history of each attraction?

I really like this site and I'm looking forward to the 3rd iteration.

Review of Map Your Buddies - Iteration2 : Jeff

Map Your Buddies


This site allows users to get list of buddies from facebook and display their location on a map.

I'm glad that this group also created a demo area for those of us without facebook accounts. This iteration appears to have done a lot of work in integrating the user login function into the project so the user doesn't have to login to facebook separately. (I'm not sure how the security is handled, some users may not want to enter their facebook account information on someone elses website)

Strengths
1. Web layout looks very good
2. Clicking on the map markers displays list of buddies located there
3. Clicking on the buddy list displays some info on that buddy

Suggestions
1. When clicking on map markers and list of local buddies shows up, it would be nice to be able to click on the buddy right there to see info.
2. Sort the buddy list by name to make easier to find buddies.

Review of ISA Site Mashup - Iteration2 : Jeff

ISA Site Mashup

This site allows international students to quickly locate information and places around Ypsilanti. I like the concept but I think that the site needs to provide more search functionality that is geared toward international students. Right now the search functions are more general in nature (other than the restaurant searches but only one has been implemented)

Strengths
1. Intuitive interface
2. Shows traffic, weather and local news
3. Pre-Defined search boxes allows visitor to quickly search for specific places
4. Map zooms to show where search results are at on map

Suggestions
1. Display search results in a way that allows the visitor to see them as a list instead of having to click on each result marker.
2. Have more searches that are relevant to international students

Review of HackNMash - Iteration2 : Jeff

HackNMash

This site is designed to complement the ParentsWithoutPartners.org website which is an organization devoted to single parents and their children.

On the first iteration, there was a map with markers pointing to events but no calendar or list of events to describe the events listed on the markers. In this iteration there is a calendar and list of events but no map?

Strengths
1. EXCELLENT target audience
2. Good service selection to use in project

Suggestions
1. When providing the link to the mashup, please be more specific...It took me a while to find the right page because of all the links on the site. In fact, the link to the event calendar was buried in a link on a child page...pwp.html -> events.html -> events2.html.
2. Bring back the googlemap and link it to your google events list and calendar.
3. Keep same look and feel of rest of website when on the HackNMash page

March 27, 2007

My Favorite Places - Instructions

To get the most out of the current iteration of My Favorite Places, please note that the "Change User" button is supposed to "switch" to the user listed in the box to the left of the button.

Currently, creating a user is not a formal process (no registration or password is required) and simply uses the value in the text box as the user. The current user is supposed to be stored in a cookie so that subsequent visits will automatically show the users favorites. On the users initial visit to the site, the page "suggests" a username of the users IP address, but I would recommend changing the "default" user id to something more personal (and easier to remember) before adding favorites.

There appears to be an inconsistent problem with the userid getting saved as a cookie...especially with Internet Explorer...and most frequently on computers in the CIS lab. If you go to the website for the first time but are able to see a list of favorites already, you are probably experiencing this problem and are seeing favorites that have been saved with a userid of "null".

As some have noted, the site needs instructions added and we will try to get instruction added shortly.

After creating a list of favorites, you can create an rss feed to incorporate into other applications or sites. This feature is available as soon as you save your first favorite. For example, if you choose a user id of "johndoe", you can access an rss feed of your favorites by pointing to http://www.myfavoriteplaces.org/rss/johndoe.

The site, as it existed at the second iteration is at http://www.myfavoriteplaces.org/phase2 but you are also welcome to visit the "work in progress" at http://www.myfavoriteplaces.org at any time to see our current progress.

Thank you everyone for your comments and suggestions.

March 23, 2007

Re: More IE agony...

From David Phipps' Blog:

The flickr api we incorporated into our site works great in firefox (big surprise) and returns an error in IE.

I have also felt the pain of Microsoft's "innovative" way of following standards. But in this case, the error is understandable. You are trying to access the .innerHTML of the "photos" element but you actually have two elements called "photos". One of the elements is an img tag which is causing the error. Change the img's name and id to something else and your error will go away.

March 22, 2007

IE and creating new Elements

We encountered another browser compatibility problem (Thanks Microsoft!) that took some investigation and trial & error to fix. Actually, we rely on error's occuring in order to fix it.

The problem that we had was that when we appended new nodes into the div for our "favorites" list, Internet Explorer would ignore the associated style sheets. Firefox handled them fine (Hurrah Firefox!). It turns out that for whatever reason, IE does not add the class attribute to the element as expected.

It seems that you can't use the a normal *.createElement("div") method with IE and then add class attributes. Microsoft either requires a different attribute name (possibly "classname") or the class attribute can be set by calling createElement with html tag equivalent.

So, to work around this, our code now tries to create the div element using the Microsoft syntax, and if an error occurs (which it will for normal browsers), we catch the error and create the div and set the class attribute the right way.

,,,Iterating through XML results...

var dElement = null; try {

if ((i/2) == (Math.round(i/2))) {
dElement = document.createElement("<div class='resData'>");
} else {
dElement = document.createElement("<div class='resDataAlt'>");
}

} catch(err) {

dElement = document.createElement("div");
if ((i/2) == (Math.round(i/2))) {
dElement.setAttribute("class", "resData");
} else {
dElement.setAttribute("class", "resDataAlt");
}
}


This code also checks whether it is an "even" or "odd" div so we can apply alternating color scheme.

March 21, 2007

Re: Question for Raymond

From Chidambaram's Blog:

Is there any special reason why you want to parse the xml output from google base in your PHP and NOT in javascript ?

Actually, in the *.php file, there is a lot of xml parsing code, but the code has all been commented out. A more cleaned up copy of the file can be found here.

Our intent is to use the google search php page to ONLY return XML. We will then parse the XML in either javascript or from a totally different PHP page. The tradeoffs between using javascript or php is, as you noted, javascript is easier to debug but using php can reduce the number of bugs (incompatibilities between browsers) that need to be debugged.

With javascript, the developer will spend a lot of time testing the code against a variety of browsers, versions and platforms. By parsing with php, the developer only needs to test against a single platform/version.

Re: Google Base Stuff !!

From Raymond's blog:

The only problem I'm having is trying to get it to parse correctly...it keeps deleting the html.

We found the reason that the entire page was getting deleted and replaced by the xml. The search data is collected in a form but instead of calling our javascript code, our form was calling the *.php page directly instead. This caused the browser to open the *.php page as a new page...the *.php page then proceeded to execute properly and display the xml results in the browser window by itself.

XSL Transformations

Sometimes when you have an XML document, all you want to do is display the data in your web page without having to create mountains of code to parse the XML and build new DOM.

I've found a couple interesting links on using XML transformations using XSL as a template to convert XML into an HTML fragment that can be easily moved around your DOM. This uses an XSLTProcessor object, which I'm just now starting to play with, which has a "transformToFragment" method which I think will make displaying XML much more efficient.

Here is a link about transformations at Mozilla.

Here is a link about transformations at Agave Group.

Of course, if you need to use the data in some other fashion, such as making calculations, then I think you will still need to build code to parse the DOM object.

March 19, 2007

Re: Help needed with Yahoo weather feed

From Chidambaram's blog


Is anyone in the class using Yahoo weather RSS feed ? I am trying to make use of this for our project. It takes a location id, for the city you need the weather information for, as a parameter and returns an xml file../..it returns the current weather conditions in a CDATA rather than a XML element...

We're not using the Yahoo weather feed, but I did follow the link you provided to get the xml from Yahoo's weather fee.

The CDATA is holding html formatted weather info but the actual weather data is also available within the same xml file in other elements/attributes. For example the <yweather:condition> and <yweather:forecast> tags contain the same temperature and weather condition info that is in the CDATA section.

March 13, 2007

Greylisting

I tested my gmail account again and had similar results as I did previously: my emails are taking a long time to reach recipient email accounts.

I sent my first test message to an email account I have with Pair networks. It took nine minutes to show up. I sent a second test message to my emich account. It took THIRTY-FIVE minutes to show up.

I remembered that I have "greylisting" enabled in my Pair email account in the SPAM control settings. "Greylisting" is a fairly recent anti-spam technique where the mail server temporarily rejects messages if the server doesn't recognize the ip address of the sender or recipient. Legitimate mail will be re-sent by the original server after a short period of time (while Spam software will not re-attempt delivery) and the mail server will accept the message on the subsequent attempt.

I disabled the greylisting feature and the gmail emails began arriving with seconds of being sent. In looking at GMails help, I found that GMail does not send the ip address of the sender in the message. So, I know now why it is taking so long to receive messages to my pair account.

I still haven't verified the cause of the delay with my emich account yet. There aren't any settings in the emich email settings to control spam so I'm assuming all such settings are controlled by the administrator. If this is the case (and EMU is using some form of greylisting), I would think everyone else would be experiencing similar delays.

March 12, 2007

GMail

I've just tried using the new GMail account to send test messages to a couple of my other email accounts. I'm finding that it is taking about 15 minutes or so for messages sent from GMail to actually reach my other email accounts. Mail sent to GMail seems to arrive normally though.

Has anyone else tried using GMail? If so, has your experience been similar?

March 11, 2007

Domain Name Registration

If anyone has thought about registering a domain name for your project, you might consider registering a name through Yahoo!. Right now, they a special offer where new customers can register a domain name for $1.99 for the first year. After you register the domain, you can setup a redirect so people can enter www.yourprojectdomain.com in the browser but then get redirected to your project pages on emich or wherever you have them.

There are other domain registars such as PairNIC (which I like a lot) but registration fees usually range from $10-20 and the $1.99 special seems reasonably priced for a domain name which might only be used for a couple months.

March 7, 2007

Re: Problem related to parsing XML

In reply to Chidambaram's Blog

I'm sure that you will need to use *.responseXML instead of *.responseText. Using *.responseXML returns a DOM object that has the getElementsByTagName method while *.responseText does not. I changed one of my own *.responseXML lines to *.responseText and was able to get the same error message you described...the error went away after I changed it back.

In your message, you are using the variable "xmlDoc.getElements..." but your error message is coming from "document.getElements...". Are you sure you don't have another line of code that might be causing the problem?

I had some problems getting *.getElementsByTagName to work right in both IE and Firefox. In my case, it looks like the problem was due to the tag name having a colon ":" in the name. The tag name is "gml:name". Firefox only recognizes it as "name" while IE required "gml:name". I got this working with this ugly looking code:

var xmlLocation = objXHRfindME.responseXML;
var resLocation = xmlLocation.getElementsByTagName("name");

if (resLocation.length == 0) {
var resLocation = xmlLocation.getElementsByTagName("gml:name");
}

var location = resLocation[1].childNodes[0].nodeValue;
replaceText(document.getElementById("MyLocPlaceholder"), location);

I'll need to go back later and clean this up a bit. Right now I'm using the length property to fix a browser cross compatibility problem but this doesn't seem like the best solution. Also, the length property should probably be checked once again before trying to access data that might not really exist.

March 6, 2007

Cookie Size

For our group project, we were going to use cookies to store "favorite places" for visitors. Unfortunately, cookies can only hold a limited amount of data. We can save a few favorite locations successfully but as we continue to add we seem to run out of space.

Cookies are supposed to hold a minimum of 4k but browsers seem to use the minimum as the maximum.

Instead, we will attempt to store favorites in a MySQL database and use just use cookies to hold the key.

February 18, 2007

Review of MCubed - Iteration 1 : Jeff

Review of MCubed - Iteration 1 as announced here.

I really like this projects concept of showing the locations of job openings graphically. This would be very beneficial for people that are looking for jobs and want to know where the jobs are located.

I know that this iteration was using a static xml file and that the next iteration is supposed to get the xml from a web site that aggregates job listings from multiple sources. I hope the next iteration also allows the visitor to specify location and type of job being sought.

I hope you are also planning to include additional information on these jobs...perhaps info on the company that is hiring. You might need to be careful though, because many of these job listings may be listed under a job recruiter and not the actual employer.

Keep up the good work...I'm looking forward to the next iteration...(I'm looking for new opportunities myself)

Practicing SAP from Home

For anyone that is taking the ERP class and wants to practice using the SAP software from home, you can download the client software from SAP's ftp site. I don't have much time during the week to make it to the CIS lab, so being able to access SAP from home has been very helpful to me.

After installing the client software, you will need to enter the host information in order to connect to the correct system with your account. You can get the host information from the login screen in class or in the lab. If you want to email me, I can provide the host info...I just don't want to post that info on a public blog. My email is jhayton at Eastern's emich dot edu email account.

February 17, 2007

Saving Drafts in MovableType

As many people have discovered, MovableType has a habit of timing out while posts are being created.

From Chidambaram's Blog:

...Earlier, I typed for about one hour ..with many longer breaks in-between. When I finally finished and clicked preview, I realized that I timed-out of movable type and so I lost everything I typed...

It would be nice if movable type had a save-for-later or a draft feature that would just save, but not publish.

Actually, you can save without publishing by changing the status from Published to Unpublished . When you are finished with the posting, just change the status back to Published and re-save.

Review of TeamExtreme - Iteration 1 : Jeff

Review of TeamExtreme - Iteration 1 as announced here.

I am very impressed with how polished this site looks on this first iteration. This site allows visitors to find a variety of information on NBA teams.

Some of the more amazing accomplishments on this site is the information that is retrieved and displayed from within the info window. The data is formatted as html before being displayed in one of the multiple tabs on the info window, I think through a server side script using XHR. The tabs are split to show new, scores, video and schedule for the selected team. I like how the team logo is displayed alongside the data.

My suggestion for next iteration is to reformat the data in the schedule tab as the info window is too small to display the information in the current format without scrolling...it looks like the data is an entire web page.

Also, it would be cool to maybe be able to see list of players on a team and maybe some basic stats.

I don't know if it was my computer, but the site seemed very slow to load. If the page is loading all information for all teams when the page loads, I would suggest to load only a minimal amount of information at first and then make subsequent data retrievals as necessary...such as when clicking on a single team.

Review of ISASiteMashup - Iteration 1 : Jeff

Review of ISASiteMashup - Iteration 1 as announced here.

I like your choice of API's used in this iteration...namely the Google Maps and the Google AJAX Search API (probably because my group is using the same API's this iteration).

I was impressed with how your search was localized to the area displayed in the visible portion of the map and not necessarily to the maps original center point. I also like how selecting an item from the search results is moved from one place to another as well as the fact that different images are used to represent items on the map that are either on the search results list or the "keep" list.

As another review noted, the thick map border is a little distracting so you might consider making the border so that it doesn't stand out so much. I'm curious as to what you envision your final product to do and your target audience.

Review of HackNMash - Iteration 1 : Jeff

Review of HackNMash - Iteration 1 as announced here.

I was impressed that this group chose to develop what appears to be an actual website for a non-profit organization. That must have taken a lot of additional work to create and reflects well on this groups detail oriented efforts.

I finally found the ajax portion of the site after clicking the "events" link. The group appears to be planning to use Google Maps to display the locations of PWP events. There were two markers on the map when the page first loaded. The two locations are being pulled from an XML file on the server but there is no description for the significance of these two locations. The text on the page states that events will be displayed on the map by clicking on an event on a calendar but there is not calendar on the page (I presume that is being worked on).

I'm looking forward to seeing the next iteration for this project. I've noticed that Google maps can get too crowded with markers sometimes, so maybe keeping the map clear of markers except for the currently selected event would be a good idea. Choosing a good default zoom level is also important. (You might remove the lat & long coord from the info window as that may confuse most visitors)

Review of AJACS (Virtual India) - Iteration 1 : Jeff

Review of AJACS (Virtual India) - Iteration 1 as announced here.

I like your site's concept of allowing visitors to go on a virtual tour of India. My supervisor at work just came back from a 3 week vacation to India and was commenting on how beautiful and nice it is over there. She also talked about the Lotus Temple, which I was able to see pictures of from this projects mashup with Flickr.

It looks like the site is still experimenting with the mechanics and layout of the mashup because there are links to two sites that look and operate a bit differently. I have a feeling that neither site looks as it was intended but here are a couple suggestions.

1. Put Navigation, zoom, and map type controls on the Google map. Aside from being able to move around the map, being able to zoom while in satellite view would be incredibly useful for tourists.

2. Don't block the list of attractions with the flickr pictures. Blocking the list really affects the user experience because the use is unable to quickly browse the pictures.

Maybe for a layout, have a drop down list of all locations at top (places of interest & cities). Have a Google map below that has markers (with names) for all places of interest for a chosen city. Display the flickr collage to the right of the map that updates based on the user clicking a marker on the map. Clicking on a thumbnail on the flicker collage could open a new window that is placed initially over the map.

3. If you keep using iframes, be sure to test in Internet Explorer 7 because IE7 reportedly breaks some web apps using iframes.

Announcing MyFavoritePlaces - Iteration 1

Announcing MyFavoritePlaces. Details from our presentation can be found here.

Our team is proud to announce the first iteration of our group project. Please visit us at MyFavoritePlaces and let us know what you like or dislike about our site and any features you think would be beneficial.

Our mission is to provide a tool for people that allows them to find places of interest to them, that are local to where they are, and allows them to manage a list of their most favorite places to visit.

Review of Whereismycaffeine.com - Iteration 1 : Jeff

Review of Whereismycaffeine.com - Iteration 1 as announced here.

Things I liked about whereismycaffeine.com:

1. I like that your data aquisition process is designed to ensure that the data on your site is accurate and up to date. Accurate, up to date information is important to consumers everywhere regardless of the product or service being presented. I think this may be a strength you could capitalize on in marketing/positioning your site.

2. I like the color and graphics scheme. It is visually appealing to visitors. Even the Website logo font is stylized in a way that is appealing. (You might consider downsizing the graphic a little to give more room to your map and cafe list)

3. I like that you are able to display an info window in two different ways: clicking on the cafe list and by clicking on the marker on the map.

4. I like that you are using tabs in the info window to breakup data.


Some Suggestions (related to the data gathering):

1. On the submission page, you might consider capturing additional information such as url for the business's website, phone number, and email address.

2. When the user submits new cafe data, instead of submitting the data to the reviewer by email, perhaps the data could be stored in a manner that allows the reviewer to view, edit, and approve the data from another data entry web page.

3. Keep visual consistency on your site on the data entry page by using the same graphics/layout as your main page.

Review of Map Your Buddies - Iteration 1 : Jeff

Review of MapYourBuddies - Iteration 1 as announced here.

I was unable to personally use the MapYourBuddies project because I do not have an account on Facebook. I checked the requirements for registering at Facebook, and while the service is free, I decided I could not agree to its terms of service...mostly because of privacy issues and facebook's purported ability to aquire commercially valuable rights in any content that I might create.

While I understand that this project is geared toward those that have facebook accounts, I might suggest that the initial page that is presented to visitors contain information about your web application so that visitors know what to expect if they do login. Does the visitor have to login from Facebook first or could you use an API call?

Your screenshot showing where your buddies are is cool. I like that you are able to display photos in the call out box. It'd be cool if you added email or instant messenger links to the page so the visitor could quickly contact their friends.

February 15, 2007

Dreamweaver Academic Prices

I haven't use Dreamweaver much so I can't comment on the features. But, if you decide to purchase it, you should look at http://www.academicsuperstore.com for academic prices. The price is less than half of the retail price.

Also, you can find a wide array of other software at discounted prices for students and teachers.

Re: SPAM

I haven't had problems with spam from the blogs, but I have received a couple "unauthorized" comments...basically just people commenting on my post. Have your spam comments been trying to sell stuff?

From Kim's blog:

For some reason I keep getting comments, pretty much spam comments, about my first blog. Is anyone having this issue? I received about 20 "unauthorized" comments in the past few days about it. They have stopped now, but I was just wondering if I was the only one.

Help with CSS Positioning

In our project, we are putting content into div's. The problem is that the div's don't autmatically flow from left to right but rather below each other. We want to be able to position two divs side by side and another div below the the first div.

In order to get the two div's side by side, we used float positioning. This works fine for the two side-by-side divs, but the third div (the one we want below) wants to snuggle in between the those two. We have temporarily solved the problem by using absolute positioning to force the divs to start at a specific place but it seems that this is not ideal because if we change the size of the first two div's, we will have to adjust the absolute positioning of the third.

Has anyone found any good examples on CSS positioning? Preferably something that allows for dynamic positioning but still allowing control over general layout.

February 3, 2007

Determine Users IP Address

IP Geolocation api's need an ip address in order to lookup the corresponding geolocation information.

I thought of perhaps using client side script to determine the users ip address but realized that many users use NAT on their networks and and private ip addresses on their computers. The private addresses returned from the client side script would not be suitable for determining the correct location of the user.

Instead we can use server side scripting to get the remote ip address of the user. In the case of PHP, we can simply access the REMOTE_ADDR environment variable using getenv(). There are other methods to get the users ip but since PHP is available for our project it seems to be the more practical method for us to use.

This script (try it here) will return the remote ip address of the user:

<?php
echo(getenv('REMOTE_ADDR'));
?>


IP Geolocation lookup

I've been looking for a way to determine the geographic location of a user based on an ip address. This will enable our web project to center the initial map around the user automatically. Otherwise, a user would have to make several clicks to focus on the local area around them (we believe our target market are people looking for restaurants near them).

I thought there would be many public api's available to perform this function. From my investigations, this is not necessarily the case. Most IP Geolocation services are commercial and/or require purchasing access to their database and ongoing subscription for updates. Pricing is generally in the several hundred dollar per year range. (This is too expensive for a small learning project but maybe the University could purchase such a service and make available for class projects).

I was able to find a free community based ip locator service at http://www.hostip.info.

The api to use this service is pretty straightforward:

The call to http://api.hostip.info/get_html.php?ip=12.215.42.19&position=true
returns the following information:

Country: UNITED STATES (US)
City: Sugar Grove, IL
Latitude: 41.7696
Longitude: -88.4588

I don't know how many IP addresses are actually cataloged in this system or how accurate/up-to-date the information is, but it did identify my own address correctly.

I hope this info is helpful to others and would appreciate any info on other free ip geolocation api's that may be available.

February 1, 2007

SOA sites

Has anyone found any good websites for SOA? I've found a lot of websites that talk about SOA but usually only in context with the websites particular product.

SOA seems to be the new thing for developing distributed applications and it would be great to get a general overiew.

Ajax libraries

Many people like the cool magic that javascript can do for ajax applications but then wonder how to make their own applications do the same thing.

Luckily, there are libraries that programmers can use to create impressive ajax applications with a minimal of effort. Libraries allow programmers to focus on the application and not have to re-invent commonly used features.

Commercial libraries from companies such as Component One are good (and you get good support) but programmers can also use open source libraries such as from Tibco or from OpenRico.org.

VISTA not wanted

I've read a few messages about VISTA and whether they should install it. I'd say "NO!". I don't like Microsoft's latest push to wrest control of users computers from them. Vista includes features to restrict what kind of media you can run on your hardware, requires constant "big brother" checking your installation, has draconian licensing restrictions.

Here are some reasons not to install Vista.

I was about to buy a new Dell computer a few days ago but didn't because they are installing Vista on their computers now instead of XP.

WhatToEat.Org

I've found a website that has similar functionality to what our group is working toward. The site has maps for restaurants in a specific geographic area.

WhatToEat.Org

This site also allows visitors to rate the establishment. I was looking for rss feeds for restaurant locations when I came across this but the content appears to be user submitted only.

RE: Are you using Notepad for your HTML editing needs

I've been using vi and notepad because it's quick and one or the other is available on just about any computer. It works ok for html but I'm finding that it's taking longer for me to find typos in my javascript.

Chidambaram's Blog

There is a free tool called HTML-Kit that you can use to do the HTML/CSS and javascript editing. I used this many times and its quite popular. Atleast its better than using notepad. You can download it at this website


I think I'll try to find another editor (maybe HTML-Kit) that can syntax check my code and automatically save back to web server.

January 25, 2007

Firefox plugins for developers

For anyone that will be using Firefox as the primary browser while developing and testing their Ajax projects, there are several plugins that you might find helpful.

The "Firebug" plugin can be found at getfirebug.com. This plugin will help debug javascript and css sheets.

The "LiveHTTPHeaders" plugin can be found at http://livehttpheaders.mozdev.org/. This plugin shows real time http header information that can be used to troubleshoot some web applications. (I've used this before to determine that a web application that kept intermittenly failing was due to a faulty web cluster configuration).

Sometimes, you may want to make a website think you are using a different browser than what you are really using. In this case you could try using "User Agent Switcher". You can find this tool at http://chrispederick.com/work/useragentswitcher/.

Agile Development & Project Management

I like to look at Agile Development as being compatible with standard project management methodologies. Using Agile techniques for software development tends to fall into the execution phase of a project. Agile projects still have other processes besides software development (such as hardware procurement) and also have to fall within a budget and deadline like any other project.

A good article that talks about standard and agile practices together can be found here at Stickyminds.com.

AJAX Interoperability

One of the nice things about AJAX is that it should theoretically be able to run on any platform using almost any type of web browser.

Microsoft might see this as a threat and implement a self defense mechanism called "embrace, extend and extinguish". This will involve Microsoft saying that AJAX is a great thing (embracing) and then proceed to implement AJAX into their products BUT with a little extra added in (extending). Often extensions do add some value in making development easier but the catch is that the extensions won't be compatible with other platforms so applications using the extensions become "locked in" to the Microsoft proprietary platforms (extinguishing the competition).

So, be careful when developing AJAX applications that you don't get tricked into locking your applications to a single OS. This will reduce the market for your application and increase support costs.

VMWare Server

For anyone interested in Virtual Computing, check out VMWare Server from www.vmware.com.

Virtual computing allows a single computer to host multiple "virtual" machines, each with its own operating system and configuration. This allows Microsoft Windows computers the ability to also run Linux or other operating systems on their computers and vice versa...a Linux computer can also run Microsoft Windows and Windows applications nativeily in a virtual machine without pseudo-emulators such as WINE.

Virtual machines are great for learning new OS, testing software and OS patches, development and maximizing the use of computer resources. For example you could develop and test AJAX applications at home by running a virtual server with Linux, Apache, MySQL, and PHP (LAMP) installed without worrying about making drastic changes to your computers main OS.

And best of all, the software is free!

Similar products include Parallels and Xen.

Weather Bonk - Cameras!

That is a cool site!

From Raymond's Blog - Weather Bonk:

Better than the Weather Channel! Maybe I'm the only guy who watches the weather channel! Here is a mashup using ten API's including Google AdWords, Google Maps, hostip.info, Microsoft Virtual Earth, NASA, NOAA Weather Service, WeatherBug, Yahoo Geocoding, Yahoo Maps, Yahoo Traffic.http://www.weatherbonk.com Those of you using Google Maps for your project might find some of these API's as useful.

One of the things that I found on the site is that the "traffic" link shows a map with links to traffic cameras! Clicking on the traffic camera pin shows the actual traffic occuring at that time.

January 14, 2007

Multiplatform apps

It just occured to me that Ajax will be a central component for developing future multi-platform applications.

From Aparna's post:

I was just wondering what are the languages so far that have been used for the AJAX based development and went on to research a lil bit about it , where I found this article . And it says that a study shows that Java was the highly used...

Systems designed using Ajax and Java will allow applications to be developed that can be run on a variety of infrastructures and not be locked into requiring a specific OS be deployed on either the client or the application server.

Ajax example

After reading through the first chapter of Head Rush Ajax, I spent about 20 minutes creating my first Ajax enabled webpage. I created a web page with a button that, when pressed, would update a section of text (encased in a span tag) with the current date. The button calls a script within the page which creates a web request to another .php page which simply returns the current Date & Time formatted in a text string. The returned value is then copied into the current page without requiring a page refresh.

I like the fact that the web browser is able to coordinate integrating data from multiple sources dynamically without necessarily requiring server side processing such as might be found in a typical ASP or ASP.NET application.

Head Rush Ajax

I just read through the first chapter of Head Rush Ajax. It's actually a pretty good book I think for jumping right into new material. I've passed over this series of books in the bookstore because I thought they looked silly but the book is presented this way to introduce concepts quickly without losing the readers interest. The steps to perform each step are described briefly but the text has a lot of FAQ's that answer questions on why a step is done a particular way.

I'm going to look at some other books in this series, O'Reilly has always had good books in their "Nutshell" series, and I'm glad this new series is just as well written (even though for a different audience).

Problem with Tag Cloud?

I'm having a problem using the tag cloud. When I click an item in the cloud, I get a list of posts that are associated with the tag, but only the first link works.

In looking at the list of posts, I notice that each link is trying to open the post from the same users blog as the first. I presume that this is a bug?

January 11, 2007

Creating a link in a blog

Adding hyperlinks in a blog adds value for readers of the blog.

In order to create a hyperlink, first type the text that you want to hyperlink from, click the "link" button (fourth button to the right), enter the URL and click OK.

Example: http://learningremix.net

Archives