Tuesday, November 23, 2010

Gallery Server Pro 2.4 Released

After several tireless months, last Friday I released the newest version of Gallery Server Pro. There is a new set of options for controlling the look and feel of the gallery, support for multiple galleries, new HTML 5 and CSS capabilities, performance improvements, and dozens of bug fixes.

Download it here. The source code is also available and can be opened in any version of Visual Studio 2005 or higher. The Microsoft Web Application Gallery version will be available in a few weeks. I also need to update the Admin Guide. Until then, I put together a QuickStart Guide.

Side note: Since this version is nearly identical to the commercial DotNetNuke module, some of this blog post is copied from a previous entry.

New features covered in this post:

  • Auto slide show and other UI customizations
  • Multiple galleries
  • New concept: gallery administrator
  • Video thumbnails
  • Thumbnails from more file types
  • More accurate TIFF colors
  • Gallery Server Pro Binary Pack
  • HTML 5 support
  • Shorter media URLs
  • CSS rounded corners and shadows
  • Web farm support
  • MOV files played in Silverlight Flash instead of QuickTime
  • Reorganized site admin pages
  • Optional treeview navigation
  • Increased limits for album and media object data
  • Eliminated galleryserverpro.config
  • Removed dependence on ASP.NET profile provider
  • Improved install and upgrade wizards
  • Upgrade warning: change in role constraint
  • Where is version 2.4.0?
  • New product key and option to hide footer

Auto slide show and other UI customizations

Prior to 2.4, Gallery Server Pro had a single look – there was a header and footer, and the contents were either a thumbnail view of an album or a single view of a media object. This worked well for many users, but didn’t offer much flexibility when developers tried to integrate a gallery into an existing site.

For example, one couldn’t automatically show a slide show of an album on the home page. Now you can:

This screen shot – and several more below - are from the DotNetNuke version of Gallery Server Pro, but the stand-alone version works the same way. You can see the slide show in action on the home page of the online DotNetNuke Module Demo. This scenario, and many others, are made possible through a new Gallery Control Settings page in the Site admin area. Here is a screen shot of the actual settings used for the slideshow demo:

The key settings are:

  • View mode – By setting it to “Show a single media object”, we tell GSP to show one image at a time rather than a thumbnail view of an album. There is also a new treeview mode.
  • Default gallery object – We set it to the album “United States Scenery”.
  • Display options – We select the checkbox to override the default settings, then turn off most of the UI elements. We also turn on the option to start the slide show when the page loads.

These settings offer a lot of flexibility for controlling how your gallery looks with just a few clicks of the mouse. Each setting has a helpful popup tooltip with info and advice:

Multiple galleries

A gallery is a collection of albums and media objects that are bound together with a common set of settings, such as file storage location, watermark settings, image size, allowed file types, and whether user albums are enabled. Starting in 2.4, each web application can contain multiple galleries. This is a big difference from the pre-2.4 notion of multiple galleries, which allowed a single database to share galleries from multiple *applications*.

The demo site illustrates the usefulness of multiple galleries. There, in a single web application, are five galleries to demonstrate all the major features, with each gallery roughly linked to each menu link. The galleries are managed in the new Gallery Manager:

New concept: gallery administrator

Previous versions of GSP had site administrators, which were users who belonged to the System Administrators role. Those users had unrestricted access to the gallery. When I created the multiple gallery feature, it became apparent that some administrators would like to allow a user to manage one gallery but not others.

For example, imagine you are an IT Administrator and you want to give the Marketing and Engineering departments their own galleries. Employee Bob can administer the Marketing gallery and Vino can control the Engineering gallery. Each can view – but not manage – the other gallery. The way to do this is to assign each user as a gallery administrator to their gallery and give them view-only access to the other gallery. This particular example is fleshed out in step-by-step detail in the DotNetNuke Module QuickStart Guide.

marketing_admin_role

There are two main tasks that only a site admin can do:

  • Enter a product key and change application settings on the Site Settings – General page.
  • Perform a backup and restore.

A gallery admin can edit settings for their gallery and create, edit, and delete users and roles, but they can never make a change that affects a gallery they do not have permission to administer. In the example above, Bob can create a user and give them access to the Marketing gallery but not the Engineering gallery. Nor can Bob promote himself to a site admin. And he can’t remove Vino as gallery admin for the Engineering gallery. You get the idea.

Video thumbnails

Gallery Server Pro 2.4 now supports the extraction of thumbnail images from most videos. Below is an album showing thumbnails from WMV, AVI, FLV (Flash video), MP4, DIVX, ASF, and MOV. Notice that only the Shockwave Flash file (SWF) does not have a thumbnail.

Video thumbnail extraction is made possible through the open source FFmpeg utility. Installing it is as easy as copying a single .EXE file into the bin directory. Read the Gallery Server Pro Binary Pack section below for more information.

Note: Executing a .EXE utility requires Full Trust permission. If your hosting company does not allow this, Gallery Server Pro gracefully reverts to the generic video thumbnail icon.

Thumbnails from more file types

In addition to thumbnails from videos, GSP can now extract a thumbnail from these image and document formats: EPS, PSD, TXT, HTML, and PDF. Here is an example:

The open source utilities GhostScript and ImageMagick are used to generate the thumbnails. As with FFmpeg, these require Full Trust on the server. More info is in the Gallery Server Pro Binary Pack section below.

More accurate TIFF colors

