ASPX templates
Version 5.x > ASPX templates > Media Library thumbnails View modes: 
User avatar
Member
Member
DahlinDev - 6/15/2010 8:06:54 PM
   
Media Library thumbnails
Using the media library through the cms. If you view imported images it will generate a thumbnail in the __thumbnails directory. Is there a way I can access these thumbnail in code at all?

User avatar
Member
Member
DahlinDev - 6/15/2010 10:38:36 PM
   
RE:Media Library thumbnails
I'd like to better explain myself.

Take a look at this page:
http://www.naturevalleybicyclefestival.com/Fanzone/Gallery.aspx?path=2009\festival

I am using a Media Library to power this. As you can see the page loads very slowly because the thumbnails be loaded are actually full size images, 3mb to 4mb each image.

Is there a way I can load actual thumbnails here instead of the full size image?

Here is my media library control:


<uc1:MediaGallery ID="cntMediaGallery" runat="server" MediaLibraryName="Photos" HideFolderTree="false"
TransformationName="ProRide.Transformations.MediaLibrary" SelectedItemTransformation="ProRide.Transformations.MediaLibrarySelectedItem"
HeaderTransformation="ProRide.Transformations.MediaLibraryHeader" FooterTransformation="ProRide.Transformations.MediaLibraryFooter" PageSize="100"
FilterMethod="0" FileIDQueryStringKey="fileid" PathQueryStringKey="path" SortQueryStringKey="sort" EnableViewState="true" DisplayFileCount="true" />


and the the transformation for this is:


<%@ Register Src="~/CMSModules/MediaLibrary/Controls/LiveControls/MediaFilePreview.ascx" TagName="MediaFilePreview" TagPrefix="cc1" %>
<div class="mediaItem">
<a href="<%# HTMLHelper.HTMLEncode(MediaLibraryFunctions.GetMediaFileDetailUrl(Eval("FileID"))) %>" title="<%# CMS.GlobalHelper.ResHelper.GetString(Convert.ToString(Eval("FileDescription"))) %>"><cc1:MediaFilePreview ID="filePreview" runat="server" maxsidesize="110" width="110" height="110"/></a>
</div>

I have everything working great, it is just way to slow.



User avatar
Kentico Consulting
Kentico Consulting
kentico_borisp - 6/16/2010 7:54:51 AM
   
RE:Media Library thumbnails
Hello,

To get the path of the thumbnail you can try to use the following method:

CMS.MediaLibrary.MediaFileInfoProvider.GetThumbnailPath(Int32, String)

For more inforamation please check our API reference.

Best regards,
Boris Pocatko

User avatar
Member
Member
gstaylor-sfopera - 3/10/2011 11:50:49 AM
   
RE:Media Library thumbnails
Boris,
The static function you reference only returns the path the parent folder that contains the thumbnail images generated, not the path to the thumbnail image itself. Looking at the file names generated, they are different based on size generated so how can we code to get the actual image (or full path to the image), not just the path to the parent folder?

User avatar
Kentico Consulting
Kentico Consulting
kentico_borisp - 3/23/2011 7:26:14 AM
   
RE:Media Library thumbnails
Hello,

If you need the link in a transformation, then you could develop a custom transformation function which will get the thumbnail. The core of the function can be the API method:

CMS.MediaLibrary.MediaFileInfoProvider.GetImageThumbnail(MediaFileInfo fileInfo, String libraryFolder, String siteName, Int32 width, Int32 height, Int32 maxSideSize)

It returns the image thumbnail from the disk if already exists, or it creates new one and saves it to disk.

The API Reference is here.

The documentation regarding custom transformation functions.

The input of that function can be the Eval function of your field and it can get the GUID of media file if you parse the string.

Best regards,
Boris Pocatko

User avatar
Member
Member
Dan - 9/27/2012 3:02:56 PM
   
RE:Media Library thumbnails
This is what I'm working on currently (within a transformation file)

<%# CMS.MediaLibrary.MediaFileInfoProvider.GetImageThumbnail(CMS.MediaLibrary.MediaFileInfoProvider.GetMediaFileInfo(Eval("FileGUID"), ?SiteName?), ?LibraryFolder?, ?SiteName?, null, null, 200) %>

