Create Default View
Create Webforms for the default view
In fact, you can create two Webforms. One (List.aspx) will list the images, the other (Default.aspx) will re-load List.aspx every time the user clicks a tree node.
List.aspx uses the entity token of the currently selected node to identify the type of the tree element (root, folder, file) and handle the event accordingly. The entity token is passed to Default.aspx in the query parameter, then passed on to the List.aspx in the same manner.
List.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="List.aspx.cs" Inherits="Composite_InstalledPackages_Media_List" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.Image
{
width: 100px;
height: 120px;
float: left;
margin: 3px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:PlaceHolder ID="MediaFolder" Visible="false" runat="server">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<div class="Image">
<img src="/media(<%# Eval("Id") %>)?mw=100&mh=100" />
<span>
<%# Eval("FileName")%></span>
</div>
</ItemTemplate>
</asp:Repeater>
</asp:PlaceHolder>
<asp:PlaceHolder ID="MediaFile" Visible="false" runat="server">
<asp:Image ID="Image" runat="server" />
</asp:PlaceHolder>
</div>
</form>
</body>
</html>
As you can see above, there are two placeholders, initially set as invisible: one to show images in the folder, the other to show a selected image.
List.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Composite.Data;
using Composite.Data.Types;
using Composite.C1Console.Security;
using Composite.C1Console.Elements;
using Composite.Data.Types.StoreIdFilter;
using Composite.Plugins.Elements.ElementProviders.MediaFileProviderElementProvider;
public partial class Composite_InstalledPackages_Media_List : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
var serializedEntityToken = Request["EntityToken"];
if (serializedEntityToken != null)
{
var entityToken = EntityTokenSerializer.Deserialize(serializedEntityToken);
if (entityToken is MediaRootFolderProviderEntityToken)
{
Repeater1.DataSource = GetChildrenOnPath("/", entityToken.Id, null);
Repeater1.DataBind();
MediaFolder.Visible = true;
return;
}
if (entityToken is DataEntityToken)
{
DataEntityToken token = (DataEntityToken)entityToken;
if (token.Data == null)
{
return;
}
if (token.Data is IMediaFileFolder)
{
IMediaFileFolder folder = (IMediaFileFolder)token.Data;
Repeater1.DataSource = GetChildrenOnPath(folder.Path, folder.StoreId, null);
Repeater1.DataBind();
MediaFolder.Visible = true;
}
if (token.Data is IMediaFile)
{
var mediaFile = (IMediaFile)token.Data;
MediaFile.Visible = true;
Image.ImageUrl = "/media(" + mediaFile.Id + ")?mw=400&mh=400";
}
}
}
}
private IEnumerable<IMediaFile> GetChildrenOnPath(string parentPath, string storeId, SearchToken searchToken)
{
var fileQueryable = new StoreIdFilterQueryable<IMediaFile>(DataFacade.GetData<IMediaFile>(), storeId);
List<IMediaFile> mediaFiles = (from item in fileQueryable
where item.StoreId == storeId
&& item.FolderPath == parentPath
select item).ToList();
return mediaFiles;
}
}As you can see above, the EntityToken is passed as a query parameter and builds a presentation logic for several cases.
Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Composite_InstalledPackages_Media_Default" %>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://www.w3.org/1999/xhtml" xmlns:control="http://www.composite.net/ns/uicontrol">
<control:httpheaders runat="server" />
<head>
<title>Composite.Management.Generic</title>
<control:styleloader runat="server"/>
<control:scriptloader type="sub" runat="server" />
<script type="text/javascript" src="binding/MediaPageBinding.js"/>
</head>
<body>
<ui:page id="page" binding="MediaPageBinding">
<ui:window id="window" url="List.aspx?EntityToken=<%=HttpUtility.UrlEncode( this.EntityToken ) %>"/>
</ui:page>
</body>
</html>As you can see above, Default.aspx serves as a container (ui:page) for List.aspx (ui:window). It references the custom page binding and uses C1 CMS-related functionality/controls to present the List.aspx in the view.
Default.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class Composite_InstalledPackages_Media_Default : System.Web.UI.Page
{
public string EntityToken
{
get
{
return Request["EntityToken"] ?? string.Empty;
}
}
protected void Page_Load(object sender, EventArgs e)
{
}
}As you can see above, it initializes the
EntityToken property with the value retrieved via the query parameter.