A user alerted me to an issue several months ago where the .NET Framework messes up the colors of certain TIFF images when creating the thumbnail and optimized versions. Interestingly, it only happens on Windows Server operating systems – Vista and Win7 work correctly. Here is an example of how 2.3 created a thumbnail from a TIFF image on Win Server 2008:

tiff_bad

Here is what it *should* look like, and how it now looks in 2.4:

tiff_good

.NET does well with most TIFF files, but I believe it has trouble with CMYK formats. At any rate, the fix was to use ImageMagick for the conversion instead of .NET.

This again requires the server to run in Full Trust. If not, GSP reverts to using .NET for the image conversion.

I’d like to throw out a special thank you to Paul Ecke Ranch who alerted me to this issue and generously donated $300 so I could focus on its resolution.

Gallery Server Pro Binary Pack

The previous features – more thumbnail support and better TIFF color processing, are made possible through three open source components:

ImageMagick – Creates thumbnail images from EPS, PSD, TXT, and PDF files. It requires GhostScript to be able to create images from EPS and PDF files.

GhostScript – It knows about the internal format of EPS and PDF files.

FFmpeg – Creates thumbnail images from video files.

These utilities must be installed separately. ImageMagick and FFmpeg are EXE files that can simply be copied into the bin directory of the web application. GhostScript must be installed using a setup program. You can acquire these programs from the sites linked above or from any number of sites that redistribute them. For your convenience, I created a Gallery Server Pro Binary Pack that includes all three, including detailed instructions.

Installing these utilities is optional. If they are not present, or if the web application is not running in Full Trust, Gallery Server Pro gracefully defaults to generic thumbnails and using .NET for TIFF processing.

Note that ImageMagick also requires certain C++ components on the server. In many cases they will already be present, but if you run into any trouble, try installing the free Visual C++ 2010 Redistributable Package. A download link is included in the instructions in the download.

HTML 5 support

Most browsers – including Internet Explorer 9 – now include some level of support for HTML5. The <video> and <audio> tags in particular have great potential for Gallery Server Pro, since it offers the promise of cross-browser video and audio playback without any dependence on plug-ins. So, in the spirit of moving toward this multimedia nirvana, 2.4 now renders <video> and <audio> tags for browsers and files that support it. For example, .webm, .ogg, and .ogv files are sent to the browser with this syntax:

<video src="getmediaobject.ashx?moid=XXXX&dt=X&g=X" controls autobuffer ><p>Cannot play: Your browser does not support the <code>video</code> element or the codec of this file. Use another browser or download the file by clicking the download toolbar button above (available only when downloading is enabled).</p></video>

In Google Chrome, it looks like this (click the image to go to the actual video):

This .webm video will play in Firefox 4, Chrome, IE 9 (when VP8 codec is installed), and Opera. For IE 9 users without the VP8 codec or for versions of IE8 and earlier, users will see this:

Support for the video and audio tag is sporadic and inconsistent across browsers, so use these new file types with caution, as you may not be able to reach as many internet users as when using something more common such as Flash video.

Shorter media URLs

All recent versions of Gallery Server Pro use a custom HTTP handler to send all media objects to the browser. For example, an image tag might in 2.3 look like this:

<img id="mo_img" src="/gallery/gs/handler/getmediaobject.ashx?YZzFlob6Lr2%2FWRpeFgR3dP9IAGJWWHGY%2FhlG%2FDQhLv%2FiNk%2Fk6X5A9C%2BvdGD0eUga6pME9BRB
8G%2F4M
9Eu7FjuF5FJDzU9zQV4eiavcTBfBOHl4fx5SL6Rd8JZbngVSOvO3PgCCPWays85WEE
qEjna9PnDWVOY0Zmn1KuY%2Ff29wnU0hYDLLv9Ftg%3D%3D" class="" alt="Image caption" title="Image caption" style="height:537px;width:640px;" />

This is better than simply linking to the actual media file for two reasons:

  1. It allows the gallery to serve files that are stored outside the web application.
  2. It allows the gallery to verify the user has permission to view the media object.

But as you can tell, the URL is very long. Why so long? Well, there are several pieces of information encoded into it that helps reduce the number of database lookups. However, it turns out some firewalls will block any request where the query string is longer than 2048 characters, and occasionally GSP will run afoul of this rule, resulting in media objects that mysteriously don’t work/can’t be seen.

So for 2.4, I drastically reduced the amount of data stored in the query string. A typical URL now looks like this:

<img id="mo_img" src="/gallery/gs/handler/getmediaobject.ashx?moid=XX&dt=X&g=X" class="" alt="Image caption" title="Image caption" style="height:537px;width:640px;" />

So now we should avoid getting blocked by firewalls. And as far as performance, while I haven’t measured it, I think things might actually be faster (and at least one user has said this). Since GSP aggressively caches items from the database, most media objects that are requested through an URL are already present in memory, so no extra database lookup is necessary. Plus, we also benefit from not having to encrypt and decrypt data. Finally, we benefit from less data being streamed up and down the internet tubes.

Web farm support

As mentioned in the previous section, Gallery Server Pro uses caching to dramatically increase performance. However, in web farm scenarios, this causes issues because caches are stored on the server, and there is no way to purge caches on all the servers in a web farm when the data changes, leading to stale data and even errors.

2.4 now allows you to turn off the cache, thus enabling web farm support. The setting is on the Site Settings – General page.

CSS rounded corners and shadows

Gallery Server Pro has sported drop shadows around images for a while now:

The technique, which I adapted from Position Is Everything, was a fairly complicated combination of nested div tags and images. Here is what it looks like under the hood:

