For a couple years I’ve had a photography site at photography.brentdanley.com that few people visited. I built it as a project to learn the Flickr API and the JavaScript framework Prototype. I’ve been wanting to incorporate it into my main site for a while, and now it’s done.

Click on the Photography link to check it out.

The new Photography page at BrentDanley.com

css · flickr · jquery · photography · php · phpFlickr · webdev · wordpress

Yesterday I read an interesting article in .net magazine of Dries Buytaert, the founder of popular open source web content management system (CMS) Drupal. In the interview Dries mentioned a new offering from Drupal, Drupal Gardens. Drupal Gardens is a hosted Drupal solution, much like WordPress’s WordPress.com. It allows people who may not know Drupal or who need a quick site to build on on a powerful system with little cost or experience.

Brent's Drupal Gardens site

drupal · drupal gardens · webdev

Since July I’ve been working on a large web dashboard project for Tri-County Mental Health Services in Lewiston, Maine. It’s been fun learning their business and working with the great people there. Although the project is moving more slowly than I’d like, progress is good and I think it looks nice. It will certainly be simpler to maintain than their manually generated legacy Excel spreadsheets. Not only do the charts tell stories about the business impossible with tabular data, they will see significant reductions in the amount of time spent generating their business analysis tools.

The user is able to not only change the date range, but also toggle the display of each individual metric series on each chart, including goals for each. The interactive changes are made dynamically, without requiring a page load. Kinda cool, eh?

The data is culled from disparate data sources and aggregated into a Microsoft SQL Server database I designed. Some of the data is entered via web-based forms I also developed. The server side code is written in PHP and the client-side scripting, obviously, is a combination of HTML, CSS and JavaScript. I make heavy use of the jQuery JavaScript Library and the flot plotting library. All data is sent from the server to the client in the JSON data-interchange format.

Site navigation is done utilizing CSS lists and the fixed zoom buttons–which change the range of all charts on the page simultaneously–use a single CSS sprite image technique.

There’s a lot of work to do, and I’m having a great time.

TCMHS Web Dashboard

January 26, 2010 – While there is much to be done on the web dashboard, there is not enough money to do it. Today my contract is over and, unfortunately, it has not been extended. Here are a couple screenshots of the product as of today.

TCMHS Web Dashboard - AGENCY

TCMHS Web Dashboard - ADULT

css · flot · javascript · jquery · php · sql server · web development · webdev

Everybody knows what a lamp is, but how many have ever heard of a wamp?

For years I used one distribution of Linux or another as my primary operating system and mostly loved it. But Gimp isn’t Photoshop and I was tired of using my laptop to manage and edit my photo library. Photoshop CS3 and Lightroom are the programs I use most after Firefox. So I’m back to Windows XP on the desktop. *sigh*

I’ve been developing in Notepad++ lately and love it! The syntax highlighting and FTP functionality make it a wonderful environment. All I have to do is connect to the server, double-click the file to edit, make the modifications and save. The file is automatically uploaded back to the server and immediately available. It is wonderful.

(more…)

apache · development · environment · linux · mysql · php · programming · web · webdev · windows

Brent Danley Photography has been ajaxified!

**The new url is photography.brentdanley.com.**

The “pages” in the gallery have previously been generated by a single PHP file. This was done by passing to itself a page parameter using the get method. This worked well except that the entire page, including images and linked scripts, had to be reloaded every time the user clicked to go to a “new” page. It was certainly better than creating a separate document for each set of thumbnails, though, even if the header and footer were reused. It made little difference to the user who doesn’t know, and probably doesn’t care, how the page is created. An asynchronous transfer would be an improvement the user would notice.

What I did today was eliminate the necessity of the page reload.

Now, using Prototype‘s Ajax.Updater method, a PHP script is passed a page value corresponding the the link on which the user clicked. The PHP script retrieves the thumbnail and image information from the Flickr API using phpFlickr and returns an XHTML string to the calling method on the client. The return string from the PHP script is automatically inserted into the client element specified in the Updater’s url parameter.

function updateGallery(page){	
	new Ajax.Updater('gallery', 'ajax_gallery.php', 
		{method: 'get', 
		parameters: 'page=' + page});
}

I also performed some CSS jujitsu to animate the thumbnails when the user passes the mouse pointer over them. It was as simple as increasing the size of the images and reducing (to -1px) the size of the margins.

#gallery  a:hover .thumb{
	background-color:#888;
	width:85px;
	height:85px;
	border:6px double #003e7c;
	margin:-1px;
	padding:0;
}

Go have a look.

It still takes some time to load each new set of thumbnails. Besides caching, I’m not sure what could be done to remedy that. I’d also like for the navigation links to be better looking buttons or tabs or an accordion. And the return from the Updater call should probably return an XML document. Another day, perhaps.

Let me know what you think.

ajax · bdp · brent danley photography · javascript · php · programming · prototype · webdev