We have seen SingleImagePlaceholderControl and SingleAttachmentPlaceholderControl
at work. They are nifty controls for managing single files. Authors are
able to upload files directly from their local computers or pick from
shared resources in the resource gallery.
However, the biggest drawback of these controls is
that files must be handled one at a time. More often than not, authors
will need to attach multiple images or attachments. They could have a
list of documents that support an article or a series of images that
accompany a story. Whatever the case may be, a single slot for
attachments may not always be sufficient.
You can get around this single-file limitation in one of three ways:
Provide authors with an HtmlPlaceholderControl.
Increase the number of SingleAttachmentPlaceholders and SingleImagePlaceholderControls on the page. Provide as many as the author requires.
Build a custom placeholder control that allows the upload of multiple files and images.
Let’s consider the first option, which calls for the use of the HtmlPlaceholderControl.
With the WYSIWYG editor, authors can upload as many images and
attachments as they need to. On the other hand, they can also add
unwanted text to the placeholder control. While giving authors complete
freedom keeps them happy, it may cause problems when authors get carried
away applying their own styles and layouts. More often than not, site
owners would like more control over how the uploaded content is
displayed and perhaps even to limit the number of images and attachments
included—none of which can be accomplished using an HtmlPlaceholderControl.
The second option of increasing the number of SingleAttachmentPlaceholders and SingleImagePlaceholderControls
on the page could be feasible if the number of attachments and images
required can be accurately estimated. One major shortcoming of this
approach is that for every placeholder control introduced, a
corresponding placeholder definition must be created. Should the
estimated number of attachments be large, so would the number of
corresponding placeholder definitions. The larger the number of
placeholders used by a posting, the more information needs to be
retrieved by database queries, potentially compromising the overall
performance of the site.
Clearly, neither of these out-of-the box solutions
satisfies this requirement completely. To bridge the gap, let’s explore
the last option and build our own custom placeholder control that
accepts multiple attachments with a friendly graphical user interface.
The maximum number of attachments will be decided
by the developer. As a placeholder control, it will have different views
in presentation and authoring modes. In authoring mode, the control
will be displayed as a table with multiple rows, each row providing a
slot for authors to upload an attachment. One interesting aspect of this
control is that it will reuse the Insert Attachment dialog that ships with Web Author.
In presentation view, the attachments are
displayed as a list of hyperlinks. Developers can choose to display
links as icons or text. Here, we have chosen to show them as a list of
icons. You can of course enhance the code to arrange them in any way you
like, horizontally, vertically, or even within a table.
The MultipleAttachmentPlaceholderControl Class
To begin, we add a class named MultipleAttachmentPlaceholderControl.cs to the UsefulCustomPlaceholders project.
The class file uses the methods from the namespaces highlighted below. Add them above the namespace declaration:
using System;
using System.Xml;
using System.Web;
using System.Text;
using System.Web.UI;
using System.Web.UI.WebControls;
using Microsoft.ContentManagement.Publishing;
using Microsoft.ContentManagement.WebControls;
using Microsoft.ContentManagement.WebControls.Design;
using Microsoft.ContentManagement.Publishing.Extensions.Placeholders;
namespace UsefulCustomPlaceholders
{
. . . code continues . . .
}
A good way to manage lists like the one we are
creating here is to store them as XML. XML gives us the flexibility to
present the attachments in a wide range of ways later on. The control
will therefore support XmlPlaceholderDefinition and be built by inheriting from BasePlaceholder:
[SupportedPlaceholderDefinitionType(typeof(XmlPlaceholderDefinition))]
public class MultipleAttachmentPlaceholderControl : BasePlaceholderControl
{
. . . code continues . . .
}
The control will provide three properties for developers:
MaxAttachments.
Specifies the maximum number of attachments supported by the control.
The initial value will be set to 10. Developers can change this value at
design time by adjusting the value in the control’s Properties dialog.
DisplayAsIcon. Specifies if the attachments are to be displayed as icons or text. Similar to the UseGeneratedIcon property in the HtmlPlaceholderDefinition class.
ResourceGalleryOnly.
Specifies if files from the author’s computer can be uploaded as an
attachment or if authors must choose from resources within resource
galleries.
Add the following three properties below the class constructor:
private static int m_maxAttachments = 10;
public int MaxAttachments
{
get
{
return m_maxAttachments;
}
set
{
m_maxAttachments = value;
}
}
private bool m_displayAsIcon = false;
public bool DisplayAsIcon
{
get
{
return m_displayAsIcon;
}
set
{
m_displayAsIcon = value;
}
}
private bool m_resourceGalleryOnly = false;
public bool ResourceGalleryOnly
{
get
{
return m_resourceGalleryOnly;
}
set
{
m_resourceGalleryOnly = value;
}
}