<div class="gsp_floatcontainer">
<div class="op1">
  <div class="op2">
   <div class="sb">
    <div class="ib">
     <img id="mo_img" src="getmediaobject.ashx?CDZHDoCF…" alt="Penguins.jpg" title="Penguins.jpg" style="height:187px;width:250px;" />
    </div>
   </div>
  </div>
</div>
</div>

Here is the supporting CSS:

.gsp_floatcontainer {overflow:hidden;width:100%;}
html > body .gsp_ns .op1 {background:url(../images/shadow_tr_8x8.png) right top no-repeat;
float:left;display:inline;}
html > body .gsp_ns .op2 {background:url(../images/shadow_bl_8x8.png) left bottom no-repeat;
padding-top:8px;padding-left:8px;}
html > body .gsp_ns .sb {background:url(../images/shadow_800x800.png) bottom right;}
html > body .gsp_ns .ib {position:relative;left:-8px;top:-8px;border:1px solid #a9a9a9;}

Now that all modern browsers – even IE9 – support drop shadows and rounded corners, I was able to simplify it down to this:

<div class="gsp_i_c">
  <img id="mo_img" src="getmediaobject.ashx?moid=XX&dt=X&g=X" alt="Penguins.jpg" title="Penguins.jpg"
style="height:187px;width:250px;" />
</div>

And the new CSS:

.gsp_ns div#divMoView .gsp_i_c {border:1px solid;border-color:#AAA #444 #444 #AAA;margin:0 auto 15px auto;padding:2%;
-moz-box-shadow: 8px 8px 8px #636363;-webkit-box-shadow: 8px 8px 8px #636363;box-shadow: 8px 8px 8px #636363;
border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;}

We went from five div tags to one, and the result looks great:

dnn_rc10

IE8 browsers and older will still get the old HTML, but everyone else benefits from the new CSS support.

One benefit to this change is that it is finally possible to center portrait images in the gallery. Here is how a portrait image used to look (and still does in IE 8 and older):

image_not_centered

In 2.4, all other browsers see this:

image_centered

MOV files played in Silverlight Flash instead of QuickTime

Update Dec 5, 2010: In 2.4.3, the rendering for .MOV files was switched to FlowPlayer/Flash rather than Silverlight. Read more about it in this blog post.

This version changes how .MOV files are handled. Previously, these files were played with the QuickTime browser plug-in, but in my experience it has been buggy, difficult to use, and quirky. Starting in 2.4, .MOV files are played with the Silverlight Flash plug-in. In most cases this offers a superior user experience, including a smoother install experience if the plug-in is not present.

Silverlight Flash only works, however, when the .MOV file uses an MPEG-4 codec. This is true of most newer .MOV files, but may not be the case for older ones. If you discover that one or more .MOV videos won’t play in your gallery, try renaming it with a .MOOV extension and re-adding it. .MOOV files continue to use the QuickTime plug-in.

Or, if you want to revert to the previous behavior of using the QuickTime plug-in for .MOV files, execute the following SQL against your gallery database:

UPDATE gs_MimeType
SET MimeTypeValue = 'video/quicktime'
WHERE FileExtension='.mov';

You will need to restart the application pool to force the gallery to recognize this change.

Reorganized site admin pages

Here is the updated admin pages menu:

sitesettings_menu

No major changes, but there were some opportunities for improving the organization. The Site Settings section is reserved for site admins – gallery admins won’t even see it. The new Gallery section contains gallery-level settings.

Remember the e-mail settings page in 2.3?

sitesettings_email

This page has been merged into the Gallery Settings page. And I finally fixed something that bothered me for a while: What was the deal with the Gallery Administrator on the e-mail page? It’s not a real account and is only used for e-mail. Confusing if you ask me. So I deleted the two settings that had been in galleryserverpro.config (EmailToName, EmailToAddress) and replaced it with a new setting UsersToNotifyWhenErrorOccurs. This setting stores a list of user accounts that should be notified when an error occurs.

The upgrade wizard will automatically migrate this setting to the correct user if you have a user with the same e-mail address as is specified here. You should probably check this after the upgrade to make sure it is set to the desired user.

Optional treeview navigation

There is a new option for browsing your media gallery. If you turn on treeview navigation, a treeview of albums appears on the left side of the screen:

treeviewnav

The treeview loads quickly because only the top level albums are displayed by default. As you drill down, efficient AJAX callbacks populate the nodes. Clicking any album causes the album contents to appear on the right.

Turn on this feature on the Gallery Control Settings page:

treeviewnavmenu

Increased limits for album and media object data

The maximum number of characters has increased for several types of data:

Album title: 1000 chars (was 200)
Album summary: unlimited (was 1000)
Media object caption: unlimited (was 1000)
External media object HTML snippet: unlimited (was 1000)
Metadata text: unlimited (was 2000)

This change was made possible through the use of the nvarchar(max) data type in SQL Server. Since this type was introduced in SQL Server 2005, Gallery Server Pro 2.4 no longer supports SQL Server 2000.

Eliminated galleryserverpro.config

Back in July I blogged about how I was essentially forced into getting rid of galleryserverpro.config so that the gallery could support the multiple portals feature in DotNetNuke. But this has been a blessing in disguise, as eliminating the file has two benefits:

  • Less app restarts. The nature of the ASP.NET configuration system requires that any changes to a config file triggers an application restart. This causes issues like synch and file upload failures when an administrator makes almost any change to a site setting. Now that the data is in the database, admins can change these settings without affecting users. Note that there is an empty galleryserverpro.config file where the old file used to be – it is there solely to prevent an error the first time you run the upgrade wizard, since at that point you are still using the old web.config file that expects the gsp config file to be there. Feel free to delete the file when you are done installing or upgrading.
  • Better architecture for future changes. With the data in the database, it becomes easier to programmatically manage. In particular, writing an upgrade wizard that dealt with XML files was a chore. It also becomes easier, for example, to write an admin page for editing the browser templates (formally known as HTML templates).

