@BRT.PhotoGallery()
Creates a gallery page displaying the contents of any directory in Brick River system Files
The @BRT.PhotoGallery() Helper creates and formats a gallery of images of a designated directory or directories. The parameter 'directory:' designates the target folder. Other optional parameters set size, sort order and style the appearance of images.
Basic Example:
@BRT.PhotoGallery(directory:"photo_galleries/annual_conference_2016")
Templated Example:
@BRT.PhotoGallery(directory:"photo_galleries/annual_conference_2016", width:100, height:100, sortField:"Title",
template:
@<div> <h2>@item.GalleryTitle </h2>
<div>@item.GalleryDescription </div>
<div>@item.DateCreated.Substring(4, 2) + "-" + @item.DateCreated.Substring(6, 2) + "-" + @ item.DateCreated.Substring(0, 4) </div> @foreach(PhotoGalleryHelperExtensions.DirectoryFile file in item.Files) {
<div>
<a href="@file.URL"><img src="@file.Image" /></a><br/>
<p><b>@file.Title</b><br/>@file.Description</p>
<p>@file.DateCreated.Substring(4, 2) + "-" + @file.DateCreated.Substring(6, 2) + "-" + @ file.DateCreated.Substring(0, 4) </p>
</div>
}
</div>)
Carousel Example - using Bootstrap 3.0 classes:
@BRT.PhotoGallery(directory:"photo_galleries/annual_conference_2016", height:300, template:
@<div id="carousel-example-generic"> <!-- Indicators -->
<ol>
@{ int i = 0; }
@foreach(PhotoGalleryHelperExtensions.DirectoryFile file in item.Files){
<li data-target="#carousel-example-generic" data-slide-to="@i"active" : "")"></li>
i += 1;
}
</ol>
<div>
@{ i = 0; }
@foreach(PhotoGalleryHelperExtensions.DirectoryFile file in item.Files){
<div active" : "")" >
<img src="@file.Image" alt="..." />
<div>
<h4>@file.Title</h4>
<p>@file.Description</p>
</div>
</div>
i += 1;
}
</div>
<!-- Controls -->
<a href="#carousel-example-generic" data-slide="prev">
<span></span>
</a>
<a href="#carousel-example-generic" data-slide="next">
<span></span>
</a>
</div>)
Example with Subdirectories
@BRT.PhotoGallery(directory:"images", width:100, height:100, showDirectories:true,
template:
@<div>
<h2>@item.GalleryTitle </h2>
<div>@item.GalleryDescription </div>
@foreach(PhotoGalleryHelperExtensions.DirectoryFile file in item.Files) {
if(file.IsDirectory != true){
<div>
<a href="@file.URL"><img src="@file.Image" /></a><br/>
<p><b>@file.Title</b><br/>@file.Description</p>
</div>
}
else{
<h4><a href="@file.URL"> @file.Filename </a></h4>
}
}
</div>)
Required Parameters
directory: The folder tree of the files to be listed by the Helper
Example: directory: "images/galleries/2016 Awards Ceremony"
directory: The folder tree of the files to be listed by the Helper
Example: directory: "images/galleries/2016 Awards Ceremony"
This parameter designates a folder tree in the Brick River File system.
It is not necessary to indicate the root directory (Home directory).
For example, if target images are in the directory - Home/images/galleries/2016 Awards Ceremony - use the directory parameter as follows:
directory: "images/galleries/2016 Awards Ceremony"
Optional Parameters
height: Sets the height of an image in pixels
Example: height:100
height: Sets the height of an image in pixels
Example: height:100
This Parameter sets the height (in pixels) of an image. It can be used alone or in addition to the 'width:' parameter.
showDirectories :A boolean indicator. If True a link will be created for subfolders in the current folder.
Example: showDirectories: true
Example: showDirectories: true
If this parameter indicates: true - any subfolders contained in the target folder will be listed above and files in the target folder.
sortField: Sets the sort order of file records returned
Example: sortField: "Title"
Example: sortField: "Title"
The sortField: parameter takes one string argument to indicate the sort order of the files records. If this parameter is not used the default sort uses the 'Title' field.
template: Applies a Razor template to data elements retrieved by the Helper
Example: template:
Example: template:
@<div>
<h4>Meet our Authors!</h4>
@foreach(EngineRecord c in item) {
<p><a href="/[email protected]("Name")">@c.GetString("Name") </a></p>
}
</div>)
The template: parameter is always an optional parameter but virtually all Helpers that create EngineRecord items use either 'template:' or 'itemTemplate:' to style and present item content.
Syntax is:
template:
@<div>
Any valid HTML and Razor code
</div>)
width: Sets the width of an image in pixels
Example: width:200
Example: width:200
This Parameter sets the width (in pixels) of an image. It can be used alone or in addition to the 'height:' parameter.