From 045bb2e4a2362c87c830004467b15095e3845499 Mon Sep 17 00:00:00 2001
From: Jonathan Treffler <mail@jonathan-treffler.de>
Date: Sat, 8 Aug 2020 20:33:33 +0200
Subject: moved templates into templates-old

Signed-off-by: Jonathan Treffler <mail@jonathan-treffler.de>
---
 templates-old/admin.php                       | 131 +++++++++++++++++++
 templates-old/index.php                       |  99 ++++++++++++++
 templates-old/part.content.explore.php        |  53 ++++++++
 templates-old/part.content.php                | 158 +++++++++++++++++++++++
 templates-old/part.content.shortcuts.php      |  78 +++++++++++
 templates-old/part.content.warnings.php       |  25 ++++
 templates-old/part.navigation.addfeed.php     | 114 ++++++++++++++++
 templates-old/part.navigation.addfolder.php   |  39 ++++++
 templates-old/part.navigation.explore.php     |   5 +
 templates-old/part.navigation.feed.php        | 179 ++++++++++++++++++++++++++
 templates-old/part.navigation.folder.php      | 142 ++++++++++++++++++++
 templates-old/part.navigation.starredfeed.php |  20 +++
 templates-old/part.navigation.unreadfeed.php  |  71 ++++++++++
 templates-old/part.settings.php               | 159 +++++++++++++++++++++++
 templates/admin.php                           | 131 -------------------
 templates/index.php                           |  99 --------------
 templates/part.content.explore.php            |  53 --------
 templates/part.content.php                    | 158 -----------------------
 templates/part.content.shortcuts.php          |  78 -----------
 templates/part.content.warnings.php           |  25 ----
 templates/part.navigation.addfeed.php         | 114 ----------------
 templates/part.navigation.addfolder.php       |  39 ------
 templates/part.navigation.explore.php         |   5 -
 templates/part.navigation.feed.php            | 179 --------------------------
 templates/part.navigation.folder.php          | 142 --------------------
 templates/part.navigation.starredfeed.php     |  20 ---
 templates/part.navigation.unreadfeed.php      |  71 ----------
 templates/part.settings.php                   | 159 -----------------------
 28 files changed, 1273 insertions(+), 1273 deletions(-)
 create mode 100644 templates-old/admin.php
 create mode 100644 templates-old/index.php
 create mode 100644 templates-old/part.content.explore.php
 create mode 100644 templates-old/part.content.php
 create mode 100644 templates-old/part.content.shortcuts.php
 create mode 100644 templates-old/part.content.warnings.php
 create mode 100644 templates-old/part.navigation.addfeed.php
 create mode 100644 templates-old/part.navigation.addfolder.php
 create mode 100644 templates-old/part.navigation.explore.php
 create mode 100644 templates-old/part.navigation.feed.php
 create mode 100644 templates-old/part.navigation.folder.php
 create mode 100644 templates-old/part.navigation.starredfeed.php
 create mode 100644 templates-old/part.navigation.unreadfeed.php
 create mode 100644 templates-old/part.settings.php
 delete mode 100644 templates/admin.php
 delete mode 100644 templates/index.php
 delete mode 100644 templates/part.content.explore.php
 delete mode 100644 templates/part.content.php
 delete mode 100644 templates/part.content.shortcuts.php
 delete mode 100644 templates/part.content.warnings.php
 delete mode 100644 templates/part.navigation.addfeed.php
 delete mode 100644 templates/part.navigation.addfolder.php
 delete mode 100644 templates/part.navigation.explore.php
 delete mode 100644 templates/part.navigation.feed.php
 delete mode 100644 templates/part.navigation.folder.php
 delete mode 100644 templates/part.navigation.starredfeed.php
 delete mode 100644 templates/part.navigation.unreadfeed.php
 delete mode 100644 templates/part.settings.php