There is one downside to eliminating the file – manual changes must be made against a database table rather than an easy-to-edit XML file. One of the more common situations where this comes into play is needing to set ShowErrorDetails to true when the app doesn’t load and you need to see the error message. To help address this particular situation, I tweaked the logic so that error details are *always* shown when debug is set to true in web.config. That is, if an error is preventing you from loading the app and you want to see the error details, open web.config and look for this line:

<compilation debug="false">

Change it to this:

<compilation debug="true">

Of course, you can still go into the database table gs_GallerySettings and set ShowErrorDetails to true, but most of you will find this easier.

Removed dependence on ASP.NET profile provider

One thing I have learned over the years is to minimize the amount of stuff you have to add to your web.config file. Anyone who has tried to manually merge GSP’s web.config file with their own app’s config file will agree. So when I was presented with a choice a few months ago – revamp the profile system to support multiple gallery settings or build a completely new profile system – I jumped at the chance to migrate away from the ASP.NET profile provider. There are two main benefits:

  • GSP no longer has to worry about a properly configured profile provider in web.config.
  • Developers who are already using the profile provider in their app no longer have to manage two subsystems (their app and GSP) that might both share the same profile configuration.

Profile data is now stored in a new table gs_UserGalleryProfile. The upgrade wizard automatically migrates data from the aspnet_Profile table into the new one.

Improved install and upgrade wizards

The upgrade wizard has several changes, as it necessarily must to handle the uniqueness of each major upgrade. It is more robust, with more informative error messages, better error handling, and the ability to modify your existing web.config file. It is also designed to be repeatable. That is, if an error happens early in the upgrade process, you can re-run it and it will resume where it left off.

Both wizards detect when they are needed and start automatically. For example, when a copy of galleryserverpro_old.config is in the gs/config/ directory, the upgrade wizard will start. If the file install.txt is present in the App_Data directory, the install wizard will start. Note that for performance reasons, the app checks for these files only when the application first starts, so if you need to trigger these wizards at some other time, you can still do it by appending “?g=install” or “?g=upgrade” to the query string.

Also, both wizards disable themselves when finished, helping to prevent unauthorized users from running them.

Upgrade warning: change in role constraint

A change in the structure of the table gs_Role may affect a small number of you when you upgrade. Who is affected? Anyone who has more than one gallery web application that shares the same database. In other words, anyone using the multiple gallery feature of 2.3.

If this might affect you, read this thread for details on how to prepare the gs_Role table before your upgrade.

Where is version 2.4.0?

The DotNetNuke module, the stand-alone version, and the Microsoft Web Application Gallery version all share the same code base. Shortly after releasing 2.4.0 of the DotNetNuke module, a few bugs were found before I could release 2.4.0 of the stand-alone version, so it was never released. Similarly, a few bugs have already been found with 2.4.1 before I could release the DotNetNuke 2.4.1 version, so by the time that gets released, it will be 2.4.2 (or maybe even higher). As I write this it sounds like it could get confusing, so I am open to changing this, but at present this is what is going on.

New product key and option to hide footer

This version requires a new product key. As always, it is completely free, although your donation is what allows me to continue working on it. Please support it so I don’t have to get a real job (which I am dangerously close to having to do). As an extra incentive to donate, I offer two great rewards to those who donate $50 or more: (1) A copy of the Dilbert book Casual Day Has Gone Too Far, and (2) A special product key that hides the Gallery Server Pro logo at the bottom of each page.

Monday, November 8, 2010

Gallery Server Pro A DotNetNuke Best Seller!

Wow. Less than a month after releasing the DotNetNuke version of Gallery Server Pro, it has landed on the best seller list on snowcovered.com! OK, sure, it’s number 87, but when you consider there are more than 10,000 modules to compete with, you have to admit that is pretty good.

Thanks to all of you use and love Gallery Server Pro. There are more great things to come!

Tuesday, October 26, 2010

Free license to all donors!

I am continually amazed that there are people who support Gallery Server Pro with donations. It is so easy to just grab a product key and skip the donation, but many of you take the extra time and send a few of your hard-earned bucks my way. I still can’t quite pay my bills with it, but it gets me most of the way there.

I want you to know how much I appreciate it, so with my best Oprah voice, I now announce “You get a license! And you get a license! Every donor gets a license!”

A couple hours ago I sent out hundreds of e-mails – one to every person who has ever donated to Gallery Server Pro. In that e-mail I included a coupon code for a free license for the Professional Edition of the new Gallery Server Pro DotNetNuke Module. If for some reason you donated but did not get an e-mail (maybe your e-mail address changed), please contact me and if I can find some record of you I’ll be glad to set you up.

This offer applies to all people who donated before October 26, 2010. I am happy to take any donation amount at any time, and while this offer applies only to past donors, I will gladly send you a free Dilbert book for donations of $50 or more (use the Product Key Wizard).

Once again, thanks for supporting me so that I can work on my second true love (you know, after Margaret).

Tuesday, October 12, 2010

Gallery Server Pro 2.4 DotNetNuke Module Released

