WebGallery 2.0 – Introduction
Over a year ago, I started creating the original “Photo Gallery,” which became the blueprint for my online photo and file repository. I created the site because commercial solutions, like Flickr and SkyDrive, couldn’t provide me with exact URLs of both thumbnailed and full-size objects. Google’s Picasa got close, but still required using their interface—which REALLY annoyed me if I wanted to post up photos for the blog.
With a year of experience behind me, and seeing what I liked/disliked about how WebStorage (its eventual name) worked, I set out to create version 2.0.
Download Code: UPDATED 3 march 2008: build 38
Changes in this version:
- Built on .NET 3.5.
- Fully XHTML 1.1 compliant.
- Compatible (mostly) and tested with with FireFox (2, 3pr), IE (6, 7), Opera (9.5), and Safari (3.0.4).
- Removed Enterprise Library dependencies in favor of LINQ-to-SQL.
- Resolution of file handing “issues” in v1.0.
- Implementation of ASP.NET AJAX to speed up gallery rendering.
- Added “paging” to the galleries.
- Removed ASP.NET user controls in favor of cleaner ListViews.
- Added caching to the WebStorageHandler.
- Added Deflate and GZip HTTP Compression to the .aspx and .ashx pages.
- Reengineered thumbnail managed (pre-fab’ed now) to speed up load times. (Thanks for the idea, Michael!)
- and more!
Over the next few blog posts, I’m going to touch on each of the changes (noted above) and the reasoning behind them; however, I wanted to get the code out there.
The project’s laid out in a simply hierarchy—a folder per respective “area,” including the LINQ-to-SQL models. I build the project in such a way to, I hope, easily move into the MVC frameworkThe additional App_Browsers directory is used by our CSS Friendly adapters.
This project is based on ASP.NET 3.5 (without the 3.6 extensions) and a couple of additional libraries:
- Microsoft CSS Friendly Adapters, build 9278.
- Blowery HTTPCompressionModule (alternative to built-in .NET), revision 4.
I also used Visual Studio 2008’s new web tests (seen in the screenshot) to complete load testing and tidy up code. I haven’t included that in the source code, but I plan to do a post on the features and results—it’s a very slick system.
With full LINQ-to-SQL support, I opted for LINQ as a solution rather than the Enterprise Library. LINQ encapsulates the SQL logic to keep our code secure, the data context object is a partial class—allowing us to custom code methods and properties into our models, and it just “works.” If you haven’t noticed from other posts of mine, I really like LINQ as an ORM solution—especially now that it’s built into the environment and fully supported by the framework.
The model itself is quite simple. Three tables control a majority of the functionality for the application.
The WebFile table
The WebFile table contains the actual objects for our WebStorage gallery. ObjectBody and ObjectThumbnail are image columns containing the binary information stored for our objects. The rest of the columns are attributes providing either end-user information (such as Description) or rendering information (such as ObjectType).
A change from the previous data model is that thumbnails are stored along with the web files and are not “automagically” generated—saving both computation time on the server and speeding up rendering for the client.
For our two image fields, I’ve also enabled “lazy loading” or “delay loading”—an attribute that only returns these fields if they are explicitly used within the code and only once per query to save bandwidth.
The ContentType table
The ContentType table manages the MIME types, their thumbnails, and matching object types. This table is used to render icons for PDFs, RARs, ZIPs, and other file types as well as generic icons for photos that do not have thumbnails.
The Gallery table
The Gallery table contains the keys, names, and allowed roles for each gallery. The roles match up to membership roles provided by ASP.NET’s Configuration.
In the next post, I’ll discuss what went into the LINQ-to-SQL queries and how the use of the DataContext’s partial classes sped up development. I’ll also discuss how the ImageHandler has been updated to match these data changes.
Edit: Updated to fix the fonts… I should know better than to create it in Word and then just copy/paste. 😦