{{#FeedItems}}

    {{#ShowError}}

    Error diagnostics:{{NextPageUrl}}
    <br />
    {{ExceptionMessage}}
    {{/ShowError}}
    <!-- else -->
    {{#ContentFeedItems}}
    {{#IsEventTile}}
    <div class='tile events shadow-highlight'>
        <a href='{{ContentFeedItemStandardViewModel.NoteUrl}}' target='_blank'>
            <div class='tile-body'>
                <div class="row-flex no-gutters">
                    <div class="col-auto center-align fill">
                        <date>{{ContentFeedItemStandardViewModel.Date}}</date>
                    </div>
                    <div class="col ml-2">
                        <div class='title'>
                            <h5>
                                {{{ContentFeedItemStandardViewModel.ResearchNoteTitle}}}
                            </h5>
                        </div>
                        <p class='line-clamp-1 ticker'>  {{{ContentFeedItemStandardViewModel.TickerMessage}}}</p>
                        <p class='block-text-single'>  {{ContentFeedItemStandardViewModel.Message}}</p>
                    </div>
                </div>
            </div>
        </a>
    </div>
    {{/IsEventTile}}
    {{^IsEventTile}}
    {{#IsStandardTile}}


    <div class='tile dashboard shadow-highlight
             {{#ContentFeedItemStandardViewModel.TileEnabled}}
             enabled
             {{/ContentFeedItemStandardViewModel.TileEnabled}}
             {{^ContentFeedItemStandardViewModel.TileEnabled}}
             disabled
             {{/ContentFeedItemStandardViewModel.TileEnabled}}
             {{ContentFeedItemStandardViewModel.TileClassName}}'>
        <a href='{{ContentFeedItemStandardViewModel.NoteUrl}}'
           {{#ContentFeedItemStandardViewModel.TargetNewTab}}
           target='_blank'
           {{/ContentFeedItemStandardViewModel.TargetNewTab}}
           {{#ContentFeedItemStandardViewModel.TargetModal}}
           data-reveal-id='model-form' data-reveal-ajax='true'
           {{/ContentFeedItemStandardViewModel.TargetModal}}>

            <div class='tile-body'>
                <div class="row-flex no-gutters">
                    <div class="col-auto center-align fill">
                        <span class="icon"></span>
                    </div>
                    <div class="col mx-2 my-2">
                        <div class='title'>
                            <h5 class="line-clamp-2">
                                {{ContentFeedItemStandardViewModel.ResearchNoteTitle}}
                            </h5>
                        </div>
                        <p class='line-clamp-2 synopsis-sml'>{{ContentFeedItemStandardViewModel.Message}}</p>
                        {{#ContentFeedItemStandardViewModel.ShowMacroTickerText}}
                        <p class='line-clamp-1 ticker'> {{{ContentFeedItemStandardViewModel.MacroClassifications}}}</p>
                        {{/ContentFeedItemStandardViewModel.ShowMacroTickerText}}
                        {{#ContentFeedItemStandardViewModel.ShowCompanyTickerText}}
                        <p class='line-clamp-1 ticker'>  {{{ContentFeedItemStandardViewModel.TickerMessage}}}</p>
                        {{/ContentFeedItemStandardViewModel.ShowCompanyTickerText}}
                        <ul class="info">
                            <li class="date"><date>{{ContentFeedItemStandardViewModel.Date}}</date></li>
                            <li class="pages">
                                {{#ContentFeedItemStandardViewModel.IsZeroPages}}
                                .
                                {{/ContentFeedItemStandardViewModel.IsZeroPages}}


                                {{#ContentFeedItemStandardViewModel.IsOnePage}}
                                <page>{{ContentFeedItemStandardViewModel.NumOfPages}} page</page>
                                {{/ContentFeedItemStandardViewModel.IsOnePage}}

                                {{#ContentFeedItemStandardViewModel.IsMoreThanOnePage}}
                                <page>{{ContentFeedItemStandardViewModel.NumOfPages}} pages</page>
                                {{/ContentFeedItemStandardViewModel.IsMoreThanOnePage}}
                            </li>
                            <li class="ratings">
                                {{#ContentFeedItemStandardViewModel.ShowRating}}
                                {{#ContentFeedItemStandardViewModel.CanEditRating}}

                                {{#ContentFeedItemStandardViewModel.IsRatingNotZero}}
                                <div id='rt-rate-it-display' style='display: none'>
                                    <input type='range' min='0' max='5' value='{{ContentFeedItemStandardViewModel.Rating}}' step='1' id='backing{{ContentFeedItemStandardViewModel.UniqueId}}'>
                                    <div data-researchnoteid='{{ContentFeedItemStandardViewModel.ResearchNoteId}}' class='rt-rate-it' data-rateit-backingfld='#backing{{ContentFeedItemStandardViewModel.UniqueId}}' data-rateit-readonly='true'></div>
                                </div>
                                {{/ContentFeedItemStandardViewModel.IsRatingNotZero}}
                                {{^ContentFeedItemStandardViewModel.IsRatingNotZero}}
                                .
                                {{/ContentFeedItemStandardViewModel.IsRatingNotZero}}


                                {{/ContentFeedItemStandardViewModel.CanEditRating}}
                                {{/ContentFeedItemStandardViewModel.ShowRating}}
                            </li>
                            <li class="logo"><img class='provider-logo' alt='{{ContentFeedItemStandardViewModel.BrokerName}}' src='{{ContentFeedItemStandardViewModel.ProviderLogoUrl}}' /></li>
                        </ul>
                    </div>
                </div>

            </div>
        </a>

    </div>


    {{/IsStandardTile}}
    {{^IsStandardTile}}
    {{#IsSecuritiesTile}}

    <div class="tile security shadow-highlight">
        <a href="{{ContentFeedItemSecurities.SeoUrl}}">
            <div class="tile-body">

                <ul class="tile-info no-gutters">
                    <li class="title"><h5>{{ContentFeedItemSecurities.Ticker}} - {{ContentFeedItemSecurities.Name}}</h5></li>
                    <li><span class="currentPrice">{{ContentFeedItemSecurities.CurrentPrice}}</span></li>
                    {{#ContentFeedItemSecurities.PricehasDecreased}}
                    <li>
                        <span class="negativeChange">{{ContentFeedItemSecurities.PriceChange}}</span>
                    </li>
                    <li>
                        <span class="negativeChange">{{ContentFeedItemSecurities.PriceChangePercent}}</span>
                    </li>
                    {{/ContentFeedItemSecurities.PricehasDecreased}}
                    {{#ContentFeedItemSecurities.PricehasIncreased}}
                    <li>
                        <span class="positiveChange">{{ContentFeedItemSecurities.PriceChange}}</span>
                    </li>
                    <li>
                        <span class="positiveChange">{{ContentFeedItemSecurities.PriceChangePercent}}</span>
                    </li>
                    {{/ContentFeedItemSecurities.PricehasIncreased}}
                    <li><span class="countryCode">{{ContentFeedItemSecurities.CounrtyListed}}</span></li>
                </ul>


            </div>


        </a>
    </div>

    {{/IsSecuritiesTile}}
    {{^IsSecuritiesTile}}
    <div class="tile announcement shadow-highlight">
        <a href="{{#ContentFeedItemNewsViewModel.IsExternalLink}}
             {{ContentFeedItemNewsViewModel.ExternalLinkUrl}}
             {{/ContentFeedItemNewsViewModel.IsExternalLink}}
            {{^ContentFeedItemNewsViewModel.IsExternalLink}}
             {{ContentFeedItemNewsViewModel.SiteUrl}}{{ContentFeedItemNewsViewModel.SeoRelativeUrl}}
             {{/ContentFeedItemNewsViewModel.IsExternalLink}}"
           {{#ContentFeedItemNewsViewModel.IsExternalLink}}
           target='_blank'
           {{/ContentFeedItemNewsViewModel.IsExternalLink}}
           {{#ContentFeedItemNewsViewModel.IsExtension}}
           target='_blank'
           {{/ContentFeedItemNewsViewModel.IsExtension}}>
            <div class="tile-body">
                <div class="row-flex no-gutters">
                    <div class="col-auto center-align fill">
                        <span class="icon"></span>
                    </div>
                    <div class="col ml-2">
                        <div class="title">
                            <h5>{{ContentFeedItemNewsViewModel.CompanyName}}</h5>
                        </div>
                        <p>{{ContentFeedItemNewsViewModel.Headline}}</p>

                        <ul class="info">
                            <!-- Date Published-->
                            <li class="date"><date>{{ContentFeedItemNewsViewModel.Date}}</date></li>
                            <li class="logo"><img class="provider-logo {{ContentFeedItemNewsViewModel.LogoClassName}}" alt="{{ContentFeedItemNewsViewModel.NewsSourceTitle}}" src="/images/logos/{{ContentFeedItemNewsViewModel.LogoFileName}}"></li>

                        </ul>
                    </div>
                </div>
            </div>


        </a>
    </div>
    {{/IsSecuritiesTile}}
    {{/IsStandardTile}}
    {{/IsEventTile}}
    {{/ContentFeedItems}}



<!--this is in seperate div as moving it into the above div caused the jscroll to keep fetching the next page-->
<div>
    {{#ShowNext}}

    <div class='next'>
        <a class='jscroll-next more-content' href='{{NextPageUrl}}'><span></span>View more</a>
    </div>
    {{/ShowNext}}

    {{#ShowMore}}

    <div class='next'>
        <a id="{{MoreButtonId}}" class='more-content' data-href="research-tab" data-news-href="{{NextPageUrl}}"><span></span>View more</a>
    </div>
    {{/ShowMore}}

    {{#ShowRnsMore}}

    <div class='next'>
        <a id="{{MoreButtonId}}" class='more-content' data-href="{{DataHref}}" data-news-href="{{NextPageUrl}}"><span></span>View more</a>
    </div>
    {{/ShowRnsMore}}

    <!--Remove this and the jscroll plugin fails--->
    &nbsp;
    <!-- else -->
    {{#ShowNoResults}}

    <div class='tile no-content'>

        <i class='fi-magnifying-glass'></i> <p>{{EmptyResultsMessage}}</p>
    </div><!--eof panel-->
    {{/ShowNoResults}}
</div>
{{/FeedItems}}