For several years users have asked for a DotNetNuke version of Gallery Server Pro. Today we reach the culmination of more than a year of work – the immediately availability of Gallery Server Pro 2.4 DotNetNuke Module! You can now have a gallery in your DNN site that efficiently and easily manages any file type, including photos, video, audio, and documents.

Play with a live demo. Download a fully functioning, 30-day trial version here. Then grab the QuickStart Guide.

dnndemo1

Gallery Server Pro 2.4 DotNetNuke Module features all the benefits of the stand-alone version of Gallery Server Pro, plus several new ones for 2.4:

  • Customizable user interface
  • Optional treeview navigation
  • Thumbnails extracted from video, PDF, HTML, TXT and EPS files
  • Multiple galleries
  • HTML5 support for <video> and <audio> tag
  • CSS rounded corners and shadows
  • IE9 users receive CSS rounded corners/shadows, while older versions use fallback technique
  • Improved .NET 4 support
  • Reorganized site admin pages
  • Moved contents of galleryserverpro.config to database (reduces app restarts)
  • No longer uses the ASP.NET profile provider

In addition, there are several features unique to DotNetNuke:

  • Tight integration with DotNetNuke’s users and roles
  • Integration with DotNetNuke’s search engine
  • Easy installation using DotNetNuke’s module architecture

More details about the features can be found in my previous blog posts:

Release Candidate Available for DotNetNuke Module

Gallery Server Pro 2.4 DotNetNuke Module Beta Released

Free Technical Support

I have offered free technical support for Gallery Server Pro users ever since the first release, and this practice continues for the DotNetNuke module. The forums now contain a Gallery Server Pro DotNetNuke Module section. Post any questions, comments, or technical support issues there.

Licensing

The module is released under a commercial license. Convert the trial to a licensed version at any time by purchasing a product key at snowcovered.com.

There are two versions of the module:

Gallery Server Pro Professional - $69 Full functionality, unlimited number of media objects, can be installed on unlimited number of portals in a single DotNetNuke installation. No source code.

Gallery Server Pro Enterprise - $199 Includes all features of the Professional version, plus source code.

The stand-alone version of Gallery Server Pro remains under the free, open source GPL license. There are no plans to change this, including the upcoming 2.4 version.

50% Off Introductory Offer!

I am offering a special deal to help celebrate this release: Until November 30, 2010, get the Enterprise Edition for 50% off the regular price of $199. The discount is automatically applied to your shopping cart at snowcovered.com. This is a promotional price only, so be sure to grab it before November 30.

Wednesday, September 29, 2010

Release Candidate Available for DotNetNuke Module

Today I am making available the Release Candidate for the Gallery Server Pro 2.4 DotNetNuke Module. It is stable, tested, and functionally complete. It also contains a number of new features not included in the beta released last month. Read my earlier blog post for background information and installation instructions.

Even if you are not interested in the DotNetNuke version, the next version of GSP will also contain these features, so keep reading.

The demo site shows off the major features and even allows you to upload and manage files for testing purposes:

dnn_rc1

Beta users: If you used the beta, you must uninstall the module before installing the release candidate. The media files will not be deleted when uninstalling, but you will lose the captions and other data stored in the tables. I anticipate – but cannot promise – a smooth upgrade to the general release that does not involve any data loss.

The release candidate contains the same 30-day trial that will be in the final version. It works just like the stand-alone version in that it is fully functional for the first 30 days. When the trial ends, a watermark appears on images and the Site admin area becomes read-only. Restore full functionality by purchasing a product key at SnowCovered (available once the full version is released).

 

Key Benefits

The main features of the DotNetNuke module are the same as the stand-alone version:

  • Intuitive, flexible user interface
  • Share any file: photos, video, audio, documents - anything!
  • Support for zero-maintenance community galleries
  • Powerful user security with flexible, per-album granularity
  • Integrates with existing users and roles
  • Scalable to hundreds of thousands of objects
  • Metadata extraction. Supports these formats: EXIF, XMP, tEXt, IFD,  and IPTC
  • Image watermarking with your own text and/or image
  • AJAX-enabled for more responsive UI
  • HTML templates allow complete control over how media objects are rendered

Plus, there are some great new features in 2.4. These will also be available in the 2.4 version of the stand-alone version, which should be released within a few weeks of the DNN version.

  • Customizable user interface
  • Optional treeview navigation
  • Thumbnails extracted from video, PDF, HTML, TXT and EPS files
  • Multiple galleries
  • HTML5 support for <video> and <audio> tag
  • CSS rounded corners and shadows
  • IE9 users receive CSS rounded corners/shadows, while older versions use fallback technique
  • Improved .NET 4 support
  • Reorganized site admin pages
  • Moved contents of galleryserverpro.config to database (reduces app restarts)
  • No longer uses the ASP.NET profile provider

The web site and Admin Guide covers the existing features, so for this post I will focus on what is new in 2.4.

 

Customize the UI

Prior to 2.4, Gallery Server Pro had a single “look” – there was a header and footer, and the contents were either a thumbnail view of an album or a single view of a media object. This worked well for many users, but didn’t offer much flexibility when developers tried to integrate a gallery into an existing site.

For example, one couldn’t automatically show a slide show of an album on the home page. Now you can, as seen in the screen shot above and on the home page of the online demo. This scenario, and many others, are made possible through a new Gallery Control Settings page in the Site admin area. Here is a screen shot of the actual settings used for the slideshow demo:

 dnn_rc3

