Move templates to vue files, load collections

7 files changed, 0 insertions, 696 deletions

diff --git a/templates/colorpicker.html b/templates/colorpicker.html
deleted file mode 100644
index ade253f0..00000000
--- a/templates/colorpicker.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<ul class="colorpicker-list">
-	<li ng-repeat="color in colors"
-		ng-class="{ selected: (color===selected) }"
-		ng-click="pick(color)"
-		ng-style="{ 'background-color':color}; "></li>
-	<li class="randomcolour"
-		ng-click="randomizeColour()"
-		ng-style="{ 'background-color':random}; ">
-		<span class="icon icon-random"></span>
-	</li>
-</ul>
diff --git a/templates/main.php b/templates/main.php
index 66a0ebce..f988a95b 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -2,255 +2,3 @@
     script('tasks', 'merged');
     style('tasks', 'style');
 ?>
-
-<div id="app-navigation" ng-controller="ListController">
-    <ul id="collections">
-        <li id="collection_{{ collection.id }}"
-            class="collection {{ collection.icon }} reactive"
-            collectionID="{{collection.id}}"
-            ng-repeat="collection in collections"
-            ng-class="{'animate-up': hideCollection(collection.id), active: collection.id==route.collectionID}"
-            dnd-list="draggedTasks"
-            dnd-drop="dropCollection(event, index, item)"
-            dnd-dragover="dragoverCollection(event, index)">
-            <a href="#/collections/{{ collection.id }}" class="sprite">
-                <span class="date" ng-if="collection.id=='today'"><?php p($_['DOM']); ?></span>
-                <span class="title">{{ collection.displayname }}</span>
-            </a>
-            <div class="app-navigation-entry-utils">
-                <ul>
-                    <li class="app-navigation-entry-utils-counter">{{ getCollectionString(collection.id) | counterFormatter }}</li>
-                </ul>
-            </div>
-        </li>
-        <li id="list_{{ calendar.uri }}"
-            class="list with-menu handler editing"
-            calendarID="{{calendar.uri}}"
-            ng-repeat="calendar in calendars"
-            ng-class="{ active: calendar.uri==route.calendarID, edit:route.listparameter == 'name' && route.calendarID == calendar.uri,
-                        caldav: route.listparameter == 'caldav' && route.calendarID == calendar.uri}"
-            dnd-list="draggedTasks"
-            dnd-drop="dropList(event, index, item)"
-            dnd-dragover="dragoverList(event, index)">
-            <div class="app-navigation-entry-bullet" style="background-color: {{ calendar.color }};"></div>
-            <a href="#/calendars/{{ calendar.uri }}" ng-dblclick="startRename(calendar)">
-                <span class="title">{{ calendar.displayname }}</span>
-            </a>
-            <div class="app-navigation-entry-utils">
-                <ul>
-                    <li class="app-navigation-entry-utils-counter">{{ getListCount(calendar.uri,'all') | counterFormatter }}</li>
-                    <li class="app-navigation-entry-utils-menu-button" ng-show="calendar.writable"><button></button></li>
-                </ul>
-            </div>
-            <div class="app-navigation-entry-menu" ng-show="calendar.writable">
-                <ul>
-                    <li>
-                        <a ng-click="startEdit($event, calendar)">
-                            <span class="icon-rename"></span>
-                            <span><?php p($l->t('Edit')); ?></span>
-                        </a>
-                    </li>
-                    <li>
-                        <a ng-click="showCalDAVUrl($event, calendar)">
-                            <span class="icon-public"></span>
-                            <span><?php p($l->t('Link')); ?></span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="{{calendar.exportUrl}}" download="{{calendar.uri}}.ics">
-                            <span class="icon-download"></span>
-                            <span><?php p($l->t('Download')); ?></span>
-                        </a>
-                    </li>
-                    <li confirmation="delete(calendar)" confirmation-message="deleteMessage(calendar)">
-                    </li>
-                </ul>
-            </div>
-            <div class="app-navigation-entry-edit name" ng-class="{error: nameError}">
-                <form>
-                    <input ng-model="calendar.displayname"
-                        class="edit hasTooltip"
-                        type="text"
-                        ng-keyup="checkEdit($event,calendar)"
-                        autofocus-on-insert>
-                    <input type="cancel"
-                        value=""
-                        class="action icon-close"
-                        ng-click="cancelEdit(calendar)"
-                        title="<?php p($l->t('Cancel')); ?>">
-                    <input type="submit"
-                        value=""
-                        class="action icon-checkmark"
-                        ng-click="saveEdit(calendar)"
-                        title="<?php p($l->t('Save')); ?>">
-                </form>
-                <colorpicker class="colorpicker"
-                                selected="calendar.color">
-                </colorpicker>
-            </div>
-            <div class="app-navigation-entry-edit caldav">
-                <form>
-                    <input class="caldav"
-                        ng-value="calendar.caldav"
-                        readonly
-                        type="text"/>
-                    <input type="cancel"
-                        value=""
-                        class="action icon-close"
-                        ng-click="hideCalDAVUrl()"
-                        title="<?php p($l->t('Cancel')); ?>">
-                </form>
-            </div>
-        </li>
-        <li class="newList handler icon-add reactive editing" ng-class="{edit: status.addingList}">
-            <a class="addlist icon sprite"
-                ng-click="startCreate($event)"
-                oc-click-focus="{selector: '#newList', timeout: 0}">
-                <span class="title"><?php p($l->t('Add List...')); ?></span>
-            </a>
-            <div class="app-navigation-entry-edit name" ng-class="{error: nameError}">
-                <form ng-disabled="isAddingList">
-                    <input id="newList"
-                        ng-model="status.newListName"
-                        class="edit hasTooltip"
-                        type="text"
-                        autofocus-on-insert
-                        placeholder="<?php p($l->t('New List')); ?>"
-                        ng-keyup="checkNew($event,status.newListName)">
-                    <input type="cancel"
-                        value=""
-                        class="action icon-close"
-                        ng-click="cancelCreate()"
-                        title="<?php p($l->t('Cancel')); ?>">
-                    <input type="submit"
-                        value=""
-                        class="action icon-checkmark"
-                        ng-click="create($event)"
-                        title="<?php p($l->t('Save')); ?>">
-                </form>
-                <colorpicker class="colorpicker" selected="color"></colorpicker>
-            </div>
-        </li>
-    </ul>
-    <div id="app-settings" ng-controller="SettingsController">
-        <div id="app-settings-header">
-            <button class="settings-button" data-apps-slide-toggle="#app-settings-content">
-                <span><?php p($l->t('Settings')); ?></span>
-            </button>
-        </div>
-        <div id="app-settings-content">
-            <ul>
-                <li>
-                    <label for="startOfWeek"><?php p($l->t('Start of week')); ?></label>
-                    <select id="startOfWeek"
-                        ng-change="setStartOfWeek()"
-                        ng-model="settingsmodel.getById('various').startOfWeek"
-                        ng-options="startOfWeekOption.id as startOfWeekOption.name for startOfWeekOption in startOfWeekOptions">
-                    </select>
-                </li>
-                <li class="headline">
-                    <?php p($l->t('Visibility of Smart Collections')); ?>
-                </li>
-                <li ng-repeat="collection in collections">
-                    <div class="label-container">
-                        <span class="icon {{ collection.icon }}">
-                            <text ng-show="collection.id=='today'"><?php p($_['DOM']); ?></text>
-                        </span>
-                        <label for="visibilityCollection-{{collection.id}}" class="title">{{ collection.displayname }}</label>
-                    </div>
-                    <select id="visibilityCollection-{{collection.id}}"
-                        ng-change="setVisibility(collection.id)"
-                        ng-model="collection.show"
-                        ng-options="collectionOption.id as collectionOption.name for collectionOption in collectionOptions">
-                    </select>
-                </li>
-            </ul>
-        </div>
-    </div>
-</div>
-
-<div id="app-content"
-    ng-controller="TasksController"
-    ng-class="{'with-app-sidebar':route.taskID}">
-    <div class="content-wrapper">
-        <div id="add-task"
-            class="add-task handler"
-            ng-show="showInput()"
-            ng-class="{'focus':status.focusTaskInput}">
-            <form ng-submit="addTask(status.taskName)" name="addTaskForm">
-                <input id="target"
-                    ng-disabled="isAddingTask"
-                    ng-click="focusTaskInput()"
-                    class="transparent"
-                    placeholder="{{ getAddString() }}"
-                    ng-model="status.taskName"
-                    ng-keydown="checkTaskInput($event)"/>
-            </form>
-        </div>
-        <div class="app-navigation-entry-utils">
-            <div class="app-navigation-entry-utils-menu-button" title="<?php p($l->t('Change sort order')); ?>">
-                <button class="sortorder-dropdown-button">
-                    <span class="icon" ng-class="getSortOrderIcon()"></span>
-                    <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                </button>
-            </div>
-        </div>
-        <div class="app-navigation-entry-menu bubble sortorder-dropdown">
-            <ul>
-                <li ng-click="setSortOrder($event, 'default')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'default'}" class="handler">
-                    <a>
-                        <span class="icon icon-list"></span>
-                        <span class="label"><?php p($l->t('Default')); ?></span>
-                        <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                    </a>
-                </li>
-                <li ng-click="setSortOrder($event, 'due')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'due'}">
-                    <a>
-                        <span class="icon icon-calendar"></span>
-                        <span class="label"><?php p($l->t('Due date')); ?></span>
-                        <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                    </a>
-                </li>
-                <li ng-click="setSortOrder($event, 'start')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'start'}">
-                    <a>
-                        <span class="icon icon-calendar"></span>
-                        <span class="label"><?php p($l->t('Start date')); ?></span>
-                        <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                    </a>
-                </li>
-                <li ng-click="setSortOrder($event, 'priority')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'priority'}">
-                    <a>
-                        <span class="icon icon-task-star"></span>
-                        <span class="label"><?php p($l->t('Priority')); ?></span>
-                        <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                    </a>
-                </li>
-                <li ng-click="setSortOrder($event, 'alphabetically')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'alphabetically'}">
-                    <a>
-                        <span class="icon icon-alphabetically"></span>
-                        <span class="label"><?php p($l->t('Alphabetically')); ?></span>
-                        <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                    </a>
-                </li>
-<!--                     <li ng-click="setSortOrder($event, 'manual')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'manual'}">
-                    <a>
-                        <span class="icon icon-manual"></span>
-                        <span class="label"><?php p($l->t('Manually')); ?></span>
-                        <span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
-                    </a>
-                </li> -->
-            </ul>
-        </div>
-        <div class="task-list">
-            <?php print_unescaped($this->inc('part.tasklist')); ?>
-            <?php print_unescaped($this->inc('part.collectionall')); ?>
-            <?php print_unescaped($this->inc('part.collectionweek')); ?>
-        </div>
-    </div>
-</div>
-<div id="app-sidebar" ng-class="{'disappear':!route.taskID}">
-        <?php print_unescaped($this->inc('part.details')); ?>
-</div>
-<script type="text/ng-template" id="part.taskbody">
-    <?php print_unescaped($this->inc('part.taskbody')); ?>
-</script>
diff --git a/templates/part.collectionall.php b/templates/part.collectionall.php
deleted file mode 100644
index 3062c17f..00000000
--- a/templates/part.collectionall.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<!-- <div ng-switch-when="starred || completed || all || today || current"> -->
-<div ng-if="route.collectionID == 'starred' || route.collectionID == 'completed' || route.collectionID == 'all' || route.collectionID == 'today' || route.collectionID == 'current'">
-    <div ng-repeat="calendar in calendars | filter:filterLists()" class="grouped-tasks ui-droppable" rel="{{ calendar.uri }}">
-        <h2 class="heading">
-            <text>{{ calendar.displayname }}</text>
-        </h2>
-        <ol class="tasks"
-            calendarID="{{calendar.uri}}"
-            collectionID="{{route.collectionID}}"
-            type="list"
-            dnd-list="draggedTasks"
-            dnd-drop="dropAsRootTask(event, item, index)"
-            dnd-dragover="dragover(event, index)">
-            <li class="task-item ui-draggable handler"
-                taskID="{{task.uri}}"
-                ng-animate="'animate'"
-                ng-repeat="task in filtered = filteredTasks() | filter:hasNoParent(task) | filter:filterTasks(task,calendar.uri) | filter:filterTasks(task,route.collectionID) | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"
-                ng-click="openDetails(task.uri,$event)"
-                ng-class="{done: task.completed}"
-                dnd-draggable="task"
-                dnd-dragstart="dragStart(event)"
-                dnd-dragend="dragEnd(event)"
-                dnd-effect-allowed="{{ allow(task) }}">
-                <?php print_unescaped($this->inc('part.taskbody')); ?>
-            </li>
-        </ol>
-        <div class="loadmore handler" ng-hide="loadedCompleted(calendar.uri) || route.collectionID != 'completed'">
-            <span ng-click="getCompletedTasks(calendar.uri)"> <?php p($l->t('Load remaining completed tasks.')); ?> </span>
-        </div>
-    </div>
-</div>
diff --git a/templates/part.collectionweek.php b/templates/part.collectionweek.php
deleted file mode 100644
index eb442e0b..00000000
--- a/templates/part.collectionweek.php
+++ /dev/null
@@ -1,27 +0,0 @@
-<div ng-if="route.collectionID=='week'">
-    <div ng-repeat="day in days | filter:dayHasEntry(day)" class="grouped-tasks ui-droppable">
-        <h2 class="heading">
-            <text>{{ day | day  }}</text>
-        </h2>
-        <ol class="tasks"
-            listID=""
-            collectionID="{{route.collectionID}}"
-            type="list"
-            dnd-list="draggedTasks"
-            dnd-drop="dropAsRootTask(event, item, index)"
-            dnd-dragover="dragover(event, index)">
-            <li class="task-item ui-draggable handler"
-                taskID="{{task.uri}}"
-                ng-animate="'animate'"
-                ng-repeat="task in filtered = filteredTasks() | filter:taskAtDay(task,day) | filter:hasNoParent(task) | filter:{'completed':'false'} | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"
-                ng-click="openDetails(task.uri,$event)"
-                ng-class="{done: task.completed}"
-                dnd-draggable="task"
-                dnd-dragstart="dragStart(event)"
-                dnd-dragend="dragEnd(event)"
-                dnd-effect-allowed="{{ allow(task) }}">
-                <?php print_unescaped($this->inc('part.taskbody')); ?>
-            </li>
-        </ol>
-    </div>
-</div>
diff --git a/templates/part.details.php b/templates/part.details.php
deleted file mode 100644
index 59de0723..00000000
--- a/templates/part.details.php
+++ /dev/null
@@ -1,238 +0,0 @@
-<div ng-controller="DetailsController"
-    ng-click="endEdit($event)"
-    class="content-wrapper handler">
-    <div class="flex-container"
-        ng-show="TaskState()=='found'"
-        ng-class="{'disabled': !task.calendar.writable}">
-    	<div class="title" ng-class="{'editing':route.parameter=='name'}">
-            <a class="checkbox reactive"
-                ng-click="toggleCompleted(task)"
-                role="checkbox"
-                aria-checked="{{task.completed}}"
-                aria-label="<?php p($l->t('Task is completed')); ?>">
-            	<span class="icon detail-checkbox" ng-class="{'icon-checkmark':task.completed, 'disabled': !task.calendar.writable}"></span>
-            </a>
-            <a class="star reactive" ng-click="toggleStarred(task)">
-            	<span class="icon icon-task-star"
-                    ng-class="{'icon-task-star-high':task.priority>5,'icon-task-star-medium':task.priority==5,'icon-task-star-low':task.priority > 0 && task.priority < 5, 'disabled': !task.calendar.writable}"></span>
-            </a>
-        	<div class="title-text handler"
-                ng-class="{'strike-through':task.completed}"
-                ng-click="editName($event, task)"
-                oc-click-focus="{selector: '#editName', timeout: 0}"
-                ng-bind-html="task.summary | linky:'_blank':{rel: 'nofollow'}">
-            </div>
-            <div class="expandable-container handler">
-            	<div class="expandingArea active">
-                    <pre><span>{{ task.summary }}</span><br /></pre>
-                    <textarea id="editName"
-                        maxlength="200"
-                        ng-model="task.summary"
-                        ng-keydown="endName($event)"
-                        ng-change="triggerUpdate(task)">
-                    </textarea>
-            	</div>
-            </div>
-        </div>
-        <div class="body">
-            <ul class="sections">
-                <li class="section detail-start handler"
-                    ng-class="{'date':isDue(task.start), 'editing':route.parameter=='startdate', 'high':isOverDue(task.start)}"
-                    ng-click="editStart($event, task)">
-                    <div>
-                        <span class="icon icon-calendar" ng-class="{'icon-calendar-due':isDue(task.start),
-                         'icon-calendar-overdue':isOverDue(task.start)}"></span>
-                        <span class="section-title">
-                            <text>{{ task.start | startDetails }}</text>
-                        </span>
-                        <div class="section-edit">
-                            <input class="datepicker-input medium"
-                                type="text"
-                                key-value=""
-                                placeholder="dd.mm.yyyy"
-                                value="{{ task.start | dateTaskList }}"
-                                datepicker="start">
-                            <input class="timepicker-input medium handler"
-                                ng-hide="task.allDay"
-                                type="text"
-                                key-value=""
-                                placeholder="hh:mm"
-                                value="{{ task.start | timeTaskList }}"
-                                timepicker="start">
-                        </div>
-                   </div>
-                   <div class="utils">
-                        <a>
-                            <span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
-                        </a>
-                        <a class="handler end-edit" ng-click="deleteStartDate(task)">
-                            <span class="icon icon-trash reactive"></span>
-                        </a>
-                    </div>
-                </li>
-                <li class="section detail-date handler"
-                    ng-class="{'date':isDue(task.due), 'editing':route.parameter=='duedate', 'high':isOverDue(task.due)}"
-                    ng-click="editDueDate($event, task)">
-                    <div>
-                    	<span class="icon icon-calendar" ng-class="{'icon-calendar-due':isDue(task.due), 'icon-calendar-overdue':isOverDue(task.due)}"></span>
-                        <span class="section-title">
-                            <text>{{ task.due | dateDetails }}</text>
-                        </span>
-                        <div class="section-edit">
-                            <input class="datepicker-input medium"
-                                type="text"
-                                key-value=""
-                                placeholder="dd.mm.yyyy"
-                                value="{{ task.due | dateTaskList }}"
-                                datepicker="due">
-                            <input class="timepicker-input medium"
-                                ng-hide="task.allDay"
-                                type="text"
-                                key-value=""
-                                placeholder="hh:mm"
-                                value="{{ task.due | timeTaskList }}"
-                                timepicker="due">
-                        </div>
-                    </div>
-                    <div class="utils">
-                        <a>
-                            <span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
-                        </a>
-                        <a class="handler end-edit" ng-click="deleteDueDate(task)">
-                            <span class="icon icon-trash reactive"></span>
-                        </a>
-                    </div>
-                </li>
-                <li class="section detail-all-day handler reactive"
-                    ng-click="toggleAllDay(task)"
-                    ng-if="isAllDayPossible(task)"
-                    role="checkbox"
-                    aria-checked="{{task.allDay}}">
-                    <div>
-                        <span class="icon detail-checkbox" ng-class="{'icon-checkmark': task.allDay, 'disabled': !task.calendar.writable}"></span>
-                        <span class="section-title">
-                            <text><?php p($l->t('All day')); ?></text>
-                        </span>
-                    </div>
-                </li>
-                <li class="section detail-priority handler"
-                    ng-class="{'editing':route.parameter=='priority','high':task.priority>5,'medium':task.priority==5,'low':task.priority > 0 && task.priority < 5, 'date':task.priority>0}"
-                    ng-click="editPriority($event, task)">
-                    <div>
-                        <span class="icon icon-task-star"
-                            ng-class="{'icon-task-star-high':task.priority>5,'icon-task-star-medium':task.priority==5,'icon-task-star-low':task.priority > 0 && task.priority < 5}"></span>
-                        <span class="section-title">
-                            <text>{{ task.priority | priorityDetails}}</text>
-                        </span>
-                        <div class="section-edit">
-                            <input class="priority-input"
-                                type="text"
-                                ng-model="task.priority"
-                                ng-change="triggerUpdate(task)">
-                            <input type="range"
-                                ng-model="task.priority"
-                                min="0"
-                                max="9"
-                                step="1"
-                                ng-change="triggerUpdate(task)">
-                        </div>
-                    </div>
-                    <div class="utils">
-                        <a>
-                            <span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
-                        </a>
-                        <a class="handler end-edit" ng-click="deletePriority(task)">
-                            <span class="icon icon-trash reactive"></span>
-                        </a>
-                </li>
-                <li class="section detail-complete handler"
-                    ng-class="{'editing':route.parameter=='percent', 'date':task.complete>0}"
-                    ng-click="editPercent($event, task)">
-                    <div>
-                        <span class="icon icon-percent" ng-class="{'icon-percent-active':task.complete>0}"></span>
-                        <span class="section-title">
-                            <text>{{ task.complete | percentDetails}}</text>
-                        </span>
-                        <div class="section-edit">
-                            <input class="percent-input"
-                                type="text"
-                                ng-model="task.complete"
-                                ng-change="setPercentComplete(task, task.complete)">
-                            <input type="range"
-                                ng-model="task.complete"
-                                min="0"
-                                max="100"
-                                step="1"
-                                ng-change="setPercentComplete(task, task.complete)">
-                        </div>
-                    </div>
-                    <div class="utils">
-                        <a>
-                            <span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
-                        </a>
-                        <a class="handler end-edit" ng-click="deletePercent(task)">
-                            <span class="icon icon-trash reactive"></span>
-                        </a>
-                    </div>
-                </li>
-                <li class="section detail-categories" ng-class="{'active':task.cats.length>0}">
-                    <div>
-                        <span class="icon icon-tag detail-categories" ng-class="{'icon-tag-active':task.cats.length>0}"></span>
-                    <!-- Edit line 1080 to show placeholder -->
-                        <div class="detail-categories-container">
-                            <ui-select
-                                multiple
-                                tagging
-                                tagging-label="<?php p($l->t('(New category)')); ?>"
-                                ng-model="task.cats"
-                                theme="select2"
-                                ng-disabled="!task.calendar.writable"
-                                style="width: 100%;"
-                                on-remove="removeCategory($item, $model)"
-                                on-select="addCategory($item, $model)">
-                                <ui-select-match placeholder="<?php p($l->t('Select categories...')); ?>">{{$item}}</ui-select-match>
-                                <ui-select-choices repeat="category in settingsmodel.getById('various').categories | filter:$select.search">
-                                  {{category}}
-                                </ui-select-choices>
-                            </ui-select>
-                        </div>
-                    </div>
-                </li>
-                <li class="section detail-note">
-                    <div class="note">
-                    	<div class="note-body selectable handler"
-                            ng-click="editNote($event, task)"
-                            oc-click-focus="{selector: '.expandingArea textarea', timeout: 0}">
-                            <div class="content-fakeable" ng-class="{'editing':route.parameter=='note'}">
-                            	<div class="display-view" ng-bind-html="task.note | linky:'_blank':{rel: 'nofollow'}"></div>
-                                <div class="edit-view">
-                                    <div class="expandingArea active">
-                                    	<pre><span>{{ task.note }}</span><br /><br /></pre>
-                                    	<textarea ng-model="task.note" ng-change="triggerUpdate(task)"></textarea>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </li>
-            </ul>
-        </div>
-        <div class="footer">
-        	<a class="handler left close-all reactive"
-                ng-click="deleteTask(task)"
-                ng-show="task.calendar.writable">
-            	<span class="icon icon-trash"></span>
-            </a>
-            <a class="handler right close-all reactive">
-            	<span class="icon icon-hide"></span>
-            </a>
-        </div>
-    </div>
-    <div ng-show="TaskState()=='loading'" class="notice">
-        <?php p($l->t('Loading the task...')); ?>
-        <div class="loading" style="height: 50px;"></div>
-    </div>
-    <div ng-show="TaskState()==null" class="notice">
-        <?php p($l->t('Task not found!')); ?>
-    </div>
-</div>
diff --git a/templates/part.taskbody.php b/templates/part.taskbody.php
deleted file mode 100644
index 876b4f91..00000000
--- a/templates/part.taskbody.php
+++ /dev/null
@@ -1,87 +0,0 @@
-<div class="task-body"
-    type="task"
-    taskID="{{ task.uri }}"
-    ng-class="{active: route.taskID==task.uri, subtasks: hasSubtasks(task), completedsubtasks: hasCompletedSubtasks(task), subtaskshidden: task.hideSubtasks, attachment: task.note!=''}">
-
-    <div class="percentbar" ng-if="task.complete > 0 ">
-        <div class="percentdone"
-            style="width:{{ task.complete }}%; background-color:{{ task.calendar.color }};"
-            aria-label="{{ task.complete | percentDetails}}">
-        </div>
-    </div>
-
-    <a class="task-checkbox handler"
-        name="toggleCompleted"
-        ng-click="toggleCompleted(task)"
-        role="checkbox"
-        aria-checked="{{task.completed}}"
-        aria-label="<?php p($l->t('Task is completed')); ?>">
-        <span class="icon task-checkbox reactive" ng-class="{'icon-checkmark': task.completed}"></span>
-    </a>
-    <a class="icon task-separator"></a>
-    <a class="task-star handler" ng-click="toggleStarred(task)">
-        <span class="icon icon-task-star right large reactive"ng-class="{'icon-task-star-high':task.priority > 5, 'icon-task-star-medium':task.priority == 5, 'icon-task-star-low':task.priority > 0 && task.priority < 5}">
-        </span>
-    </a>
-    <a class="task-addsubtask handler add-subtask"
-        ng-show="task.calendar.writable"
-        ng-click="showSubtaskInput(task.uid)"
-        oc-click-focus="{selector: '.add-subtask input', timeout: 0}">
-        <span class="icon icon-add right large reactive" title="<?php p($l->t('add a subtask to')); ?> {{ task.summary }}"></span>
-    </a>
-    <a class="handler" ng-click="toggleSubtasks(task)">
-        <span class="icon right large subtasks reactive"
-            ng-class="task.hideSubtasks ? 'icon-subtasks-hidden' : 'icon-subtasks-visible'"
-            title="<?php p($l->t('Toggle subtasks')); ?>">
-        </span>
-    </a>
-    <a class="handler" ng-click="toggleCompletedSubtasks(task)">
-        <span class="icon icon-toggle right large toggle-completed-subtasks reactive"
-            ng-class="{'active': !task.hideCompletedSubtasks}"
-            title="<?php p($l->t('Toggle completed subtasks')); ?>">
-        </span>
-    </a>
-    <a>
-        <span class="icon icon-note right large"></span>
-    </a>
-    <a class="duedate" ng-class="{overdue: TasksModel.overdue(task.due)}">{{ task.due | dateTaskList }}</a>
-    <a ng-show="route.collectionID=='week'" class="listname" >{{ task.calendar.displayname }}</a>
-    <div class="title-wrapper">
-        <span class="title" ng-bind-html="task.summary | linky:'_blank':{rel: 'nofollow'}"></span>
-        <span class="categories-list">
-            <ul>
-                <li ng-repeat="category in task.categories"><span>{{ category }}</span></li>
-            </ul>
-        </span>
-    </div>
-</div>
-<div class="subtasks-container"
-    ng-class="{subtaskshidden: hideSubtasks(task)}">
-    <ol dnd-list="draggedTasks"
-        calendarID="{{task.calendar.uri}}"
-        dnd-drop="dropAsSubtask(event, item, index)"
-        dnd-dragover="dragover(event, index)">
-        <li class="task-item ui-draggable handler add-subtask"
-            ng-show="status.addSubtaskTo == task.uid">
-            <form ng-submit="addTask(status.subtaskName,task.uid,task.calendar,task)" name="addTaskForm">
-                <input class="transparent"
-                    placeholder="{{ getSubAddString(task.summary) }}"
-                    ng-disabled="isAddingTask"
-                    ng-click="focusInput()"
-                    ng-model="status.subtaskName"
-                    ng-keydown="checkTaskInput($event)"/>
-            </form>
-        </li>
-        <li taskID="{{ task.uri }}"
-            class="task-item ui-draggable handler subtask"
-            ng-repeat="task in getSubTasks(filtered,task) | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"
-            ng-click="openDetails(task.uri,$event)"
-            ng-class="{done: task.completed}"
-            ng-include="'part.taskbody'"
-            dnd-draggable="task"
-            dnd-dragstart="dragStart(event)"
-            dnd-dragend="dragEnd(event)"
-            dnd-effect-allowed="{{ allow(task) }}">
-        </li>
-    </ol>
-</div>
diff --git a/templates/part.tasklist.php b/templates/part.tasklist.php
deleted file mode 100644
index 12b7824a..00000000
--- a/templates/part.tasklist.php
+++ /dev/null
@@ -1,50 +0,0 @@
-<!-- <div ng-switch-default> -->
-<div ng-if="route.collectionID != 'week' && route.collectionID != 'starred' && route.collectionID != 'completed' && route.collectionID != 'all' && route.collectionID != 'today' && route.collectionID != 'current'">
-    <div class="grouped-tasks"
-         ng-class="{'completed-hidden':!settingsmodel.getById('various').showHidden}">
-        <ol class="tasks"
-            calendarID="{{route.calendarID}}"
-            collectionID="uncompleted"
-            type="list"
-            dnd-list="draggedTasks"
-            dnd-drop="dropAsRootTask(event, item, index)"
-            dnd-dragover="dragover(event, index)">
-            <li class="task-item ui-draggable handler"
-                taskID="{{ task.uri }}"
-                ng-repeat="task in filtered = filteredTasks() | filter:hasNoParent(task) | filter:filterTasks(task,route.calendarID) | filter:{'completed':'false'} | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"
-                ng-click="openDetails(task.uri,$event)"
-                ng-class="{done: task.completed}"
-                dnd-draggable="task"
-                dnd-dragstart="dragStart(event)"
-                dnd-dragend="dragEnd(event)"
-                dnd-effect-allowed="{{ allow(task) }}">
-                <?php print_unescaped($this->inc('part.taskbody')); ?>
-            </li>
-        </ol>
-        <h2 class="heading-hiddentasks icon-triangle-s handler" ng-show="getCount(route.calendarID,'completed')" ng-click="toggleHidden()">
-            {{ getCountString(route.calendarID,'completed') }}
-        </h2>
-        <ol class="completed-tasks"
-            calendarID="{{route.calendarID}}"
-            collectionID="completed"
-            type="list"
-            dnd-list="draggedTasks"
-            dnd-drop="dropAsRootTask(event, item, index)"
-            dnd-dragover="dragover(event, index)">
-            <li class="task-item handler"
-                taskID="{{ task.uri }}"
-                ng-repeat="task in filtered = filteredTasks() | filter:hasNoParent(task) | filter:filterTasks(task,route.calendarID) | filter:{'completed':true} | orderBy:'completed_date':true"
-                ng-click="openDetails(task.uri,$event)"
-                ng-class="{done: task.completed}"
-                dnd-draggable="task"
-                dnd-dragstart="dragStart(event)"
-                dnd-dragend="dragEnd(event)"
-                dnd-effect-allowed="{{ allow(task) }}">
-                <?php print_unescaped($this->inc('part.taskbody')); ?>
-            </li>
-        </ol>
-        <div class="loadmore handler" ng-hide="loadedCompleted(route.calendarID)">
-            <span ng-click="getCompletedTasks(route.calendarID)"><?php p($l->t('Load remaining completed tasks.')); ?></span>
-        </div>
-    </div>
-</div>