diff --git a/templates-old/admin.php b/templates-old/admin.php
new file mode 100644
index 000000000..cf69c33de
--- /dev/null
+++ b/templates-old/admin.php
@@ -0,0 +1,131 @@
+<?php
+script('news', 'admin/Admin');
+style('news', 'admin');
+?>
+
+<div class="section" id="news">
+    <h2>News</h2>
+    <div class="form-line">
+        <p><input type="checkbox" name="news-use-cron-updates"
+               <?php if ($_['useCronUpdates']) p('checked'); ?>>
+            <label for="news-use-cron-updates">
+                <?php p($l->t('Use system cron for updates')); ?>
+            </label>
+        </p>
+        <p>
+            <em><?php p($l->t(
+                'Disable this if you run a custom updater such as the Python ' .
+                'updater included in the app'
+            )); ?></em>
+        </p>
+    </div>
+    <div class="form-line">
+        <p>
+            <label for="news-auto-purge-minimum-interval">
+                <?php p($l->t('Purge interval')); ?></p>
+            </label>
+        <p>
+            <em>
+            <?php p($l->t(
+                'Minimum amount of seconds after deleted feeds and folders ' .
+                'are removed from the database; values below 60 seconds are ' .
+                'ignored'
+            )); ?></em>
+        </p>
+        <p><input type="text" name="news-auto-purge-minimum-interval"
+               value="<?php p($_['autoPurgeMinimumInterval']); ?>"></p>
+    </div>
+    <div class="form-line">
+        <p>
+            <label for="news-auto-purge-count">
+                <?php p($l->t('Maximum read count per feed')); ?>
+            </label>
+        </p>
+        <p>
+            <em>
+            <?php p($l->t(
+                'Defines the maximum amount of articles that can be read per ' .
+                "feed which won't be deleted by the cleanup job; ".
+                'if old articles reappear after being read, increase ' .
+                'this value; negative values such as -1 will turn this ' .
+                'feature off'
+            )); ?></em>
+        </p>
+        <p><input type="text" name="news-auto-purge-count"
+               value="<?php p($_['autoPurgeCount']); ?>"></p>
+    </div>
+    <div class="form-line">
+        <p>
+            <label for="news-max-redirects">
+                <?php p($l->t('Maximum redirects')); ?>
+            </label>
+        </p>
+        <p>
+            <em>
+                <?php p($l->t(
+                    'How many redirects the feed fetcher should follow'
+                )); ?>
+            </em>
+        </p>
+        <p><input type="text" name="news-max-redirects"
+               value="<?php p($_['maxRedirects']); ?>"></p>
+    </div>
+    <div class="form-line">
+        <p>
+            <label for="news-max-size">
+                <?php p($l->t('Maximum feed page size')); ?>
+            </label>
+        </p>
+        <p>
+            <em>
+                <?php p($l->t(
+                    'Maximum feed size in bytes. If the RSS/Atom page is ' .
+                    'bigger than this value, the update will be aborted'
+                )); ?>
+            </em>
+        </p>
+        <p><input type="text" name="news-max-size"
+               value="<?php p($_['maxSize']); ?>"></p>
+    </div>
+    <div class="form-line">
+        <p>
+            <label for="news-feed-fetcher-timeout">
+                <?php p($l->t('Feed fetcher timeout')); ?>
+            </label>
+        </p>
+        <p>
+            <em>
+            <?php p($l->t(
+                'Maximum number of seconds to wait for an RSS or Atom feed ' .
+                'to load; if it takes longer the update will be aborted'
+            )); ?></em>
+        </p>
+        <p><input type="text" name="news-feed-fetcher-timeout"
+               value="<?php p($_['feedFetcherTimeout']); ?>"></p>
+    </div>
+    <div class="form-line">
+        <p>
+            <label for="news-explore-url">
+                <?php p($l->t('Explore Service URL')); ?>
+            </label>
+        </p>
+        <p>
+            <em>
+                <?php p($l->t(
+                    'If given, this service\'s URL will be queried for ' .
+                    'displaying the feeds in the explore feed section. To ' .
+                    'fall back to the built in explore service, leave this ' .
+                    'input empty'
+                )); ?>.
+            </em>
+            <a href="https://github.com/nextcloud/news/tree/master/docs/explore"><?php p($l->t(
+                'For more information check the wiki'
+            )); ?></a>
+        </p>
+        <p><input type="text" name="news-explore-url"
+               value="<?php p($_['exploreUrl']); ?>"></p>
+    </div>
+    <div id="news-saved-message">
+        <span class="msg success"><?php p($l->t('Saved')); ?></span>
+    </div>
+</div>
diff --git a/templates-old/index.php b/templates-old/index.php
new file mode 100644
index 000000000..4b0408af1
--- /dev/null
+++ b/templates-old/index.php
@@ -0,0 +1,99 @@
+<?php
+use OCA\News\Plugin\Client\Plugin;
+
+script('news', [
+    'build/app.min'
+]);
+
+style('news', [
+    'app',
+    'content',
+    'custom',
+    'explore',
+    'mobile',
+    'navigation',
+    'settings',
+    'shortcuts'
+]);
+
+// load plugin scripts and styles
+foreach (Plugin::getStyles() as $appName => $fileName) {
+    style($appName, $fileName);
+}
+foreach (Plugin::getScripts() as $appName => $fileName) {
+    script($appName, $fileName);
+}
+?>
+
+    <div id="global-loading"
+        class="icon-loading"
+        ngCloak
+        ng-show="App.loading.isLoading('global')"></div>
+
+    <!-- content -->
+    <script type="text/ng-template" id="content.html">
+        <?php print_unescaped($this->inc('part.content')) ?>
+    </script>
+    <script type="text/ng-template" id="shortcuts.html">
+        <?php print_unescaped($this->inc('part.content.shortcuts')) ?>
+    </script>
+    <script type="text/ng-template" id="explore.html">
+        <?php print_unescaped($this->inc('part.content.explore')) ?>
+    </script>
+
+    <!-- navigation -->
+    <div id="app-navigation"
+        ng-controller="NavigationController as Navigation"
+        ng-hide="App.loading.isLoading('global')">
+
+        <news-search on-search="Navigation.search"></news-search>
+        <news-title-unread-count
+            unread-count="{{ Navigation.getUnreadCount() }}">
+        </news-title-unread-count>
+
+        <ul class="with-icon" data-id="0" news-droppable>
+            <?php print_unescaped($this->inc('part.navigation.addfeed')) ?>
+            <?php print_unescaped($this->inc('part.navigation.addfolder')) ?>
+            <?php print_unescaped($this->inc('part.navigation.unreadfeed')) ?>
+            <?php print_unescaped($this->inc('part.navigation.starredfeed')) ?>
+            <?php print_unescaped($this->inc(
+                'part.navigation.feed', ['folderId' => '0']
+            )) ?>
+            <?php print_unescaped($this->inc('part.navigation.folder')) ?>
+            <?php print_unescaped($this->inc('part.navigation.explore')) ?>
+        </ul>
+
+        <!-- settings -->
+        <div id="app-settings" ng-controller="SettingsController as Settings">
+            <?php print_unescaped($this->inc('part.settings')) ?>
+        </div>
+    </div>
+
+    <div id="app-content"
+        ng-class="{
+            'loading-content': App.loading.isLoading('content') &&
+                               !App.loading.isLoading('global'),
+            'explore': App.isFirstRun()
+        }"
+        tabindex="-1"
+        news-pull-to-refresh="showPullToRefresh">
+        <div class="podcast" news-sticky-menu="#app-content" ng-if="App.playingItem">
+            <audio controls autoplay ng-src="{{ App.playingItem.enclosureLink|trustUrl }}" news-play-one></audio>
+            <a class="button podcast-download" title="<?php p($l->t('Download')) ?>"
+                ng-href="{{ App.playingItem.enclosureLink|trustUrl }}"
+                target="_blank"
+                rel="noreferrer"></a>
+            <button class="podcast-close" title="<?php p($l->t('Close')) ?>"
+                ng-click="App.playingItem = false"></button>
+        </div>
+        <div id="app-content-wrapper"
+            ng-class="{
+                'autopaging': App.loading.isLoading('autopaging'),
+                'finished-auto-paging': Content.isNothingMoreToAutoPage
+            }"
+            ng-hide="App.loading.isLoading('global')"
+            ng-view
+            news-scroll
+            news-scroll-enabled-mark-read="Content.markReadEnabled()"
+            news-scroll-auto-page="Content.autoPage()"
+            news-scroll-mark-read="Content.scrollRead(itemIds)"></div>
diff --git a/templates-old/part.content.explore.php b/templates-old/part.content.explore.php
new file mode 100644
index 000000000..87a62259f
--- /dev/null
+++ b/templates-old/part.content.explore.php
@@ -0,0 +1,53 @@
+<?php print_unescaped($this->inc('part.content.warnings')) ?>
+
+<div id="explore">
+    <!--<div class="explore-filter">
+        <label>
+            <input ng-model="Explore.filter" type="search" placeholder="<?php p(addslashes($l->t('filter'))) ?>" news-auto-focus>
+        </label>
+    </div>-->
+
+
+    <div class="explore-filter">
+        <label for="explorelanguagecode"><?php p($l->t('Language')) ?>: </label>
+        <select id="explorelanguagecode" name="explorelanguagecode"
+                ng-change="Explore.showLanguage(Explore.selectedLanguageCode)"
+                ng-options="language as language for language in Explore.getSupportedLanguageCodes()"
+                ng-model="Explore.selectedLanguageCode"></select>
+    </div>
+    <div class="grid">
+        <div ng-repeat="entry in Explore.feeds | filter:Explore.filter | orderBy:'-votes'" ng-show="!Explore.feedExists(entry.feed)" class="explore-feed grid-item" news-refresh-masonry>
+            <div class="category-wrapper">
+                <div class="category">
+                    {{ entry.category }}
+                </div>
+            </div>
+            <div class="grid-item-content">
+                <h1 ng-show="entry.favicon"
+                    ng-style="{ backgroundImage: 'url(' + entry.favicon + ')'}">
+                    <a target="_blank" rel="noreferrer" ng-href="{{ entry.url }}">{{ entry.title }}</a>
+                </h1>
+                <h1 ng-hide="entry.favicon" class="icon-rss">
+                    {{ entry.title }}
+                </h1>
+                <div style="clear:both"></div>
+                <div class="explore-content">
+                    <p>{{ entry.description }}</p>
+
+                    <div class="explore-logo">
+                        <img ng-src="{{ entry.image }}" ng-if="entry.image">
+                    </div>
+                </div>
+                <div class="explore-subscribe">
+                    <button ng-click="Explore.subscribeTo(entry.feed)">
+                        <?php p($l->t('Subscribe')) ?>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div class="explore-footer">
+        <a target="_blank" rel="noreferrer" href="https://github.com/nextcloud/news/tree/master/docs/explore"><?php p($l->t('Got more awesome feeds? Share them with us!')) ?></a>
+    </div>
+</div>
diff --git a/templates-old/part.content.php b/templates-old/part.content.php
new file mode 100644
index 000000000..120e9173a
--- /dev/null
+++ b/templates-old/part.content.php
@@ -0,0 +1,158 @@
+<?php print_unescaped($this->inc('part.content.warnings')) ?>
+
+<div news-auto-focus="#app-content"
+    id="articles"
+     ng-class="{
+        compact: Content.isCompactView(),
+        'feed-view': Content.isFeed()
+    }"
+    news-compact-expand="{{ Content.isCompactExpand() }}"
+    class="app-content-detail">
+    <div ng-show="Content.getItems().length == 0" class="no-feeds-available">
+        <p ng-show="Content.isShowAll()"><?php p($l->t('No articles available')) ?></p>
+        <p ng-show="!Content.isShowAll()"><?php p($l->t('No unread articles available')) ?></p>
+    </div>
+    <button ng-controller="NavigationController as Navigation" id="mark-all-read-button" ng-click="Navigation.markCurrentRead()" class="hidden">
+        <span title="Mark Read" class="icon-checkmark"></span>
+    </button>
+
+    <ul>
+        <li class="item {{ ::Content.getFeed(item.feedId).cssClass }}"
+            ng-repeat="item in Content.getItems() |
+                orderBy:[Content.orderBy()] track by item.id"
+            ng-mouseup="Content.markRead(item.id)"
+            ng-click="Content.markRead(item.id); Content.setItemActive(item.id)"
+            news-on-active="Content.setItemActive(item.id)"
+            ng-class="{read: !item.unread, open: item.show, active: Content.isItemActive(item.id)}"
+            data-id="{{ ::item.id }}">
+
+            <div class="utils" ng-click="Content.toggleItem(item)">
+                <ul>
+                    <li class="util-spacer"></li>
+                    <li class="util only-in-compact">
+                        <a class="external icon-link"
+                            ng-click="Content.markRead(item.id)"
+                            target="_blank"
+                            rel="noreferrer"
+                            ng-href="{{ ::item.url }}"
+                            title="<?php p($l->t('Open website')) ?>"
+                            news-stop-propagation>
+                        </a>
+                    </li>
+                    <li class="title only-in-compact"
+                        ng-class="{
+                            'icon-rss':
+                                !Content.getFeed(item.feedId).faviconLink
+                        }"
+                        ng-style="{
+                            backgroundImage:
+                                'url('
+                                    + Content.getFeed(item.feedId).faviconLink +
+                                ')'
+                            }">
+                        <h1 ng-attr-dir="{{item.rtl && 'rtl'}}"><a>{{ ::item.title }} <span class="intro" news-bind-html-unsafe="::item.intro"></span></a></h1>
+                    </li>
+                    <li class="only-in-compact">
+                        <time class="date"
+                                title="{{ item.pubDate*1000 |
+                                            date:'yyyy-MM-dd HH:mm:ss' }}"
+                            datetime="{{ item.pubDate*1000 |
+                                            date:'yyyy-MM-ddTHH:mm:ssZ' }}">
+                                {{ Content.getRelativeDate(item.pubDate) }}
+                        </time>
+                    </li>
+                    <li ng-click="Content.toggleStar(item.id)"
+                        class="util"
+                        news-stop-propagation>
+                        <button class="star svg"
+                                ng-hide="item.starred"
+                                title="<?php p($l->t('Star article')); ?>">
+                        </button>
+                        <button class="starred svg"
+                                ng-show="item.starred"
+                                title="<?php p($l->t('Unstar article')); ?>">
+                        </button>
+                    </li>
+                    <li ng-click="Content.toggleKeepUnread(item.id)"
+                        class="util toggle-keep-unread"
+                        news-stop-propagation>
+                        <button class="icon-toggle"
+                            ng-hide="item.keepUnread"
+                            title="<?php p($l->t('Keep article unread')); ?>">
+                        </button>
+                        <button
+                            class="icon-toggle keep-unread"
+                            ng-show="item.keepUnread"
+                            title="<?php
+                                p($l->t('Remove keep article unread'));
+                            ?>">
+                        </button>
+                    </li>
+                    <li class="util more" news-stop-propagation ng-hide="noPlugins">
+                        <button class="icon-more" news-toggle-show="#actions-{{item.id}}"></button>
+                        <div class="article-actions" id="actions-{{item.id}}">
+                            <ul news-article-actions="item" no-plugins="noPlugins"></ul>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="article" ng-if="!Content.isCompactView() || item.show">
+
+                <div class="heading only-in-expanded">
+                    <time class="date"
+                          title="{{ item.pubDate*1000 |
+                            date:'yyyy-MM-dd HH:mm:ss' }}"
+                          datetime="{{ item.pubDate*1000 |
+                            date:'yyyy-MM-ddTHH:mm:ssZ' }}">
+                        {{ Content.getRelativeDate(item.pubDate) }}
+                    </time>
+                    <h1 ng-attr-dir="{{item.rtl && 'rtl'}}">
+                        <a class="external"
+                            target="_blank"
+                            rel="noreferrer"
+                            ng-href="{{ ::item.url }}"
+                            title="{{ ::item.title }}">
+                            {{ ::item.title }}
+                        </a>
+                    </h1>
+                </div>
+
+                <div class="subtitle" ng-attr-dir="{{item.rtl && 'rtl'}}">
+                    <span class="author" ng-show="item.author">
+                        <?php p($l->t('by')) ?> {{ ::item.author }}
+                    </span>
+                    <span class="source"><?php p($l->t('from')) ?>
+                        <a ng-href="#/items/feeds/{{ ::item.feedId }}/">
+                            {{ ::Content.getFeed(item.feedId).title }}
+                            <img ng-if="Content.getFeed(item.feedId).faviconLink && !Content.isCompactView()" src="{{ ::Content.getFeed(item.feedId).faviconLink }}" alt="favicon">
+                        </a>
+                    </span>
+                </div>
+
+                <div class="enclosure" ng-if="Content.getMediaType(item.enclosureMime) == 'audio'">
+                    <button ng-click="App.play(item)"><?php p($l->t('Play audio')) ?></button>
+                    <a class="button" ng-href="{{ item.enclosureLink|trustUrl }}" target="_blank" rel="noreferrer">
+                        <?php p($l->t('Download audio')) ?>
+                    </a>
+                </div>
+                <div class="enclosure" ng-if="Content.getMediaType(item.enclosureMime) == 'video'">
+                    <video controls preload="none" news-play-one ng-src="{{ item.enclosureLink|trustUrl }}" type="{{ item.enclosureMime }}">
+                    </video>
+                    <a class="button" ng-href="{{ item.enclosureLink|trustUrl }}" target="_blank" rel="noreferrer">
+                        <?php p($l->t('Download video')) ?>
+                    </a>
+                </div>
+
+                <div class="enclosure thumbnail" ng-if="item.mediaThumbnail">
+                    <a ng-href="{{ ::item.enclosureLink }}"><img ng-src="{{ item.mediaThumbnail|trustUrl }}" alt="" /></a>
+                </div>
+
+                <div class="enclosure description" ng-if="item.mediaDescription" news-bind-html-unsafe="item.mediaDescription"></div>
+
+                <div class="body" news-bind-html-unsafe="item.body" ng-attr-dir="{{item.rtl && 'rtl'}}"></div>
+
+            </div>
+        </li>
+    </ul>
+</div>
diff --git a/templates-old/part.content.shortcuts.php b/templates-old/part.content.shortcuts.php
new file mode 100644
index 000000000..81c7f1b42
--- /dev/null
+++ b/templates-old/part.content.shortcuts.php
@@ -0,0 +1,78 @@
+<?php print_unescaped($this->inc('part.content.warnings')) ?>
+
+<div id="app-shortcuts">
+    <div>
+        <table>
+            <tr>
+                <th><?php p($l->t('Keyboard shortcut')); ?></th>
+                <th><?php p($l->t('Description')); ?></th>
+            </tr>
+            <tr>
+                <td>n / j / <?php p($l->t('right')); ?></td>
+                <td><?php p($l->t('Jump to next article')); ?></td>
+            </tr>
+            <tr>
+                <td>p / k / <?php p($l->t('left')); ?></td>
+                <td><?php p($l->t('Jump to previous article')); ?></td>
+            </tr>
+            <tr>
+                <td>s / l</td>
+                <td><?php p($l->t('Toggle star article')); ?></td>
+            </tr>
+            <tr>
+                <td>h</td>
+                <td>
+                    <?php p($l->t('Star article and jump to next one')); ?>
+                </td>
+            </tr>
+            <tr>
+                <td>u</td>
+                <td>
+                    <?php p($l->t('Toggle keep current article unread')); ?>
+                </td>
+            </tr>
+            <tr>
+                <td>o</td>
+                <td><?php p($l->t('Open article in new tab')); ?></td>
+            </tr>
+            <tr>
+                <td>e</td>
+                <td>
+                    <?php p($l->t('Toggle expand article in compact view')); ?>
+                </td>
+            </tr>
+            <tr>
+                <td>r</td>
+                <td><?php p($l->t('Refresh')); ?></td>
+            </tr>
+            <tr>
+                <td>f</td>
+                <td><?php p($l->t('Load next feed')); ?></td>
+            </tr>
+            <tr>
+                <td>d</td>
+                <td><?php p($l->t('Load previous feed')); ?></td>
+            </tr>
+            <tr>
+                <td>c</td>
+                <td><?php p($l->t('Load next folder')); ?></td>
+            </tr>
+            <tr>
+                <td>v</td>
+                <td><?php p($l->t('Load previous folder')); ?></td>
+            </tr>
+            <tr>
+                <td>a</td>
+                <td><?php p($l->t('Scroll to active navigation entry')); ?></td>
+            </tr>
+            <tr>
+                <td>q</td>
+                <td><?php p($l->t('Focus search field')); ?></td>
+            </tr>
+            <tr>
+                <td>shift + a</td>
+                <td><?php p($l->t('Mark current article\'s feed/folder read')); ?></td>
+            </tr>
+        </table>
+    </div>
+</div>
\ No newline at end of file
diff --git a/templates-old/part.content.warnings.php b/templates-old/part.content.warnings.php
new file mode 100644
index 000000000..e8578b299
--- /dev/null
+++ b/templates-old/part.content.warnings.php
@@ -0,0 +1,25 @@
+<?php if ($_['warnings']['improperlyConfiguredCron']) { ?>
+    <news-instant-notification id="cron-warning">
+        <p><?php p($l->t('Ajax or webcron mode detected! Your feeds will not be updated!')); ?></p>
+        <ul>
+            <li>
+                <a href="https://docs.nextcloud.org/server/latest/admin_manual/configuration_server/background_jobs_configuration.html#cron"
+                   target="_blank"
+                   rel="noreferrer">
+                    <?php
+                    p($l->t('How to set up the operating system cron'));
+                    ?>
+                </a>
+            </li>
+            <li>
+                <a href="https://github.com/nextcloud/news-updater"
+                   target="_blank"
+                   rel="noreferrer">
+                    <?php
+                    p($l->t('Install and set up a faster parallel updater that uses the News app\'s update API'));
+                    ?>
+                </a>
+            </li>
+        </ul>
+    </news-instant-notification>
+<?php }; ?>
diff --git a/templates-old/part.navigation.addfeed.php b/templates-old/part.navigation.addfeed.php
new file mode 100644
index 000000000..595b1a1b4
--- /dev/null
+++ b/templates-old/part.navigation.addfeed.php
@@ -0,0 +1,114 @@
+<li class="add-new">
+    <div class="heading">
+        <button
+            class="icon-add"
+            data-apps-slide-toggle="#new-feed"
+            news-focus="[name='address']"><?php p($l->t('Subscribe'))?></button>
+    </div>
+
+    <div class="add-new-popup" id="new-feed" news-add-feed="Navigation.feed">
+
+        <form ng-submit="Navigation.createFeed(Navigation.feed)"
+              name="feedform">
+            <fieldset ng-disabled="Navigation.addingFeed">
+                <input type="text"
+                    ng-model="Navigation.feed.url"
+                    ng-class="{'ng-invalid':
+                        !Navigation.addingFeed &&
+                        Navigation.feedUrlExists(Navigation.feed.url)
+                    }"
+                    placeholder="<?php p($l->t('Web address')); ?>"
+                    name="address"
+                    pattern="[^\s]+"
+                    required
+                    autofocus>
+
+                <p class="error"
+                    ng-show="!Navigation.addingFeed &&
+                        Navigation.feedUrlExists(Navigation.feed.url)">
+                    <?php p($l->t('Feed exists already!')); ?>
+                </p>
+
+                <!-- select a folder -->
+                <select name="folder"
+                    title="<?php p($l->t('Folder')); ?>"
+                    ng-if="!Navigation.showNewFolder"
+                    ng-model="Navigation.feed.existingFolder"
+                    ng-options="folder.name for folder in
+                        Navigation.getFolders() track by folder.name">
+                    <option value=""
+                        >-- <?php p($l->t('No folder')); ?> --</option>
+                </select>
+                <button type="button"
+                        class="icon-add add-new-folder-primary"
+                        ng-hide="Navigation.showNewFolder"
+                        title="<?php p($l->t('New folder')); ?>"
+                        ng-click="Navigation.showNewFolder=true"
+                        news-focus="#new-feed [name='folderName']"></button>
+
+                <!-- add a folder -->
+                <input type="text"
+                       ng-model="Navigation.feed.newFolder"
+                       ng-class="{'ng-invalid':
+                            !Navigation.addingFeed &&
+                            !Navigation.addingFeed &&
+                            Navigation.showNewFolder &&
+                            Navigation.folderNameExists(
+                                Navigation.feed.newFolder
+                            )
+                        }"
+                       placeholder="<?php p($l->t('Folder name')); ?>"
+                       name="folderName"
+                       ng-if="Navigation.showNewFolder"
+                       required>
+                <button type="button"
+                        ng-show="Navigation.showNewFolder"
+                        class="icon-close add-new-folder-primary"
+                        title="<?php p($l->t('Go back')); ?>"
+                        ng-click="Navigation.showNewFolder=false;
+                                  Navigation.feed.newFolder=''">
+                </button>
+
+
+                <p class="error" ng-show="!Navigation.addingFeed &&
+                    Navigation.folderNameExists(Navigation.feed.newFolder)">
+                    <?php p($l->t('Folder exists already!')); ?>
+                </p>
+
+                <!-- basic auth -->
+                <div class="add-new-basicauth-toggle">
+                    <input type="checkbox"
+                           class="checkbox"
+                           ng-model="Navigation.addFeedBasicauth"
+                           id="add-feed-basicauth">
+                    <label for="add-feed-basicauth"><?php p($l->t('Credentials')); ?></label>
+                </div>
+
+                <div ng-show="Navigation.addFeedBasicauth" class="add-feed-basicauth">
+                    <p class="warning"><?php p($l->t('HTTP Basic Auth credentials must be stored unencrypted! Everyone with access to the server or database will be able to access them!')); ?></p>
+                    <input type="text"
+                        ng-model="Navigation.feed.user"
+                        placeholder="<?php p($l->t('Username')); ?>"
+                        name="user"
+                        autofocus>
+
+                    <input type="password"
+                        ng-model="Navigation.feed.password"
+                        placeholder="<?php p($l->t('Password')); ?>"
+                        name="password" autocomplete="new-password">
+                </div>
+
+                <!-- submit -->
+                <input type="submit"
+                    value="<?php p($l->t('Subscribe')); ?>"
+                    class="primary"
+                    ng-disabled="
+                        Navigation.feedUrlExists(Navigation.feed.url) ||
+                                (
+                                    Navigation.showNewFolder &&
+                                    Navigation.folderNameExists(folder.name)
+                                )">
+            </fieldset>
+        </form>
+    </div>
+</li>
diff --git a/templates-old/part.navigation.addfolder.php b/templates-old/part.navigation.addfolder.php
new file mode 100644
index 000000000..437c35c71
--- /dev/null
+++ b/templates-old/part.navigation.addfolder.php
@@ -0,0 +1,39 @@
+<li class="add-new">
+    <div class="heading">
+        <button
+            class="icon-add"
+            data-apps-slide-toggle="#new-folder"
+            news-focus="#new-folder [name='folderName']">
+                <?php p($l->t('New Folder'))?>
+        </button>
+    </div>
+
+    <div class="add-new-popup" id="new-folder">
+
+        <form ng-submit="Navigation.createFolder(folder)" name="folderform">
+            <fieldset ng-disabled="Navigation.addingFolder">
+            <!-- add a folder -->
+                <input type="text"
+                       ng-class="{
+                            'ng-invalid': !Navigation.addingFolder &&
+                                Navigation.folderNameExists(folder.name)
+                        }"
+                       ng-model="folder.name"
+                       placeholder="<?php p($l->t('Folder name')); ?>"
+                       title="<?php p($l->t('Folder name')); ?>"
+                       name="folderName"
+                       required>
+
+                <p class="error" ng-show="!Navigation.addingFolder &&
+                    Navigation.folderNameExists(folder.name)">
+                    <?php p($l->t('Folder exists already!')); ?>
+                </p>
+
+                <input type="submit"
+                    value="<?php p($l->t('Create')); ?>"
+                    class="primary"
+                    ng-disabled="Navigation.folderNameExists(folder.name)">
+            </fieldset>
+        </form>
+    </div>
+</li>
diff --git a/templates-old/part.navigation.explore.php b/templates-old/part.navigation.explore.php
new file mode 100644
index 000000000..8575afb1c
--- /dev/null
+++ b/templates-old/part.navigation.explore.php
@@ -0,0 +1,5 @@
+<li ng-class="{active: Navigation.isExploreActive()}" class="explore-feed">
+    <a class="icon-link" ng-href="#/explore/?lang={{Navigation.getLanguageCode()}}">
+       <?php p($l->t('Explore')) ?>
+    </a>
+</li>
diff --git a/templates-old/part.navigation.feed.php b/templates-old/part.navigation.feed.php
new file mode 100644
index 000000000..3c694d3d9
--- /dev/null
+++ b/templates-old/part.navigation.feed.php
@@ -0,0 +1,179 @@
+<li ng-class="{
+        active: Navigation.isFeedActive(feed.id),
+        unread: Navigation.isFeedUnread(feed.id),
+        updateerror: feed.updateErrorCount>50,
+        deleted: feed.deleted,
+        editing: feed.editing,
+        'icon-loading-small': !(feed.id || feed.error)
+    }"
+    ng-repeat="feed in Navigation.getFeedsOfFolder(<?php p($_['folderId']); ?>)
+        | orderBy:['-pinned', 'title.toLowerCase()'] track by feed.url"
+    ng-show="Navigation.isFeedUnread(feed.id)
+            || Navigation.isShowAll()
+            || Navigation.isFeedActive(feed.id)
+            || !feed.id
+            || feed.updateErrorCount>50"
+    data-id="{{ feed.id }}"
+    class="feed with-counter with-menu animate-show"
+    news-draggable-disable="{{
+        feed.error.length > 0 ||
+        !feed.id ||
+        feed.deleted ||
+        feed.editing
+    }}"
+    news-draggable="{
+        stack: '> li',
+        zIndex: 1000,
+        axis: 'y',
+        delay: 200,
+        containment: '#app-navigation ul',
+        scroll: true,
+        revert: true
+    }">
+
+    <a  ng-style="{ backgroundImage: 'url(' + feed.faviconLink + ')'}"
+        ng-show="!feed.error && feed.id"
+        ng-href="#/items/feeds/{{ feed.id }}/"
+        class="title"
+        ng-class="{'icon-rss': !feed.faviconLink}"
+        title="{{ feed.updateErrorCount>50 ? '<?php p(addslashes($l->t('Update failed more than 50 times'))); ?>: ' + feed.lastUpdateError : feed.title }}">
+       {{ feed.title }}
+    </a>
+
+    <a ng-if="!(feed.id || feed.error)"
+        class="title"
+        title="{{ feed.title }}">
+       {{ feed.title }}
+    </a>
+
+    <div ng-if="feed.deleted"
+         class="app-navigation-entry-deleted"
+         news-timeout="Navigation.deleteFeed(feed)">
+        <div class="app-navigation-entry-deleted-description">
+            <?php p($l->t('Deleted feed')); ?>: {{ feed.title }}
+        </div>
+        <button class="icon-history app-navigation-entry-deleted-button"
+                title="<?php p($l->t('Undo delete feed')); ?>"
+                ng-click="Navigation.undoDeleteFeed(feed)"></button>
+    </div>
+
+    <div ng-if="feed.editing" class="app-navigation-entry-edit">
+        <form ng-submit="Navigation.renameFeed(feed)">
+            <input name="feedRename"
+                type="text"
+                ng-model="feed.title"
+                news-auto-focus
+                ng-model-options="{updateOn:'submit'}"
+                required>
+            <input type="submit"
+                value=""
+                title="<?php p($l->t('Rename')); ?>"
+                    class="action icon-checkmark">
+        </form>
+    </div>
+
+    <div class="app-navigation-entry-utils"
+         ng-show="feed.id && !feed.editing && !feed.error && !feed.deleted">
+        <ul>
+            <li class="app-navigation-entry-utils-counter"
+                ng-show="feed.id && Navigation.isFeedUnread(feed.id)"
+                title="{{ Navigation.getFeedUnreadCount(feed.id) }}">
+                {{ Navigation.getFeedUnreadCount(feed.id) |
+                    unreadCountFormatter }}
+            </li>
+            <li class="app-navigation-entry-utils-menu-button">
+                <button title="<?php p($l->t('Menu')); ?>"></button>
+            </li>
+        </ul>
+    </div>
+
+    <div class="app-navigation-entry-menu" ng-click="$event.stopPropagation()">
+        <ul>
+            <li ng-show="Navigation.isFeedUnread(feed.id)" class="mark-read">
+                <button ng-click="Navigation.markFeedRead(feed.id)">
+                    <span class="icon-checkmark"></span>
+                    <span><?php p($l->t('Mark read')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="Navigation.togglePinned(feed.id)"
+                        ng-show="feed.pinned">
+                    <span class="icon-pinned"></span>
+                    <span><?php p($l->t('Unpin from top')); ?></span>
+                </button>
+                <button ng-click="Navigation.togglePinned(feed.id)"
+                        ng-hide="feed.pinned">
+                    <span class="icon-unpinned"></span>
+                    <span><?php p($l->t('Pin to top')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="Navigation.setOrdering(feed, 1)"
+                        ng-show="feed.ordering == 0">
+                    <span class="icon-caret-dark feed-no-ordering"></span>
+                    <span><?php p($l->t('Newest first')); ?></span>
+                </button>
+                <button ng-click="Navigation.setOrdering(feed, 2)"
+                        ng-show="feed.ordering == 1">
+                    <span class="icon-caret-dark feed-reverse-ordering"></span>
+                    <span><?php p($l->t('Oldest first')); ?></span>
+                </button>
+                <button ng-click="Navigation.setOrdering(feed, 0)"
+                        ng-show="feed.ordering == 2">
+                    <span class="icon-caret-dark feed-normal-ordering"></span>
+                    <span><?php p($l->t('Default order')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="Navigation.toggleFullText(feed)"
+                        ng-hide="feed.fullTextEnabled">
+                    <span class="icon-full-text-disabled"></span>
+                    <span><?php p($l->t('Enable full text')); ?></span>
+                </button>
+                <button ng-click="Navigation.toggleFullText(feed)"
+                        ng-show="feed.fullTextEnabled">
+                    <span class="icon-full-text-enabled"></span>
+                    <span><?php p($l->t('Disable full text')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="Navigation.setUpdateMode(feed.id, 1)"
+                        ng-hide="feed.updateMode == 1">
+                    <span class="icon-updatemode-default"></span>
+                    <span><?php p($l->t('Unread updated')); ?></span>
+                </button>
+                <button ng-click="Navigation.setUpdateMode(feed.id, 0)"
+                        ng-show="feed.updateMode == 1">
+                    <span class="icon-updatemode-unread"></span>
+                    <span><?php p($l->t('Ignore updated')); ?></span>
+                </button>
+            </li>
+            <li>
+                <a ng-href="{{feed.url}}" target="_blank" rel="noopener noreferrer">
+                    <span class="icon-rss"></span>
+                    <span><?php p($l->t('Open feed URL')); ?></span>
+                </a>
+            </li>
+            <li>
+                <button ng-click="feed.editing=true">
+                    <span class="icon-rename"></span>
+                    <span><?php p($l->t('Rename')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="Navigation.reversiblyDeleteFeed(feed)">
+                    <span class="icon-delete"></span>
+                    <span><?php p($l->t('Delete')); ?></span>
+                </button>
+            </li>
+        </ul>
+    </div>
+
+    <div class="error-message" ng-show="feed.error">
+        <h2 class="title">{{ feed.url }}</h2>
+        <span class="message">{{ feed.error }}</span>
+        <button type="button "
+                title="<?php p($l->t('Dismiss')); ?>"
+                ng-click="Navigation.deleteFeed(feed)"></button>
+    </div>
+</li>
diff --git a/templates-old/part.navigation.folder.php b/templates-old/part.navigation.folder.php
new file mode 100644
index 000000000..67ac81e84
--- /dev/null
+++ b/templates-old/part.navigation.folder.php
@@ -0,0 +1,142 @@
+<li ng-class="{
+        active: Navigation.isFolderActive(folder.id),
+        open: folder.opened || folder.getsFeed,
+        unread: Navigation.isFolderUnread(folder.id),
+        deleted: folder.deleted,
+        editing: folder.editing
+    }"
+    ng-repeat="folder in Navigation.getFolders() | orderBy:'name.toLowerCase()'"
+    ng-show="Navigation.isFolderUnread(folder.id)
+            || Navigation.isShowAll()
+            || Navigation.isFolderActive(folder.id)
+            || Navigation.subFeedActive(folder.id)
+            || !folder.id
+            || folder.getsFeed
+            || !Navigation.hasFeeds(folder.id)"
+    class="folder with-counter with-menu animate-show collapsible"
+    data-id="{{ folder.id }}"
+    news-droppable>
+    <button class="collapse"
+            ng-hide="folder.editing || folder.deleted"
+            title="<?php p($l->t('Collapse'));?>"
+            ng-click="Navigation.toggleFolder(folder.name)"></button>
+
+    <a ng-href="#/items/folders/{{ folder.id }}/"
+        class="title icon-folder"
+        ng-if="!folder.error && folder.id">
+       {{ folder.name }}
+    </a>
+
+    <a class="title icon-loading-small" ng-if="!(folder.id || folder.error)">
+       {{ folder.name }}
+    </a>
+
+    <div ng-if="folder.deleted"
+        class="app-navigation-entry-deleted"
+        news-timeout="Navigation.deleteFolder(folder)">
+        <div class="app-navigation-entry-deleted-description">
+            <?php p($l->t('Deleted folder')); ?>: {{ folder.name }}
+        </div>
+        <button class="icon-history app-navigation-entry-deleted-button"
+                title="<?php p($l->t('Undo delete folder')); ?>"
+                ng-click="Navigation.undoDeleteFolder(folder)"></button>
+    </div>
+
+    <div ng-if="folder.editing" class="app-navigation-entry-edit"
+        ng-class="{
+            'folder-rename-error':
+                folder.renameError ||
+                (folderName != folder.name &&
+                !Navigation.renamingFolder &&
+                Navigation.folderNameExists(folderName))
+            }">
+        <form ng-submit="Navigation.renameFolder(folder, folderName)">
+            <input name="folderName"
+                type="text"
+                ng-init="folderName=folder.name"
+                ng-class="{
+                    'ng-invalid':
+                        folderName != folder.name &&
+                        !Navigation.renamingFolder &&
+                        Navigation.folderNameExists(folderName)
+                }"
+                ng-model="folderName"
+                ng-model-options="{updateOn:'submit'}"
+                ng-disabled="Navigation.renamingFolder"
+                required
+                news-auto-focus>
+            <input type="submit"
+                value=""
+                ng-class="{'icon-loading-small': Navigation.renamingFolder}"
+                title="<?php p($l->t('Rename')); ?>"
+                class="action icon-checkmark"
+                ng-disabled="folderName != folder.name &&
+                    !Navigation.renamingFolder &&
+                    Navigation.folderNameExists(folderName)">
+            </button>
+            <p class="error" ng-show="folderName != folder.name &&
+                !Navigation.renamingFolder &&
+                Navigation.folderNameExists(folderName)">
+                <?php p($l->t('Folder exists already!')); ?>
+            </p>
+            <p class="error" ng-show="folder.renameError">
+                {{ folder.renameError }}
+            </p>
+        </form>
+    </div>
+
+    <div class="app-navigation-entry-utils"
+         ng-show="folder.id &&
+            !folder.editing &&
+            !folder.error &&
+            !folder.deleted">
+        <ul>
+            <li class="app-navigation-entry-utils-counter"
+                ng-show="folder.id &&
+                     Navigation.isFolderUnread(folder.id)"
+                title="{{ Navigation.getFolderUnreadCount(folder.id) }}">
+                {{ Navigation.getFolderUnreadCount(folder.id) |
+                    unreadCountFormatter }}
+            </li>
+            <li class="app-navigation-entry-utils-menu-button">
+                <button title="<?php p($l->t('Menu')); ?>"></button>
+            </li>
+        </ul>
+    </div>
+
+    <div class="app-navigation-entry-menu">
+        <ul>
+            <li ng-show="Navigation.isFolderUnread(folder.id)" class="mark-read">
+                <button ng-click="Navigation.markFolderRead(folder.id)">
+                    <span class="icon-checkmark"></span>
+                    <span><?php p($l->t('Mark read')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="folder.editing=true">
+                    <span class="icon-rename"></span>
+                    <span><?php p($l->t('Rename')); ?></span>
+                </button>
+            </li>
+            <li>
+                <button ng-click="Navigation.reversiblyDeleteFolder(folder)">
+                    <span class="icon-delete"></span>
+                    <span><?php p($l->t('Delete')); ?></span>
+                </button>
+            </li>
+        </ul>
+    </div>
+    <ul ng-hide="folder.error || folder.deleted">
+        <?php print_unescaped(
+            $this->inc('part.navigation.feed', ['folderId' => 'folder.id'])
+        ); ?>
+    </ul>
+
+    <div class="error-message" ng-show="folder.error">
+        <h2 class="title">{{ folder.name }}</h2>
+        <span class="message">{{ folder.error }}</span>
+        <button type="button "
+                title="<?php p($l->t('Dismiss')); ?>"
+                ng-click="Navigation.deleteFolder(folder)"></button>
+    </div>
+</li>
diff --git a/templates-old/part.navigation.starredfeed.php b/templates-old/part.navigation.starredfeed.php
new file mode 100644
index 000000000..1f096d57d
--- /dev/null
+++ b/templates-old/part.navigation.starredfeed.php
@@ -0,0 +1,20 @@
+<li ng-class="{
+        active: Navigation.isStarredActive(),
+        unread: Navigation.isStarredUnread()
+    }"
+    class="with-counter starred-feed">
+
+    <a class="icon-starred" ng-href="#/items/starred/">
+       <?php p($l->t('Starred')) ?>
+    </a>
+
+    <div class="app-navigation-entry-utils">
+        <ul>
+            <li class="app-navigation-entry-utils-counter"
+                ng-show="Navigation.isStarredUnread()"
+                title="{{ Navigation.getStarredCount() }}">
+                {{ Navigation.getStarredCount() | unreadCountFormatter }}
+            </li>
+        </ul>
+    </div>
+</li>
\ No newline at end of file
diff --git a/templates-old/part.navigation.unreadfeed.php b/templates-old/part.navigation.unreadfeed.php
new file mode 100644
index 000000000..ac92625af
--- /dev/null
+++ b/templates-old/part.navigation.unreadfeed.php
@@ -0,0 +1,71 @@
+<li ng-class="{
+        active: Navigation.isUnreadActive(),
+        unread: Navigation.isUnread()
+    }"
+    class="subscriptions-feed with-counter with-menu">
+
+    <a class="icon-rss" ng-href="#/items/unread/" >
+       <?php p($l->t('Unread articles'))?>
+    </a>
+
+    <div class="app-navigation-entry-utils" ng-show="Navigation.isUnread()">
+        <ul>
+            <li class="app-navigation-entry-utils-counter"
+                ng-show="Navigation.isUnread()"
+                title="{{ Navigation.getUnreadCount() }}">
+                {{ Navigation.getUnreadCount() | unreadCountFormatter }}
+            </li>
+            <li class="app-navigation-entry-utils-menu-button">
+                <button
+                    ng-click="optionsId = (optionsId == 'all' ? -1 : 'all')">
+                </button>
+            </li>
+        </ul>
+    </div>
+
+    <div class="app-navigation-entry-menu">
+        <ul>
+            <li class="mark-read">
+                <button ng-click="Navigation.markRead()">
+                    <span class="icon-checkmark"></span>
+                    <span><?php p($l->t('Mark read')); ?></span>
+                </button>
+            </li>
+        </ul>
+    </div>
+
+</li>
+
+<li ng-class="{
+        active: Navigation.isSubscriptionsActive(),
+        unread: Navigation.isUnread()
+    }"
+    ng-if="Navigation.isShowAll()"
+    class="all-subscriptions-feed with-menu">
+
+    <a class="icon-rss" ng-href="#/items/">
+       <?php p($l->t('All articles'))?>
+    </a>
+
+    <div class="app-navigation-entry-utils">
+        <ul>
+            <li class="app-navigation-entry-utils-menu-button">
+                <button
+                    ng-click="optionsId = (optionsId == 'all' ? -1 : 'all')">
+                </button>
+            </li>
+        </ul>
+    </div>
+
+    <div class="app-navigation-entry-menu">
+        <ul>
+            <li class="mark-read">
+                <button ng-click="Navigation.markRead()">
+                    <span class="icon-checkmark"></span>
+                    <span><?php p($l->t('Mark read')); ?></span>
+                </button>
+            </li>
+        </ul>
+    </div>
+
+</li>
diff --git a/templates-old/part.settings.php b/templates-old/part.settings.php
new file mode 100644
index 000000000..b3a1b541e
--- /dev/null
+++ b/templates-old/part.settings.php
@@ -0,0 +1,159 @@
+<div id="app-settings-header">
+    <button name="app settings"
+            class="settings-button"
+            data-apps-slide-toggle="#app-settings-content">
+        <?php p($l->t('Settings')); ?>
+    </button>
+</div>
+
+<div id="app-settings-content">
+    <h3><?php p($l->t('Settings')); ?></h3>
+
+    <fieldset class="settings-fieldset">
+        <ul class="settings-fieldset-interior">
+            <li class="settings-fieldset-interior-item">
+                <input type="checkbox"
+                       class="checkbox"
+                       ng-click="Settings.toggleSetting('preventReadOnScroll')"
+                       ng-checked="Settings.getSetting('preventReadOnScroll')"
+                       name="preventReadOnScroll"
+                       id="settings-preventReadOnScroll">
+                <label for="settings-preventReadOnScroll"><?php p($l->t('Disable mark read through scrolling')); ?></label>
+            </li>
+            <li class="settings-fieldset-interior-item">
+                <input type="checkbox"
+                       class="checkbox"
+                       ng-click="Settings.toggleSetting('compact')"
+                       ng-checked="Settings.getSetting('compact')"
+                       name="compact"
+                       id="settings-compact">
+                <label for="settings-compact"><?php p($l->t('Compact view')); ?></label>
+            </li>
+            <li class="settings-fieldset-interior-item" ng-show="Settings.getSetting('compact')">
+                <input type="checkbox"
+                       class="checkbox"
+                       ng-click="Settings.toggleSetting('compactExpand')"
+                       ng-checked="Settings.getSetting('compactExpand')"
+                       name="compactExpand"
+                       id="settings-compactExpand">
+                <label for="settings-compactExpand"><?php p($l->t('Expand articles on key navigation')); ?></label>
+            </li>
+            <li class="settings-fieldset-interior-item">
+                <input type="checkbox"
+                       class="checkbox"
+                       ng-click="Settings.toggleSetting('showAll')"
+                       ng-checked="Settings.getSetting('showAll')"
+                       name="showAll"
+                       id="settings-showAll">
+                <label for="settings-showAll"><?php p($l->t('Show all articles')); ?></label>
+            </li>
+            <li class="settings-fieldset-interior-item">
+                <input type="checkbox"
+                       class="checkbox"
+                       ng-click="Settings.toggleSetting('oldestFirst')"
+                       ng-checked="Settings.getSetting('oldestFirst')"
+                       name="oldestFirst"
+                       id="settings-oldestFirst">
+                <label for="settings-oldestFirst"><?php p($l->t('Reverse ordering (oldest on top)')); ?></label>
+            </li>
+        </ul>
+    </fieldset>
+
+    <div class="import-export">
+        <h3><?php p($l->t('Subscriptions (OPML)')); ?></h3>
+
+        <input type="file"
+               id="opml-upload"
+               name="import"
+               news-read-file="Settings.importOPML($fileContent)"/>
+
+        <button title="<?php p($l->t('Import')); ?>"
+                class="icon-upload svg button-icon-label"
+                news-trigger-click="#opml-upload"
+                ng-class="{'entry-loading': Settings.isOPMLImporting}"
+                ng-disabled=
+                "Settings.isOPMLImporting || Settings.isArticlesImporting">
+        </button>
+
+        <a title="<?php p($l->t('Export')); ?>"
+           class="button icon-download svg button-icon-label"
+           href="<?php p($_['url_generator']->linkToRoute('news.export.opml')); ?>"
+           target="_blank"
+           rel="noreferrer"
+           ng-hide="App.isFirstRun()">
+        </a>
+
+        <button
+            class="icon-download svg button-icon-label"
+            title="<?php p($l->t('Export')); ?>"
+            ng-show="App.isFirstRun()"
+            disabled>
+        </button>
+
+        <p class="error" ng-show="Settings.opmlImportError">
+            <?php p(
+                $l->t('Error when importing: File does not contain valid OPML')
+            ); ?>
+        </p>
+        <p class="error" ng-show="Settings.opmlImportEmptyError">
+            <?php p(
+                $l->t('Error when importing: OPML is does neither contain ' .
+                    'feeds nor folders')
+            ); ?>
+        </p>
+
+        <h3><?php p($l->t('Unread/Starred Articles')); ?></h3>
+
+        <input
+            type="file"
+            id="article-upload"
+            name="importarticle"
+            news-read-file="Settings.importArticles($fileContent)"/>
+
+        <button title="<?php p($l->t('Import')); ?>"
+                class="icon-upload svg button-icon-label"
+                ng-class="{'entry-loading': Settings.isArticlesImporting}"
+                ng-disabled="Settings.isOPMLImporting || Settings.isArticlesImporting"
+                news-trigger-click="#article-upload">
+        </button>
+
+        <a title="<?php p($l->t('Export')); ?>"
+           class="button icon-download svg button-icon-label"
+           href="<?php p($_['url_generator']->linkToRoute('news.export.articles')); ?>"
+           target="_blank"
+           rel="noreferrer"
+           ng-hide="App.isFirstRun()">
+        </a>
+        <button
+            class="icon-download svg button-icon-label"
+            title="<?php p($l->t('Export')); ?>"
+            ng-show="App.isFirstRun()"
+            disabled>
+        </button>
+
+        <p class="error" ng-show="Settings.articleImportError">
+            <?php p(
+                $l->t('Error when importing: file does not contain valid JSON')
+            ); ?>
+        </p>
+
+    </div>
+
+    <h3><?php p($l->t('Help')); ?></h3>
+
+    <p>
+        <a href="#/shortcuts/"><?php p($l->t('Keyboard shortcuts')); ?></a>
+    </p>
+
+    <p>
+        <a target="_blank"
+           rel="noreferrer"
+           href="https://github.com/nextcloud/news/tree/master/docs"><?php p($l->t('Documentation')); ?></a>
+    </p>
+    <p>
+        <a target="_blank"
+           rel="noreferrer"
+           href="https://github.com/nextcloud/news/issues/new"><?php p($l->t('Report a bug')); ?></a>
+    </p>
+
+</div>
diff --git a/templates/admin.php b/templates/admin.php
deleted file mode 100644
index cf69c33de..000000000
--- a/templates/admin.php
+++ /dev/null
@@ -1,131 +0,0 @@
-<?php
-script('news', 'admin/Admin');
-style('news', 'admin');
-?>
-
-<div class="section" id="news">
-    <h2>News</h2>
-    <div class="form-line">
-        <p><input type="checkbox" name="news-use-cron-updates"
-               <?php if ($_['useCronUpdates']) p('checked'); ?>>
-            <label for="news-use-cron-updates">
-                <?php p($l->t('Use system cron for updates')); ?>
-            </label>
-        </p>
-        <p>
-            <em><?php p($l->t(
-                'Disable this if you run a custom updater such as the Python ' .
-                'updater included in the app'
-            )); ?></em>
-        </p>
-    </div>
-    <div class="form-line">
-        <p>
-            <label for="news-auto-purge-minimum-interval">
-                <?php p($l->t('Purge interval')); ?></p>
-            </label>
-        <p>
-            <em>
-            <?php p($l->t(
-                'Minimum amount of seconds after deleted feeds and folders ' .
-                'are removed from the database; values below 60 seconds are ' .
-                'ignored'
-            )); ?></em>
-        </p>
-        <p><input type="text" name="news-auto-purge-minimum-interval"
-               value="<?php p($_['autoPurgeMinimumInterval']); ?>"></p>
-    </div>
-    <div class="form-line">
-        <p>
-            <label for="news-auto-purge-count">
-                <?php p($l->t('Maximum read count per feed')); ?>
-            </label>
-        </p>
-        <p>
-            <em>
-            <?php p($l->t(
-                'Defines the maximum amount of articles that can be read per ' .
-                "feed which won't be deleted by the cleanup job; ".
-                'if old articles reappear after being read, increase ' .
-                'this value; negative values such as -1 will turn this ' .
-                'feature off'
-            )); ?></em>
-        </p>
-        <p><input type="text" name="news-auto-purge-count"
-               value="<?php p($_['autoPurgeCount']); ?>"></p>
-    </div>
-    <div class="form-line">
-        <p>
-            <label for="news-max-redirects">
-                <?php p($l->t('Maximum redirects')); ?>
-            </label>
-        </p>
-        <p>
-            <em>
-                <?php p($l->t(
-                    'How many redirects the feed fetcher should follow'
-                )); ?>
-            </em>
-        </p>
-        <p><input type="text" name="news-max-redirects"
-               value="<?php p($_['maxRedirects']); ?>"></p>
-    </div>
-    <div class="form-line">
-        <p>
-            <label for="news-max-size">
-                <?php p($l->t('Maximum feed page size')); ?>
-            </label>
-        </p>
-        <p>
-            <em>
-                <?php p($l->t(
-                    'Maximum feed size in bytes. If the RSS/Atom page is ' .
-                    'bigger than this value, the update will be aborted'
-                )); ?>
-            </em>
-        </p>
-        <p><input type="text" name="news-max-size"
-               value="<?php p($_['maxSize']); ?>"></p>
-    </div>
-    <div class="form-line">
-        <p>
-            <label for="news-feed-fetcher-timeout">
-                <?php p($l->t('Feed fetcher timeout')); ?>
-            </label>
-        </p>
-        <p>
-            <em>
-            <?php p($l->t(
-                'Maximum number of seconds to wait for an RSS or Atom feed ' .
-                'to load; if it takes longer the update will be aborted'
-            )); ?></em>
-        </p>
-        <p><input type="text" name="news-feed-fetcher-timeout"
-               value="<?php p($_['feedFetcherTimeout']); ?>"></p>
-    </div>
-    <div class="form-line">
-        <p>
-            <label for="news-explore-url">
-                <?php p($l->t('Explore Service URL')); ?>
-            </label>
-        </p>
-        <p>
-            <em>
-                <?php p($l->t(
-                    'If given, this service\'s URL will be queried for ' .
-                    'displaying the feeds in the explore feed section. To ' .
-                    'fall back to the built in explore service, leave this ' .
-                    'input empty'
-                )); ?>.
-            </em>
-            <a href="https://github.com/nextcloud/news/tree/master/docs/explore"><?php p($l->t(
-                'For more information check the wiki'
-            )); ?></a>
-        </p>
-        <p><input type="text" name="news-explore-url"
-               value="<?php p($_['exploreUrl']); ?>"></p>
-    </div>
-    <div id="news-saved-message">
-        <span class="msg success"><?php p($l->t('Saved')); ?></span>
-    </div>
-</div>
diff --git a/templates/index.php b/templates/index.php
deleted file mode 100644
index 4b0408af1..000000000
--- a/templates/index.php
+++ /dev/null
@@ -1,99 +0,0 @@
-<?php
-use OCA\News\Plugin\Client\Plugin;
-
-script('news', [
-    'build/app.min'
-]);
-
-style('news', [
-    'app',
-    'content',
-    'custom',
-    'explore',
-    'mobile',
-    'navigation',
-    'settings',
-    'shortcuts'
-]);
-
-// load plugin scripts and styles
-foreach (Plugin::getStyles() as $appName => $fileName) {
-    style($appName, $fileName);
-}
-foreach (Plugin::getScripts() as $appName => $fileName) {
-    script($appName, $fileName);
-}
-?>
-
-    <div id="global-loading"
-        class="icon-loading"
-        ngCloak
-        ng-show="App.loading.isLoading('global')"></div>
-
-    <!-- content -->
-    <script type="text/ng-template" id="content.html">
-        <?php print_unescaped($this->inc('part.content')) ?>
-    </script>
-    <script type="text/ng-template" id="shortcuts.html">
-        <?php print_unescaped($this->inc('part.content.shortcuts')) ?>
-    </script>
-    <script type="text/ng-template" id="explore.html">
-        <?php print_unescaped($this->inc('part.content.explore')) ?>
-