The key settings are:

  • View mode – By setting it to “Show a single media object”, we tell GSP to show one image at a time rather than a thumbnail view of an album. There is also a new treeview mode.
  • Default gallery object – We set it to the album “United States Scenery”.
  • Display options – We select the checkbox to override the default settings, then turn off most of the UI elements. We also turn on the option to start the slide show when the page loads.

These settings offer a lot of flexibility for controlling how your gallery looks with just a few clicks of the mouse. Each setting has a helpful popup tooltip with info and advice:

dnn_rc4

 

Thumbnails from videos and other file types

I covered this feature in my earlier blog post, so rather than repeat myself I’ll use the magic of the web and point you to it.

 

Multiple galleries

A gallery is a collection of albums and media objects that are bound together with a common set of settings, such as file storage location, watermark settings, image size, allowed file types, and whether user albums are enabled. Starting in 2.4, each web application can contain multiple galleries. This is a big difference from the pre-2.4 notion of multiple galleries, which allowed a single database to share galleries from multiple *applications*.

The demo site illustrates the usefulness of multiple galleries. There, in a single web application, are five galleries to demonstrate all the major features, with each gallery roughly linked to each menu link. The galleries are managed in the new Gallery Manager:

 dnn_rc5

The screen shot shows the five galleries and their media files storage location. Each instance of the module on a page is linked to one gallery. For example, the home page that contains the slide show is linked to the gallery “Slide show gallery”; the remaining demo pages are linked to their corresponding gallery. Two galleries are re-used – the Demo4 and Demo6 pages point to one of the other galleries since they don’t need their own.

 

HTML5 support

Most browsers – including Internet Explorer 9 – now include some level of support for HTML5. The <video> and <audio> tags in particular have great potential for Gallery Server Pro, since it offers the promise of cross-browser video and audio playback without any dependence on plug-ins. So, in the spirit of moving toward this multimedia nirvana, 2.4 now renders <video> and <audio> tags for browsers and files that support it. For example, .webm, .ogg, and .ogv files are sent to the browser with this syntax:

<video src="getmediaobject.ashx?t22if9isNfsY" controls autobuffer ><p>Cannot play: Your browser does not support the <code>video</code> element or the codec of this file. Use another browser or download the file by clicking the download toolbar button above (available only when downloading is enabled).</p></video>

In Google Chrome, it looks like this (click the image to go to the actual video):

 dnn_rc7

This .webm video will play in Firefox 4, Chrome, IE 9 (when VP8 codec is installed), and Opera. For IE 9 users without the VP8 codec or for versions of IE8 and earlier, users will see this:

dnn_rc8 

 

CSS rounded corners and shadows

Gallery Server Pro has sported drop shadows around images for a while now:

dnn_rc9

The technique, which I adapted from Position Is Everything, was a fairly complicated combination of nested div tags and images. Here is what it looks like under the hood:

<div class="gsp_floatcontainer">
<div class="op1">
  <div class="op2">
   <div class="sb">
    <div class="ib">
     <img id="mo_img" src="getmediaobject.ashx?CDZHDoCF" alt="Penguins.jpg" title="Penguins.jpg" style="height:187px;width:250px;" />
    </div>
   </div>
  </div>
</div>
</div>

Here is the supporting CSS:

.gsp_floatcontainer {overflow:hidden;width:100%;}
html > body .gsp_ns .op1 {background:url(../images/shadow_tr_8x8.png) right top no-repeat;
float:left;display:inline;}
html > body .gsp_ns .op2 {background:url(../images/shadow_bl_8x8.png) left bottom no-repeat;
padding-top:8px;padding-left:8px;}
html > body .gsp_ns .sb {background:url(../images/shadow_800x800.png) bottom right;}
html > body .gsp_ns .ib {position:relative;left:-8px;top:-8px;border:1px solid #a9a9a9;}

Now that all modern browsers – even IE9 – support drop shadows and rounded corners, I was able to simplify it down to this:

<div class="gsp_i_c">
  <img id="mo_img" src="getmediaobject.ashx?CDZHDoCF" alt="Penguins.jpg" title="Penguins.jpg"
style="height:187px;width:250px;" />
</div>

And the new CSS:

.gsp_ns div#divMoView .gsp_i_c {border:1px solid;border-color:#AAA #444 #444 #AAA;margin:0 auto 15px auto;padding:2%;
-moz-box-shadow: 8px 8px 8px #636363;-webkit-box-shadow: 8px 8px 8px #636363;box-shadow: 8px 8px 8px #636363;
border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;}

We went from five div tags to one, and the result looks great:

dnn_rc10

IE8 browsers and earlier will still get the old HTML, but everyone else benefits from the new CSS support.

 

Elimination of galleryserverpro.config

The configuration file galleryserverpro.config in 2.3 and earlier versions contained the MIME types, HTML templates, and most of the settings that were exposed in the Site admin area. While this made it easy to edit in any text editor, it was not compatible with the multi-portal features in DotNetNuke. In addition, ASP.NET would restart the web application each time the file was edited, resulting in delays and potential interruptions for users.

I moved these settings to database tables for 2.4.

 

Elimination of ASP.NET profile provider

Previous versions of Gallery Server Pro used the ASP.NET profile infrastructure to store user profile data such as whether the metadata popup was visible and the user album ID (when user albums are enabled). This worked well but had two flaws:

  1. Web.config modification – The web.config file had to specify the profile provider and the profile properties. If a developer was already using the profile provider, she had to merge the GSP profile properties with the ones she had already defined. This sometimes causes issues with existing code that interacted with the properties, since they were not aware of the new GSP properties.
  2. DotNetNuke profiles – DotNetNuke provides its own profile mechanism that I tried to tap into, but it would have required a lot of work to handle the settings for multiple galleries within a portal, plus it fragmented the settings for GSP – some settings were managed in the DNN profile management and others in the GSP admin screens. Better to have them all in one place.

