File Viewers

File Viewers allow the platform to customize the display of uploaded files and embedded URLs.  The IFileViewer  plugin type defines which URLs or file extensions the viewer should handle and the output that should be displayed. 

Why should I create a File Viewer?

Instead of providing a link to download the file, a file viewer can display the contents of the file inline.  For example, instead of showing a hyperlink to a YouTube video, the YouTube file viewer displays that video inline and allows it to be played without leaving the community.

Creating a File Viewer

To add support for a file viewer,  that implements the IFileViewer  plugin type. The IFileViewer interface extends IPlugin to add support custom file viewers.

To begin, implement the SupportedUrlPattern, SupportedFileExtensions and DefaultOrderNumber properties.  Our example file viewer will allow Vine embed Urls to be viewed in the community.  Since we are not supporting uploaded files with this file viewer, the SupportedFileExtensions property returns an empty collection.  The SupportedUrlPattern property uses a regular expression to limit the file viewer to URLs containing the vine.co domain.  The DefaultOrderNumber defines the order in which file viewers are checked against the SupportedFileExtensions and SupportedUrlPattern properties.  If two different file viewers were both capable of handling a file or Url, the one with the lower order number would take precedence.

public int DefaultOrderNumber { get { return 100; } }

public string SupportedUrlPattern
{
	get { return @"http[s]?://vine\.co/"; }
}

public string[] SupportedFileExtensions { get { return Array.Empty<string>(); } }

Next, the GetMediaType() methods are implemented.  There are two methods, one for URLs being viewed and the other for files.  Our file viewer does not support files, so we can throw a FileViewerNotSupportedException to indicate that to the platform.  The GetMediaType() method that receives a URL will throw a FileViewerNotSupportedException when previewing the URL, the platform will handle the preview for the file viewer.  When viewing the method will return Video.

public FileViewerMediaType GetMediaType(CentralizedFile file, IFileViewerOptions options)
{
	throw new FileViewerNotSupportedException();
}

public FileViewerMediaType GetMediaType(Uri url, IFileViewerOptions options)
{
	if (options.ViewType == FileViewerViewType.Preview)
		throw new FileViewerNotSupportedException();

	return FileViewerMediaType.Video;
}

Lastly, the Render() methods are implemented.  Again since we do not support viewing files in our example, this method will throw a FileViewerNotSupportedException.  The Render() method that receives a URL as a parameter, will have two code paths.  Our sample does not provide a preview image specific to Vine, instead we can throw a FileViewerNotSupportedException .  The platform will provide a default image preview.  When viewing the video, the method will return an IFRAME with the Vine URL that will display the vine video inline in the content.

public string Render(CentralizedFile file, IFileViewerOptions options)
{
	throw new FileViewerNotSupportedException();
}

public string Render(Uri url, IFileViewerOptions options)
{
	var uiApi = Telligent.Evolution.Extensibility.Apis.Get<IUI>();

	if (options.ViewType == FileViewerViewType.Preview)
	{
		throw new FileViewerNotSupportedException();
	}
	else
	{
		var width = options.Width.HasValue ? options.Width.Value : 0;
		var height = options.Height.HasValue ? options.Height.Value : 0;
		return string.Format("<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" frameborder=\"0\" scrolling=\"no\" />"
				, Apis.Get<IHtml>().EncodeAttribute(url.ToString()), width, height);
	}
}