CarouFredSel carousel of testimonials

@*
This spits out a CarouFredSel list of testimonials. Posted 5/26/2016 so ensure you have the latest of everything.
Here's the CarouFredSel website
https://dev7studios.com/products/caroufredsel-wordpress-plugin/




You have to put the call the jQuery file in the head
Put in @section head {
the script stuff below
}


*@


<script type="text/javascript" src="/files/content/www/owlcarousel/jquery.caroufredsel-6.2.1.js"></script>




<script type="text/javascript">
     
$(function() {
   
    $("#caro").carouFredSel({
        
        auto: 7000,
        scroll : {
            items: 1,
            pauseOnHover: true
        },
        pagination: {
            container: "#pager",
            keys: true
        },
        responsive: true,
        prev: {
            button: "#prev",
            pauseOnHover: true
        },
        next: {
            button: "#next",
    		pauseOnHover: true
    	}     
        
    });    


});
</script>




@*
Now here's the code that calls the carousel.
This is calling a carousel of testimonials
*@


<div id="caro">
    @BRT.Lister(tableId:"Content",viewId:"Testimonials",pageSize:10,fields: new[] {"Authors.PrimaryImage","Authors.FirstName","Authors.LastName","Summary","PubDate","PersonTitle","PersonName"}, 
    sortFields: new SortFieldMeta[] {new SortFieldMeta() {FieldId = "PubDate", Descending = true}},itemTemplate:
    @<div class="testimonial">
        <div class="testimonial-meat">
            @if(!item.IsDBNull("Authors") && @item.GetRecordList("Authors").Count > 0) {
                if (item.GetRecordList("Authors")[0].GetFiles("PrimaryImage").Count==1) {
                    <img class="test-img img-circle" src="@item.GetRecordList("Authors")[0].GetFiles("PrimaryImage")[0].Url?width=90&height=90&mode=crop&vert=top&sat=70" />
                }
            }
            <div>@item["Summary"]</div>
            <div><b>@item["PersonName"], @item["PersonTitle"]</b></div>
        </div>
        <p><a href="/testimonials">View all testimonials &rarr;</a></p>
    </div>)
</div>
<div class="clearfix"></div>