description = "Main News Page"

[staticPage]
useContent = 0
default = 0

[blogPosts]
pageNumber = "{{ :page }}"
postsPerPage = 6
noPostsMessage = "No posts found"
sortOrder = "published_at desc"
categoryPage = 404
postPage = 404

[searchInput]
useAutoComplete = 0
autoCompleteResultCount = 5
showProviderBadge = 0
searchPage = "search-result.htm"
==
<?php
use System\Classes\CombineAssets;
  use RainLab\Blog\Models\Post;
  function onStart(){
    $css = ['assets/css/news.css'];
    //$scripts = ['assets/javascript/homepage.js'];
    $this->addCss(CombineAssets::combine($css, base_path('themes/linus')));
    //$this->addJs(CombineAssets::combine($scripts, base_path('themes/linus')));

    $theme = Cms\Classes\Theme::getEditTheme();
    $pageList = new RainLab\Pages\Classes\PageList($theme);
    $allPages = $pageList->listPages();
    $this['heroIn'] = null;
    foreach ($allPages as $pg) {
        if($pg->id == 'news-banner') {
            $this['heroIn'] = $pg;
        }
    }
    $this->prepareVariable();
  }
  function prepareVariable(){
      $options = post('Filter', ['sort' => 'published_at desc']);
      $this['postList'] = Post::listFrontEnd($options);
      $this['sortingoptions'] = Post::$allowedSortingOptions;
  }
  function onSortPost(){
      $this->prepareVariable();
  }
  function onPage(){
      $this->prepareVariable();
  }
?>
==
{% partial 'site/head' %}
{% partial 'site/header' %}
<script src="{{'assets/vendor/jquery.js'|theme }}"></script>
<div class="wrapper" id="mobileBodyContent">
    {% partial 'hero-banner' %}
    <div class="row noPM blog-list">
      <div class="bg-pattern"></div>
        <div class="container">
            <div class="row flex-con section-pad-3 news-sort">
                <div class="col-sm-8 col-xs-7">
                    <form action="{{ searchInput.searchPage | page }}?q={{ query | url_encode(true) }}" method="get">
                        <div class="ss-search-form">
                            <div class="ss-search-form__input trans">
                                <input class = "input-search-text blog-search-input" name="q" type="text" placeholder="Search News"
                                       value="{{ searchInput.query }}"
                                       autocomplete="off"
                                       autofocus
                                        {% if searchInput.useAutoComplete %}
                                            data-track-input
                                            data-request="{{ searchInput }}::onType"
                                            data-request-before-update="document.getElementById('autocomplete-results').classList.add('ss-search-form__results--visible')"
                                            data-request-update="'{{ searchInput }}::autocomplete': '#autocomplete-results'"
                                        {% endif %}
                                >
                                <button class="ss-search-form__submit" type="submit">
                                  <img src="{{'assets/svg/ico-search.svg'|theme}}">
                                </button>
                            </div>
                            <div class="ss-search-form__results" id="autocomplete-results"></div>
                        </div>
                    </form>
                </div>
                <div class="col-sm-4 col-xs-5" id = "sortPost">
                    {{ form_ajax('onSortPost', { id: 'sort-post-form', update: { 'post-load' : '#post-wrapper', 'post-page': '#post-page' } }) }}
                        <div class="sort-label">
                          <select class = "sort-text p-text" id="sort-post" name="Filter[sort]">
                              <!--<option value="" selected disabled></option>-->
                              {% for code, option in sortingoptions %}
                                  <option value="{{code}}">{{ option }}</option>
                              {% endfor %}
                          </select>
                        </div>
                    {{ form_close() }}
                </div>
            </div>
            <div class="row" id="post-wrapper">
              {% partial 'post-load' %}
            </div>
            <div id="post-page">
                {% partial 'post-page' %}
            </div>

            {{ form_ajax('onPage', { id : 'page-form', update: { 'post-load': '#post-wrapper', 'post-page': '#post-page' } }) }}
                <select class="ui fluid dropdown invisible" name="Filter[page]" id = "pagi-ajax" >
                    {% for i in 1..posts.lastPage %}
                        <option value="{{i}}">{{ i }}</option>
                    {% endfor %}
                </select>
                <select class = "sort-text invisible" id="sort-post-clone" name="Filter[sort]">
                    <option value="" selected disabled>Sort by</option>
                    {% for code, option in sortingoptions %}
                        <option value="{{code}}">{{ option }}</option>
                    {% endfor %}
                </select>
            {{ form_close() }}

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

{% partial 'site/footer' %}