Dave Burke : Freelance .NET Web Developer specializing in Online Communities

Associating a Photo Gallery Tag with a Blog Post

This post covers the high points of associating and displaying a tagged collection of photos with an individual blog post in Community Server.

Let's say I'm doing a series of Vermont State Of Mind Goodness, using my recent Hike to Camel's Hump Summit post as an example. For each post in the series I want to display four images from a specific photo gallery tag with a link to all photos associated with that post. In this example I want to display photos tagged with "Camel's Hump."



The issues to address would be associating the blog post with the photo gallery tag and displaying those tagged photos in the GalleryPostList control. If you're thinking, hey, just create a tag that matches the blog post title and pass that as a QueryOverride Tags property to GalleryPostList, that's not a good plan. It's too prone to human entry error, long tags like "Hike to Camel's Hump Summit" corrupt the taxonomic nature of tags, and Tags="<%= someTagVar %>" cannot be passed in QueryOverride properties, as only literal and bound values can be used.

We're going to use a WeblogPost PhotoCategoryID ExtendedAttribute to specify the tag categoryID (in cs_post_categories) which we're going to use when generating the GalleryPostList.




Not a whole lot that's interesting here, but it gets us started. Now we can tailor our custom GalleryPostList control to display photos with that categoryID, oh yes, and at the custom size we want to display those photos. We'll use custom GalleryPostList and GalleryPostImage controls on the web page, with an interesting observation that, with the exception of PageSize, we're not passing any QueryOverrides to get the job done.


<DBVTControl:SidebarGalleryPostList runat="server">

<QueryOverrides PageSize="4" runat="Server" />
<HeaderTemplate>
...
<ItemTemplate>
<CSGallery:GalleryPostData LinkTo="ViewPicture" runat="server">
<ContentTemplate>
<DBVTControl:GalleryPostImage ImageType="Micro" runat="server"/>
</ContentTemplate>
</CSGallery:GalleryPostData>
</ItemTemplate>
...
</DBVTControl:SidebarGalleryPostList>



