Show cat/item icon in admin

[bigbangtech]

In AC5 we were easily able to display thumbnails for categories and products in a Admin catalog view.

Is there an easy way to call up, add or say easily replace the default cat/item picture with the objects actual icon in Admin/Catalog/Browse.aspx ?

Somewhere in here:

Code: Select all

ItemTemplate>
                                                    <asp:LinkButton ID="MU" runat="server" CommandName="Do_Up" ToolTip="Move Up" CommandArgument='<%#string.Format("{0}|{1}", Eval("CatalogNodeTypeId"), Eval("CatalogNodeId"))%>'><img src="<%# GetIconUrl("arrow_up.gif") %>" border="0" alt="Move Up" /></asp:LinkButton>
                                                    <asp:LinkButton ID="MD" runat="server" CommandName="Do_Down" ToolTip="Move Down"  CommandArgument='<%#string.Format("{0}|{1}", Eval("CatalogNodeTypeId"), Eval("CatalogNodeId"))%>'><img src="<%# GetIconUrl("arrow_down.gif") %>" border="0" alt="Move Down" /></asp:LinkButton>
                                                    <img src="<%# GetCatalogIconUrl(Container.DataItem) %>" border="0" alt="<%#Eval("CatalogNodeType")%>" />
                                                </ItemTemplate>
                                            </asp:TemplateField>
                                            <asp:TemplateField HeaderText="Name">
                                                <ItemTemplate>
                                                    <asp:LinkButton ID="N" runat="server" Text='<%# Eval("Name") %>' CommandName="Do_Open" CommandArgument='<%#string.Format("{0}|{1}", Eval("CatalogNodeTypeId"), Eval("CatalogNodeId"))%>'></asp:LinkButton>
                                                </ItemTemplate>
                                                <HeaderStyle HorizontalAlign="Left" />
                                            </asp:TemplateField>
                                            <asp:TemplateField>
                                                <ItemTemplate>
													<a href="<%# GetPreviewUrl(Eval("CatalogNodeType"), Eval("CatalogNodeId"), Eval("Name")) %>" Title="Preview" Target="_blank"><img src="<%# GetIconUrl("Preview.gif") %>" border="0" alt="Preview" /></a>

                                                    <asp:LinkButton ID="C" runat="server" ToolTip="Copy" CommandName="Do_Copy" CommandArgument='<%#string.Format("{0}|{1}", Eval("CatalogNodeTypeId"), Eval("CatalogNodeId"))%>' Visible='<%#((CatalogNodeType)Eval("CatalogNodeType") != CatalogNodeType.Category) %>'><img src="<%# GetIconUrl("copy.gif") %>" alt="Copy" border="0" / ></asp:LinkButton>

                                                    <asp:LinkButton ID="P" runat="server" ToolTip='<%#string.Format("Visibility : {0}",Eval("Visibility"))%>' CommandName="Do_Pub" CommandArgument='<%#string.Format("{0}|{1}", Eval("CatalogNodeTypeId"), Eval("CatalogNodeId"))%>'><img src="<%# GetVisibilityIconUrl(Container.DataItem) %>" border="0" alt="<%#Eval("Visibility")%>" /></asp:LinkButton>

                                                    <a href="<%# GetEditUrl(Eval("CatalogNodeType"), Eval("CatalogNodeId")) %>" Title="Edit"><img src="<%# GetIconUrl("edit.gif") %>" border="0" alt="Edit" /></a>
                                                    
												
													                                                    
													<asp:LinkButton ID="D" runat="server" ToolTip="Delete" CommandName="Do_Delete" CommandArgument='<%#string.Format("{0}|{1}", Eval("CatalogNodeTypeId"), Eval("CatalogNodeId"))%>'><img src="<%# GetIconUrl("delete.gif") %>" border="0" alt="Delete" /></asp:LinkButton>
                                                    
                                             
                                                </ItemTemplate>

or possibly customize this part on browse.aspx.cs to replace with actual icon:

Code: Select all

    protected string GetCatalogIconUrl(object dataItem)
    {
        CatalogNodeType nodeType = ((CatalogNode)dataItem).CatalogNodeType;
        switch (nodeType)
        {
            case CatalogNodeType.Category:
                return _IconPath + "Category.gif";
            case CatalogNodeType.Product:
                return _IconPath + "Product.gif";
            case CatalogNodeType.Webpage:
                return _IconPath + "Webpage.gif";
            case CatalogNodeType.Link:
                return _IconPath + "Link.gif";
        }
        return string.Empty;

[AbleMods]

It's fairly simple. Here's how to do it:
(as always, back up files before changing them)

Edit the /Admin/Catalog/Browse.aspx file. Find this line:

Code: Select all

<img src="<%# GetCatalogIconUrl(Container.DataItem) %>" border="0" alt="<%#Eval("CatalogNodeType")%>" />

and change it to:

Code: Select all

<asp:Image ID="Img_Node" runat="server" ImageUrl="<%# GetCatalogIconUrl(Container.DataItem) %>" AlternateText='<%#Eval("CatalogNodeType")%>' />

Save those changes. Now edit the /Admin/Catalog/Browse.aspx.cs file. Find the GetCatalogIconUrl() function. Replace the entire GetCatalogIconUrl() with this code:

Code: Select all

    protected string GetCatalogIconUrl(object dataItem)
    {
        CatalogNodeType nodeType = ((CatalogNode)dataItem).CatalogNodeType;
        switch (nodeType)
        {
            case CatalogNodeType.Category:
                {
                    Category _Cat = CategoryDataSource.Load(((CatalogNode)dataItem).CatalogNodeId);
                    return _Cat.ThumbnailUrl;
                    //return _IconPath + "Category.gif";
                }
            case CatalogNodeType.Product:
                {
                    Product _Prod = ProductDataSource.Load(((CatalogNode)dataItem).CatalogNodeId);
                    return _Prod.ThumbnailUrl;
                    //return _IconPath + "Product.gif";
                }
            case CatalogNodeType.Webpage:
                {
                 Webpage _Page = WebpageDataSource.Load(((CatalogNode)dataItem).CatalogNodeId);
                    return _Page.ThumbnailUrl;
                //return _IconPath + "Webpage.gif";
                }
            case CatalogNodeType.Link:
                {
                    Link _Link = LinkDataSource.Load(((CatalogNode)dataItem).CatalogNodeId);
                    return _Link.ThumbnailUrl;
                //return _IconPath + "Link.gif";
                }
        }
        return string.Empty;
    }

Once you've copy/pasted the above code, save that file as well. Now go into your Catalog/Browse menu choice and see what it looks like.

Note that the image doesn't resize - it uses whatever thumbnail image you have set on each category/product/webpage/link. If you want to force the displayed image to a specific size because your thumbnails are not consistent, simply add this code to the end of the <asp:Image...> tag line:

Code: Select all

Width="50" Height="50"/>

and change the Width/Height values to your desired sizes.

Enjoy !

[bigbangtech]

I changed the category code to show the original pic as show below. Does the code look OK?

Code: Select all

Category _Cat = CategoryDataSource.Load(((CatalogNode)dataItem).CatalogNodeId);
                    if (string.IsNullOrEmpty(_Cat.ThumbnailUrl))
                        return _IconPath + "Category.gif";
                    else
                        return _Cat.ThumbnailUrl;
                    //return _IconPath + "Category.gif";