In the end I created a new table gs_UserGalleryProfile and wrote custom code to interact with it, completely bypassing the ASP.NET profile mechanism and eliminating the dependence on web.config changes and the DNN profile API.

Friday, August 20, 2010

Gallery Server Pro 2.4 DotNetNuke Module Beta Released

Today I am excited to announce the immediate availability of a beta version of the Gallery Server Pro 2.4 DotNetNuke Module. It is based on the same code architecture as the regular version of Gallery Server Pro, which means all the great features you love are now available in a module that runs natively inside a DotNetNuke web application. In addition, version 2.4 brings some great new features such as thumbnail generation for videos, PDF, EPS, text and Photoshop (PSD) files.

The module works in all versions of DotNetNuke 5.0.0 and higher.

Download the beta here. It is fully functional with no expiration. Later in this post I will walk you through the installation process. I will quickly point out that uninstalling the module completely removes all traces of it, including the database tables. Note, however, that any media files you added to the gallery will remain in the default location within the Portals directory – you can delete these manually (this was an intentional decision to prevent accidental deletion).

If you haven’t heard of DotNetNuke, it is a popular platform for building highly functional .NET web applications. The community version of DotNetNuke is free and the source code can be downloaded and modified if desired. It has an extensible module architecture that allows third parties to add additional functionality. There is even a website named SnowCovered where you can browse – and purchase - the available modules.

I created a public demo to show off the Gallery Server Pro module and let you play with it. Here is a screen shot of the gallery:

DNN home 1

The gallery functionality is nearly identical to the stand-alone version of Gallery Server Pro. The only differences are minor tweaks due to the nature of it being a module inside of DotNetNuke. For example, by default, the Gallery Server Pro module does not render a login link since DotNetNuke provides one. Plus, a few redundant features are disabled, such as allowing users to create and mange their own accounts.

The module integrates with DotNetNuke’s users and roles to easily manage secure access to the gallery objects. All SuperUser accounts and users in the Administrators role automatically have admin permissions to the gallery. All users in the Registered Users role have view permissions on objects. This can be changed by editing the role permissions on the Manage Roles page in Gallery Server Pro’s Site admin area.

Just like with the regular version, you can restrict certain albums from users by using the role-based security access. And use watermarking to protect your images. The user album feature can be used to give each DotNetNuke user their own personal gallery. There are dozens of configuration options that let you set up the gallery exactly the way you want it.

If you would like to perform advanced customization, the source code for this module will be available at the general release.

Install instructions

Install the Gallery Server Pro module the same way you do any other module. Log in with a host account (SuperUser) and go to Host – Module Definitions. Click the down arrow and select Install Module.

DNN GSP install 1

Select the Gallery Server Pro Module zip file and click Next.

DNN GSP install 2

Gallery Server Pro uses ASMX web services, which causes DotNetNuke to issue a warning. Select Ignore File Restrictions and click Next.

DNN GSP install 3

The next page shows some information about the module.

DNN GSP install 4

The next page shows the release notes. Pay special attention to the note about requiring full trust! Even though the regular version of Gallery Server Pro can run in medium trust, the DotNetNuke module must run in a web application running at full trust. This is because of an unfortunate decision by DotNetNuke to disable .resx language files, which Gallery Server Pro uses to support multiple languages. The Gallery Server Pro module re-enables this feature, but it requires full trust to do it. I submitted a feature request with DotNetNuke that will eliminate this requirement – please vote on it to help make it a priority with them.

DNN GSP install 5

The next page shows the license, which is a standard commercial license rather than the GNU GPL the regular version is released under. See below for more info about the licensing and pricing.

I have no plans to change the license for the regular version of GSP – it will remain under the GPL for as far into the future as I am capable of seeing.

DNN GSP install 6

The next page shows the results of the installation. Click Return to go back to the Module Definitions page.

DNN GSP install 7

Now that the module is installed, it is time to add it to one of the web pages. For this example, I created a page called Gallery and included it in the menu. From this page, I select the Gallery Server Pro module from the Module dropdown list and click the Add Module button.

DNN GSP install 8

An empty gallery appears.

DNN GSP install 9

At this point you can interact with the gallery the same way you do the regular version of Gallery Server Pro. Add albums and upload media files, or copy files to the Portals directory and then synchronize. Refer to the Media Objects – General page in the Site admin area to view and optionally change the directory that contains your media files.

Thumnbails from videos and other file types

Gallery Server Pro 2.4 now supports the extraction of thumbnail images from virtually all videos, text files, PDF, EPS, and PSD (Photoshop) files. Below is an album showing thumbnails from WMV, AVI, FLV (Flash video), MP4, DIVX, ASF, and MOV. Notice that only the Shockwave Flash file (SWF) does not have a thumbnail.

DNN GSP install 10

And here is an album with thumbnails of EPS, PSD, TXT, and PDF files.

DNN GSP install 11

Thumbnail creation is made possible through the use of three open source components:

ImageMagick – Creates thumbnail images from EPS, PSD, TXT, and PDF files. It requires GhostScript to be able to create images from EPS and PDF files.

GhostScript – It knows about the internal format of EPS and PDF files.

FFmpeg – Creates thumbnail images from video files.