We need to specify a CategoryID in the GalleryPostQuery, so even though the GalleryPostList is using the context of a Photo Gallery (the lights are on but nobody's home), we can use the WeblogControlUtility to retrieve the current weblogpost, and thus the post's "PhotoCategoryID" extended attribute integer.

I think we've seen the DBVTConfiguration in play in previous posts. The custom CSConfiguration service is a staple in the DBVT Community Server Customization arsenal. Here it's serving up a site default PhotoCategoryID for those posts that do not have a set photo categoryID. The idea is to display photos on all Vermont State of Mind Goodness posts, whether a photo categoryID is specified or not.


DBVT\Controls\GalleryPost\SidebarGalleryPostList.cs

WeblogPost post = (WeblogPost) WeblogControlUtility.Instance().GetCurrentPost(this);
int postPhotoCategoryID = Globals.SafeInt(post.GetExtendedAttribute("PhotoCategoryID"),
DBVTConfiguration.GetConfig().DefaultPhotoCategoryID);
query.CategoryID = postPhotoCategoryID;


The GalleryPostImage sets our custom image size, with Micro stepping up as the new Sidebar image size. I didn't want to create a new GalleryImageType enumerator. The DBVTConfiguration is handy here because we can change the dimensions of the images on-the-fly by changing the image height and width settings in the site DBVT.Config file.


DBVT\Controls\GalleryPost\GalleryPostImage.cs


switch (ImageType)
{
case GalleryImageType.Micro:

// DBVT Modified - Micro is the new Sidebar - ha-ha

DBVTConfiguration dbvtConfig = DBVTConfiguration.GetConfig();
settings = new GalleryImageSettings(dbvtConfig.SidebarImageWidth,
dbvtConfig.SidebarImageHeight, Quality, true);
settings.GalleryImageType = GalleryImageType.Other;

image.ImageUrl = ImageHandling.GetPictureUrl(post, settings);
image.Height = dbvtConfig.SidebarImageHeight;
image.Width = dbvtConfig.SidebarImageWidth;
break;

Oh, I guess you want to see photos now! Geez.

Comments (9) | Post RSS RSS comment feed

Posted on 9/12/2007 8:19:40 PM by Dave Burke
Categories: .NET | Community Server
Tags: No tags for this post

Related posts

Comments

9/13/2007 3:48:08 PM Permalink

Sorry Dave i'm lost here!! The second post down shows an images tab, is this part of CS2007 or have you added that tab? Adding a thumbnail and group of photos is exactly what I want to do on uk-mkivs.net, any chance of some code that created the images tab Smile

cheers.

Dave |

9/13/2007 5:23:33 PM Permalink

Hey, Dave!  I renamed the "Attachments" tab in the ControlPanelResources.xml and the Attachment upload field.  No coding at all.  I took the dropdown from the Gallery Import page, which I saved as a weblogpost extended attribute.  The modification of the GalleryPostList and GalleryPostImage Chameleon controls took the most thought.  Since a client of mine paid for the R&D I can't give the source away, at least not until they pay me. Smile  Continued success with UK-MKIVS.NET, and thank you for your comments.

daveburke |

9/14/2007 1:01:39 AM Permalink

Ah I see, thanks Dave

"I took the dropdown from the Gallery Import page, which I saved as a weblogpost extended attribute"

How do you save as a weblogpost extended attribute? Does I need to create a CSModule to handle that or does CS do it automatically?

A step by step guide to adding blog (forum etc) extendedattributes would be really useful to many i'm sure as it has been asked numerous times on cs.org with no answer

Dave |

9/14/2007 1:07:04 AM Permalink

PS - You have a bit of code in your blog homepage source that isn't rendering   - in some of the

tags

Dave |

9/14/2007 4:21:52 AM Permalink


Thanks for the render info, Dave.  I'll check into it.



Here are the essentials on the dropdown extended attribute. I programmed straight to the CreateEditPost.ascx.cs, as I do in most instances when working with Control Panel source.  



protected ParentCategoryDropDown PhotoCategoryID;



On edit:



PhotoCategoryID.SectionID =



  CommunityServer.Galleries.Galleries.GetGalleryID(CurrentWeblog.ApplicationKey);



PhotoCategoryID.DataBind();



PhotoCategoryID.Items.FindByValue(Globals.SafeInt



  (CurrentWeblogPost.GetExtendedAttribute("PhotoCategoryID"), 0).ToString()).Selected = true;



On add:



PhotoCategoryID.SectionID =  



    CommunityServer.Galleries.Galleries.GetGalleryID(CurrentWeblog.ApplicationKey);



PhotoCategoryID.DataBind();



On save:



post.SetExtendedAttribute("PhotoCategoryID",



    PhotoCategoryID.SelectedValue.ToString());



I'm using the same application key for the photo gallery as I am for the blog.  Probably not the smartest approach as there are certain query/chameleon property issues in doing that, but I wanted clean urls (not /CarsGallery/Picture142.aspx, but /Cars/Picture142.aspx.)  So that's your call, thus, slightly different logic on determining which gallery's categories to use.  That might not be an issue at all for you.  Thought I'd mention it.  Cheers!


daveburke |

9/14/2007 6:46:01 AM Permalink

do you mean \ControlPanel\Blogs\CreateEditBlogPost.ascx.cs?

Dave |

9/14/2007 6:51:25 AM Permalink

yeap!

daveburke |

9/16/2007 1:44:06 PM Permalink

Thanks Dave got it all working now. What are the issues in using the same applicationKey that you found? I've found that you can't edit the applicationKey of an existing blog which may be a problem!

Dave |

9/16/2007 3:02:37 PM Permalink

Hey, Dave.  Good to hear!  One issue would be using query.Tags = "something," may be considered a bug, I don't know, but no guarantee on retrieving tags from the Photo Gallery as opposed to a Weblog unless the SectionID or AppKey is also defined.  I'm suspecting there are other potential source issues as well, but that's the only I've seen.

daveburke |

Comments are closed

This site was built with the Sueetie .NET Open Source Community Framework. Learn more about Sueetie at Sueetie.com.