I assume you can define SiteName as "" if the given library is global, but I'm having trouble getting the Library Folder. If there an easy way to get this value, or do I have to parse a string of a url value?

User avatar
Kentico Consulting
Kentico Consulting
kentico_borisp - 9/28/2012 7:55:53 AM
   
RE:Media Library thumbnails
Hello,

Again, you can use our API:

CMS.MediaLibrary > MediaLibraryInfo > LibraryFolder

You only need to get the MediaLibraryInfo of the edited media library.

Best regards,
Boris Pocatko

User avatar
Member
Member
Dan - 9/28/2012 8:44:54 AM
   
RE:Media Library thumbnails
Thanks for the quick reply.

I think I've almost got it, but I'm getting this error message
error CS1502: The best overloaded method match for 'CMS.MediaLibrary.MediaFileInfoProvider.GetMediaFileInfo(System.Guid, string)' has some invalid arguments


with this code:
<%# CMS.MediaLibrary.MediaFileInfoProvider.GetImageThumbnail(CMS.MediaLibrary.MediaFileInfoProvider.GetMediaFileInfo(Eval("FileGUID"), null), CMS.MediaLibrary.MediaLibraryInfoProvider.getLibraryInfo(Eval("FileLibraryID")).LibraryFolder, null, null, null, 200) %>


Same message if I try the other overloaded functions.

User avatar
Member
Member
Dan - 9/28/2012 9:19:45 AM
   
RE:Media Library thumbnails
Okay (incorrect class names aside) the problem was that 1) the String Eval values needed to be cast to integers and that integer values can't be null.

Now that returns an array of bytes... so I assume that generating the url of this thumbnail is going to require an extra step?

User avatar
Member
Member
Dan - 9/28/2012 1:31:50 PM
   
RE:Media Library thumbnails
Well figured it out completely so here's the code for people wondering:


public static string getThatThumbnail(int fileID, int width, int height, int maxwidth) //I had trouble getting custom functions to work (following the Dev guides), so I had to make the function static... could be my version of .net
{
MediaFileInfo myFile = MediaFileInfoProvider.GetMediaFileInfo(fileID);
string siteName = CustomSiteInfoProvider.GetSiteInfo(myFile.FileSiteID).SiteName;
MediaLibraryInfo myLibrary = MediaLibraryInfoProvider.GetMediaLibraryInfo(myFile.FileLibraryID);
string websitePath="C:\\yoursiteslocalpath\\KenticoCMS"
string thumbnailfilename = myFile.FileName + "_" + myFile.FileExtension.Replace(".", "") + "_preview" + myFile.FileExtension;
string localFilePath = MediaFileInfoProvider.GetThumbnailPath(myFile.FileLibraryID, myFile.FilePath) + "\\" + thumbnailfilename;
string returnValue = MediaFileInfoProvider.GetThumbnailPath(myFile.FileLibraryID, myFile.FilePath).Replace(websitePath, "").Replace("\\", "/") + "/" + myFile.FileName + "_" + myFile.FileExtension.Replace(".","") + "_preview" + myFile.FileExtension; // Note that I'm converting this from a local system path to a web address of the form /MediaGallery/Images/__thumbs/randomfile_jpg_preview.jpg which we can plug into an <img> tag
if (!System.IO.File.Exists(localFilePath)) //if the thumb doesn't exist, we make one
{
byte[] myThumb = MediaFileInfoProvider.GetImageThumbnail(MediaFileInfoProvider.GetMediaFileInfo(fileID), myLibrary.LibraryFolder, siteName, width, height, maxwidth);
System.IO.File.WriteAllBytes(localFilePath, myThumb); //Note that this doesn't check whether or not thumbnails generated by other parts of the CMS exist, nor does it check if the thumbnail that exists is of your desired size.
}
return returnValue; // send the output to the transformation file that called it
}
}


Note that I added this declaration to the top:
using CMS.MediaLibrary;

in the Transformation file:

<%# CMSTransformation.getThatThumbnail((int)Eval("FileID"), 0, 0, 200) %>

For some reason, the only way I could get custom transformations to work was to specify the CMSTransformation class name, and because of that, I had to make the function static.