These utilities must be installed separately. ImageMagick and FFmpeg are EXE files that can simply be copied into the bin directory of the web application. GhostScript must be installed using a setup program. You can acquire these programs from the sites linked above or from any number of sites that redistribute them. For your convenience, I created a Gallery Server Pro Binary Pack that includes all three.

Installing these utilities is optional. If they are not present, Gallery Server Pro falls back to the default technique of using a generic image for the thumbnail.

This feature will also be included in the stand-alone version of Gallery Server Pro 2.4, which I expect to release shortly after the DotNetNuke module.

Licensing and pricing

I would love to use the donation-supported model for the module, just like I do with the regular version of Gallery Server Pro. However, donations have not been sufficient to pay the bills, so in order to be able to continue working on it I need to increase revenue. Using a commercial license for this module while keeping the original version donation-supported and GPL seems like a good way to do it. The vast majority of DotNetNuke modules are commercial, and developers are used to paying a small chunk of money in order to enhance the value of their DotNetNuke sites.

Therefore I have adopted a pretty standard commercial license and expect to offer two versions of the module. Note that this may change by the final release.

Gallery Server Pro Professional - $69 Full functionality, unlimited number of media objects, can be installed on unlimited number of portals in a single DotNetNuke installation. No source code.

Gallery Server Pro Enterprise - $199 Includes all features of the Professional version. Includes source code.

Tuesday, August 3, 2010

Adding a gallery in .NET 4.0 without requiring ClientIDMode in web.config

My previous blog post described how to add a gallery to a default ASP.NET 4.0 application. However, yesterday I noticed some strange behavior surrounding the new ClientIDMode property in .NET 4.0. It appears that in some cases you may have to specify ClientIDMode=“AutoID” in your application, but it doesn’t have to be in web.config. Read on for the details.

The tutorial in my previous blog post told you to replace the default web.config file with the .NET 4.0 version that ships with GSP. That version includes a couple attributes to tell GSP to use the legacy 3.5 behavior:

<pages theme="" styleSheetTheme="" validateRequest="false" controlRenderingCompatibilityVersion="3.5"
 clientIDMode="AutoID" />

If you use controlRenderingCompatibilityVersion and clientIDMode like this, I haven’t noticed any issues with GSP in .NET 4.0. If you are content with this, skip the rest of this post and go have a beer (preferably homebrew). Life is good.

But your app might be using the new client ID rendering features in .NET 4.0 and you don’t want to specify legacy behavior. Or you just don’t like the idea of putting your whole app in a legacy mode just because a piece needs it.

As best I can tell, GSP doesn’t need the controlRenderingCompatibilityVersion attribute, so go ahead and change it to “4.0” or delete it altogether.

But you can’t get rid of ClientIDMode so easily, nor use its default value of Predictable. In a stand-alone version of GSP, I can find one thing that breaks – the rearrange page.

Fixing the code on the Rearrange page

One of the really nice functions in GSP is the ability to drag the items in an album to reposition them:

rearrange1

But when ClientIDMode is left out of web.config or set to Predictable (or Static), you can no longer drag the thumbnails around. This turned out to be pretty easy to fix by changing one line of code in \gs\pages\task\rearrange.ascx:

onmousedown="<%# Container.ClientID %>.startDragging(event);">

Change it to this:

onmousedown="eval(this.parentNode.parentNode.id + '.startDragging(event);');">

You can make this change by just editing the file in a text editor like Notepad, and you do not have to recompile the source code. The next version of GSP will incorporate this fix.

I don’t really understand why the original code fails, since Container.ClientID should return the client-side name of the object. But the reality is that Container.ClientID returns a different ID than what is eventually output to the page, and this makes the javascript unhappy.

Does anything else break?

Well, it depends. In the stand-alone version of GSP (that is, when the gallery is the entire application), everything else seems to work. But when I add a gallery to an existing site, like I did in the tutorial, at least two of the ComponentArt controls failed – the Grid and Dialog controls. This breaks a bunch of stuff, including the image metadata window and several pages in the Site Admin area. For example, here is the Manage Users page:

users

I poked around for a bit, and I don’t know why it is failing. It is a mystery why it works when run as stand-alone app but not when added to an existing site. I tried it in both a default VB and C# ASP.NET 4.0 app and got the same (failing) results. If you have any theories let me know.

But the workaround is easy. Tell the gallery to use ClientIDMode=”AutoID”. This causes ASP.NET to generate client IDs the same way it did in earlier versions of .NET. By default, controls inherit this setting from their parent container, so you can set this once in web.config to get everything working very quickly. But, as I noted earlier, you might not want the entire app to use this mode. That leaves you with a few choices as to where you want to set it:

Page – Choose the .aspx page that contains the gallery and use a page directive to set it:

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" 
    CodeBehind="Gallery.aspx.vb" Inherits="WebWithGsp.Gallery" ClientIDMode="AutoID" %>

Gallery control – Add the property to the top-level gallery control:

<gsp:Gallery ID="g" runat="server" ClientIDMode="AutoID" /> 

One or more child pages or controls – You can add this property to child user controls or server controls. For example, you could set it on the Manage Users page at gs\pages\admin\manageusers.ascx:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="manageusers.ascx.cs"
Inherits="GalleryServerPro.Web.gs.pages.admin.manageusers" ClientIDMode="AutoID" %>

But you would have to do it multiple times, which can be error prone (you might miss a few). Don’t do this. Just choose one of the top-level locations – web.config, .aspx page, or Gallery control, and set it there. Do it once and you are done. As with the edit to the rearrange page, you do not need to recompile the source code.

Hope this helps.