From f2221efe7a1f3625e76b2b5f317276216238a7b8 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 7 Sep 2017 18:48:13 +0200
Subject: [PATCH 001/110] First try of backbone/marionette framework

---
 css/bookmarks.css  | 450 ++---------------------------------------
 js/bookmarks.js    | 491 ++++++---------------------------------------
 templates/main.php |   3 +
 3 files changed, 78 insertions(+), 866 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 7e553dc6b..b56f3b721 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,438 +1,14 @@
-input.disabled, input.disabled:hover, input.disabled:focus {
-    cursor: not-allowed;
-    background-color: #ddd;
-    color: gray;
-}
-#settingsbtn { background: transparent; color:#666;
-               border-bottom: 1px solid #ddd; border-top: 1px solid #fff; }
-#settingsbtn:hover { background:#dbdbdb !important; color:#999;
-                     border-bottom: 1px solid #CCCCCC; border-top: 1px solid #D4D4D4; }
-#settingsbtn img { width: 18px; height: 18px; margin: 10px; }
-
-
-.bookmarks_headline {
-    font-size: large;
-    font-weight: bold;
-    margin-left: 2em;
-    padding: 2.5ex 0.5ex;
-}
-
-.bookmarks_menu {
-    margin-left: 1.5em;
-    padding: 0.5ex;
-}
-
-.bookmarks_list, #firstrun {
-    overflow: auto;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    height: 100%;
-}
-
-#add_form {
-    padding-bottom: 2em;
-}
-
-#add_form_loading {
-    visibility: hidden;
-    float: right;
-    margin: 8px;
-}
-
-#add_form input {
-    margin: 0.3em;
-}
-#add_url {
-    width: 98%;
-}
-.bookmarks_addBml {
-    text-decoration: underline;
-}
-#bookmark_add_submit {
-    background-color: transparent;
-    border: none;
-    position: absolute;
-    right: 0;
-    top: 0;
-    opacity: .5;
-    padding: 17px 14px;
-}
-
-.bookmarks_label {
-    width: 7em;
-    display: inline-block;
-    text-align: right;
-}
-
-.bookmarks_input {
-    width: 8em;
-}
-
-.bookmark_actions {
-    position: absolute;
-    right: 1em;
-    top: 12px;
-    display: none;
-}
-.bookmark_actions span { margin: 0 0.4em; }
-.bookmark_actions img { opacity: 0.3;}
-.bookmark_actions img:hover { opacity: 1; cursor: pointer; }
-.bookmark_edit img {opacity:0.3;}
-.bookmark_edit img:hover {cursor: pointer; opacity: 1;}
-
-.bookmark_single {
-    position: relative;
-    padding: 0.2em 1em;
-    min-height: 3em;
-    border-bottom: 1px solid #DDD;
-    -webkit-transition:background-color 500ms; -moz-transition:background-color 500ms; -o-transition:background-color 500ms; transition:background-color 500ms;
-}
-
-.bookmark_single:hover {
-    background-color:#f8f8f8;
-}
-
-.bookmark_single:hover .bookmark_actions {
-    display: block;
-}
-
-.bookmark_title {
-    font-weight: bold;
-    display: block;
-    margin-right: 0.8em;
-    margin-top:0.7em;
-}
-
-.bookmark_title a {
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: inline-block;
-    max-width: 74%;
-}
-
-.bookmark_single:hover .bookmark_title .bookmark_edit_btn {
-    display:inline-block;
-}
-
-.bm_view_list .bookmark_tags {
-    position: absolute;
-    top: 0.5em;
-    right: 6em;
-    text-align: right;
-}
-
-#app-navigation > ul > li {
-  display: block !important;
-}
-
-.bookmark_tags {
-    left:0%;
-    position: relative;
-    width: 75%;
-}
-.bookmark_tag {
-    display: inline-block;
-    color: white;
-    margin: 0.2em 0.2em;
-    padding: 0 0.4em;
-    background-color: #1D2D44;
-    border-radius: 0.4em;
-    opacity: 0.2;
-}
-.bookmark_tag:hover { opacity: 0.5; }
-
-.loading_meta {
-    display: none;
-    margin-left: 5px;
-}
-
-.addBm {
-    background: none repeat scroll 0 0 #F8F8F8;
-    border-radius: 0.5em 0.5em 0.5em 0.5em;
-    color: #555555;
-    margin: 1em;
-    padding: 0.5em 1em;
-    text-shadow: 0 1px 0 #FFFFFF;
-    width: 500px;
-
-}
-.bm_desc {
-    width:90%;
-}
-.addBm h1 {
-    font-weight: bold;
-    border-bottom: 1px solid #BABABA;
-}
-
-
-.addBm fieldset > ul > li {
-    margin-top: 1em;
-}
-.addBm label {
-    display:block;
-    width:100%;
-}
-.addBm .is_public_label {
-    display: inline;
-
-}
-.addBm fieldset input[type="text"], .addBm textarea {
-    width:100%;
-}
-.addBm textarea{
-    min-width:250px;
-}
-.addBm .close_btn
-{
-    height: 18px;
-    margin: -20px 0 0;
-    padding: 1px;
-    float:right;
-    width: 19px;
-}
-.addBm .submit {
-    float: right;
-}
-
-.addBm ul.tagit { background:white; }
-
-.addBm input.ui-autocomplete-input,  #tag_filter input.ui-autocomplete-input, .bookmark_form_tags input.ui-autocomplete-input{
-    box-shadow:none;
-
-}
-
-ul.tagit li.tagit-new {
-    padding-left: 0em;
-}
-
-#tag_select_label{
-    display: block;
-    text-align: center;
-    margin-top: 10px;
-    cursor: default;
-}
-
-li.tag_list {
-    padding-left: 3px;
-    padding-right: 3px;
-    overflow: hidden;
-}
-
-li.tag_list a {
-    display: inline !important;
-    padding: 5px 11px 5px 11px !important;
-    border: 1px solid transparent;
-}
-
-li.tag_list li:hover > a {
-    background: none repeat scroll 0 0 #dee7f8 !important;
-    border: 1px solid #cad8f3;
-    border-radius: 6px;
-}
-
-.tag_list em , .share_list em{
-    float:right;
-    display:block;
-}
-
-.tags_actions {
-    margin-left: 0.5em;
-    display: inline;
-    line-height: 44px;
-}
-
-.tags_actions > span {
-    display:none;
-    float:right;
-}
-li:hover > .tags_actions > span {
-    display:inline;
-}
-li:hover > .tags_actions > em { display : none; }
-
-#tag_filter li, #tag_filter li:hover {
-    background: none repeat scroll 0 0 #F8F8F8;
-}
-#tag_filter .tagit {
-    display: inline-block;
-    margin: 0.3em;
-}
-#tag_filter ul.tagit > li.tagit-new {
-    padding:0;
-}
-#tag_filter ul.tagit li.tagit-choice {
-    background: none repeat scroll 0 0 #DEE7F8;
-    padding: 0.2em 18px 0.2em 0.5em;
-    width: auto;
-}
-
-#tag_filter a {
-    display: inline;
-    float: none;
-    margin: 0;
-    padding: 0;
-}
-
-#tag_filter ul li:hover > a {
-    background-color: transparent;
-}
-
-#tag_filter ul.tagit li.tagit-choice .close{
-    margin-top: -8px;
-    cursor: pointer;
-    margin-top: -8px;
-    top: 50%;
-    padding-left: 0px !important;
-}
-
-#tag_filter ul.tagit li.tagit-choice .close span{
-    text-align: right;
-}
-
-ul.tagit li.tagit-choice .close .text-icon {
-    display: block !important;
-}
-
-.bookmark_desc{
-    padding-left:0.25em;
-    padding-bottom:0.25em;
-    white-space:nowrap;
-    text-overflow:ellipsis;
-    overflow:hidden;
-    display:block;
-    font-weight:500;
-    /* 	z-index: -10; */
-}
-.bookmark_date, .bookmark_submit {
-    font-size:small;
-    position: absolute;
-    right: 6em;
-    color:gray;
-    /* 	margin-top:2.5em; */
-    margin-right: 0.2em;
-    top:0.8em;
-}
-
-/*
-.bm_view_img .bookmark_single:hover .bookmark_url{
-        display:block;
-}
-.bm_view_img .bookmark_single .bookmark_url{
-        display:block;
-}
-*/
-.bookmark_single:hover .bookmark_url { display: inline;  }
-.bookmark_single:hover .bookmark_url a[href]{ color:gray; }
-
-.bookmark_url { display: none; }
-.bookmark_form_title {
-    float: left;
-    width:25%;
-}
-
-.bookmark_form_url {
-    float:left;
-    width:25%;
-}
-
-.bookmark_form_tags {
-    width:30%;
-    float:left;
-}
-
-
-.bookmark_form_desc {
-    width:50%;
-    padding-top:100px;
-}
-
-.bookmark_form_desc textarea {
-    margin-top:-3.4em;
-}
-
-.bookmark_form_title input, .bookmark_form_url input  {
-    width: 89%;
-}
-.bookmark_form_desc textarea {
-    width: 94.5%;
-}
-
-.bookmark_single .bookmark_edit_btn {
-    visibility:hidden;
-    width: 16px;
-}
-
-.bookmark_single:hover .bookmark_edit_btn {
-    visibility: visible;
-}
-
-.bookmark_single:focus .bookmark_edit_btn {
-    visibility: visible;
-    opacity:1;
-}
-
-.bookmark_single_form {
-    padding: 20px 8px;
-    border-bottom: 1px solid #DDD;
-}
-
-.bookmark_single_form .tagit{
-    /* 	width: 80%; */
-    box-shadow: 0 1px 1px #FFFFFF, 0 1px 0 #BBBBBB inset;
-    /* 	margin: 3px; */
-    /* 	height:6.4em; */
-}
-.bookmark_form_submit {
-    margin-left: 4px;
-}
-.bookmark_form_submit .reset {
-    float: right;
-}
-
-.bm_view_img .bookmark_actions {
-    bottom: 0.7em;
-    display: block;
-    position: absolute;
-    right: 1em;
-    top: auto;
-}
-
-#bm_setting_panel {
-    background-color: #eee;
-    padding: 1em;
-    height: 100%;
-    /* 	display:none; */
-}
-/* .open #bm_setting_panel { display:block; } */
-
-#bm_setting_panel legend{
-    margin-top: 0.5em;
-}
-
-#bookmarklet_hint {
-    margin-bottom: 6px;
-}
-
-#bm_import {
-    opacity: 0;
-    position: absolute;
-    width: 90px;
-}
-
-#bm_import:hover ~ button#bm_import_submit {
-    background-color: rgba(250, 250, 250, 0.9);
-    color: #333;
-}
-
-#import_bookmark {
-    margin-top: 10px;
-}
-
-#import_bookmark .personalblock {
-    margin-top: 1em;
-}
-#app-navigation a.bookmarklet {
-    margin-top: 5px;
-    padding: 0 5px 2px;
+.bookmarks {
+  padding: .5cm;
+}
+.bookmark-card {
+  width: 5cm;
+  height: 5cm;
+  float: left;
+  margin: 0 .5cm .5cm 0;
+}
+.bookmark-card h1 {
+  font-weight: bold;
+  font-family: sans-serif;
+  font-size: .3cm;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 5bbff687c..219f2fffd 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -1,429 +1,62 @@
-var bookmarksPage = 0;
-var bookmarksLoading = false;
-var dialog;
-var bookmarksSorting = 'bookmarks_sorting_recent';
-var fullTags = [];
-var ajaxCallCount = 0;
-
-$(document).ready(function () {
-	getTags();
-	watchUrlField();
-	$('#bm_import').change(attachSettingEvent);
-	$('#add_url').on('keydown keyup change click', watchUrlField);
-	$('#app-settings').on('click keydown', toggleSettings);
-	$('#bm_export').click(exportBm);
-	$('#emptycontent-setting').click(function () {
-		if (!$('#app-settings').hasClass('open')) {
-			$('#app-settings').click();
-		}
-	});
-	$('.bookmarks_list').scroll(updateOnBottom).empty();
-	$('#tag_filter input').tagit({
-		allowSpaces: true,
-		availableTags: fullTags,
-		onTagFinishRemoved: filterTagsChanged,
-		placeholderText: t('bookmarks', 'Filter by tag')
-	}).tagit('option', 'onTagAdded', filterTagsChanged);
-	getBookmarks();
-});
-
-function getTags() {
-	jQuery.ajax({
-		url: 'tag',
-		success: function (result) {
-			fullTags = result;
-		},
-		async: false
-	});
-}
-
-var formatString = (function () {
-	var replacer = function (context) {
-		return function (s, name) {
-			return context[name];
-		};
-	};
-
-	return function (input, context) {
-		return input.replace(/\{(\w+)\}/g, replacer(context));
-	};
-})();
-
-function increaseAjaxCallCount() {
-	ajaxCallCount++;
-	if (ajaxCallCount - 1 === 0) {
-		updateLoadingAnimation();
-	}
-}
-
-function decreaseAjaxCallCount() {
-	if (ajaxCallCount > 0) {
-		ajaxCallCount--;
-		updateLoadingAnimation();
-	}
-}
-
-function updateLoadingAnimation() {
-	if (ajaxCallCount === 0) {
-		$('#bookmark_add_submit').removeClass('icon-loading-small');
-		$('#bookmark_add_submit').addClass('icon-add');
-	} else {
-		$('#bookmark_add_submit').removeClass('icon-add');
-		$('#bookmark_add_submit').addClass('icon-loading-small');
-	}
-}
-
-function watchClickInSetting(e) {
-	if ($('#app-settings').find($(e.target)).length === 0) {
-		toggleSettings();
-	}
-}
-
-function checkURL(url) {
-	if (url.substring(0, 3) === "htt") {
-		return url;
-	}
-	return "http://" + url;
-}
-
-function toggleSettings() {
-	if ($('#app-settings').hasClass('open')) { //Close
-		$('#app-settings').switchClass("open", "");
-		$('body').unbind('click', watchClickInSetting);
-	}
-	else {
-		$('#app-settings').switchClass("", "open");
-		$('body').bind('click', watchClickInSetting);
-	}
-}
-function addFilterTag(event) {
-	event.preventDefault();
-	$('#tag_filter input').tagit('createTag', $(this).text());
-}
-
-function updateTagsList(tag) {
-	var html = tmpl("tag_tmpl", tag);
-	$('.tag_list').append(html);
-}
-
-function filterTagsChanged()
-{
-	$('#bookmarkFilterTag').val($('#tag_filter input').val());
-	$('.bookmarks_list').empty();
-	bookmarksPage = 0;
-	getBookmarks();
-}
-function getBookmarks() {
-	if (bookmarksLoading) {
-		//have patience :)
-		return;
-	}
-	increaseAjaxCallCount();
-	bookmarksLoading = true;
-	//Update Rel Tags if first page
-	if (bookmarksPage === 0) {
-
-		$.ajax({
-			type: 'GET',
-			url: 'bookmark',
-			data: {type: 'rel_tags', tag: $('#bookmarkFilterTag').val(), page: bookmarksPage, sort: bookmarksSorting},
-			success: function (tags) {
-				$('.tag_list').empty();
-				for (var i in tags.data) {
-					updateTagsList(tags.data[i]);
-				}
-				$('.tag_list .tag_edit').click(renameTag);
-				$('.tag_list .tag_delete').click(deleteTag);
-				$('.tag_list a.tag').click(addFilterTag);
-
-
-			}
-		});
-	}
-	$.ajax({
-		type: 'GET',
-		url: 'bookmark',
-		data: {type: 'bookmark', tag: $('#bookmarkFilterTag').val(), page: bookmarksPage, conjunction: 'and', sort: bookmarksSorting},
-		complete: function () {
-			decreaseAjaxCallCount();
-		},
-		success: function (bookmarks) {
-			if (bookmarks.data.length) {
-				bookmarksPage += 1;
-			}
-			$('.bookmark_link').unbind('click', recordClick);
-			$('.bookmark_delete').unbind('click', delBookmark);
-			$('.bookmark_edit').unbind('click', editBookmark);
-
-			for (var i in bookmarks.data) {
-				updateBookmarksList(bookmarks.data[i]);
-			}
-			checkEmpty();
-
-			$('.bookmark_link').click(recordClick);
-			$('.bookmark_delete').click(delBookmark);
-			$('.bookmark_edit').click(editBookmark);
-
-			bookmarksLoading = false;
-			if (bookmarks.data.length) {
-				updateOnBottom();
-			}
-		}
-	});
-}
-
-function watchUrlField() {
-	var form = $('#add_form');
-	var el = $('#add_url');
-	var button = $('#bookmark_add_submit');
-	form.unbind('submit');
-	if (!acceptUrl(el.val())) {
-		form.bind('submit', function (e) {
-			e.preventDefault();
-		});
-		button.addClass('disabled');
-	}
-	else {
-		button.removeClass('disabled');
-		form.bind('submit', addBookmark);
-	}
-}
-
-function acceptUrl(url) {
-	return url.replace(/^\s+/g, '').replace(/\s+$/g, '') !== '';
-}
-
-function addBookmark(event) {
-	event.preventDefault();
-	var url = $('#add_url').val();
-	//If trim is empty
-	if (!acceptUrl(url)) {
-		return;
-	}
-
-	$('#add_url').val('');
-	var bookmark = {url: url, description: '', title: '', from_own: 0, added_date: new Date()};
-	increaseAjaxCallCount();
-	$.ajax({
-		type: 'POST',
-		url: 'bookmark',
-		data: bookmark,
-		complete: function () {
-			decreaseAjaxCallCount();
-		},
-		success: function (data) {
-			if (data.status === 'success') {
-				// First remove old BM if exists
-				$('.bookmark_single').filterAttr('data-id', data.item.id).remove();
-
-				var bookmark = $.extend({}, bookmark, data.item);
-				updateBookmarksList(bookmark, 'prepend');
-				checkEmpty();
-				watchUrlField();
-			}
-		},
-		error: function () {
-			OC.Notification.showTemporary(t('bookmarks', 'Could not add bookmark.'));
-		}
-	});
-}
-
-function delBookmark() {
-	var record = $(this).parent().parent();
-	OC.dialogs.confirm(t('bookmarks', 'Are you sure you want to remove this bookmark?'),
-			t('bookmarks', 'Warning'), function (answer) {
-		if (answer) {
-			$.ajax({
-				type: 'DELETE',
-				url: 'bookmark/' + record.data('id'),
-				success: function (data) {
-					if (data.status === 'success') {
-						record.remove();
-						checkEmpty();
-					}
-				}
-			});
-		}
-	});
-}
-
-function checkEmpty() {
-	if ($('.bookmarks_list').children().length === 0) {
-		$("#emptycontent").show();
-		$("#bm_export").addClass('disabled');
-		$('.bookmarks_list').hide();
-	} else {
-		$("#emptycontent").hide();
-		$("#bm_export").removeClass('disabled');
-		$('.bookmarks_list').show();
-	}
-}
-function editBookmark() {
-	if ($('.bookmark_single_form').length) {
-		$('.bookmark_single_form .reset').click();
-	}
-	var record = $(this).parent().parent();
-	var bookmark = record.data('record');
-	var html = tmpl("item_form_tmpl", bookmark);
-
-	record.after(html);
-	record.hide();
-	var rec_form = record.next().find('form');
-	rec_form.find('.bookmark_form_tags ul').tagit({
-		allowSpaces: true,
-		availableTags: fullTags,
-		placeholderText: t('bookmarks', 'Tags')
-	});
-
-	rec_form.find('.reset').bind('click', cancelBookmark);
-	rec_form.bind('submit', function (event) {
-		event.preventDefault();
-		var form_values = $(this).serialize();
-		if(form_values.indexOf('item%5Btags%5D') === -1) {
-			// if not tag is selected, the input field does not exist, so
-			// we need to manually insert an empty array
-			form_values += "&item%5Btags%5D%5B%5D=";
-		}
-		$.ajax({
-			type: 'PUT',
-			url: $(this).attr('action') + "/" + this.elements['record_id'].value,
-			data: form_values,
-			success: function (data) {
-				if (data.status === 'success') {
-					//@TODO : do better reaction than reloading the page
-					filterTagsChanged();
-				} else { // On failure
-					//@TODO : show error message?
-				}
-			}
-		});
-	});
-}
-
-function cancelBookmark(event) {
-	event.preventDefault();
-	var rec_form = $(this).closest('form').parent();
-	rec_form.prev().show();
-	rec_form.remove();
-}
-
-function updateBookmarksList(bookmark, position) {
-	position = typeof position !== 'undefined' ? position : 'append';
-	bookmark = $.extend({title: '', description: '', added_date: new Date('now'), tags: []}, bookmark);
-	var tags = bookmark.tags;
-	var taglist = '';
-	for (var i = 0, len = tags.length; i < len; ++i) {
-		if (tags[i] !== '')
-			taglist = taglist + '<a class="bookmark_tag" href="#">' + escapeHTML(tags[i]) + '</a> ';
-	}
-	if (!hasProtocol(bookmark.url)) {
-		bookmark.url = 'http://' + bookmark.url;
-	}
-
-	if (bookmark.added) {
-		bookmark.added_date.setTime(parseInt(bookmark.added) * 1000);
-	}
-
-	if (!bookmark.title)
-		bookmark.title = '';
-
-	var html = tmpl("item_tmpl", bookmark);
-	if (position === "prepend") {
-		$('.bookmarks_list').prepend(html);
-	} else {
-		$('.bookmarks_list').append(html);
-	}
-	var line = $('.bookmark_single[data-id="' + bookmark.id + '"]');
-	line.data('record', bookmark);
-	if (taglist !== '') {
-		line.append('<p class="bookmark_tags">' + taglist + '</p>');
-	}
-	line.find('a.bookmark_tag').bind('click', addFilterTag);
-	line.find('.bookmark_link').click(recordClick);
-	line.find('.bookmark_delete').click(delBookmark);
-	line.find('.bookmark_edit').click(editBookmark);
-
-}
-
-function updateOnBottom() {
-	//check wether user is on bottom of the page
-	var top = $('.bookmarks_list>:last-child').position().top;
-	var height = $('.bookmarks_list').height();
-	// use a bit of margin to begin loading before we are really at the
-	// bottom
-	if (top < height * 1.2) {
-		getBookmarks();
-	}
-}
-
-function recordClick() {
-	$.ajax({
-		type: 'POST',
-		url: 'bookmark/click',
-		data: 'url=' + encodeURIComponent($(this).attr('href'))
-	});
-}
-
-function hasProtocol(url) {
-	var regexp = /(ftp|http|https|sftp)/;
-	return regexp.test(url);
-}
-
-function renameTag() {
-	if ($('input[name="tag_new_name"]').length)
-		return; // Do nothing if a tag is currenlty edited
-	var tagElement = $(this).closest('li');
-	tagElement.append('<form><input name="tag_new_name" type="text"></form>');
-	var form = tagElement.find('form');
-	//tag_el.find('.tags_actions').hide();
-	var tagName = tagElement.find('.tag').hide().text();
-	tagElement.find('input').val(tagName).focus().bind('blur', function () {
-		form.trigger('submit');
-	});
-	form.bind('submit', submitTagName);
-}
-
-function submitTagName(event) {
-	event.preventDefault();
-	var tagElement = $(this).closest('li');
-	var newTagName = tagElement.find('input').val();
-	var oldTagName = tagElement.find('.tag').show().text();
-	//tag_el.find('.tag_edit').show();
-	//tag_el.find('.tags_actions').show();
-	tagElement.find('input').unbind('blur');
-	tagElement.find('form').unbind('submit').remove();
-
-	if (newTagName !== oldTagName && newTagName !== '') {
-		//submit
-		$.ajax({
-			type: 'POST',
-			url: 'tag',
-			data: {old_name: oldTagName, new_name: newTagName},
-			success: function (bookmarks) {
-				if (bookmarks.status === 'success') {
-					filterTagsChanged();
-				}
-			}
-		});
-	}
-}
-
-function deleteTag() {
-	var tag_el = $(this).closest('li');
-	var old_tag_name = tag_el.find('.tag').show().text();
-	OC.dialogs.confirm(t('bookmarks', 'Are you sure you want to remove this tag from every entry?'),
-			t('bookmarks', 'Warning'), function (answer) {
-		if (answer) {
-			$.ajax({
-				type: 'DELETE',
-				url: 'tag',
-				data: {old_name: old_tag_name},
-				success: function (bookmarks) {
-					if (bookmarks.status === 'success') {
-						filterTagsChanged();
-					}
-				}
-			});
-		}
-	});
-}
+var Backbone = OC.Backbone
+
+var Bookmark = Backbone.Model.extend({
+  defaults: {
+    id: '',
+    url: '',
+    title: '',
+    description: '',
+    tags: Tags
+  }
+})
+
+var Bookmarks = Backbone.Collection.extend({
+  model: Bookmark
+, url: 'bookmark'
+})
+
+var Tag = Backbone.Model.extend({
+  id: '',
+  title: ''
+})
+
+var Tags = Backbone.Collection.extend({
+  model: Tag
+, url: 'tag'
+})
+var BookmarkCardView = Marionette.View.extend({
+  template: _.template('<h1><%- title %></h1><h2><%- new URL(url).host %></h2>'),
+  tagName: "div",
+  className: "bookmark-card",
+  events: {
+    "click": "open",
+  },
+  initialize: function() {
+    this.listenTo(this.model, "change", this.render);
+  },
+})
+
+var BookmarksView = Marionette.CollectionView.extend({
+  tagName: "div"
+, className: 'bookmarks'
+, childView: BookmarkCardView
+})
+
+
+var _sync = Backbone.sync
+Backbone.sync = function(method, model, options) {
+  _sync(method, model, _.extend({}, options, {
+    success: function(json) {
+      console.log(json)
+      if (!(model instanceof Tags)) options.success(json.data)
+      else options.success(json)
+    }
+  }))
+}
+
+var bookmarks = new Bookmarks
+var view = new BookmarksView({collection: bookmarks})
+$('#app-content').empty().append(view.el)
+bookmarks.fetch({success: function() {
+  view.render()
+}})
diff --git a/templates/main.php b/templates/main.php
index de7de6b29..d67007152 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -3,6 +3,9 @@
 script('bookmarks', 'bookmarks');
 style('bookmarks', 'bookmarks');
 
+
+script('bookmarks', '3rdparty/backbone.radio');
+script('bookmarks', '3rdparty/backbone.marionette.min');
 script('bookmarks', '3rdparty/tag-it');
 script('bookmarks', '3rdparty/js_tpl');
 style('bookmarks', '3rdparty/jquery.tagit');

From 1b14643c7163b4fed1e37206830573fc4d2e8912 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 9 Sep 2017 00:08:20 +0200
Subject: [PATCH 002/110] Add emptyView

---
 css/bookmarks.css | 17 +++++++++++------
 js/bookmarks.js   | 12 +++++++++++-
 2 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index b56f3b721..1fe3f3a52 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,14 +1,19 @@
-.bookmarks {
-  padding: .5cm;
+.bookmarks-empty {
+  width: 4cm;
+  margin: 30% auto;
 }
+
 .bookmark-card {
   width: 5cm;
   height: 5cm;
   float: left;
-  margin: 0 .5cm .5cm 0;
+  padding: .5cm;
+  border-right: 1px solid #ebebeb;
+  border-bottom: 1px solid #ebebeb;
 }
 .bookmark-card h1 {
-  font-weight: bold;
-  font-family: sans-serif;
-  font-size: .3cm;
+  font-size: .5cm;
+}
+.bookmark-card h2 {
+  font-size: .4cm;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 219f2fffd..fae1b6563 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -40,6 +40,13 @@ var BookmarksView = Marionette.CollectionView.extend({
   tagName: "div"
 , className: 'bookmarks'
 , childView: BookmarkCardView
+, emptyView: EmptyBookmarksView
+})
+
+var EmptyBookmarksView = Marionette.CollectionView.extend({
+  template: _.template('<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>')
+, tagName: "div"
+, className: 'bookmarks-empty'
 })
 
 
@@ -56,7 +63,10 @@ Backbone.sync = function(method, model, options) {
 
 var bookmarks = new Bookmarks
 var view = new BookmarksView({collection: bookmarks})
-$('#app-content').empty().append(view.el)
 bookmarks.fetch({success: function() {
   view.render()
 }})
+
+$(function() {
+  $('#app-content').append(view.el)
+})

From 0fb93c34e0604016a2d6d96c64dcb8f7cf7e15c8 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 9 Sep 2017 01:35:47 +0200
Subject: [PATCH 003/110] More structure, replace whole template

---
 css/bookmarks.css  |  19 ++++++-
 js/bookmarks.js    | 129 +++++++++++++++++++++++++++++++++++++--------
 templates/main.php |  54 ++-----------------
 3 files changed, 128 insertions(+), 74 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 1fe3f3a52..a97f962fe 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,6 +1,21 @@
+.add-bookmark {
+  padding: .1cm;
+  border-bottom: 1px solid #ebebeb;
+}
+.add-bookmark input {
+  width: 93%;
+  font-size: .6cm;
+  border: none;
+  width: calc(100% - 1.5cm);
+}
+.add-bookmark button {
+  width: 1cm;
+  height: 1cm;
+}
+
 .bookmarks-empty {
-  width: 4cm;
-  margin: 30% auto;
+  width: 5cm;
+  margin: 20% auto;
 }
 
 .bookmark-card {
diff --git a/js/bookmarks.js b/js/bookmarks.js
index fae1b6563..a1367d9e7 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -16,17 +16,119 @@ var Bookmarks = Backbone.Collection.extend({
 })
 
 var Tag = Backbone.Model.extend({
-  id: '',
-  title: ''
+  defaults: {
+    id: ''
+  , name: ''
+  }
 })
 
 var Tags = Backbone.Collection.extend({
   model: Tag
 , url: 'tag'
 })
+
+
+var AppView = Marionette.View.extend({
+  template: _.template('<div id="app-navigation"></div><div id="app-content"></div>')
+, regions: {
+    'navigation': '#app-navigation'
+  , 'content': '#app-content'
+  }
+, initialize: function() {
+    this.bookmarks = new Bookmarks
+    this.bookmarks.fetch()
+    this.tags = new Tags
+    this.tags.fetch()
+  }
+, onRender: function() {
+    this.showChildView('navigation', new NavigationView({tags: this.tags}));
+    this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
+  }
+})
+
+var NavigationView = Marionette.View.extend({
+  className: 'navigation'
+, template: _.template('<ul><li data-id="all" class="all"><a href="#">All bookmarks</a></li><li data-id="facorites" class="favorites"><a href="#">Favorites</a></li><li data-id="shared" class="shared"><a href="#">Shared</a></li><li data-id="tags" class="tags"><a href="#">Tags</a></li></ul>Favorite tags<div id="favorite-tags-slot"></div>')
+, events: {
+    'click .all': 'onClick'
+  , 'lick .favorites': 'onClick'
+  , 'click .shared': 'onClick'
+  }
+, regions: {
+    'tags': '#favorite-tags-slot'
+  }
+, initialize: function(options) {
+    this.tags = options.tags
+  }
+, onClick: function(e) {
+    e.preventDefault()
+    this.triggerMethod('navigation:open', e.target.parentNode.dataset.id)
+  }
+, onNavigationOpen: function(category) {
+    $('.active', this.$el).removeClass('active')
+    $('.'+category, this.$el).addClass('active')
+  }
+, onRender: function() {
+    this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
+  }
+})
+
+var TagsNavigationView = Marionette.CollectionView.extend({
+  tagName: 'ul'
+, childView: function() {return TagsNavigationTagView}
+})
+
+var TagsNavigationTagView = Marionette.View.extend({
+  className: 'tag-nav-item'
+, tagName: 'li'
+, template: _.template('<li><a href="#"><%- name %></a></li>')
+})
+
+var ContentView = Marionette.View.extend({
+  template: _.template('<div id="add-bookmark-slot"></div><div id="view-bookmarks-slot"></div>')
+, regions: {
+    'addBookmarks':  {
+      el: '#add-bookmark-slot'
+    , replaceElement: true
+    }
+  , 'viewBookmarks': {
+      el: '#view-bookmarks-slot'
+    , replaceElement: true
+    }
+  }
+, initialize: function(options) {
+    this.bookmarks = options.bookmarks
+  }
+, onRender: function() {
+    this.showChildView('addBookmarks', new AddBookmarkView());
+    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
+  }
+})
+
+
+
+
+
+var AddBookmarkView = Marionette.View.extend({
+  template: _.template('<input type="text" value="" placeholder="Address"/><button title="Add" class="icon-add"></button>')
+, className: 'add-bookmark'
+})
+
+
+
+var BookmarksView = Marionette.CollectionView.extend({
+  className: 'bookmarks'
+, childView: function() {return BookmarkCardView}
+, emptyView: function() {return EmptyBookmarksView}
+})
+
+var EmptyBookmarksView = Marionette.View.extend({
+  template: _.template('<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>')
+, className: 'bookmarks-empty'
+})
+
 var BookmarkCardView = Marionette.View.extend({
   template: _.template('<h1><%- title %></h1><h2><%- new URL(url).host %></h2>'),
-  tagName: "div",
   className: "bookmark-card",
   events: {
     "click": "open",
@@ -36,18 +138,6 @@ var BookmarkCardView = Marionette.View.extend({
   },
 })
 
-var BookmarksView = Marionette.CollectionView.extend({
-  tagName: "div"
-, className: 'bookmarks'
-, childView: BookmarkCardView
-, emptyView: EmptyBookmarksView
-})
-
-var EmptyBookmarksView = Marionette.CollectionView.extend({
-  template: _.template('<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>')
-, tagName: "div"
-, className: 'bookmarks-empty'
-})
 
 
 var _sync = Backbone.sync
@@ -61,12 +151,9 @@ Backbone.sync = function(method, model, options) {
   }))
 }
 
-var bookmarks = new Bookmarks
-var view = new BookmarksView({collection: bookmarks})
-bookmarks.fetch({success: function() {
-  view.render()
-}})
+// init
 
+var view = new AppView()
 $(function() {
-  $('#app-content').append(view.el)
+  $('#content').append(view.render().el)
 })
diff --git a/templates/main.php b/templates/main.php
index d67007152..393d2d67c 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -1,11 +1,12 @@
 <?php
+script('bookmarks', '3rdparty/backbone');
+script('bookmarks', '3rdparty/backbone.radio');
+script('bookmarks', '3rdparty/backbone.marionette.min');
 script('bookmarks', 'settings');
 script('bookmarks', 'bookmarks');
 style('bookmarks', 'bookmarks');
 
 
-script('bookmarks', '3rdparty/backbone.radio');
-script('bookmarks', '3rdparty/backbone.marionette.min');
 script('bookmarks', '3rdparty/tag-it');
 script('bookmarks', '3rdparty/js_tpl');
 style('bookmarks', '3rdparty/jquery.tagit');
@@ -32,54 +33,5 @@ function bookmarklet($bookmarkleturl) {
 }
 ?>
 
-<div id="app-navigation">
-    <ul id="navigation-list">
-        <li>
-            <form id="add_form">
-                <input type="text" id="add_url" value="" placeholder="<?php p($l->t('Address')); ?>"/>
-                <button id="bookmark_add_submit" title="Add" class="icon-add"></button>
-            </form>
-            <p id="tag_filter" class="open">
-                <input type="text" value="<?php if(isset($_['req_tag'])) p($_['req_tag']); else ""; ?>"/>
-
-
-            </p>
-            <input type="hidden" id="bookmarkFilterTag" value="<?php if(isset($_['req_tag'])) p($_['req_tag']); else ""; ?>" />
-            <label id="tag_select_label"><?php p($l->t('Filterable Tags')); ?></label>
-        </li>
-        <li class="tag_list">
-        </li>
-    </ul>
-
-    <div id="app-settings">
-        <div id="app-settings-header">
-            <button class="settings-button generalsettings" data-apps-slide-toggle="#app-settings-content" tabindex="0"></button>
-        </div>
-        <div id="app-settings-content">
-
-
-			<?php require 'settings.php'; ?>
-        </div>
-    </div>
-
-</div>
-<div id="app-content">
-    <div id="emptycontent" style="display: none;">
-        <p class="title"><?php
-			p($l->t('You have no bookmarks'));
-			$embedded = true;
-			print_unescaped($bookmarkletscript);
-			?></p>
-        <br/><br/>
-
-
-        <div class="bkm_hint">
-            <a href="#" id="firstrun_setting">
-				<?php p($l->t('You can also import a bookmark file')); ?>
-            </a></div>
-    </div>
-    <div class="bookmarks_list"></div>
-</div>
-
 <?php
 require 'js_tpl.php';

From 72bb937d6fa5275abd8e8df64aacffeed586fe57 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 9 Sep 2017 14:58:01 +0200
Subject: [PATCH 004/110] Navigation is working

---
 css/bookmarks.css                          |    7 +
 js/3rdparty/backbone.js                    | 1920 ++++++++++++++++++++
 js/3rdparty/backbone.marionette.min.js     |   13 +
 js/3rdparty/backbone.marionette.min.js.map |    1 +
 js/3rdparty/backbone.radio.js              |  350 ++++
 js/3rdparty/backbone.radio.js.map          |    1 +
 js/bookmarks.js                            |  115 +-
 7 files changed, 2381 insertions(+), 26 deletions(-)
 create mode 100644 js/3rdparty/backbone.js
 create mode 100644 js/3rdparty/backbone.marionette.min.js
 create mode 100644 js/3rdparty/backbone.marionette.min.js.map
 create mode 100644 js/3rdparty/backbone.radio.js
 create mode 100644 js/3rdparty/backbone.radio.js.map

diff --git a/css/bookmarks.css b/css/bookmarks.css
index a97f962fe..788a5c9f8 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,3 +1,10 @@
+#app-navigation h3 {
+	padding-top: .7cm;
+	padding-left: 0.1cm;
+	border-top: 1px solid #ededed;
+}
+
+
 .add-bookmark {
   padding: .1cm;
   border-bottom: 1px solid #ebebeb;
diff --git a/js/3rdparty/backbone.js b/js/3rdparty/backbone.js
new file mode 100644
index 000000000..55ccb22bd
--- /dev/null
+++ b/js/3rdparty/backbone.js
@@ -0,0 +1,1920 @@
+//     Backbone.js 1.3.3
+
+//     (c) 2010-2016 Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+//     Backbone may be freely distributed under the MIT license.
+//     For all details and documentation:
+//     http://backbonejs.org
+
+(function(factory) {
+
+  // Establish the root object, `window` (`self`) in the browser, or `global` on the server.
+  // We use `self` instead of `window` for `WebWorker` support.
+  var root = (typeof self == 'object' && self.self === self && self) ||
+            (typeof global == 'object' && global.global === global && global);
+
+  // Set up Backbone appropriately for the environment. Start with AMD.
+  if (typeof define === 'function' && define.amd) {
+    define(['underscore', 'jquery', 'exports'], function(_, $, exports) {
+      // Export global even in AMD case in case this script is loaded with
+      // others that may still expect a global Backbone.
+      root.Backbone = factory(root, exports, _, $);
+    });
+
+  // Next for Node.js or CommonJS. jQuery may not be needed as a module.
+  } else if (typeof exports !== 'undefined') {
+    var _ = require('underscore'), $;
+    try { $ = require('jquery'); } catch (e) {}
+    factory(root, exports, _, $);
+
+  // Finally, as a browser global.
+  } else {
+    root.Backbone = factory(root, {}, root._, (root.jQuery || root.Zepto || root.ender || root.$));
+  }
+
+})(function(root, Backbone, _, $) {
+
+  // Initial Setup
+  // -------------
+
+  // Save the previous value of the `Backbone` variable, so that it can be
+  // restored later on, if `noConflict` is used.
+  var previousBackbone = root.Backbone;
+
+  // Create a local reference to a common array method we'll want to use later.
+  var slice = Array.prototype.slice;
+
+  // Current version of the library. Keep in sync with `package.json`.
+  Backbone.VERSION = '1.3.3';
+
+  // For Backbone's purposes, jQuery, Zepto, Ender, or My Library (kidding) owns
+  // the `$` variable.
+  Backbone.$ = $;
+
+  // Runs Backbone.js in *noConflict* mode, returning the `Backbone` variable
+  // to its previous owner. Returns a reference to this Backbone object.
+  Backbone.noConflict = function() {
+    root.Backbone = previousBackbone;
+    return this;
+  };
+
+  // Turn on `emulateHTTP` to support legacy HTTP servers. Setting this option
+  // will fake `"PATCH"`, `"PUT"` and `"DELETE"` requests via the `_method` parameter and
+  // set a `X-Http-Method-Override` header.
+  Backbone.emulateHTTP = false;
+
+  // Turn on `emulateJSON` to support legacy servers that can't deal with direct
+  // `application/json` requests ... this will encode the body as
+  // `application/x-www-form-urlencoded` instead and will send the model in a
+  // form param named `model`.
+  Backbone.emulateJSON = false;
+
+  // Proxy Backbone class methods to Underscore functions, wrapping the model's
+  // `attributes` object or collection's `models` array behind the scenes.
+  //
+  // collection.filter(function(model) { return model.get('age') > 10 });
+  // collection.each(this.addView);
+  //
+  // `Function#apply` can be slow so we use the method's arg count, if we know it.
+  var addMethod = function(length, method, attribute) {
+    switch (length) {
+      case 1: return function() {
+        return _[method](this[attribute]);
+      };
+      case 2: return function(value) {
+        return _[method](this[attribute], value);
+      };
+      case 3: return function(iteratee, context) {
+        return _[method](this[attribute], cb(iteratee, this), context);
+      };
+      case 4: return function(iteratee, defaultVal, context) {
+        return _[method](this[attribute], cb(iteratee, this), defaultVal, context);
+      };
+      default: return function() {
+        var args = slice.call(arguments);
+        args.unshift(this[attribute]);
+        return _[method].apply(_, args);
+      };
+    }
+  };
+  var addUnderscoreMethods = function(Class, methods, attribute) {
+    _.each(methods, function(length, method) {
+      if (_[method]) Class.prototype[method] = addMethod(length, method, attribute);
+    });
+  };
+
+  // Support `collection.sortBy('attr')` and `collection.findWhere({id: 1})`.
+  var cb = function(iteratee, instance) {
+    if (_.isFunction(iteratee)) return iteratee;
+    if (_.isObject(iteratee) && !instance._isModel(iteratee)) return modelMatcher(iteratee);
+    if (_.isString(iteratee)) return function(model) { return model.get(iteratee); };
+    return iteratee;
+  };
+  var modelMatcher = function(attrs) {
+    var matcher = _.matches(attrs);
+    return function(model) {
+      return matcher(model.attributes);
+    };
+  };
+
+  // Backbone.Events
+  // ---------------
+
+  // A module that can be mixed in to *any object* in order to provide it with
+  // a custom event channel. You may bind a callback to an event with `on` or
+  // remove with `off`; `trigger`-ing an event fires all callbacks in
+  // succession.
+  //
+  //     var object = {};
+  //     _.extend(object, Backbone.Events);
+  //     object.on('expand', function(){ alert('expanded'); });
+  //     object.trigger('expand');
+  //
+  var Events = Backbone.Events = {};
+
+  // Regular expression used to split event strings.
+  var eventSplitter = /\s+/;
+
+  // Iterates over the standard `event, callback` (as well as the fancy multiple
+  // space-separated events `"change blur", callback` and jQuery-style event
+  // maps `{event: callback}`).
+  var eventsApi = function(iteratee, events, name, callback, opts) {
+    var i = 0, names;
+    if (name && typeof name === 'object') {
+      // Handle event maps.
+      if (callback !== void 0 && 'context' in opts && opts.context === void 0) opts.context = callback;
+      for (names = _.keys(name); i < names.length ; i++) {
+        events = eventsApi(iteratee, events, names[i], name[names[i]], opts);
+      }
+    } else if (name && eventSplitter.test(name)) {
+      // Handle space-separated event names by delegating them individually.
+      for (names = name.split(eventSplitter); i < names.length; i++) {
+        events = iteratee(events, names[i], callback, opts);
+      }
+    } else {
+      // Finally, standard events.
+      events = iteratee(events, name, callback, opts);
+    }
+    return events;
+  };
+
+  // Bind an event to a `callback` function. Passing `"all"` will bind
+  // the callback to all events fired.
+  Events.on = function(name, callback, context) {
+    return internalOn(this, name, callback, context);
+  };
+
+  // Guard the `listening` argument from the public API.
+  var internalOn = function(obj, name, callback, context, listening) {
+    obj._events = eventsApi(onApi, obj._events || {}, name, callback, {
+      context: context,
+      ctx: obj,
+      listening: listening
+    });
+
+    if (listening) {
+      var listeners = obj._listeners || (obj._listeners = {});
+      listeners[listening.id] = listening;
+    }
+
+    return obj;
+  };
+
+  // Inversion-of-control versions of `on`. Tell *this* object to listen to
+  // an event in another object... keeping track of what it's listening to
+  // for easier unbinding later.
+  Events.listenTo = function(obj, name, callback) {
+    if (!obj) return this;
+    var id = obj._listenId || (obj._listenId = _.uniqueId('l'));
+    var listeningTo = this._listeningTo || (this._listeningTo = {});
+    var listening = listeningTo[id];
+
+    // This object is not listening to any other events on `obj` yet.
+    // Setup the necessary references to track the listening callbacks.
+    if (!listening) {
+      var thisId = this._listenId || (this._listenId = _.uniqueId('l'));
+      listening = listeningTo[id] = {obj: obj, objId: id, id: thisId, listeningTo: listeningTo, count: 0};
+    }
+
+    // Bind callbacks on obj, and keep track of them on listening.
+    internalOn(obj, name, callback, this, listening);
+    return this;
+  };
+
+  // The reducing API that adds a callback to the `events` object.
+  var onApi = function(events, name, callback, options) {
+    if (callback) {
+      var handlers = events[name] || (events[name] = []);
+      var context = options.context, ctx = options.ctx, listening = options.listening;
+      if (listening) listening.count++;
+
+      handlers.push({callback: callback, context: context, ctx: context || ctx, listening: listening});
+    }
+    return events;
+  };
+
+  // Remove one or many callbacks. If `context` is null, removes all
+  // callbacks with that function. If `callback` is null, removes all
+  // callbacks for the event. If `name` is null, removes all bound
+  // callbacks for all events.
+  Events.off = function(name, callback, context) {
+    if (!this._events) return this;
+    this._events = eventsApi(offApi, this._events, name, callback, {
+      context: context,
+      listeners: this._listeners
+    });
+    return this;
+  };
+
+  // Tell this object to stop listening to either specific events ... or
+  // to every object it's currently listening to.
+  Events.stopListening = function(obj, name, callback) {
+    var listeningTo = this._listeningTo;
+    if (!listeningTo) return this;
+
+    var ids = obj ? [obj._listenId] : _.keys(listeningTo);
+
+    for (var i = 0; i < ids.length; i++) {
+      var listening = listeningTo[ids[i]];
+
+      // If listening doesn't exist, this object is not currently
+      // listening to obj. Break out early.
+      if (!listening) break;
+
+      listening.obj.off(name, callback, this);
+    }
+
+    return this;
+  };
+
+  // The reducing API that removes a callback from the `events` object.
+  var offApi = function(events, name, callback, options) {
+    if (!events) return;
+
+    var i = 0, listening;
+    var context = options.context, listeners = options.listeners;
+
+    // Delete all events listeners and "drop" events.
+    if (!name && !callback && !context) {
+      var ids = _.keys(listeners);
+      for (; i < ids.length; i++) {
+        listening = listeners[ids[i]];
+        delete listeners[listening.id];
+        delete listening.listeningTo[listening.objId];
+      }
+      return;
+    }
+
+    var names = name ? [name] : _.keys(events);
+    for (; i < names.length; i++) {
+      name = names[i];
+      var handlers = events[name];
+
+      // Bail out if there are no events stored.
+      if (!handlers) break;
+
+      // Replace events if there are any remaining.  Otherwise, clean up.
+      var remaining = [];
+      for (var j = 0; j < handlers.length; j++) {
+        var handler = handlers[j];
+        if (
+          callback && callback !== handler.callback &&
+            callback !== handler.callback._callback ||
+              context && context !== handler.context
+        ) {
+          remaining.push(handler);
+        } else {
+          listening = handler.listening;
+          if (listening && --listening.count === 0) {
+            delete listeners[listening.id];
+            delete listening.listeningTo[listening.objId];
+          }
+        }
+      }
+
+      // Update tail event if the list has any events.  Otherwise, clean up.
+      if (remaining.length) {
+        events[name] = remaining;
+      } else {
+        delete events[name];
+      }
+    }
+    return events;
+  };
+
+  // Bind an event to only be triggered a single time. After the first time
+  // the callback is invoked, its listener will be removed. If multiple events
+  // are passed in using the space-separated syntax, the handler will fire
+  // once for each event, not once for a combination of all events.
+  Events.once = function(name, callback, context) {
+    // Map the event into a `{event: once}` object.
+    var events = eventsApi(onceMap, {}, name, callback, _.bind(this.off, this));
+    if (typeof name === 'string' && context == null) callback = void 0;
+    return this.on(events, callback, context);
+  };
+
+  // Inversion-of-control versions of `once`.
+  Events.listenToOnce = function(obj, name, callback) {
+    // Map the event into a `{event: once}` object.
+    var events = eventsApi(onceMap, {}, name, callback, _.bind(this.stopListening, this, obj));
+    return this.listenTo(obj, events);
+  };
+
+  // Reduces the event callbacks into a map of `{event: onceWrapper}`.
+  // `offer` unbinds the `onceWrapper` after it has been called.
+  var onceMap = function(map, name, callback, offer) {
+    if (callback) {
+      var once = map[name] = _.once(function() {
+        offer(name, once);
+        callback.apply(this, arguments);
+      });
+      once._callback = callback;
+    }
+    return map;
+  };
+
+  // Trigger one or many events, firing all bound callbacks. Callbacks are
+  // passed the same arguments as `trigger` is, apart from the event name
+  // (unless you're listening on `"all"`, which will cause your callback to
+  // receive the true name of the event as the first argument).
+  Events.trigger = function(name) {
+    if (!this._events) return this;
+
+    var length = Math.max(0, arguments.length - 1);
+    var args = Array(length);
+    for (var i = 0; i < length; i++) args[i] = arguments[i + 1];
+
+    eventsApi(triggerApi, this._events, name, void 0, args);
+    return this;
+  };
+
+  // Handles triggering the appropriate event callbacks.
+  var triggerApi = function(objEvents, name, callback, args) {
+    if (objEvents) {
+      var events = objEvents[name];
+      var allEvents = objEvents.all;
+      if (events && allEvents) allEvents = allEvents.slice();
+      if (events) triggerEvents(events, args);
+      if (allEvents) triggerEvents(allEvents, [name].concat(args));
+    }
+    return objEvents;
+  };
+
+  // A difficult-to-believe, but optimized internal dispatch function for
+  // triggering events. Tries to keep the usual cases speedy (most internal
+  // Backbone events have 3 arguments).
+  var triggerEvents = function(events, args) {
+    var ev, i = -1, l = events.length, a1 = args[0], a2 = args[1], a3 = args[2];
+    switch (args.length) {
+      case 0: while (++i < l) (ev = events[i]).callback.call(ev.ctx); return;
+      case 1: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1); return;
+      case 2: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2); return;
+      case 3: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2, a3); return;
+      default: while (++i < l) (ev = events[i]).callback.apply(ev.ctx, args); return;
+    }
+  };
+
+  // Aliases for backwards compatibility.
+  Events.bind   = Events.on;
+  Events.unbind = Events.off;
+
+  // Allow the `Backbone` object to serve as a global event bus, for folks who
+  // want global "pubsub" in a convenient place.
+  _.extend(Backbone, Events);
+
+  // Backbone.Model
+  // --------------
+
+  // Backbone **Models** are the basic data object in the framework --
+  // frequently representing a row in a table in a database on your server.
+  // A discrete chunk of data and a bunch of useful, related methods for
+  // performing computations and transformations on that data.
+
+  // Create a new model with the specified attributes. A client id (`cid`)
+  // is automatically generated and assigned for you.
+  var Model = Backbone.Model = function(attributes, options) {
+    var attrs = attributes || {};
+    options || (options = {});
+    this.cid = _.uniqueId(this.cidPrefix);
+    this.attributes = {};
+    if (options.collection) this.collection = options.collection;
+    if (options.parse) attrs = this.parse(attrs, options) || {};
+    var defaults = _.result(this, 'defaults');
+    attrs = _.defaults(_.extend({}, defaults, attrs), defaults);
+    this.set(attrs, options);
+    this.changed = {};
+    this.initialize.apply(this, arguments);
+  };
+
+  // Attach all inheritable methods to the Model prototype.
+  _.extend(Model.prototype, Events, {
+
+    // A hash of attributes whose current and previous value differ.
+    changed: null,
+
+    // The value returned during the last failed validation.
+    validationError: null,
+
+    // The default name for the JSON `id` attribute is `"id"`. MongoDB and
+    // CouchDB users may want to set this to `"_id"`.
+    idAttribute: 'id',
+
+    // The prefix is used to create the client id which is used to identify models locally.
+    // You may want to override this if you're experiencing name clashes with model ids.
+    cidPrefix: 'c',
+
+    // Initialize is an empty function by default. Override it with your own
+    // initialization logic.
+    initialize: function(){},
+
+    // Return a copy of the model's `attributes` object.
+    toJSON: function(options) {
+      return _.clone(this.attributes);
+    },
+
+    // Proxy `Backbone.sync` by default -- but override this if you need
+    // custom syncing semantics for *this* particular model.
+    sync: function() {
+      return Backbone.sync.apply(this, arguments);
+    },
+
+    // Get the value of an attribute.
+    get: function(attr) {
+      return this.attributes[attr];
+    },
+
+    // Get the HTML-escaped value of an attribute.
+    escape: function(attr) {
+      return _.escape(this.get(attr));
+    },
+
+    // Returns `true` if the attribute contains a value that is not null
+    // or undefined.
+    has: function(attr) {
+      return this.get(attr) != null;
+    },
+
+    // Special-cased proxy to underscore's `_.matches` method.
+    matches: function(attrs) {
+      return !!_.iteratee(attrs, this)(this.attributes);
+    },
+
+    // Set a hash of model attributes on the object, firing `"change"`. This is
+    // the core primitive operation of a model, updating the data and notifying
+    // anyone who needs to know about the change in state. The heart of the beast.
+    set: function(key, val, options) {
+      if (key == null) return this;
+
+      // Handle both `"key", value` and `{key: value}` -style arguments.
+      var attrs;
+      if (typeof key === 'object') {
+        attrs = key;
+        options = val;
+      } else {
+        (attrs = {})[key] = val;
+      }
+
+      options || (options = {});
+
+      // Run validation.
+      if (!this._validate(attrs, options)) return false;
+
+      // Extract attributes and options.
+      var unset      = options.unset;
+      var silent     = options.silent;
+      var changes    = [];
+      var changing   = this._changing;
+      this._changing = true;
+
+      if (!changing) {
+        this._previousAttributes = _.clone(this.attributes);
+        this.changed = {};
+      }
+
+      var current = this.attributes;
+      var changed = this.changed;
+      var prev    = this._previousAttributes;
+
+      // For each `set` attribute, update or delete the current value.
+      for (var attr in attrs) {
+        val = attrs[attr];
+        if (!_.isEqual(current[attr], val)) changes.push(attr);
+        if (!_.isEqual(prev[attr], val)) {
+          changed[attr] = val;
+        } else {
+          delete changed[attr];
+        }
+        unset ? delete current[attr] : current[attr] = val;
+      }
+
+      // Update the `id`.
+      if (this.idAttribute in attrs) this.id = this.get(this.idAttribute);
+
+      // Trigger all relevant attribute changes.
+      if (!silent) {
+        if (changes.length) this._pending = options;
+        for (var i = 0; i < changes.length; i++) {
+          this.trigger('change:' + changes[i], this, current[changes[i]], options);
+        }
+      }
+
+      // You might be wondering why there's a `while` loop here. Changes can
+      // be recursively nested within `"change"` events.
+      if (changing) return this;
+      if (!silent) {
+        while (this._pending) {
+          options = this._pending;
+          this._pending = false;
+          this.trigger('change', this, options);
+        }
+      }
+      this._pending = false;
+      this._changing = false;
+      return this;
+    },
+
+    // Remove an attribute from the model, firing `"change"`. `unset` is a noop
+    // if the attribute doesn't exist.
+    unset: function(attr, options) {
+      return this.set(attr, void 0, _.extend({}, options, {unset: true}));
+    },
+
+    // Clear all attributes on the model, firing `"change"`.
+    clear: function(options) {
+      var attrs = {};
+      for (var key in this.attributes) attrs[key] = void 0;
+      return this.set(attrs, _.extend({}, options, {unset: true}));
+    },
+
+    // Determine if the model has changed since the last `"change"` event.
+    // If you specify an attribute name, determine if that attribute has changed.
+    hasChanged: function(attr) {
+      if (attr == null) return !_.isEmpty(this.changed);
+      return _.has(this.changed, attr);
+    },
+
+    // Return an object containing all the attributes that have changed, or
+    // false if there are no changed attributes. Useful for determining what
+    // parts of a view need to be updated and/or what attributes need to be
+    // persisted to the server. Unset attributes will be set to undefined.
+    // You can also pass an attributes object to diff against the model,
+    // determining if there *would be* a change.
+    changedAttributes: function(diff) {
+      if (!diff) return this.hasChanged() ? _.clone(this.changed) : false;
+      var old = this._changing ? this._previousAttributes : this.attributes;
+      var changed = {};
+      for (var attr in diff) {
+        var val = diff[attr];
+        if (_.isEqual(old[attr], val)) continue;
+        changed[attr] = val;
+      }
+      return _.size(changed) ? changed : false;
+    },
+
+    // Get the previous value of an attribute, recorded at the time the last
+    // `"change"` event was fired.
+    previous: function(attr) {
+      if (attr == null || !this._previousAttributes) return null;
+      return this._previousAttributes[attr];
+    },
+
+    // Get all of the attributes of the model at the time of the previous
+    // `"change"` event.
+    previousAttributes: function() {
+      return _.clone(this._previousAttributes);
+    },
+
+    // Fetch the model from the server, merging the response with the model's
+    // local attributes. Any changed attributes will trigger a "change" event.
+    fetch: function(options) {
+      options = _.extend({parse: true}, options);
+      var model = this;
+      var success = options.success;
+      options.success = function(resp) {
+        var serverAttrs = options.parse ? model.parse(resp, options) : resp;
+        if (!model.set(serverAttrs, options)) return false;
+        if (success) success.call(options.context, model, resp, options);
+        model.trigger('sync', model, resp, options);
+      };
+      wrapError(this, options);
+      return this.sync('read', this, options);
+    },
+
+    // Set a hash of model attributes, and sync the model to the server.
+    // If the server returns an attributes hash that differs, the model's
+    // state will be `set` again.
+    save: function(key, val, options) {
+      // Handle both `"key", value` and `{key: value}` -style arguments.
+      var attrs;
+      if (key == null || typeof key === 'object') {
+        attrs = key;
+        options = val;
+      } else {
+        (attrs = {})[key] = val;
+      }
+
+      options = _.extend({validate: true, parse: true}, options);
+      var wait = options.wait;
+
+      // If we're not waiting and attributes exist, save acts as
+      // `set(attr).save(null, opts)` with validation. Otherwise, check if
+      // the model will be valid when the attributes, if any, are set.
+      if (attrs && !wait) {
+        if (!this.set(attrs, options)) return false;
+      } else if (!this._validate(attrs, options)) {
+        return false;
+      }
+
+      // After a successful server-side save, the client is (optionally)
+      // updated with the server-side state.
+      var model = this;
+      var success = options.success;
+      var attributes = this.attributes;
+      options.success = function(resp) {
+        // Ensure attributes are restored during synchronous saves.
+        model.attributes = attributes;
+        var serverAttrs = options.parse ? model.parse(resp, options) : resp;
+        if (wait) serverAttrs = _.extend({}, attrs, serverAttrs);
+        if (serverAttrs && !model.set(serverAttrs, options)) return false;
+        if (success) success.call(options.context, model, resp, options);
+        model.trigger('sync', model, resp, options);
+      };
+      wrapError(this, options);
+
+      // Set temporary attributes if `{wait: true}` to properly find new ids.
+      if (attrs && wait) this.attributes = _.extend({}, attributes, attrs);
+
+      var method = this.isNew() ? 'create' : (options.patch ? 'patch' : 'update');
+      if (method === 'patch' && !options.attrs) options.attrs = attrs;
+      var xhr = this.sync(method, this, options);
+
+      // Restore attributes.
+      this.attributes = attributes;
+
+      return xhr;
+    },
+
+    // Destroy this model on the server if it was already persisted.
+    // Optimistically removes the model from its collection, if it has one.
+    // If `wait: true` is passed, waits for the server to respond before removal.
+    destroy: function(options) {
+      options = options ? _.clone(options) : {};
+      var model = this;
+      var success = options.success;
+      var wait = options.wait;
+
+      var destroy = function() {
+        model.stopListening();
+        model.trigger('destroy', model, model.collection, options);
+      };
+
+      options.success = function(resp) {
+        if (wait) destroy();
+        if (success) success.call(options.context, model, resp, options);
+        if (!model.isNew()) model.trigger('sync', model, resp, options);
+      };
+
+      var xhr = false;
+      if (this.isNew()) {
+        _.defer(options.success);
+      } else {
+        wrapError(this, options);
+        xhr = this.sync('delete', this, options);
+      }
+      if (!wait) destroy();
+      return xhr;
+    },
+
+    // Default URL for the model's representation on the server -- if you're
+    // using Backbone's restful methods, override this to change the endpoint
+    // that will be called.
+    url: function() {
+      var base =
+        _.result(this, 'urlRoot') ||
+        _.result(this.collection, 'url') ||
+        urlError();
+      if (this.isNew()) return base;
+      var id = this.get(this.idAttribute);
+      return base.replace(/[^\/]$/, '$&/') + encodeURIComponent(id);
+    },
+
+    // **parse** converts a response into the hash of attributes to be `set` on
+    // the model. The default implementation is just to pass the response along.
+    parse: function(resp, options) {
+      return resp;
+    },
+
+    // Create a new model with identical attributes to this one.
+    clone: function() {
+      return new this.constructor(this.attributes);
+    },
+
+    // A model is new if it has never been saved to the server, and lacks an id.
+    isNew: function() {
+      return !this.has(this.idAttribute);
+    },
+
+    // Check if the model is currently in a valid state.
+    isValid: function(options) {
+      return this._validate({}, _.extend({}, options, {validate: true}));
+    },
+
+    // Run validation against the next complete set of model attributes,
+    // returning `true` if all is well. Otherwise, fire an `"invalid"` event.
+    _validate: function(attrs, options) {
+      if (!options.validate || !this.validate) return true;
+      attrs = _.extend({}, this.attributes, attrs);
+      var error = this.validationError = this.validate(attrs, options) || null;
+      if (!error) return true;
+      this.trigger('invalid', this, error, _.extend(options, {validationError: error}));
+      return false;
+    }
+
+  });
+
+  // Underscore methods that we want to implement on the Model, mapped to the
+  // number of arguments they take.
+  var modelMethods = {keys: 1, values: 1, pairs: 1, invert: 1, pick: 0,
+      omit: 0, chain: 1, isEmpty: 1};
+
+  // Mix in each Underscore method as a proxy to `Model#attributes`.
+  addUnderscoreMethods(Model, modelMethods, 'attributes');
+
+  // Backbone.Collection
+  // -------------------
+
+  // If models tend to represent a single row of data, a Backbone Collection is
+  // more analogous to a table full of data ... or a small slice or page of that
+  // table, or a collection of rows that belong together for a particular reason
+  // -- all of the messages in this particular folder, all of the documents
+  // belonging to this particular author, and so on. Collections maintain
+  // indexes of their models, both in order, and for lookup by `id`.
+
+  // Create a new **Collection**, perhaps to contain a specific type of `model`.
+  // If a `comparator` is specified, the Collection will maintain
+  // its models in sort order, as they're added and removed.
+  var Collection = Backbone.Collection = function(models, options) {
+    options || (options = {});
+    if (options.model) this.model = options.model;
+    if (options.comparator !== void 0) this.comparator = options.comparator;
+    this._reset();
+    this.initialize.apply(this, arguments);
+    if (models) this.reset(models, _.extend({silent: true}, options));
+  };
+
+  // Default options for `Collection#set`.
+  var setOptions = {add: true, remove: true, merge: true};
+  var addOptions = {add: true, remove: false};
+
+  // Splices `insert` into `array` at index `at`.
+  var splice = function(array, insert, at) {
+    at = Math.min(Math.max(at, 0), array.length);
+    var tail = Array(array.length - at);
+    var length = insert.length;
+    var i;
+    for (i = 0; i < tail.length; i++) tail[i] = array[i + at];
+    for (i = 0; i < length; i++) array[i + at] = insert[i];
+    for (i = 0; i < tail.length; i++) array[i + length + at] = tail[i];
+  };
+
+  // Define the Collection's inheritable methods.
+  _.extend(Collection.prototype, Events, {
+
+    // The default model for a collection is just a **Backbone.Model**.
+    // This should be overridden in most cases.
+    model: Model,
+
+    // Initialize is an empty function by default. Override it with your own
+    // initialization logic.
+    initialize: function(){},
+
+    // The JSON representation of a Collection is an array of the
+    // models' attributes.
+    toJSON: function(options) {
+      return this.map(function(model) { return model.toJSON(options); });
+    },
+
+    // Proxy `Backbone.sync` by default.
+    sync: function() {
+      return Backbone.sync.apply(this, arguments);
+    },
+
+    // Add a model, or list of models to the set. `models` may be Backbone
+    // Models or raw JavaScript objects to be converted to Models, or any
+    // combination of the two.
+    add: function(models, options) {
+      return this.set(models, _.extend({merge: false}, options, addOptions));
+    },
+
+    // Remove a model, or a list of models from the set.
+    remove: function(models, options) {
+      options = _.extend({}, options);
+      var singular = !_.isArray(models);
+      models = singular ? [models] : models.slice();
+      var removed = this._removeModels(models, options);
+      if (!options.silent && removed.length) {
+        options.changes = {added: [], merged: [], removed: removed};
+        this.trigger('update', this, options);
+      }
+      return singular ? removed[0] : removed;
+    },
+
+    // Update a collection by `set`-ing a new list of models, adding new ones,
+    // removing models that are no longer present, and merging models that
+    // already exist in the collection, as necessary. Similar to **Model#set**,
+    // the core operation for updating the data contained by the collection.
+    set: function(models, options) {
+      if (models == null) return;
+
+      options = _.extend({}, setOptions, options);
+      if (options.parse && !this._isModel(models)) {
+        models = this.parse(models, options) || [];
+      }
+
+      var singular = !_.isArray(models);
+      models = singular ? [models] : models.slice();
+
+      var at = options.at;
+      if (at != null) at = +at;
+      if (at > this.length) at = this.length;
+      if (at < 0) at += this.length + 1;
+
+      var set = [];
+      var toAdd = [];
+      var toMerge = [];
+      var toRemove = [];
+      var modelMap = {};
+
+      var add = options.add;
+      var merge = options.merge;
+      var remove = options.remove;
+
+      var sort = false;
+      var sortable = this.comparator && at == null && options.sort !== false;
+      var sortAttr = _.isString(this.comparator) ? this.comparator : null;
+
+      // Turn bare objects into model references, and prevent invalid models
+      // from being added.
+      var model, i;
+      for (i = 0; i < models.length; i++) {
+        model = models[i];
+
+        // If a duplicate is found, prevent it from being added and
+        // optionally merge it into the existing model.
+        var existing = this.get(model);
+        if (existing) {
+          if (merge && model !== existing) {
+            var attrs = this._isModel(model) ? model.attributes : model;
+            if (options.parse) attrs = existing.parse(attrs, options);
+            existing.set(attrs, options);
+            toMerge.push(existing);
+            if (sortable && !sort) sort = existing.hasChanged(sortAttr);
+          }
+          if (!modelMap[existing.cid]) {
+            modelMap[existing.cid] = true;
+            set.push(existing);
+          }
+          models[i] = existing;
+
+        // If this is a new, valid model, push it to the `toAdd` list.
+        } else if (add) {
+          model = models[i] = this._prepareModel(model, options);
+          if (model) {
+            toAdd.push(model);
+            this._addReference(model, options);
+            modelMap[model.cid] = true;
+            set.push(model);
+          }
+        }
+      }
+
+      // Remove stale models.
+      if (remove) {
+        for (i = 0; i < this.length; i++) {
+          model = this.models[i];
+          if (!modelMap[model.cid]) toRemove.push(model);
+        }
+        if (toRemove.length) this._removeModels(toRemove, options);
+      }
+
+      // See if sorting is needed, update `length` and splice in new models.
+      var orderChanged = false;
+      var replace = !sortable && add && remove;
+      if (set.length && replace) {
+        orderChanged = this.length !== set.length || _.some(this.models, function(m, index) {
+          return m !== set[index];
+        });
+        this.models.length = 0;
+        splice(this.models, set, 0);
+        this.length = this.models.length;
+      } else if (toAdd.length) {
+        if (sortable) sort = true;
+        splice(this.models, toAdd, at == null ? this.length : at);
+        this.length = this.models.length;
+      }
+
+      // Silently sort the collection if appropriate.
+      if (sort) this.sort({silent: true});
+
+      // Unless silenced, it's time to fire all appropriate add/sort/update events.
+      if (!options.silent) {
+        for (i = 0; i < toAdd.length; i++) {
+          if (at != null) options.index = at + i;
+          model = toAdd[i];
+          model.trigger('add', model, this, options);
+        }
+        if (sort || orderChanged) this.trigger('sort', this, options);
+        if (toAdd.length || toRemove.length || toMerge.length) {
+          options.changes = {
+            added: toAdd,
+            removed: toRemove,
+            merged: toMerge
+          };
+          this.trigger('update', this, options);
+        }
+      }
+
+      // Return the added (or merged) model (or models).
+      return singular ? models[0] : models;
+    },
+
+    // When you have more items than you want to add or remove individually,
+    // you can reset the entire set with a new list of models, without firing
+    // any granular `add` or `remove` events. Fires `reset` when finished.
+    // Useful for bulk operations and optimizations.
+    reset: function(models, options) {
+      options = options ? _.clone(options) : {};
+      for (var i = 0; i < this.models.length; i++) {
+        this._removeReference(this.models[i], options);
+      }
+      options.previousModels = this.models;
+      this._reset();
+      models = this.add(models, _.extend({silent: true}, options));
+      if (!options.silent) this.trigger('reset', this, options);
+      return models;
+    },
+
+    // Add a model to the end of the collection.
+    push: function(model, options) {
+      return this.add(model, _.extend({at: this.length}, options));
+    },
+
+    // Remove a model from the end of the collection.
+    pop: function(options) {
+      var model = this.at(this.length - 1);
+      return this.remove(model, options);
+    },
+
+    // Add a model to the beginning of the collection.
+    unshift: function(model, options) {
+      return this.add(model, _.extend({at: 0}, options));
+    },
+
+    // Remove a model from the beginning of the collection.
+    shift: function(options) {
+      var model = this.at(0);
+      return this.remove(model, options);
+    },
+
+    // Slice out a sub-array of models from the collection.
+    slice: function() {
+      return slice.apply(this.models, arguments);
+    },
+
+    // Get a model from the set by id, cid, model object with id or cid
+    // properties, or an attributes object that is transformed through modelId.
+    get: function(obj) {
+      if (obj == null) return void 0;
+      return this._byId[obj] ||
+        this._byId[this.modelId(obj.attributes || obj)] ||
+        obj.cid && this._byId[obj.cid];
+    },
+
+    // Returns `true` if the model is in the collection.
+    has: function(obj) {
+      return this.get(obj) != null;
+    },
+
+    // Get the model at the given index.
+    at: function(index) {
+      if (index < 0) index += this.length;
+      return this.models[index];
+    },
+
+    // Return models with matching attributes. Useful for simple cases of
+    // `filter`.
+    where: function(attrs, first) {
+      return this[first ? 'find' : 'filter'](attrs);
+    },
+
+    // Return the first model with matching attributes. Useful for simple cases
+    // of `find`.
+    findWhere: function(attrs) {
+      return this.where(attrs, true);
+    },
+
+    // Force the collection to re-sort itself. You don't need to call this under
+    // normal circumstances, as the set will maintain sort order as each item
+    // is added.
+    sort: function(options) {
+      var comparator = this.comparator;
+      if (!comparator) throw new Error('Cannot sort a set without a comparator');
+      options || (options = {});
+
+      var length = comparator.length;
+      if (_.isFunction(comparator)) comparator = _.bind(comparator, this);
+
+      // Run sort based on type of `comparator`.
+      if (length === 1 || _.isString(comparator)) {
+        this.models = this.sortBy(comparator);
+      } else {
+        this.models.sort(comparator);
+      }
+      if (!options.silent) this.trigger('sort', this, options);
+      return this;
+    },
+
+    // Pluck an attribute from each model in the collection.
+    pluck: function(attr) {
+      return this.map(attr + '');
+    },
+
+    // Fetch the default set of models for this collection, resetting the
+    // collection when they arrive. If `reset: true` is passed, the response
+    // data will be passed through the `reset` method instead of `set`.
+    fetch: function(options) {
+      options = _.extend({parse: true}, options);
+      var success = options.success;
+      var collection = this;
+      options.success = function(resp) {
+        var method = options.reset ? 'reset' : 'set';
+        collection[method](resp, options);
+        if (success) success.call(options.context, collection, resp, options);
+        collection.trigger('sync', collection, resp, options);
+      };
+      wrapError(this, options);
+      return this.sync('read', this, options);
+    },
+
+    // Create a new instance of a model in this collection. Add the model to the
+    // collection immediately, unless `wait: true` is passed, in which case we
+    // wait for the server to agree.
+    create: function(model, options) {
+      options = options ? _.clone(options) : {};
+      var wait = options.wait;
+      model = this._prepareModel(model, options);
+      if (!model) return false;
+      if (!wait) this.add(model, options);
+      var collection = this;
+      var success = options.success;
+      options.success = function(m, resp, callbackOpts) {
+        if (wait) collection.add(m, callbackOpts);
+        if (success) success.call(callbackOpts.context, m, resp, callbackOpts);
+      };
+      model.save(null, options);
+      return model;
+    },
+
+    // **parse** converts a response into a list of models to be added to the
+    // collection. The default implementation is just to pass it through.
+    parse: function(resp, options) {
+      return resp;
+    },
+
+    // Create a new collection with an identical list of models as this one.
+    clone: function() {
+      return new this.constructor(this.models, {
+        model: this.model,
+        comparator: this.comparator
+      });
+    },
+
+    // Define how to uniquely identify models in the collection.
+    modelId: function(attrs) {
+      return attrs[this.model.prototype.idAttribute || 'id'];
+    },
+
+    // Private method to reset all internal state. Called when the collection
+    // is first initialized or reset.
+    _reset: function() {
+      this.length = 0;
+      this.models = [];
+      this._byId  = {};
+    },
+
+    // Prepare a hash of attributes (or other model) to be added to this
+    // collection.
+    _prepareModel: function(attrs, options) {
+      if (this._isModel(attrs)) {
+        if (!attrs.collection) attrs.collection = this;
+        return attrs;
+      }
+      options = options ? _.clone(options) : {};
+      options.collection = this;
+      var model = new this.model(attrs, options);
+      if (!model.validationError) return model;
+      this.trigger('invalid', this, model.validationError, options);
+      return false;
+    },
+
+    // Internal method called by both remove and set.
+    _removeModels: function(models, options) {
+      var removed = [];
+      for (var i = 0; i < models.length; i++) {
+        var model = this.get(models[i]);
+        if (!model) continue;
+
+        var index = this.indexOf(model);
+        this.models.splice(index, 1);
+        this.length--;
+
+        // Remove references before triggering 'remove' event to prevent an
+        // infinite loop. #3693
+        delete this._byId[model.cid];
+        var id = this.modelId(model.attributes);
+        if (id != null) delete this._byId[id];
+
+        if (!options.silent) {
+          options.index = index;
+          model.trigger('remove', model, this, options);
+        }
+
+        removed.push(model);
+        this._removeReference(model, options);
+      }
+      return removed;
+    },
+
+    // Method for checking whether an object should be considered a model for
+    // the purposes of adding to the collection.
+    _isModel: function(model) {
+      return model instanceof Model;
+    },
+
+    // Internal method to create a model's ties to a collection.
+    _addReference: function(model, options) {
+      this._byId[model.cid] = model;
+      var id = this.modelId(model.attributes);
+      if (id != null) this._byId[id] = model;
+      model.on('all', this._onModelEvent, this);
+    },
+
+    // Internal method to sever a model's ties to a collection.
+    _removeReference: function(model, options) {
+      delete this._byId[model.cid];
+      var id = this.modelId(model.attributes);
+      if (id != null) delete this._byId[id];
+      if (this === model.collection) delete model.collection;
+      model.off('all', this._onModelEvent, this);
+    },
+
+    // Internal method called every time a model in the set fires an event.
+    // Sets need to update their indexes when models change ids. All other
+    // events simply proxy through. "add" and "remove" events that originate
+    // in other collections are ignored.
+    _onModelEvent: function(event, model, collection, options) {
+      if (model) {
+        if ((event === 'add' || event === 'remove') && collection !== this) return;
+        if (event === 'destroy') this.remove(model, options);
+        if (event === 'change') {
+          var prevId = this.modelId(model.previousAttributes());
+          var id = this.modelId(model.attributes);
+          if (prevId !== id) {
+            if (prevId != null) delete this._byId[prevId];
+            if (id != null) this._byId[id] = model;
+          }
+        }
+      }
+      this.trigger.apply(this, arguments);
+    }
+
+  });
+
+  // Underscore methods that we want to implement on the Collection.
+  // 90% of the core usefulness of Backbone Collections is actually implemented
+  // right here:
+  var collectionMethods = {forEach: 3, each: 3, map: 3, collect: 3, reduce: 0,
+      foldl: 0, inject: 0, reduceRight: 0, foldr: 0, find: 3, detect: 3, filter: 3,
+      select: 3, reject: 3, every: 3, all: 3, some: 3, any: 3, include: 3, includes: 3,
+      contains: 3, invoke: 0, max: 3, min: 3, toArray: 1, size: 1, first: 3,
+      head: 3, take: 3, initial: 3, rest: 3, tail: 3, drop: 3, last: 3,
+      without: 0, difference: 0, indexOf: 3, shuffle: 1, lastIndexOf: 3,
+      isEmpty: 1, chain: 1, sample: 3, partition: 3, groupBy: 3, countBy: 3,
+      sortBy: 3, indexBy: 3, findIndex: 3, findLastIndex: 3};
+
+  // Mix in each Underscore method as a proxy to `Collection#models`.
+  addUnderscoreMethods(Collection, collectionMethods, 'models');
+
+  // Backbone.View
+  // -------------
+
+  // Backbone Views are almost more convention than they are actual code. A View
+  // is simply a JavaScript object that represents a logical chunk of UI in the
+  // DOM. This might be a single item, an entire list, a sidebar or panel, or
+  // even the surrounding frame which wraps your whole app. Defining a chunk of
+  // UI as a **View** allows you to define your DOM events declaratively, without
+  // having to worry about render order ... and makes it easy for the view to
+  // react to specific changes in the state of your models.
+
+  // Creating a Backbone.View creates its initial element outside of the DOM,
+  // if an existing element is not provided...
+  var View = Backbone.View = function(options) {
+    this.cid = _.uniqueId('view');
+    _.extend(this, _.pick(options, viewOptions));
+    this._ensureElement();
+    this.initialize.apply(this, arguments);
+  };
+
+  // Cached regex to split keys for `delegate`.
+  var delegateEventSplitter = /^(\S+)\s*(.*)$/;
+
+  // List of view options to be set as properties.
+  var viewOptions = ['model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName', 'events'];
+
+  // Set up all inheritable **Backbone.View** properties and methods.
+  _.extend(View.prototype, Events, {
+
+    // The default `tagName` of a View's element is `"div"`.
+    tagName: 'div',
+
+    // jQuery delegate for element lookup, scoped to DOM elements within the
+    // current view. This should be preferred to global lookups where possible.
+    $: function(selector) {
+      return this.$el.find(selector);
+    },
+
+    // Initialize is an empty function by default. Override it with your own
+    // initialization logic.
+    initialize: function(){},
+
+    // **render** is the core function that your view should override, in order
+    // to populate its element (`this.el`), with the appropriate HTML. The
+    // convention is for **render** to always return `this`.
+    render: function() {
+      return this;
+    },
+
+    // Remove this view by taking the element out of the DOM, and removing any
+    // applicable Backbone.Events listeners.
+    remove: function() {
+      this._removeElement();
+      this.stopListening();
+      return this;
+    },
+
+    // Remove this view's element from the document and all event listeners
+    // attached to it. Exposed for subclasses using an alternative DOM
+    // manipulation API.
+    _removeElement: function() {
+      this.$el.remove();
+    },
+
+    // Change the view's element (`this.el` property) and re-delegate the
+    // view's events on the new element.
+    setElement: function(element) {
+      this.undelegateEvents();
+      this._setElement(element);
+      this.delegateEvents();
+      return this;
+    },
+
+    // Creates the `this.el` and `this.$el` references for this view using the
+    // given `el`. `el` can be a CSS selector or an HTML string, a jQuery
+    // context or an element. Subclasses can override this to utilize an
+    // alternative DOM manipulation API and are only required to set the
+    // `this.el` property.
+    _setElement: function(el) {
+      this.$el = el instanceof Backbone.$ ? el : Backbone.$(el);
+      this.el = this.$el[0];
+    },
+
+    // Set callbacks, where `this.events` is a hash of
+    //
+    // *{"event selector": "callback"}*
+    //
+    //     {
+    //       'mousedown .title':  'edit',
+    //       'click .button':     'save',
+    //       'click .open':       function(e) { ... }
+    //     }
+    //
+    // pairs. Callbacks will be bound to the view, with `this` set properly.
+    // Uses event delegation for efficiency.
+    // Omitting the selector binds the event to `this.el`.
+    delegateEvents: function(events) {
+      events || (events = _.result(this, 'events'));
+      if (!events) return this;
+      this.undelegateEvents();
+      for (var key in events) {
+        var method = events[key];
+        if (!_.isFunction(method)) method = this[method];
+        if (!method) continue;
+        var match = key.match(delegateEventSplitter);
+        this.delegate(match[1], match[2], _.bind(method, this));
+      }
+      return this;
+    },
+
+    // Add a single event listener to the view's element (or a child element
+    // using `selector`). This only works for delegate-able events: not `focus`,
+    // `blur`, and not `change`, `submit`, and `reset` in Internet Explorer.
+    delegate: function(eventName, selector, listener) {
+      this.$el.on(eventName + '.delegateEvents' + this.cid, selector, listener);
+      return this;
+    },
+
+    // Clears all callbacks previously bound to the view by `delegateEvents`.
+    // You usually don't need to use this, but may wish to if you have multiple
+    // Backbone views attached to the same DOM element.
+    undelegateEvents: function() {
+      if (this.$el) this.$el.off('.delegateEvents' + this.cid);
+      return this;
+    },
+
+    // A finer-grained `undelegateEvents` for removing a single delegated event.
+    // `selector` and `listener` are both optional.
+    undelegate: function(eventName, selector, listener) {
+      this.$el.off(eventName + '.delegateEvents' + this.cid, selector, listener);
+      return this;
+    },
+
+    // Produces a DOM element to be assigned to your view. Exposed for
+    // subclasses using an alternative DOM manipulation API.
+    _createElement: function(tagName) {
+      return document.createElement(tagName);
+    },
+
+    // Ensure that the View has a DOM element to render into.
+    // If `this.el` is a string, pass it through `$()`, take the first
+    // matching element, and re-assign it to `el`. Otherwise, create
+    // an element from the `id`, `className` and `tagName` properties.
+    _ensureElement: function() {
+      if (!this.el) {
+        var attrs = _.extend({}, _.result(this, 'attributes'));
+        if (this.id) attrs.id = _.result(this, 'id');
+        if (this.className) attrs['class'] = _.result(this, 'className');
+        this.setElement(this._createElement(_.result(this, 'tagName')));
+        this._setAttributes(attrs);
+      } else {
+        this.setElement(_.result(this, 'el'));
+      }
+    },
+
+    // Set attributes from a hash on this view's element.  Exposed for
+    // subclasses using an alternative DOM manipulation API.
+    _setAttributes: function(attributes) {
+      this.$el.attr(attributes);
+    }
+
+  });
+
+  // Backbone.sync
+  // -------------
+
+  // Override this function to change the manner in which Backbone persists
+  // models to the server. You will be passed the type of request, and the
+  // model in question. By default, makes a RESTful Ajax request
+  // to the model's `url()`. Some possible customizations could be:
+  //
+  // * Use `setTimeout` to batch rapid-fire updates into a single request.
+  // * Send up the models as XML instead of JSON.
+  // * Persist models via WebSockets instead of Ajax.
+  //
+  // Turn on `Backbone.emulateHTTP` in order to send `PUT` and `DELETE` requests
+  // as `POST`, with a `_method` parameter containing the true HTTP method,
+  // as well as all requests with the body as `application/x-www-form-urlencoded`
+  // instead of `application/json` with the model in a param named `model`.
+  // Useful when interfacing with server-side languages like **PHP** that make
+  // it difficult to read the body of `PUT` requests.
+  Backbone.sync = function(method, model, options) {
+    var type = methodMap[method];
+
+    // Default options, unless specified.
+    _.defaults(options || (options = {}), {
+      emulateHTTP: Backbone.emulateHTTP,
+      emulateJSON: Backbone.emulateJSON
+    });
+
+    // Default JSON-request options.
+    var params = {type: type, dataType: 'json'};
+
+    // Ensure that we have a URL.
+    if (!options.url) {
+      params.url = _.result(model, 'url') || urlError();
+    }
+
+    // Ensure that we have the appropriate request data.
+    if (options.data == null && model && (method === 'create' || method === 'update' || method === 'patch')) {
+      params.contentType = 'application/json';
+      params.data = JSON.stringify(options.attrs || model.toJSON(options));
+    }
+
+    // For older servers, emulate JSON by encoding the request into an HTML-form.
+    if (options.emulateJSON) {
+      params.contentType = 'application/x-www-form-urlencoded';
+      params.data = params.data ? {model: params.data} : {};
+    }
+
+    // For older servers, emulate HTTP by mimicking the HTTP method with `_method`
+    // And an `X-HTTP-Method-Override` header.
+    if (options.emulateHTTP && (type === 'PUT' || type === 'DELETE' || type === 'PATCH')) {
+      params.type = 'POST';
+      if (options.emulateJSON) params.data._method = type;
+      var beforeSend = options.beforeSend;
+      options.beforeSend = function(xhr) {
+        xhr.setRequestHeader('X-HTTP-Method-Override', type);
+        if (beforeSend) return beforeSend.apply(this, arguments);
+      };
+    }
+
+    // Don't process data on a non-GET request.
+    if (params.type !== 'GET' && !options.emulateJSON) {
+      params.processData = false;
+    }
+
+    // Pass along `textStatus` and `errorThrown` from jQuery.
+    var error = options.error;
+    options.error = function(xhr, textStatus, errorThrown) {
+      options.textStatus = textStatus;
+      options.errorThrown = errorThrown;
+      if (error) error.call(options.context, xhr, textStatus, errorThrown);
+    };
+
+    // Make the request, allowing the user to override any Ajax options.
+    var xhr = options.xhr = Backbone.ajax(_.extend(params, options));
+    model.trigger('request', model, xhr, options);
+    return xhr;
+  };
+
+  // Map from CRUD to HTTP for our default `Backbone.sync` implementation.
+  var methodMap = {
+    'create': 'POST',
+    'update': 'PUT',
+    'patch': 'PATCH',
+    'delete': 'DELETE',
+    'read': 'GET'
+  };
+
+  // Set the default implementation of `Backbone.ajax` to proxy through to `$`.
+  // Override this if you'd like to use a different library.
+  Backbone.ajax = function() {
+    return Backbone.$.ajax.apply(Backbone.$, arguments);
+  };
+
+  // Backbone.Router
+  // ---------------
+
+  // Routers map faux-URLs to actions, and fire events when routes are
+  // matched. Creating a new one sets its `routes` hash, if not set statically.
+  var Router = Backbone.Router = function(options) {
+    options || (options = {});
+    if (options.routes) this.routes = options.routes;
+    this._bindRoutes();
+    this.initialize.apply(this, arguments);
+  };
+
+  // Cached regular expressions for matching named param parts and splatted
+  // parts of route strings.
+  var optionalParam = /\((.*?)\)/g;
+  var namedParam    = /(\(\?)?:\w+/g;
+  var splatParam    = /\*\w+/g;
+  var escapeRegExp  = /[\-{}\[\]+?.,\\\^$|#\s]/g;
+
+  // Set up all inheritable **Backbone.Router** properties and methods.
+  _.extend(Router.prototype, Events, {
+
+    // Initialize is an empty function by default. Override it with your own
+    // initialization logic.
+    initialize: function(){},
+
+    // Manually bind a single named route to a callback. For example:
+    //
+    //     this.route('search/:query/p:num', 'search', function(query, num) {
+    //       ...
+    //     });
+    //
+    route: function(route, name, callback) {
+      if (!_.isRegExp(route)) route = this._routeToRegExp(route);
+      if (_.isFunction(name)) {
+        callback = name;
+        name = '';
+      }
+      if (!callback) callback = this[name];
+      var router = this;
+      Backbone.history.route(route, function(fragment) {
+        var args = router._extractParameters(route, fragment);
+        if (router.execute(callback, args, name) !== false) {
+          router.trigger.apply(router, ['route:' + name].concat(args));
+          router.trigger('route', name, args);
+          Backbone.history.trigger('route', router, name, args);
+        }
+      });
+      return this;
+    },
+
+    // Execute a route handler with the provided parameters.  This is an
+    // excellent place to do pre-route setup or post-route cleanup.
+    execute: function(callback, args, name) {
+      if (callback) callback.apply(this, args);
+    },
+
+    // Simple proxy to `Backbone.history` to save a fragment into the history.
+    navigate: function(fragment, options) {
+      Backbone.history.navigate(fragment, options);
+      return this;
+    },
+
+    // Bind all defined routes to `Backbone.history`. We have to reverse the
+    // order of the routes here to support behavior where the most general
+    // routes can be defined at the bottom of the route map.
+    _bindRoutes: function() {
+      if (!this.routes) return;
+      this.routes = _.result(this, 'routes');
+      var route, routes = _.keys(this.routes);
+      while ((route = routes.pop()) != null) {
+        this.route(route, this.routes[route]);
+      }
+    },
+
+    // Convert a route string into a regular expression, suitable for matching
+    // against the current location hash.
+    _routeToRegExp: function(route) {
+      route = route.replace(escapeRegExp, '\\$&')
+                   .replace(optionalParam, '(?:$1)?')
+                   .replace(namedParam, function(match, optional) {
+                     return optional ? match : '([^/?]+)';
+                   })
+                   .replace(splatParam, '([^?]*?)');
+      return new RegExp('^' + route + '(?:\\?([\\s\\S]*))?$');
+    },
+
+    // Given a route, and a URL fragment that it matches, return the array of
+    // extracted decoded parameters. Empty or unmatched parameters will be
+    // treated as `null` to normalize cross-browser behavior.
+    _extractParameters: function(route, fragment) {
+      var params = route.exec(fragment).slice(1);
+      return _.map(params, function(param, i) {
+        // Don't decode the search params.
+        if (i === params.length - 1) return param || null;
+        return param ? decodeURIComponent(param) : null;
+      });
+    }
+
+  });
+
+  // Backbone.History
+  // ----------------
+
+  // Handles cross-browser history management, based on either
+  // [pushState](http://diveintohtml5.info/history.html) and real URLs, or
+  // [onhashchange](https://developer.mozilla.org/en-US/docs/DOM/window.onhashchange)
+  // and URL fragments. If the browser supports neither (old IE, natch),
+  // falls back to polling.
+  var History = Backbone.History = function() {
+    this.handlers = [];
+    this.checkUrl = _.bind(this.checkUrl, this);
+
+    // Ensure that `History` can be used outside of the browser.
+    if (typeof window !== 'undefined') {
+      this.location = window.location;
+      this.history = window.history;
+    }
+  };
+
+  // Cached regex for stripping a leading hash/slash and trailing space.
+  var routeStripper = /^[#\/]|\s+$/g;
+
+  // Cached regex for stripping leading and trailing slashes.
+  var rootStripper = /^\/+|\/+$/g;
+
+  // Cached regex for stripping urls of hash.
+  var pathStripper = /#.*$/;
+
+  // Has the history handling already been started?
+  History.started = false;
+
+  // Set up all inheritable **Backbone.History** properties and methods.
+  _.extend(History.prototype, Events, {
+
+    // The default interval to poll for hash changes, if necessary, is
+    // twenty times a second.
+    interval: 50,
+
+    // Are we at the app root?
+    atRoot: function() {
+      var path = this.location.pathname.replace(/[^\/]$/, '$&/');
+      return path === this.root && !this.getSearch();
+    },
+
+    // Does the pathname match the root?
+    matchRoot: function() {
+      var path = this.decodeFragment(this.location.pathname);
+      var rootPath = path.slice(0, this.root.length - 1) + '/';
+      return rootPath === this.root;
+    },
+
+    // Unicode characters in `location.pathname` are percent encoded so they're
+    // decoded for comparison. `%25` should not be decoded since it may be part
+    // of an encoded parameter.
+    decodeFragment: function(fragment) {
+      return decodeURI(fragment.replace(/%25/g, '%2525'));
+    },
+
+    // In IE6, the hash fragment and search params are incorrect if the
+    // fragment contains `?`.
+    getSearch: function() {
+      var match = this.location.href.replace(/#.*/, '').match(/\?.+/);
+      return match ? match[0] : '';
+    },
+
+    // Gets the true hash value. Cannot use location.hash directly due to bug
+    // in Firefox where location.hash will always be decoded.
+    getHash: function(window) {
+      var match = (window || this).location.href.match(/#(.*)$/);
+      return match ? match[1] : '';
+    },
+
+    // Get the pathname and search params, without the root.
+    getPath: function() {
+      var path = this.decodeFragment(
+        this.location.pathname + this.getSearch()
+      ).slice(this.root.length - 1);
+      return path.charAt(0) === '/' ? path.slice(1) : path;
+    },
+
+    // Get the cross-browser normalized URL fragment from the path or hash.
+    getFragment: function(fragment) {
+      if (fragment == null) {
+        if (this._usePushState || !this._wantsHashChange) {
+          fragment = this.getPath();
+        } else {
+          fragment = this.getHash();
+        }
+      }
+      return fragment.replace(routeStripper, '');
+    },
+
+    // Start the hash change handling, returning `true` if the current URL matches
+    // an existing route, and `false` otherwise.
+    start: function(options) {
+      if (History.started) throw new Error('Backbone.history has already been started');
+      History.started = true;
+
+      // Figure out the initial configuration. Do we need an iframe?
+      // Is pushState desired ... is it available?
+      this.options          = _.extend({root: '/'}, this.options, options);
+      this.root             = this.options.root;
+      this._wantsHashChange = this.options.hashChange !== false;
+      this._hasHashChange   = 'onhashchange' in window && (document.documentMode === void 0 || document.documentMode > 7);
+      this._useHashChange   = this._wantsHashChange && this._hasHashChange;
+      this._wantsPushState  = !!this.options.pushState;
+      this._hasPushState    = !!(this.history && this.history.pushState);
+      this._usePushState    = this._wantsPushState && this._hasPushState;
+      this.fragment         = this.getFragment();
+
+      // Normalize root to always include a leading and trailing slash.
+      this.root = ('/' + this.root + '/').replace(rootStripper, '/');
+
+      // Transition from hashChange to pushState or vice versa if both are
+      // requested.
+      if (this._wantsHashChange && this._wantsPushState) {
+
+        // If we've started off with a route from a `pushState`-enabled
+        // browser, but we're currently in a browser that doesn't support it...
+        if (!this._hasPushState && !this.atRoot()) {
+          var rootPath = this.root.slice(0, -1) || '/';
+          this.location.replace(rootPath + '#' + this.getPath());
+          // Return immediately as browser will do redirect to new url
+          return true;
+
+        // Or if we've started out with a hash-based route, but we're currently
+        // in a browser where it could be `pushState`-based instead...
+        } else if (this._hasPushState && this.atRoot()) {
+          this.navigate(this.getHash(), {replace: true});
+        }
+
+      }
+
+      // Proxy an iframe to handle location events if the browser doesn't
+      // support the `hashchange` event, HTML5 history, or the user wants
+      // `hashChange` but not `pushState`.
+      if (!this._hasHashChange && this._wantsHashChange && !this._usePushState) {
+        this.iframe = document.createElement('iframe');
+        this.iframe.src = 'javascript:0';
+        this.iframe.style.display = 'none';
+        this.iframe.tabIndex = -1;
+        var body = document.body;
+        // Using `appendChild` will throw on IE < 9 if the document is not ready.
+        var iWindow = body.insertBefore(this.iframe, body.firstChild).contentWindow;
+        iWindow.document.open();
+        iWindow.document.close();
+        iWindow.location.hash = '#' + this.fragment;
+      }
+
+      // Add a cross-platform `addEventListener` shim for older browsers.
+      var addEventListener = window.addEventListener || function(eventName, listener) {
+        return attachEvent('on' + eventName, listener);
+      };
+
+      // Depending on whether we're using pushState or hashes, and whether
+      // 'onhashchange' is supported, determine how we check the URL state.
+      if (this._usePushState) {
+        addEventListener('popstate', this.checkUrl, false);
+      } else if (this._useHashChange && !this.iframe) {
+        addEventListener('hashchange', this.checkUrl, false);
+      } else if (this._wantsHashChange) {
+        this._checkUrlInterval = setInterval(this.checkUrl, this.interval);
+      }
+
+      if (!this.options.silent) return this.loadUrl();
+    },
+
+    // Disable Backbone.history, perhaps temporarily. Not useful in a real app,
+    // but possibly useful for unit testing Routers.
+    stop: function() {
+      // Add a cross-platform `removeEventListener` shim for older browsers.
+      var removeEventListener = window.removeEventListener || function(eventName, listener) {
+        return detachEvent('on' + eventName, listener);
+      };
+
+      // Remove window listeners.
+      if (this._usePushState) {
+        removeEventListener('popstate', this.checkUrl, false);
+      } else if (this._useHashChange && !this.iframe) {
+        removeEventListener('hashchange', this.checkUrl, false);
+      }
+
+      // Clean up the iframe if necessary.
+      if (this.iframe) {
+        document.body.removeChild(this.iframe);
+        this.iframe = null;
+      }
+
+      // Some environments will throw when clearing an undefined interval.
+      if (this._checkUrlInterval) clearInterval(this._checkUrlInterval);
+      History.started = false;
+    },
+
+    // Add a route to be tested when the fragment changes. Routes added later
+    // may override previous routes.
+    route: function(route, callback) {
+      this.handlers.unshift({route: route, callback: callback});
+    },
+
+    // Checks the current URL to see if it has changed, and if it has,
+    // calls `loadUrl`, normalizing across the hidden iframe.
+    checkUrl: function(e) {
+      var current = this.getFragment();
+
+      // If the user pressed the back button, the iframe's hash will have
+      // changed and we should use that for comparison.
+      if (current === this.fragment && this.iframe) {
+        current = this.getHash(this.iframe.contentWindow);
+      }
+
+      if (current === this.fragment) return false;
+      if (this.iframe) this.navigate(current);
+      this.loadUrl();
+    },
+
+    // Attempt to load the current URL fragment. If a route succeeds with a
+    // match, returns `true`. If no defined routes matches the fragment,
+    // returns `false`.
+    loadUrl: function(fragment) {
+      // If the root doesn't match, no routes can match either.
+      if (!this.matchRoot()) return false;
+      fragment = this.fragment = this.getFragment(fragment);
+      return _.some(this.handlers, function(handler) {
+        if (handler.route.test(fragment)) {
+          handler.callback(fragment);
+          return true;
+        }
+      });
+    },
+
+    // Save a fragment into the hash history, or replace the URL state if the
+    // 'replace' option is passed. You are responsible for properly URL-encoding
+    // the fragment in advance.
+    //
+    // The options object can contain `trigger: true` if you wish to have the
+    // route callback be fired (not usually desirable), or `replace: true`, if
+    // you wish to modify the current URL without adding an entry to the history.
+    navigate: function(fragment, options) {
+      if (!History.started) return false;
+      if (!options || options === true) options = {trigger: !!options};
+
+      // Normalize the fragment.
+      fragment = this.getFragment(fragment || '');
+
+      // Don't include a trailing slash on the root.
+      var rootPath = this.root;
+      if (fragment === '' || fragment.charAt(0) === '?') {
+        rootPath = rootPath.slice(0, -1) || '/';
+      }
+      var url = rootPath + fragment;
+
+      // Strip the hash and decode for matching.
+      fragment = this.decodeFragment(fragment.replace(pathStripper, ''));
+
+      if (this.fragment === fragment) return;
+      this.fragment = fragment;
+
+      // If pushState is available, we use it to set the fragment as a real URL.
+      if (this._usePushState) {
+        this.history[options.replace ? 'replaceState' : 'pushState']({}, document.title, url);
+
+      // If hash changes haven't been explicitly disabled, update the hash
+      // fragment to store history.
+      } else if (this._wantsHashChange) {
+        this._updateHash(this.location, fragment, options.replace);
+        if (this.iframe && fragment !== this.getHash(this.iframe.contentWindow)) {
+          var iWindow = this.iframe.contentWindow;
+
+          // Opening and closing the iframe tricks IE7 and earlier to push a
+          // history entry on hash-tag change.  When replace is true, we don't
+          // want this.
+          if (!options.replace) {
+            iWindow.document.open();
+            iWindow.document.close();
+          }
+
+          this._updateHash(iWindow.location, fragment, options.replace);
+        }
+
+      // If you've told us that you explicitly don't want fallback hashchange-
+      // based history, then `navigate` becomes a page refresh.
+      } else {
+        return this.location.assign(url);
+      }
+      if (options.trigger) return this.loadUrl(fragment);
+    },
+
+    // Update the hash location, either replacing the current entry, or adding
+    // a new one to the browser history.
+    _updateHash: function(location, fragment, replace) {
+      if (replace) {
+        var href = location.href.replace(/(javascript:|#).*$/, '');
+        location.replace(href + '#' + fragment);
+      } else {
+        // Some browsers require that `hash` contains a leading #.
+        location.hash = '#' + fragment;
+      }
+    }
+
+  });
+
+  // Create the default Backbone.history.
+  Backbone.history = new History;
+
+  // Helpers
+  // -------
+
+  // Helper function to correctly set up the prototype chain for subclasses.
+  // Similar to `goog.inherits`, but uses a hash of prototype properties and
+  // class properties to be extended.
+  var extend = function(protoProps, staticProps) {
+    var parent = this;
+    var child;
+
+    // The constructor function for the new subclass is either defined by you
+    // (the "constructor" property in your `extend` definition), or defaulted
+    // by us to simply call the parent constructor.
+    if (protoProps && _.has(protoProps, 'constructor')) {
+      child = protoProps.constructor;
+    } else {
+      child = function(){ return parent.apply(this, arguments); };
+    }
+
+    // Add static properties to the constructor function, if supplied.
+    _.extend(child, parent, staticProps);
+
+    // Set the prototype chain to inherit from `parent`, without calling
+    // `parent`'s constructor function and add the prototype properties.
+    child.prototype = _.create(parent.prototype, protoProps);
+    child.prototype.constructor = child;
+
+    // Set a convenience property in case the parent's prototype is needed
+    // later.
+    child.__super__ = parent.prototype;
+
+    return child;
+  };
+
+  // Set up inheritance for the model, collection, router, view and history.
+  Model.extend = Collection.extend = Router.extend = View.extend = History.extend = extend;
+
+  // Throw an error when a URL is needed, and none is supplied.
+  var urlError = function() {
+    throw new Error('A "url" property or function must be specified');
+  };
+
+  // Wrap an optional error callback with a fallback error event.
+  var wrapError = function(model, options) {
+    var error = options.error;
+    options.error = function(resp) {
+      if (error) error.call(options.context, model, resp, options);
+      model.trigger('error', model, resp, options);
+    };
+  };
+
+  return Backbone;
+});
diff --git a/js/3rdparty/backbone.marionette.min.js b/js/3rdparty/backbone.marionette.min.js
new file mode 100644
index 000000000..7067c3bfe
--- /dev/null
+++ b/js/3rdparty/backbone.marionette.min.js
@@ -0,0 +1,13 @@
+/**
+* @license
+* MarionetteJS (Backbone.Marionette)
+* ----------------------------------
+* v3.4.3
+*
+* Copyright (c)2017 Derick Bailey, Muted Solutions, LLC.
+* Distributed under MIT license
+*
+* http://marionettejs.com
+*/
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("backbone"),require("underscore"),require("backbone.radio")):"function"==typeof define&&define.amd?define(["backbone","underscore","backbone.radio"],t):e.Marionette=t(e.Backbone,e._,e.Backbone.Radio)}(this,function(e,t,i){"use strict";function n(e,t,i){return i.toUpperCase()}function s(e){for(var i=arguments.length,n=Array(i>1?i-1:0),s=1;s<i;s++)n[s-1]=arguments[s];var r=W(e),o=H.call(this,r),h=void 0;return t.isFunction(o)&&(h=o.apply(this,n)),this.trigger.apply(this,arguments),h}function r(e){for(var i=arguments.length,n=Array(i>1?i-1:0),r=1;r<i;r++)n[r-1]=arguments[r];return t.isFunction(e.triggerMethod)?e.triggerMethod.apply(e,n):s.apply(e,n)}function o(e,i,n){e._getImmediateChildren&&t.each(e._getImmediateChildren(),function(e){n(e)&&r(e,i,e)})}function h(e){return!e._isAttached}function d(e){return!!h(e)&&(e._isAttached=!0,!0)}function l(e){return e._isAttached}function a(e){return!!l(e)&&(e._isAttached=!1,!0)}function c(e){e._isAttached&&e._isRendered&&r(e,"dom:refresh",e)}function u(e){e._isAttached&&e._isRendered&&r(e,"dom:remove",e)}function f(){o(this,"before:attach",h)}function _(){o(this,"attach",d),c(this)}function p(){o(this,"before:detach",l),u(this)}function g(){o(this,"detach",a)}function v(){u(this)}function m(){c(this)}function w(e){e._areViewEventsMonitored||!1===e.monitorViewEvents||(e._areViewEventsMonitored=!0,e.on({"before:attach":f,attach:_,"before:detach":p,detach:g,"before:render":v,render:m}))}function y(e,i,n,s,r){var o=s.split(/\s+/);t.each(o,function(t){var s=e[t];if(!s)throw new Z('Method "'+t+'" was configured as an event handler, but does not exist.');e[r](i,n,s)})}function V(e,i,n,s){if(i&&n){if(!t.isObject(n))throw new Z({message:"Bindings must be an object.",url:"marionette.functions.html#marionettebindevents"});t.each(n,function(n,r){t.isString(n)?y(e,i,r,n,s):e[s](i,r,n)})}}function C(e,t){return V(this,e,t,"listenTo"),this}function E(e,t){return V(this,e,t,"stopListening"),this}function b(e,i,n,s){if(i&&n){if(!t.isObject(n))throw new Z({message:"Bindings must be an object.",url:"marionette.functions.html#marionettebindrequests"});var r=q.call(e,n);i[s](r,e)}}function M(e,t){return b(this,e,t,"reply"),this}function R(e,t){return b(this,e,t,"stopReplying"),this}function B(e,i){return e.behaviorClass?e.behaviorClass:t.isFunction(e)?e:t.isFunction(Pe.Behaviors.behaviorsLookup)?Pe.Behaviors.behaviorsLookup(e,i)[i]:Pe.Behaviors.behaviorsLookup[i]}function x(e,i){return t.chain(i).map(function(i,n){var s=B(i,n),r=new s(i===s?{}:i,e),o=x(e,t.result(r,"behaviors"));return[r].concat(o)}).flatten().value()}function D(e,i){return""+e+t.uniqueId(".evt")+" "+i}function A(e){return!!oe[e]}function O(e,i){t.isString(i)&&(i={event:i});var n=i.event,s=!!i.preventDefault;A("triggersPreventDefault")&&(s=!1!==i.preventDefault);var r=!!i.stopPropagation;return A("triggersStopPropagation")&&(r=!1!==i.stopPropagation),function(t){s&&t.preventDefault(),r&&t.stopPropagation(),e.triggerMethod(n,e,t)}}function I(t){return t instanceof e.$?t:e.$(t)}function $(e){return this.prototype.Dom=t.extend({},this.prototype.Dom,e),this}function T(e){e._isRendered||(e.supportsRenderLifecycle||r(e,"before:render",e),e.render(),e.supportsRenderLifecycle||(e._isRendered=!0,r(e,"render",e)))}function U(e){if(e.destroy)e.destroy();else{e.supportsDestroyLifecycle||r(e,"before:destroy",e);var t=e._isAttached&&!e._shouldDisableEvents;t&&r(e,"before:detach",e),e.remove(),t&&(e._isAttached=!1,r(e,"detach",e)),e._isDestroyed=!0,e.supportsDestroyLifecycle||r(e,"destroy",e)}}function S(e,i){var n=t.extend({},i);if(t.isString(e))return t.extend(n,{el:e}),F(n);if(t.isFunction(e))return t.extend(n,{regionClass:e}),F(n);if(t.isObject(e))return e.selector&&k("The selector option on a Region definition object is deprecated. Use el to pass a selector string"),t.extend(n,{el:e.selector},e),F(n);throw new Z({message:"Improper region configuration type.",url:"marionette.region.html#region-configuration-types"})}function F(e){return new(0,e.regionClass)(t.omit(e,"regionClass"))}function L(e,t){return t.model&&t.model.get(e)}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t,i=i&&i.hasOwnProperty("default")?i.default:i;var P=function(e){return function(t){for(var i=arguments.length,n=Array(i>1?i-1:0),s=1;s<i;s++)n[s-1]=arguments[s];return e.apply(t,n)}},z=e.Model.extend,k=function e(i,n){t.isObject(i)&&(i=i.prev+" is going to be removed in the future. Please use "+i.next+" instead."+(i.url?" See: "+i.url:"")),Pe.DEV_MODE&&(void 0!==n&&n||e._cache[i]||(e._warn("Deprecation warning: "+i),e._cache[i]=!0))};k._console="undefined"!=typeof console?console:{},k._warn=function(){return(k._console.warn||k._console.log||t.noop).apply(k._console,arguments)},k._cache={};var j=function(e){return document.documentElement.contains(e&&e.parentNode)},N=function(e,i){var n=this;e&&t.each(i,function(t){var i=e[t];void 0!==i&&(n[t]=i)})},H=function(e){if(e)return this.options&&void 0!==this.options[e]?this.options[e]:this[e]},q=function(e){var i=this;return t.reduce(e,function(e,n,s){return t.isFunction(n)||(n=i[n]),n&&(e[s]=n),e},{})},K=/(^|:)(\w)/gi,W=t.memoize(function(e){return"on"+e.replace(K,n)}),Y=["description","fileName","lineNumber","name","message","number"],Z=z.call(Error,{urlRoot:"http://marionettejs.com/docs/v3.4.3/",constructor:function(e,i){t.isObject(e)?e=(i=e).message:i||(i={});var n=Error.call(this,e);t.extend(this,t.pick(n,Y),t.pick(i,Y)),this.captureStackTrace(),i.url&&(this.url=this.urlRoot+i.url)},captureStackTrace:function(){Error.captureStackTrace&&Error.captureStackTrace(this,Z)},toString:function(){return this.name+": "+this.message+(this.url?" See: "+this.url:"")}});Z.extend=z;var G={normalizeMethods:q,_setOptions:function(e){this.options=t.extend({},t.result(this,"options"),e)},mergeOptions:N,getOption:H,bindEvents:C,unbindEvents:E},J={_initRadio:function(){var e=t.result(this,"channelName");if(e){if(!i)throw new Z({name:"BackboneRadioMissing",message:'The dependency "backbone.radio" is missing.'});var n=this._channel=i.channel(e),s=t.result(this,"radioEvents");this.bindEvents(n,s);var r=t.result(this,"radioRequests");this.bindRequests(n,r),this.on("destroy",this._destroyRadio)}},_destroyRadio:function(){this._channel.stopReplying(null,null,this)},getChannel:function(){return this._channel},bindEvents:C,unbindEvents:E,bindRequests:M,unbindRequests:R},Q=["channelName","radioEvents","radioRequests"],X=function(e){this.hasOwnProperty("options")||this._setOptions(e),this.mergeOptions(e,Q),this._setCid(),this._initRadio(),this.initialize.apply(this,arguments)};X.extend=z,t.extend(X.prototype,e.Events,G,J,{cidPrefix:"mno",_isDestroyed:!1,isDestroyed:function(){return this._isDestroyed},initialize:function(){},_setCid:function(){this.cid||(this.cid=t.uniqueId(this.cidPrefix))},destroy:function(){if(this._isDestroyed)return this;for(var e=arguments.length,t=Array(e),i=0;i<e;i++)t[i]=arguments[i];return this.triggerMethod.apply(this,["before:destroy",this].concat(t)),this._isDestroyed=!0,this.triggerMethod.apply(this,["destroy",this].concat(t)),this.stopListening(),this},triggerMethod:s});var ee=function(e){this.templateId=e};t.extend(ee,{templateCaches:{},get:function(e,t){var i=this.templateCaches[e];return i||(i=new ee(e),this.templateCaches[e]=i),i.load(t)},clear:function(){for(var e=void 0,t=arguments.length,i=Array(t),n=0;n<t;n++)i[n]=arguments[n];var s=i.length;if(s>0)for(e=0;e<s;e++)delete this.templateCaches[i[e]];else this.templateCaches={}}}),t.extend(ee.prototype,{load:function(e){if(this.compiledTemplate)return this.compiledTemplate;var t=this.loadTemplate(this.templateId,e);return this.compiledTemplate=this.compileTemplate(t,e),this.compiledTemplate},loadTemplate:function(t,i){var n=e.$(t);if(!n.length)throw new Z({name:"NoTemplateError",message:'Could not find template: "'+t+'"'});return n.html()},compileTemplate:function(e,i){return t.template(e,i)}});var te=t.invokeMap||t.invoke,ie={_initBehaviors:function(){this._behaviors=this._getBehaviors()},_getBehaviors:function(){var e=t.result(this,"behaviors");return t.isObject(e)?x(this,e):{}},_getBehaviorTriggers:function(){var e=te(this._behaviors,"getTriggers");return t.reduce(e,function(e,i){return t.extend(e,i)},{})},_getBehaviorEvents:function(){var e=te(this._behaviors,"getEvents");return t.reduce(e,function(e,i){return t.extend(e,i)},{})},_proxyBehaviorViewProperties:function(){te(this._behaviors,"proxyViewProperties")},_delegateBehaviorEntityEvents:function(){te(this._behaviors,"delegateEntityEvents")},_undelegateBehaviorEntityEvents:function(){te(this._behaviors,"undelegateEntityEvents")},_destroyBehaviors:function(){for(var e=arguments.length,t=Array(e),i=0;i<e;i++)t[i]=arguments[i];te.apply(void 0,[this._behaviors,"destroy"].concat(t))},_removeBehavior:function(e){this._isDestroyed||(this._behaviors=t.without(this._behaviors,e))},_bindBehaviorUIElements:function(){te(this._behaviors,"bindUIElements")},_unbindBehaviorUIElements:function(){te(this._behaviors,"unbindUIElements")},_triggerEventOnBehaviors:function(){for(var e=this._behaviors,t=0,i=e&&e.length;t<i;t++)s.apply(e[t],arguments)}},ne={_delegateEntityEvents:function(e,i){this._undelegateEntityEvents(e,i);var n=t.result(this,"modelEvents");C.call(this,e,n);var s=t.result(this,"collectionEvents");C.call(this,i,s)},_undelegateEntityEvents:function(e,i){var n=t.result(this,"modelEvents");E.call(this,e,n);var s=t.result(this,"collectionEvents");E.call(this,i,s)}},se=/^(\S+)\s*(.*)$/,re=function(e){var t=e.match(se);return D(t[1],t[2])},oe={childViewEventPrefix:!0,triggersStopPropagation:!0,triggersPreventDefault:!0},he={_getViewTriggers:function(e,i){return t.reduce(i,function(t,i,n){return n=re(n),t[n]=O(e,i),t},{})}},de=function(e,i){return t.reduce(e,function(e,t,n){return e[le(n,i)]=t,e},{})},le=function(e,t){return e.replace(/@ui\.[a-zA-Z-_$0-9]*/g,function(e){return t[e.slice(4)]})},ae=function e(i,n,s){return t.each(i,function(r,o){t.isString(r)?i[o]=le(r,n):t.isObject(r)&&t.isArray(s)&&(t.extend(r,e(t.pick(r,s),n)),t.each(s,function(e){var i=r[e];t.isString(i)&&(r[e]=le(i,n))}))}),i},ce={normalizeUIKeys:function(e){var t=this._getUIBindings();return de(e,t)},normalizeUIString:function(e){var t=this._getUIBindings();return le(e,t)},normalizeUIValues:function(e,t){var i=this._getUIBindings();return ae(e,i,t)},_getUIBindings:function(){var e=t.result(this,"_uiBindings"),i=t.result(this,"ui");return e||i},_bindUIElements:function(){var e=this;if(this.ui){this._uiBindings||(this._uiBindings=this.ui);var i=t.result(this,"_uiBindings");this._ui={},t.each(i,function(t,i){e._ui[i]=e.$(t)}),this.ui=this._ui}},_unbindUIElements:function(){var e=this;this.ui&&this._uiBindings&&(t.each(this.ui,function(t,i){delete e.ui[i]}),this.ui=this._uiBindings,delete this._uiBindings,delete this._ui)},_getUI:function(e){return this._ui[e]}},ue={createBuffer:function(){return document.createDocumentFragment()},getEl:function(e){return I(e)},findEl:function(e,t){return(arguments.length>2&&void 0!==arguments[2]?arguments[2]:I(e)).find(t)},hasEl:function(e,t){return e.contains(t&&t.parentNode)},detachEl:function(e){(arguments.length>1&&void 0!==arguments[1]?arguments[1]:I(e)).detach()},replaceEl:function(e,t){if(e!==t){var i=t.parentNode;i&&i.replaceChild(e,t)}},swapEl:function(e,t){if(e!==t){var i=e.parentNode,n=t.parentNode;if(i&&n){var s=e.nextSibling,r=t.nextSibling;i.insertBefore(t,s),n.insertBefore(e,r)}}},setContents:function(e,t){(arguments.length>2&&void 0!==arguments[2]?arguments[2]:I(e)).html(t)},appendContents:function(e,t){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},n=i._$el,s=void 0===n?I(e):n,r=i._$contents,o=void 0===r?I(t):r;s.append(o)},hasContents:function(e){return e.hasChildNodes()},detachContents:function(e){(arguments.length>1&&void 0!==arguments[1]?arguments[1]:I(e)).contents().detach()}},fe={Dom:ue,supportsRenderLifecycle:!0,supportsDestroyLifecycle:!0,_isDestroyed:!1,isDestroyed:function(){return!!this._isDestroyed},_isRendered:!1,isRendered:function(){return!!this._isRendered},_isAttached:!1,isAttached:function(){return!!this._isAttached},delegateEvents:function(i){this._proxyBehaviorViewProperties(),this._buildEventProxies();var n=this._getEvents(i);void 0===i&&(this.events=n);var s=t.extend({},this._getBehaviorEvents(),n,this._getBehaviorTriggers(),this.getTriggers());return e.View.prototype.delegateEvents.call(this,s),this},_getEvents:function(e){var i=e||this.events;return t.isFunction(i)?this.normalizeUIKeys(i.call(this)):this.normalizeUIKeys(i)},getTriggers:function(){if(this.triggers){var e=this.normalizeUIKeys(t.result(this,"triggers"));return this._getViewTriggers(this,e)}},delegateEntityEvents:function(){return this._delegateEntityEvents(this.model,this.collection),this._delegateBehaviorEntityEvents(),this},undelegateEntityEvents:function(){return this._undelegateEntityEvents(this.model,this.collection),this._undelegateBehaviorEntityEvents(),this},destroy:function(){if(this._isDestroyed)return this;for(var e=this._isAttached&&!this._shouldDisableEvents,t=arguments.length,i=Array(t),n=0;n<t;n++)i[n]=arguments[n];return this.triggerMethod.apply(this,["before:destroy",this].concat(i)),e&&this.triggerMethod("before:detach",this),this.unbindUIElements(),this._removeElement(),e&&(this._isAttached=!1,this.triggerMethod("detach",this)),this._removeChildren(),this._isDestroyed=!0,this._isRendered=!1,this._destroyBehaviors.apply(this,i),this.triggerMethod.apply(this,["destroy",this].concat(i)),this.stopListening(),this},_removeElement:function(){this.$el.off().removeData(),this.Dom.detachEl(this.el,this.$el)},bindUIElements:function(){return this._bindUIElements(),this._bindBehaviorUIElements(),this},unbindUIElements:function(){return this._unbindUIElements(),this._unbindBehaviorUIElements(),this},getUI:function(e){return this._getUI(e)},childViewEventPrefix:function(){return!!A("childViewEventPrefix")&&"childview"},triggerMethod:function(){var e=s.apply(this,arguments);return this._triggerEventOnBehaviors.apply(this,arguments),e},_buildEventProxies:function(){this._childViewEvents=t.result(this,"childViewEvents"),this._childViewTriggers=t.result(this,"childViewTriggers")},_proxyChildViewEvents:function(e){this.listenTo(e,"all",this._childViewEventHandler)},_childViewEventHandler:function(e){for(var i=this.normalizeMethods(this._childViewEvents),n=arguments.length,s=Array(n>1?n-1:0),r=1;r<n;r++)s[r-1]=arguments[r];void 0!==i&&t.isFunction(i[e])&&i[e].apply(this,s);var o=this._childViewTriggers;o&&t.isString(o[e])&&this.triggerMethod.apply(this,[o[e]].concat(s));var h=t.result(this,"childViewEventPrefix");if(!1!==h){var d=h+":"+e;this.triggerMethod.apply(this,[d].concat(s))}}};t.extend(fe,ie,G,ne,he,ce);var _e=["allowMissingEl","parentEl","replaceElement"],pe=X.extend({Dom:ue,cidPrefix:"mnr",replaceElement:!1,_isReplaced:!1,_isSwappingView:!1,constructor:function(t){if(this._setOptions(t),this.mergeOptions(t,_e),this._initEl=this.el=this.getOption("el"),this.el=this.el instanceof e.$?this.el[0]:this.el,!this.el)throw new Z({name:"NoElError",message:'An "el" must be specified for a region.'});this.$el=this.getEl(this.el),X.call(this,t)},show:function(e,t){if(this._ensureElement(t))return(e=this._getView(e,t))===this.currentView?this:(this._isSwappingView=!!this.currentView,this.triggerMethod("before:show",this,e,t),e._isAttached||this.empty(t),this._setupChildView(e),this.currentView=e,T(e),this._attachView(e,t),this.triggerMethod("show",this,e,t),this._isSwappingView=!1,this)},_setupChildView:function(e){w(e),this._proxyChildViewEvents(e),e.on("destroy",this._empty,this)},_proxyChildViewEvents:function(e){var t=this._parentView;t&&t._proxyChildViewEvents(e)},_shouldDisableMonitoring:function(){return this._parentView&&!1===this._parentView.monitorViewEvents},_attachView:function(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=!e._isAttached&&j(this.el)&&!this._shouldDisableMonitoring(),s=void 0===i.replaceElement?!!t.result(this,"replaceElement"):!!i.replaceElement;n&&r(e,"before:attach",e),s?this._replaceEl(e):this.attachHtml(e),n&&(e._isAttached=!0,r(e,"attach",e))},_ensureElement:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(t.isObject(this.el)||(this.$el=this.getEl(this.el),this.el=this.$el[0],this.$el=this.Dom.getEl(this.el)),!this.$el||0===this.$el.length){if(void 0===e.allowMissingEl?!!t.result(this,"allowMissingEl"):!!e.allowMissingEl)return!1;throw new Z('An "el" must exist in DOM for this region '+this.cid)}return!0},_getView:function(t){if(!t)throw new Z({name:"ViewNotValid",message:"The view passed is undefined and therefore invalid. You must pass a view instance to show."});if(t._isDestroyed)throw new Z({name:"ViewDestroyedError",message:'View (cid: "'+t.cid+'") has already been destroyed and cannot be used.'});if(t instanceof e.View)return t;var i=this._getViewOptions(t);return new ye(i)},_getViewOptions:function(e){if(t.isFunction(e))return{template:e};if(t.isObject(e))return e;return{template:function(){return e}}},getEl:function(e){var i=t.result(this,"parentEl");return i&&t.isString(e)?this.Dom.findEl(i,e):this.Dom.getEl(e)},_replaceEl:function(e){this._restoreEl(),e.on("before:destroy",this._restoreEl,this),this.Dom.replaceEl(e.el,this.el),this._isReplaced=!0},_restoreEl:function(){if(this._isReplaced){var e=this.currentView;e&&(this._detachView(e),this._isReplaced=!1)}},isReplaced:function(){return!!this._isReplaced},isSwappingView:function(){return!!this._isSwappingView},attachHtml:function(e){this.Dom.appendContents(this.el,e.el,{_$el:this.$el,_$contents:e.$el})},empty:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{allowMissingEl:!0},t=this.currentView;if(!t)return this._ensureElement(e)&&this.detachHtml(),this;var i=!e.preventDestroy;return i||k("The preventDestroy option is deprecated. Use Region#detachView"),this._empty(t,i),this},_empty:function(e,t){e.off("destroy",this._empty,this),this.triggerMethod("before:empty",this,e),this._restoreEl(),delete this.currentView,e._isDestroyed||(t?this.removeView(e):this._detachView(e),this._stopChildViewEvents(e)),this.triggerMethod("empty",this,e)},_stopChildViewEvents:function(e){this._parentView&&this._parentView.stopListening(e)},destroyView:function(e){return e._isDestroyed?e:(e._shouldDisableEvents=this._shouldDisableMonitoring(),U(e),e)},removeView:function(e){this.destroyView(e)},detachView:function(){var e=this.currentView;if(e)return this._empty(e),e},_detachView:function(e){var t=e._isAttached&&!this._shouldDisableMonitoring(),i=this._isReplaced;t&&r(e,"before:detach",e),i?this.Dom.replaceEl(this.el,e.el):this.detachHtml(),t&&(e._isAttached=!1,r(e,"detach",e))},detachHtml:function(){this.Dom.detachContents(this.el,this.$el)},hasView:function(){return!!this.currentView},reset:function(e){return this.empty(e),this.$el&&(this.el=this._initEl),delete this.$el,this},destroy:function(e){return this._isDestroyed?this:(this.reset(e),this._name&&this._parentView._removeReferences(this._name),delete this._parentView,delete this._name,X.prototype.destroy.apply(this,arguments))}},{setDomApi:$}),ge=function(e,t){return e instanceof pe?e:S(e,t)},ve={regionClass:pe,_initRegions:function(){this.regions=this.regions||{},this._regions={},this.addRegions(t.result(this,"regions"))},_reInitRegions:function(){te(this._regions,"reset")},addRegion:function(e,t){var i={};return i[e]=t,this.addRegions(i)[e]},addRegions:function(e){if(!t.isEmpty(e))return e=this.normalizeUIValues(e,["selector","el"]),this.regions=t.extend({},this.regions,e),this._addRegions(e)},_addRegions:function(e){var i=this,n={regionClass:this.regionClass,parentEl:t.partial(t.result,this,"el")};return t.reduce(e,function(e,t,s){return e[s]=ge(t,n),i._addRegion(e[s],s),e},{})},_addRegion:function(e,t){this.triggerMethod("before:add:region",this,t,e),e._parentView=this,e._name=t,this._regions[t]=e,this.triggerMethod("add:region",this,t,e)},removeRegion:function(e){var t=this._regions[e];return this._removeRegion(t,e),t},removeRegions:function(){var e=this._getRegions();return t.each(this._regions,t.bind(this._removeRegion,this)),e},_removeRegion:function(e,t){this.triggerMethod("before:remove:region",this,t,e),e.destroy(),this.triggerMethod("remove:region",this,t,e)},_removeReferences:function(e){delete this.regions[e],delete this._regions[e]},emptyRegions:function(){var e=this.getRegions();return te(e,"empty"),e},hasRegion:function(e){return!!this.getRegion(e)},getRegion:function(e){return this._isRendered||this.render(),this._regions[e]},_getRegions:function(){return t.clone(this._regions)},getRegions:function(){return this._isRendered||this.render(),this._getRegions()},showChildView:function(e,t){for(var i=this.getRegion(e),n=arguments.length,s=Array(n>2?n-2:0),r=2;r<n;r++)s[r-2]=arguments[r];return i.show.apply(i,[t].concat(s))},detachChildView:function(e){return this.getRegion(e).detachView()},getChildView:function(e){return this.getRegion(e).currentView}},me={render:function(e,i){if(!e)throw new Z({name:"TemplateNotFoundError",message:"Cannot render the template since its false, null or undefined."});return(t.isFunction(e)?e:ee.get(e))(i)}},we=["behaviors","childViewEventPrefix","childViewEvents","childViewTriggers","collectionEvents","events","modelEvents","regionClass","regions","template","templateContext","triggers","ui"],ye=e.View.extend({constructor:function(i){this.render=t.bind(this.render,this),this._setOptions(i),this.mergeOptions(i,we),w(this),this._initBehaviors(),this._initRegions();var n=Array.prototype.slice.call(arguments);n[0]=this.options,e.View.prototype.constructor.apply(this,n),this.delegateEntityEvents(),this._triggerEventOnBehaviors("initialize",this)},serializeData:function(){return this.model||this.collection?this.model?this.serializeModel():{items:this.serializeCollection()}:{}},serializeModel:function(){return this.model?t.clone(this.model.attributes):{}},serializeCollection:function(){return this.collection?this.collection.map(function(e){return t.clone(e.attributes)}):{}},setElement:function(){var t=!!this.el;return e.View.prototype.setElement.apply(this,arguments),t&&(this._isRendered=this.Dom.hasContents(this.el),this._isAttached=j(this.el)),this._isRendered&&this.bindUIElements(),this},render:function(){return this._isDestroyed?this:(this.triggerMethod("before:render",this),this._isRendered&&this._reInitRegions(),this._renderTemplate(),this.bindUIElements(),this._isRendered=!0,this.triggerMethod("render",this),this)},_renderTemplate:function(){var e=this.getTemplate();if(!1!==e){var t=this.mixinTemplateContext(this.serializeData()),i=this._renderHtml(e,t);this.attachElContent(i)}else k("template:false is deprecated.  Use _.noop.")},_renderHtml:function(e,t){return me.render(e,t,this)},getTemplate:function(){return this.template},mixinTemplateContext:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=t.result(this,"templateContext");return t.extend(e,i)},attachElContent:function(e){return this.Dom.setContents(this.el,e,this.$el),this},_removeChildren:function(){this.removeRegions()},_getImmediateChildren:function(){return t.chain(this._getRegions()).map("currentView").compact().value()}},{setRenderer:function(e){return this.prototype._renderHtml=e,this},setDomApi:$});t.extend(ye.prototype,fe,ve);var Ve=["forEach","each","map","find","detect","filter","select","reject","every","all","some","any","include","contains","invoke","toArray","first","initial","rest","last","without","isEmpty","pluck","reduce","partition"],Ce=function(e,i){t.each(Ve,function(n){e[n]=function(){var e=t.result(this,i),s=Array.prototype.slice.call(arguments);return t[n].apply(t,[e].concat(s))}})},Ee=function(e){this._views={},this._indexByModel={},this._indexByCustom={},this._updateLength(),t.each(e,t.bind(this.add,this))};Ce(Ee.prototype,"_getViews"),t.extend(Ee.prototype,{_getViews:function(){return t.values(this._views)},add:function(e,t){return this._add(e,t)._updateLength()},_add:function(e,t){var i=e.cid;return this._views[i]=e,e.model&&(this._indexByModel[e.model.cid]=i),t&&(this._indexByCustom[t]=i),this},findByModel:function(e){return this.findByModelCid(e.cid)},findByModelCid:function(e){var t=this._indexByModel[e];return this.findByCid(t)},findByCustom:function(e){var t=this._indexByCustom[e];return this.findByCid(t)},findByIndex:function(e){return t.values(this._views)[e]},findByCid:function(e){return this._views[e]},remove:function(e){return this._remove(e)._updateLength()},_remove:function(e){var i=e.cid;return e.model&&delete this._indexByModel[e.model.cid],t.some(this._indexByCustom,t.bind(function(e,t){if(e===i)return delete this._indexByCustom[t],!0},this)),delete this._views[i],this},_updateLength:function(){return this.length=t.size(this._views),this}});var be=["behaviors","childView","childViewEventPrefix","childViewEvents","childViewOptions","childViewTriggers","collectionEvents","events","filter","emptyView","emptyViewOptions","modelEvents","reorderOnSort","sort","triggers","ui","viewComparator"],Me=e.View.extend({sort:!0,constructor:function(i){this.render=t.bind(this.render,this),this._setOptions(i),this.mergeOptions(i,be),w(this),this._initBehaviors(),this.once("render",this._initialEvents),this._initChildViewStorage(),this._bufferedChildren=[];var n=Array.prototype.slice.call(arguments);n[0]=this.options,e.View.prototype.constructor.apply(this,n),this.delegateEntityEvents(),this._triggerEventOnBehaviors("initialize",this)},_startBuffering:function(){this._isBuffering=!0},_endBuffering:function(){var e=this._isAttached&&!1!==this.monitorViewEvents?this._getImmediateChildren():[];this._isBuffering=!1,t.each(e,function(e){r(e,"before:attach",e)}),this.attachBuffer(this,this._createBuffer()),t.each(e,function(e){e._isAttached=!0,r(e,"attach",e)}),this._bufferedChildren=[]},_getImmediateChildren:function(){return t.values(this.children._views)},_initialEvents:function(){this.collection&&(this.listenTo(this.collection,"add",this._onCollectionAdd),this.listenTo(this.collection,"update",this._onCollectionUpdate),this.listenTo(this.collection,"reset",this.render),this.sort&&this.listenTo(this.collection,"sort",this._sortViews))},_onCollectionAdd:function(e,i,n){var s=void 0!==n.at&&(n.index||i.indexOf(e));(this.filter||!1===s)&&(s=t.indexOf(this._filteredSortedModels(s),e)),this._shouldAddChild(e,s)&&(this._destroyEmptyView(),this._addChild(e,s))},_onCollectionUpdate:function(e,t){var i=t.changes;this._removeChildModels(i.removed)},_removeChildModels:function(e){var t=this._getRemovedViews(e);t.length&&(this.children._updateLength(),this._updateIndices(t,!1),this.isEmpty()&&this._showEmptyView())},_getRemovedViews:function(e){var i=this;return t.reduce(e,function(e,t){var n=t&&i.children.findByModel(t);return!n||n._isDestroyed?e:(i._removeChildView(n),e.push(n),e)},[])},_removeChildView:function(e){this.triggerMethod("before:remove:child",this,e),this.children._remove(e),e._shouldDisableEvents=!1===this.monitorViewEvents,U(e),this.stopListening(e),this.triggerMethod("remove:child",this,e)},setElement:function(){var t=!!this.el;return e.View.prototype.setElement.apply(this,arguments),t&&(this._isAttached=j(this.el)),this},render:function(){return this._isDestroyed?this:(this.triggerMethod("before:render",this),this._renderChildren(),this._isRendered=!0,this.triggerMethod("render",this),this)},setFilter:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).preventRender,i=this._isRendered&&!this._isDestroyed,n=this.filter!==e;if(i&&n&&!t){var s=this._filteredSortedModels();this.filter=e;var r=this._filteredSortedModels();this._applyModelDeltas(r,s)}else this.filter=e;return this},removeFilter:function(e){return this.setFilter(null,e)},_applyModelDeltas:function(e,i){var n=this,s={};t.each(e,function(e,t){!n.children.findByModel(e)&&n._onCollectionAdd(e,n.collection,{at:t}),s[e.cid]=!0});var r=t.filter(i,function(e){return!s[e.cid]&&n.children.findByModel(e)});this._removeChildModels(r)},reorder:function(){var e=this,i=this.children,n=this._filteredSortedModels();if(!n.length&&this._showingEmptyView)return this;if(t.some(n,function(e){return!i.findByModel(e)}))this.render();else{var s=[],r=t.reduce(this.children._views,function(e,i){var r=t.indexOf(n,i.model);return-1===r?(s.push(i.model),e):(i._index=r,e[r]=i.el,e)},new Array(n.length));this.triggerMethod("before:reorder",this);var o=this.Dom.createBuffer();t.each(r,function(t){e.Dom.appendContents(o,t)}),this._appendReorderedChildren(o),this._removeChildModels(s),this.triggerMethod("reorder",this)}return this},resortView:function(){return this.reorderOnSort?this.reorder():this._renderChildren(),this},_sortViews:function(){var e=this,i=this._filteredSortedModels();t.find(i,function(t,i){var n=e.children.findByModel(t);return!n||n._index!==i})&&this.resortView()},_emptyViewIndex:-1,_appendReorderedChildren:function(e){this.Dom.appendContents(this.el,e,{_$el:this.$el})},_renderChildren:function(){this._isRendered&&(this._destroyEmptyView(),this._destroyChildren());var e=this._filteredSortedModels();this.isEmpty({processedModels:e})?this._showEmptyView():(this.triggerMethod("before:render:children",this),this._startBuffering(),this._showCollection(e),this._endBuffering(),this.triggerMethod("render:children",this))},_createView:function(e,t){var i=this._getChildView(e),n=this._getChildViewOptions(e,t);return this.buildChildView(e,i,n)},_setupChildView:function(e,t){w(e),this._proxyChildViewEvents(e),this.sort&&(e._index=t)},_showCollection:function(e){t.each(e,t.bind(this._addChild,this)),this.children._updateLength()},_filteredSortedModels:function(e){if(!this.collection||!this.collection.length)return[];var t=this.getViewComparator(),i=this.collection.models;if(e=Math.min(Math.max(e,0),i.length-1),t){var n=void 0;e&&(n=i[e],i=i.slice(0,e).concat(i.slice(e+1))),i=this._sortModelsBy(i,t),n&&i.splice(e,0,n)}return i=this._filterModels(i)},getViewComparator:function(){return this.viewComparator},_filterModels:function(e){var i=this;return this.filter&&(e=t.filter(e,function(e,t){return i._shouldAddChild(e,t)})),e},_sortModelsBy:function(e,i){return"string"==typeof i?t.sortBy(e,function(e){return e.get(i)}):1===i.length?t.sortBy(e,t.bind(i,this)):t.clone(e).sort(t.bind(i,this))},_showEmptyView:function(){var i=this._getEmptyView();if(i&&!this._showingEmptyView){this._showingEmptyView=!0;var n=new e.Model,s=this.emptyViewOptions||this.childViewOptions;t.isFunction(s)&&(s=s.call(this,n,this._emptyViewIndex));var r=this.buildChildView(n,i,s);this.triggerMethod("before:render:empty",this,r),this.addChildView(r,0),this.triggerMethod("render:empty",this,r)}},_destroyEmptyView:function(){this._showingEmptyView&&(this.triggerMethod("before:remove:empty",this),this._destroyChildren(),delete this._showingEmptyView,this.triggerMethod("remove:empty",this))},_getEmptyView:function(){var e=this.emptyView;if(e)return this._getView(e)},_getChildView:function(e){var t=this.childView;if(!t)throw new Z({name:"NoChildViewError",message:'A "childView" must be specified'});if(!(t=this._getView(t,e)))throw new Z({name:"InvalidChildViewError",message:'"childView" must be a view class or a function that returns a view class'});return t},_getView:function(i,n){return i.prototype instanceof e.View||i===e.View?i:t.isFunction(i)?i.call(this,n):void 0},_addChild:function(e,t){var i=this._createView(e,t);return this.addChildView(i,t),i},_getChildViewOptions:function(e,i){return t.isFunction(this.childViewOptions)?this.childViewOptions(e,i):this.childViewOptions},addChildView:function(e,t){return this.triggerMethod("before:add:child",this,e),this._setupChildView(e,t),this._isBuffering?this.children._add(e):(this._updateIndices(e,!0),this.children.add(e)),T(e),this._attachView(e,t),this.triggerMethod("add:child",this,e),e},_updateIndices:function(e,i){if(this.sort)if(i){var n=t.isArray(e)?t.max(e,"_index"):e;t.isObject(n)&&t.each(this.children._views,function(e){e._index>=n._index&&(e._index+=1)})}else t.each(t.sortBy(this.children._views,"_index"),function(e,t){e._index=t})},_attachView:function(e,t){var i=!e._isAttached&&!this._isBuffering&&this._isAttached&&!1!==this.monitorViewEvents;i&&r(e,"before:attach",e),this.attachHtml(this,e,t),i&&(e._isAttached=!0,r(e,"attach",e))},buildChildView:function(e,i,n){return new i(t.extend({model:e},n))},removeChildView:function(e){return!e||e._isDestroyed?e:(this._removeChildView(e),this.children._updateLength(),this._updateIndices(e,!1),e)},isEmpty:function(e){var i=void 0;return t.result(e,"processedModels")?i=e.processedModels:(i=this.collection?this.collection.models:[],i=this._filterModels(i)),0===i.length},attachBuffer:function(e,t){this.Dom.appendContents(e.el,t,{_$el:e.$el})},_createBuffer:function(){var e=this,i=this.Dom.createBuffer();return t.each(this._bufferedChildren,function(t){e.Dom.appendContents(i,t.el,{_$contents:t.$el})}),i},attachHtml:function(e,t,i){e._isBuffering?e._bufferedChildren.splice(i,0,t):e._insertBefore(t,i)||e._insertAfter(t)},_insertBefore:function(e,i){var n=void 0;return this.sort&&i<this.children.length-1&&(n=t.find(this.children._views,function(e){return e._index===i+1})),!!n&&(this.beforeEl(n.el,e.el),!0)},beforeEl:function(e,t){this.$(e).before(t)},_insertAfter:function(e){this.Dom.appendContents(this.el,e.el,{_$el:this.$el,_$contents:e.$el})},_initChildViewStorage:function(){this.children=new Ee},_removeChildren:function(){this._destroyChildren()},_destroyChildren:function(e){this.children.length&&(this.triggerMethod("before:destroy:children",this),t.each(this.children._views,t.bind(this._removeChildView,this)),this.children._updateLength(),this.triggerMethod("destroy:children",this))},_shouldAddChild:function(e,i){var n=this.filter;return!t.isFunction(n)||n.call(this,e,i,this.collection)}},{setDomApi:$});t.extend(Me.prototype,fe);var Re=function(){this._init()};Ce(Re.prototype,"_views"),t.extend(Re.prototype,{_init:function(){this._views=[],this._viewsByCid={},this._indexByModel={},this._updateLength()},_add:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this._views.length,i=e.cid;this._viewsByCid[i]=e,e.model&&(this._indexByModel[e.model.cid]=i),this._views.splice(t,0,e),this._updateLength()},_sort:function(e){return"string"==typeof e?(e=t.partial(L,e),this._sortBy(e)):1===e.length?this._sortBy(e):this._views.sort(e)},_sortBy:function(e){var i=t.sortBy(this._views,e);return this._set(i),i},_set:function(e){this._views.length=0,this._views.push.apply(this._views,e.slice(0)),this._updateLength()},_swap:function(e,t){var i=this.findIndexByView(e),n=this.findIndexByView(t);if(-1!==i&&-1!==n){var s=this._views[i];this._views[i]=this._views[n],this._views[n]=s}},findByModel:function(e){return this.findByModelCid(e.cid)},findByModelCid:function(e){var t=this._indexByModel[e];return this.findByCid(t)},findByIndex:function(e){return this._views[e]},findIndexByView:function(e){return this._views.indexOf(e)},findByCid:function(e){return this._viewsByCid[e]},hasView:function(e){return!!this.findByCid(e.cid)},_remove:function(e){if(this._viewsByCid[e.cid]){e.model&&delete this._indexByModel[e.model.cid],delete this._viewsByCid[e.cid];var t=this.findIndexByView(e);this._views.splice(t,1),this._updateLength()}},_updateLength:function(){this.length=this._views.length}});var Be=["behaviors","childView","childViewEventPrefix","childViewEvents","childViewOptions","childViewTriggers","collectionEvents","emptyView","emptyViewOptions","events","modelEvents","sortWithCollection","triggers","ui","viewComparator","viewFilter"],xe=e.View.extend({sortWithCollection:!0,constructor:function(t){this._setOptions(t),this.mergeOptions(t,Be),w(this),this.once("render",this._initialEvents),this._initChildViewStorage(),this._initBehaviors();var i=Array.prototype.slice.call(arguments);i[0]=this.options,e.View.prototype.constructor.apply(this,i),this.getEmptyRegion(),this.delegateEntityEvents(),this._triggerEventOnBehaviors("initialize",this)},_initChildViewStorage:function(){this.children=new Re},getEmptyRegion:function(){return this._emptyRegion&&!this._emptyRegion.isDestroyed()?this._emptyRegion:(this._emptyRegion=new pe({el:this.el,replaceElement:!1}),this._emptyRegion._parentView=this,this._emptyRegion)},_initialEvents:function(){this.listenTo(this.collection,{sort:this._onCollectionSort,reset:this._onCollectionReset,update:this._onCollectionUpdate})},_onCollectionSort:function(){var e=this;this.sortWithCollection&&!1!==this.viewComparator&&this.collection.length===this.children.length&&(this.collection.some(function(t){return!e.children.findByModel(t)})||this.sort())},_onCollectionReset:function(){this.render()},_onCollectionUpdate:function(e,t){var i=t.changes,n=i.removed.length&&this._removeChildModels(i.removed);this._addedViews=i.added.length&&this._addChildModels(i.added),this._detachChildren(n),this._showChildren(),this._removeChildViews(n)},_removeChildModels:function(e){return t.map(e,t.bind(this._removeChildModel,this))},_removeChildModel:function(e){var t=this.children.findByModel(e);return this._removeChild(t),t},_removeChild:function(e){this.triggerMethod("before:remove:child",this,e),this.children._remove(e),this.triggerMethod("remove:child",this,e)},_addChildModels:function(e){return t.map(e,t.bind(this._addChildModel,this))},_addChildModel:function(e){var t=this._createChildView(e);return this._addChild(t),t},_createChildView:function(e){var t=this._getChildView(e),i=this._getChildViewOptions(e);return this.buildChildView(e,t,i)},_addChild:function(e,t){this.triggerMethod("before:add:child",this,e),this._setupChildView(e),this.children._add(e,t),this.triggerMethod("add:child",this,e)},_getChildView:function(e){var t=this.childView;if(!t)throw new Z({name:"NoChildViewError",message:'A "childView" must be specified'});if(!(t=this._getView(t,e)))throw new Z({name:"InvalidChildViewError",message:'"childView" must be a view class or a function that returns a view class'});return t},_getView:function(i,n){return i.prototype instanceof e.View||i===e.View?i:t.isFunction(i)?i.call(this,n):void 0},_getChildViewOptions:function(e){return t.isFunction(this.childViewOptions)?this.childViewOptions(e):this.childViewOptions},buildChildView:function(e,i,n){return new i(t.extend({model:e},n))},_setupChildView:function(e){w(e),e.on("destroy",this.removeChildView,this),this._proxyChildViewEvents(e)},_getImmediateChildren:function(){return this.children._views},setElement:function(){var t=!!this.el;return e.View.prototype.setElement.apply(this,arguments),t&&(this._isAttached=j(this.el)),this},render:function(){return this._isDestroyed?this:(this.triggerMethod("before:render",this),this._destroyChildren(),this.children._init(),this.collection&&this._addChildModels(this.collection.models),this._showChildren(),this._isRendered=!0,this.triggerMethod("render",this),this)},sort:function(){return this._isDestroyed?this:this.children.length?(this._showChildren(),this):this},_showChildren:function(){this.isEmpty()?this._showEmptyView():(this._sortChildren(),this.filter())},isEmpty:function(e){return e||!this.children.length},_showEmptyView:function(){var e=this._getEmptyView();if(e){var t=this._getEmptyViewOptions();this.getEmptyRegion().show(new e(t))}},_getEmptyView:function(){var e=this.emptyView;if(e)return this._getView(e)},_destroyEmptyView:function(){var e=this.getEmptyRegion();e.hasView()&&e.empty()},_getEmptyViewOptions:function(){var e=this.emptyViewOptions||this.childViewOptions;return t.isFunction(e)?e.call(this):e},_sortChildren:function(){if(!1!==this.viewComparator){this.triggerMethod("before:sort",this);var e=this.getComparator();t.isFunction(e)&&(e=e.bind(this)),this.children._sort(e),this.triggerMethod("sort",this)}},setComparator:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).preventRender,i=this.viewComparator!==e&&!t;return this.viewComparator=e,i&&this.sort(),this},removeComparator:function(e){return this.setComparator(null,e)},getComparator:function(){return this.viewComparator||this._viewComparator},_viewComparator:function(e){if(this.collection)return this.collection.indexOf(e.model)},filter:function(){if(this._isDestroyed)return this;if(!this.children.length)return this;var e=this._filterChildren();return this._renderChildren(e),this},_isAddedAtEnd:function(e,t,i){var n=this.children._views.length-i.length+t;return e===this.children._views[n]},_filterChildren:function(){var e=this._getFilter(),i=this._addedViews;if(delete this._addedViews,!e)return i&&t.every(i,t.bind(this._isAddedAtEnd,this))?i:this.children._views;this.triggerMethod("before:filter",this);var n=t.partition(this.children._views,t.bind(e,this));return this._detachChildren(n[1]),this.triggerMethod("filter",this),n[0]},_getFilter:function(){var e=this.getFilter();if(!e)return!1;if(t.isFunction(e))return e;if(t.isObject(e)){var i=t.matches(e);return function(e){return i(e.model&&e.model.attributes)}}if(t.isString(e))return function(t){return t.model&&t.model.get(e)};throw new Z({name:"InvalidViewFilterError",message:'"viewFilter" must be a function, predicate object literal, a string indicating a model attribute, or falsy'})},getFilter:function(){return this.viewFilter},setFilter:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).preventRender,i=this.viewFilter!==e&&!t;return this.viewFilter=e,i&&this.filter(),this},removeFilter:function(e){return this.setFilter(null,e)},_detachChildren:function(e){t.each(e,t.bind(this._detachChildView,this))},_detachChildView:function(e){var t=e._isAttached&&!1!==this.monitorViewEvents;t&&r(e,"before:detach",e),this.detachHtml(e),t&&(e._isAttached=!1,r(e,"detach",e))},detachHtml:function(e){this.Dom.detachEl(e.el,e.$el)},_renderChildren:function(e){if(this.isEmpty(!e.length))this._showEmptyView();else{this._destroyEmptyView(),this.triggerMethod("before:render:children",this,e);var t=this._getBuffer(e);this._attachChildren(t,e),this.triggerMethod("render:children",this,e)}},_attachChildren:function(e,i){i=this._isAttached&&!1!==this.monitorViewEvents?i:[],t.each(i,function(e){e._isAttached||r(e,"before:attach",e)}),this.attachHtml(e),t.each(i,function(e){e._isAttached||(e._isAttached=!0,r(e,"attach",e))})},_getBuffer:function(e){var i=this,n=this.Dom.createBuffer();return t.each(e,function(e){T(e),i.Dom.appendContents(n,e.el,{_$contents:e.$el})}),n},attachHtml:function(e){this.Dom.appendContents(this.el,e,{_$el:this.$el})},swapChildViews:function(e,t){if(!this.children.hasView(e)||!this.children.hasView(t))throw new Z({name:"ChildSwapError",message:"Both views must be children of the collection view"});return this.children._swap(e,t),this.Dom.swapEl(e.el,t.el),this.Dom.hasEl(this.el,e.el)!==this.Dom.hasEl(this.el,t.el)&&this.filter(),this},addChildView:function(e,t){return!e||e._isDestroyed?e:(this._addChild(e,t),this._addedViews=[e],this._showChildren(),e)},detachChildView:function(e){return this.removeChildView(e,{shouldDetach:!0}),e},removeChildView:function(e,t){return e?(this._removeChildView(e,t),this._removeChild(e),this.isEmpty()&&this._showEmptyView(),e):e},_removeChildViews:function(e){t.each(e,t.bind(this._removeChildView,this))},_removeChildView:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).shouldDetach;e.off("destroy",this.removeChildView,this),t?this._detachChildView(e):this._destroyChildView(e),this.stopListening(e)},_destroyChildView:function(e){e._isDestroyed||(e._shouldDisableEvents=!1===this.monitorViewEvents,U(e))},_removeChildren:function(){this._destroyChildren(),this.getEmptyRegion().destroy(),delete this._addedViews},_destroyChildren:function(){this.children&&this.children.length&&(this.triggerMethod("before:destroy:children",this),!1===this.monitorViewEvents&&this.Dom.detachContents(this.el,this.$el),t.each(this.children._views,t.bind(this._removeChildView,this)),this.triggerMethod("destroy:children",this))}},{setDomApi:$});t.extend(xe.prototype,fe);var De=["childViewContainer","template","templateContext"],Ae=Me.extend({constructor:function(e){k("CompositeView is deprecated. Convert to View at your earliest convenience"),this.mergeOptions(e,De),Me.prototype.constructor.apply(this,arguments)},_initialEvents:function(){this.collection&&(this.listenTo(this.collection,"add",this._onCollectionAdd),this.listenTo(this.collection,"update",this._onCollectionUpdate),this.listenTo(this.collection,"reset",this.renderChildren),this.sort&&this.listenTo(this.collection,"sort",this._sortViews))},_getChildView:function(e){var t=this.childView;if(!t)return this.constructor;if(!(t=this._getView(t,e)))throw new Z({name:"InvalidChildViewError",message:'"childView" must be a view class or a function that returns a view class'});return t},serializeData:function(){return this.serializeModel()},render:function(){return this._isDestroyed?this:(this._isRendering=!0,this.resetChildViewContainer(),this.triggerMethod("before:render",this),this._renderTemplate(),this.bindUIElements(),this.renderChildren(),this._isRendering=!1,this._isRendered=!0,this.triggerMethod("render",this),this)},renderChildren:function(){(this._isRendered||this._isRendering)&&Me.prototype._renderChildren.call(this)},attachBuffer:function(e,t){var i=this.getChildViewContainer(e);this.Dom.appendContents(i[0],t,{_$el:i})},_insertAfter:function(e){var t=this.getChildViewContainer(this,e);this.Dom.appendContents(t[0],e.el,{_$el:t,_$contents:e.$el})},_appendReorderedChildren:function(e){var t=this.getChildViewContainer(this);this.Dom.appendContents(t[0],e,{_$el:t})},getChildViewContainer:function(e,i){if(e.$childViewContainer)return e.$childViewContainer;var n=void 0;if(e.childViewContainer){var s=t.result(e,"childViewContainer");if((n="@"===s.charAt(0)&&e.ui?e.ui[s.substr(4)]:this.$(s)).length<=0)throw new Z({name:"ChildViewContainerMissingError",message:'The specified "childViewContainer" was not found: '+e.childViewContainer})}else n=e.$el;return e.$childViewContainer=n,n},resetChildViewContainer:function(){this.$childViewContainer&&(this.$childViewContainer=void 0)}}),Oe=t.pick(ye.prototype,"serializeModel","getTemplate","_renderTemplate","_renderHtml","mixinTemplateContext","attachElContent");t.extend(Ae.prototype,Oe);var Ie=["collectionEvents","events","modelEvents","triggers","ui"],$e=X.extend({cidPrefix:"mnb",constructor:function(e,i){this.view=i,this.defaults&&k("Behavior defaults are deprecated. For similar functionality set options on the Behavior class."),this.defaults=t.clone(t.result(this,"defaults",{})),this._setOptions(t.extend({},this.defaults,e)),this.mergeOptions(this.options,Ie),this.ui=t.extend({},t.result(this,"ui"),t.result(i,"ui")),X.apply(this,arguments)},$:function(){return this.view.$.apply(this.view,arguments)},destroy:function(){return this.stopListening(),this.view._removeBehavior(this),this},proxyViewProperties:function(){return this.$el=this.view.$el,this.el=this.view.el,this},bindUIElements:function(){return this._bindUIElements(),this},unbindUIElements:function(){return this._unbindUIElements(),this},getUI:function(e){return this._getUI(e)},delegateEntityEvents:function(){return this._delegateEntityEvents(this.view.model,this.view.collection),this},undelegateEntityEvents:function(){return this._undelegateEntityEvents(this.view.model,this.view.collection),this},getEvents:function(){var e=this,i=this.normalizeUIKeys(t.result(this,"events"));return t.reduce(i,function(i,n,s){if(t.isFunction(n)||(n=e[n]),n)return s=re(s),i[s]=t.bind(n,e),i},{})},getTriggers:function(){if(this.triggers){var e=this.normalizeUIKeys(t.result(this,"triggers"));return this._getViewTriggers(this.view,e)}}});t.extend($e.prototype,ne,he,ce);var Te=["region","regionClass"],Ue=X.extend({cidPrefix:"mna",constructor:function(e){this._setOptions(e),this.mergeOptions(e,Te),this._initRegion(),X.prototype.constructor.apply(this,arguments)},regionClass:pe,_initRegion:function(){var e=this.region;if(e){var t={regionClass:this.regionClass};this._region=ge(e,t)}},getRegion:function(){return this._region},showView:function(e){for(var t=this.getRegion(),i=arguments.length,n=Array(i>1?i-1:0),s=1;s<i;s++)n[s-1]=arguments[s];return t.show.apply(t,[e].concat(n))},getView:function(){return this.getRegion().currentView},start:function(e){return this.triggerMethod("before:start",this,e),this.triggerMethod("start",this,e),this}}),Se=["appRoutes","controller"],Fe=e.Router.extend({constructor:function(t){this._setOptions(t),this.mergeOptions(t,Se),e.Router.apply(this,arguments);var i=this.appRoutes,n=this._getController();this.processAppRoutes(n,i),this.on("route",this._processOnRoute,this)},appRoute:function(e,t){var i=this._getController();return this._addAppRoute(i,e,t),this},_processOnRoute:function(e,i){if(t.isFunction(this.onRoute)){var n=t.invert(this.appRoutes)[e];this.onRoute(e,n,i)}},processAppRoutes:function(e,i){var n=this;if(!i)return this;var s=t.keys(i).reverse();return t.each(s,function(t){n._addAppRoute(e,t,i[t])}),this},_getController:function(){return this.controller},_addAppRoute:function(e,i,n){var s=e[n];if(!s)throw new Z('Method "'+n+'" was not found on the controller');this.route(i,n,t.bind(s,e))},triggerMethod:s});t.extend(Fe.prototype,G);var Le=e.Marionette,Pe=e.Marionette={};return Pe.noConflict=function(){return e.Marionette=Le,this},Pe.bindEvents=P(C),Pe.unbindEvents=P(E),Pe.bindRequests=P(M),Pe.unbindRequests=P(R),Pe.mergeOptions=P(N),Pe.getOption=P(H),Pe.normalizeMethods=P(q),Pe.extend=z,Pe.isNodeAttached=j,Pe.deprecate=k,Pe.triggerMethod=P(s),Pe.triggerMethodOn=r,Pe.isEnabled=A,Pe.setEnabled=function(e,t){return oe[e]=t},Pe.monitorViewEvents=w,Pe.Behaviors={},Pe.Behaviors.behaviorsLookup=function(){throw new Z({message:"You must define where your behaviors are stored.",url:"marionette.behaviors.md#behaviorslookup"})},Pe.Application=Ue,Pe.AppRouter=Fe,Pe.Renderer=me,Pe.TemplateCache=ee,Pe.View=ye,Pe.CollectionView=Me,Pe.NextCollectionView=xe,Pe.CompositeView=Ae,Pe.Behavior=$e,Pe.Region=pe,Pe.Error=Z,Pe.Object=X,Pe.DEV_MODE=!1,Pe.FEATURES=oe,Pe.VERSION="3.4.3",Pe.DomApi=ue,Pe.setDomApi=function(e){Me.setDomApi(e),Ae.setDomApi(e),xe.setDomApi(e),pe.setDomApi(e),ye.setDomApi(e)},Pe}),this&&this.Marionette&&(this.Mn=this.Marionette);
+//# sourceMappingURL=backbone.marionette.min.js.map
\ No newline at end of file
diff --git a/js/3rdparty/backbone.marionette.min.js.map b/js/3rdparty/backbone.marionette.min.js.map
new file mode 100644
index 000000000..ca964b24d
--- /dev/null
+++ b/js/3rdparty/backbone.marionette.min.js.map
@@ -0,0 +1 @@
+{"version":3,"sources":["src/common/trigger-method.js","src/common/monitor-view-events.js","src/common/bind-events.js","src/common/bind-requests.js","src/mixins/behaviors.js","src/utils/get-unique-event-name.js","src/config/features.js","src/mixins/triggers.js","src/config/dom.js","src/common/view.js","src/common/build-region.js","src/next-child-view-container.js","src/utils/proxy.js","src/utils/extend.js","src/utils/deprecate.js","src/common/is-node-attached.js","src/common/merge-options.js","src/common/get-option.js","src/common/normalize-methods.js","src/error.js","src/utils/set-options.js","src/mixins/common.js","src/mixins/radio.js","src/object.js","src/template-cache.js","src/utils/invoke.js","src/mixins/delegate-entity-events.js","src/mixins/ui.js","src/mixins/view.js","src/region.js","src/mixins/regions.js","src/config/renderer.js","src/view.js","src/utils/emulate-collection.js","src/child-view-container.js","src/collection-view.js","src/next-collection-view.js","src/composite-view.js","src/behavior.js","src/application.js","src/app-router.js","src/backbone.marionette.js","src/config/behaviors-lookup.js"],"names":["getEventName","match","prefix","eventName","toUpperCase","triggerMethod","event","args","Array","_len","_key","arguments","methodName","getOnMethodName","method","getOption","call","this","result","_","isFunction","apply","trigger","triggerMethodOn","context","_len2","_key2","triggerMethodChildren","view","shouldTrigger","_getImmediateChildren","each","child","shouldTriggerAttach","_isAttached","shouldAttach","shouldTriggerDetach","shouldDetach","triggerDOMRefresh","_isRendered","triggerDOMRemove","handleBeforeAttach","handleAttach","handleBeforeDetach","handleDetach","handleBeforeRender","handleRender","monitorViewEvents","_areViewEventsMonitored","on","bindFromStrings","target","entity","evt","methods","actionName","methodNames","split","MarionetteError","iterateEvents","bindings","isObject","isString","bindEvents","unbindEvents","iterateReplies","channel","normalizedRadioRequests","normalizeMethods","bindRequests","unbindRequests","getBehaviorClass","options","key","behaviorClass","Marionette","Behaviors","behaviorsLookup","parseBehaviors","behaviors","chain","map","BehaviorClass","behavior","nestedBehaviors","concat","flatten","value","uniqueName","selector","uniqueId","isEnabled","name","FEATURES","buildViewTrigger","triggerDef","shouldPreventDefault","preventDefault","shouldStopPropagation","stopPropagation","getEl","el","Backbone","$","setDomApi","mixin","prototype","Dom","extend","renderView","supportsRenderLifecycle","render","destroyView","destroy","supportsDestroyLifecycle","_shouldDisableEvents","remove","_isDestroyed","buildRegionFromDefinition","definition","defaults","opts","buildRegionFromObject","regionClass","RegionClass","omit","stringComparator","comparator","model","get","proxy","Model","deprecate","message","test","prev","next","url","DEV_MODE","undefined","_cache","_warn","_console","console","warn","log","noop","isNodeAttached","document","documentElement","contains","parentNode","mergeOptions","keys","option","optionName","hash","reduce","normalizedHash","_this","splitter","memoize","replace","errorProps","Error","error","pick","captureStackTrace","urlRoot","CommonMixin","RadioMixin","channelName","Radio","_channel","radioEvents","radioRequests","_destroyRadio","stopReplying","ClassOptions","MarionetteObject","hasOwnProperty","_setOptions","_setCid","_initRadio","initialize","Events","cid","cidPrefix","stopListening","TemplateCache","templateId","cachedTemplate","templateCaches","load","i","length","compiledTemplate","template","loadTemplate","compileTemplate","$template","html","rawTemplate","_invoke","invokeMap","invoke","BehaviorsMixin","_behaviors","_getBehaviors","triggers","memo","_triggers","events","_events","without","DelegateEntityEventsMixin","collection","_undelegateEntityEvents","modelEvents","collectionEvents","delegateEventSplitter","getUniqueEventName","TriggersMixin","normalizeUIKeys","ui","val","normalizeUIString","uiString","r","slice","normalizeUIValues","properties","isArray","property","propertyVal","UIMixin","uiBindings","_getUIBindings","_uiBindings","_ui","$el","_this2","DomApi","createDocumentFragment","find","childEl","detach","newEl","oldEl","parent","replaceChild","el1","el2","parent1","parent2","next1","nextSibling","next2","insertBefore","contents","_$el","_ref$_$el","_$contents","_ref$_$contents","append","hasChildNodes","ViewMixin","eventsArg","_proxyBehaviorViewProperties","_buildEventProxies","viewEvents","_getEvents","combinedEvents","_getBehaviorEvents","_getBehaviorTriggers","getTriggers","View","delegateEvents","_getViewTriggers","_delegateEntityEvents","_delegateBehaviorEntityEvents","_undelegateBehaviorEntityEvents","unbindUIElements","_removeElement","_removeChildren","_destroyBehaviors","off","removeData","detachEl","_bindUIElements","_bindBehaviorUIElements","_unbindUIElements","_unbindBehaviorUIElements","_getUI","ret","_triggerEventOnBehaviors","_childViewEvents","_childViewTriggers","listenTo","_childViewEventHandler","childViewEvents","childViewTriggers","childEventName","Region","_initEl","_ensureElement","_getView","currentView","_isSwappingView","empty","_setupChildView","_attachView","_proxyChildViewEvents","_empty","parentView","_parentView","_shouldDisableMonitoring","shouldReplaceEl","replaceElement","_replaceEl","attachHtml","allowMissingEl","viewOptions","_getViewOptions","findEl","_restoreEl","replaceEl","_isReplaced","_detachView","appendContents","detachHtml","shouldDestroy","preventDestroy","removeView","_stopChildViewEvents","shouldRestoreEl","detachContents","reset","_name","_removeReferences","buildRegion","RegionsMixin","regions","_regions","addRegions","isEmpty","_addRegions","regionDefinitions","partial","_addRegion","region","_removeRegion","_getRegions","bind","getRegions","getRegion","clone","show","detachView","Renderer","data","_initBehaviors","_initRegions","constructor","delegateEntityEvents","serializeModel","serializeCollection","attributes","hasEl","setElement","hasContents","bindUIElements","_reInitRegions","_renderTemplate","getTemplate","mixinTemplateContext","serializeData","_renderHtml","attachElContent","templateContext","setContents","removeRegions","compact","renderer","emulateCollection","object","listProperty","list","Container","views","_views","_indexByModel","_indexByCustom","_updateLength","add","values","customIndex","_add","viewCid","findByModelCid","modelCid","findByCid","index","_remove","some","size","CollectionView","once","_initialEvents","_initChildViewStorage","_bufferedChildren","_isBuffering","triggerOnChildren","attachBuffer","_createBuffer","children","_onCollectionAdd","_onCollectionUpdate","sort","_sortViews","at","indexOf","filter","_filteredSortedModels","_shouldAddChild","_destroyEmptyView","_addChild","changes","_removeChildModels","removed","models","removedViews","_getRemovedViews","_updateIndices","_showEmptyView","removingViews","findByModel","_removeChildView","push","_renderChildren","preventRender","canBeRendered","filterChanged","previousModels","_applyModelDeltas","setFilter","currentIds","removeModels","prevModel","_showingEmptyView","filteredOutModels","elsToReorder","viewEls","_index","elBuffer","createBuffer","_appendReorderedChildren","reorderOnSort","reorder","item","_this4","resortView","_destroyChildren","processedModels","_startBuffering","_showCollection","_endBuffering","ChildView","_getChildView","childViewOptions","_getChildViewOptions","buildChildView","addedAt","viewComparator","getViewComparator","Math","min","max","addedModel","_sortModelsBy","splice","_filterModels","_this5","sortBy","EmptyView","_getEmptyView","emptyViewOptions","_emptyViewIndex","addChildView","emptyView","childView","_createView","increment","laterView","ChildViewClass","collectionView","buffer","b","_insertBefore","_insertAfter","beforeEl","siblings","before","ChildViewContainer","_init","_viewsByCid","_sortBy","sortedViews","_set","view1","view2","view1Index","findIndexByView","view2Index","swapView","getEmptyRegion","_emptyRegion","isDestroyed","_onCollectionSort","_onCollectionReset","sortWithCollection","_addedViews","added","_addChildModels","_detachChildren","_showChildren","_removeChildViews","_removeChildModel","_removeChild","_addChildModel","_createChildView","removeChildView","_sortChildren","allViewsFiltered","_getEmptyViewOptions","emptyRegion","hasView","getComparator","_sort","shouldSort","setComparator","_viewComparator","filteredViews","_filterChildren","addedView","addedViews","viewIndex","viewFilter","_getFilter","every","_isAddedAtEnd","partition","getFilter","matcher","matches","shouldRender","detachingViews","_detachChildView","els","_getBuffer","_attachChildren","_swap","swapEl","_destroyChildView","CompositeView","renderChildren","_isRendering","resetChildViewContainer","compositeView","$container","getChildViewContainer","containerView","$childViewContainer","container","childViewContainer","charAt","substr","MixinFromView","Behavior","_removeBehavior","behaviorEvents","behaviorHandler","behaviorTriggers","Application","_initRegion","_region","AppRouter","Router","appRoutes","controller","_getController","processAppRoutes","_processOnRoute","route","_addAppRoute","routeName","routeArgs","onRoute","routePath","invert","routeNames","reverse","previousMarionette","noConflict","setEnabled","state","NextCollectionView","Object","VERSION"],"mappings":"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","file":"backbone.marionette.min.js","sourcesContent":["// Trigger Method\n// --------------\n\nimport _ from 'underscore';\nimport getOption from './get-option';\n\n// split the event name on the \":\"\nconst splitter = /(^|:)(\\w)/gi;\n\n// take the event section (\"section1:section2:section3\")\n// and turn it in to uppercase name onSection1Section2Section3\nfunction getEventName(match, prefix, eventName) {\n  return eventName.toUpperCase();\n}\n\nconst getOnMethodName = _.memoize(function(event) {\n  return 'on' + event.replace(splitter, getEventName);\n});\n\n// Trigger an event and/or a corresponding method name. Examples:\n//\n// `this.triggerMethod(\"foo\")` will trigger the \"foo\" event and\n// call the \"onFoo\" method.\n//\n// `this.triggerMethod(\"foo:bar\")` will trigger the \"foo:bar\" event and\n// call the \"onFooBar\" method.\nexport function triggerMethod(event, ...args) {\n  // get the method name from the event name\n  const methodName = getOnMethodName(event);\n  const method = getOption.call(this, methodName);\n  let result;\n\n  // call the onMethodName if it exists\n  if (_.isFunction(method)) {\n    // pass all args, except the event name\n    result = method.apply(this, args);\n  }\n\n  // trigger the event\n  this.trigger.apply(this, arguments);\n\n  return result;\n}\n\n// triggerMethodOn invokes triggerMethod on a specific context\n//\n// e.g. `Marionette.triggerMethodOn(view, 'show')`\n// will trigger a \"show\" event or invoke onShow the view.\nexport function triggerMethodOn(context, ...args) {\n  if (_.isFunction(context.triggerMethod)) {\n    return context.triggerMethod.apply(context, args);\n  }\n\n  return triggerMethod.apply(context, args);\n}\n","// DOM Refresh\n// -----------\n\nimport _ from 'underscore';\nimport { triggerMethodOn } from './trigger-method';\n\n// Trigger method on children unless a pure Backbone.View\nfunction triggerMethodChildren(view, event, shouldTrigger) {\n  if (!view._getImmediateChildren) { return; }\n  _.each(view._getImmediateChildren(), child => {\n    if (!shouldTrigger(child)) { return; }\n    triggerMethodOn(child, event, child);\n  });\n}\n\nfunction shouldTriggerAttach(view) {\n  return !view._isAttached;\n}\n\nfunction shouldAttach(view) {\n  if (!shouldTriggerAttach(view)) { return false; }\n  view._isAttached = true;\n  return true;\n}\n\nfunction shouldTriggerDetach(view) {\n  return view._isAttached;\n}\n\nfunction shouldDetach(view) {\n  if (!shouldTriggerDetach(view)) { return false; }\n  view._isAttached = false;\n  return true;\n}\n\nfunction triggerDOMRefresh(view) {\n  if (view._isAttached && view._isRendered) {\n    triggerMethodOn(view, 'dom:refresh', view);\n  }\n}\n\nfunction triggerDOMRemove(view) {\n  if (view._isAttached && view._isRendered) {\n    triggerMethodOn(view, 'dom:remove', view);\n  }\n}\n\nfunction handleBeforeAttach() {\n  triggerMethodChildren(this, 'before:attach', shouldTriggerAttach);\n}\n\nfunction handleAttach() {\n  triggerMethodChildren(this, 'attach', shouldAttach);\n  triggerDOMRefresh(this);\n}\n\nfunction handleBeforeDetach() {\n  triggerMethodChildren(this, 'before:detach', shouldTriggerDetach);\n  triggerDOMRemove(this);\n}\n\nfunction handleDetach() {\n  triggerMethodChildren(this, 'detach', shouldDetach);\n}\n\nfunction handleBeforeRender() {\n  triggerDOMRemove(this);\n}\n\nfunction handleRender() {\n  triggerDOMRefresh(this);\n}\n\n// Monitor a view's state, propagating attach/detach events to children and firing dom:refresh\n// whenever a rendered view is attached or an attached view is rendered.\nfunction monitorViewEvents(view) {\n  if (view._areViewEventsMonitored || view.monitorViewEvents === false) { return; }\n\n  view._areViewEventsMonitored = true;\n\n  view.on({\n    'before:attach': handleBeforeAttach,\n    'attach': handleAttach,\n    'before:detach': handleBeforeDetach,\n    'detach': handleDetach,\n    'before:render': handleBeforeRender,\n    'render': handleRender\n  });\n}\n\nexport default monitorViewEvents;\n","// Bind Entity Events & Unbind Entity Events\n// -----------------------------------------\n//\n// These methods are used to bind/unbind a backbone \"entity\" (e.g. collection/model)\n// to methods on a target object.\n//\n// The first parameter, `target`, must have the Backbone.Events module mixed in.\n//\n// The second parameter is the `entity` (Backbone.Model, Backbone.Collection or\n// any object that has Backbone.Events mixed in) to bind the events from.\n//\n// The third parameter is a hash of { \"event:name\": \"eventHandler\" }\n// configuration. Multiple handlers can be separated by a space. A\n// function can be supplied instead of a string handler name.\n\nimport _ from 'underscore';\nimport MarionetteError from '../error';\n\n// Bind/unbind the event to handlers specified as a string of\n// handler names on the target object\nfunction bindFromStrings(target, entity, evt, methods, actionName) {\n  const methodNames = methods.split(/\\s+/);\n\n  _.each(methodNames, function(methodName) {\n    const method = target[methodName];\n    if (!method) {\n      throw new MarionetteError(`Method \"${methodName}\" was configured as an event handler, but does not exist.`);\n    }\n\n    target[actionName](entity, evt, method);\n  });\n}\n\n// generic looping function\nfunction iterateEvents(target, entity, bindings, actionName) {\n  if (!entity || !bindings) { return; }\n\n  // type-check bindings\n  if (!_.isObject(bindings)) {\n    throw new MarionetteError({\n      message: 'Bindings must be an object.',\n      url: 'marionette.functions.html#marionettebindevents'\n    });\n  }\n\n  // iterate the bindings and bind/unbind them\n  _.each(bindings, function(method, evt) {\n\n    // allow for a list of method names as a string\n    if (_.isString(method)) {\n      bindFromStrings(target, entity, evt, method, actionName);\n      return;\n    }\n\n    target[actionName](entity, evt, method);\n  });\n}\n\nfunction bindEvents(entity, bindings) {\n  iterateEvents(this, entity, bindings, 'listenTo');\n  return this;\n}\n\nfunction unbindEvents(entity, bindings) {\n  iterateEvents(this, entity, bindings, 'stopListening');\n  return this;\n}\n\n// Export Public API\nexport {\n  bindEvents,\n  unbindEvents\n};\n","// Bind/Unbind Radio Requests\n// -----------------------------------------\n//\n// These methods are used to bind/unbind a backbone.radio request\n// to methods on a target object.\n//\n// The first parameter, `target`, will set the context of the reply method\n//\n// The second parameter is the `Radio.channel` to bind the reply to.\n//\n// The third parameter is a hash of { \"request:name\": \"replyHandler\" }\n// configuration. A function can be supplied instead of a string handler name.\n\nimport _ from 'underscore';\nimport normalizeMethods from './normalize-methods';\nimport MarionetteError from '../error';\n\nfunction iterateReplies(target, channel, bindings, actionName) {\n  if (!channel || !bindings) { return; }\n\n  // type-check bindings\n  if (!_.isObject(bindings)) {\n    throw new MarionetteError({\n      message: 'Bindings must be an object.',\n      url: 'marionette.functions.html#marionettebindrequests'\n    });\n  }\n\n  const normalizedRadioRequests = normalizeMethods.call(target, bindings);\n\n  channel[actionName](normalizedRadioRequests, target);\n}\n\nfunction bindRequests(channel, bindings) {\n  iterateReplies(this, channel, bindings, 'reply');\n  return this;\n}\n\nfunction unbindRequests(channel, bindings) {\n  iterateReplies(this, channel, bindings, 'stopReplying');\n  return this;\n}\n\nexport {\n  bindRequests,\n  unbindRequests\n};\n","import _ from 'underscore';\nimport _invoke from '../utils/invoke';\nimport { triggerMethod } from '../common/trigger-method';\nimport Marionette from '../backbone.marionette';\n\n// MixinOptions\n// - behaviors\n\n// Takes care of getting the behavior class\n// given options and a key.\n// If a user passes in options.behaviorClass\n// default to using that.\n// If a user passes in a Behavior Class directly, use that\n// Otherwise delegate the lookup to the users `behaviorsLookup` implementation.\nfunction getBehaviorClass(options, key) {\n  if (options.behaviorClass) {\n    return options.behaviorClass;\n    //treat functions as a Behavior constructor\n  } else if (_.isFunction(options)) {\n    return options;\n  }\n\n  // behaviorsLookup can be either a flat object or a method\n  if (_.isFunction(Marionette.Behaviors.behaviorsLookup)) {\n    return Marionette.Behaviors.behaviorsLookup(options, key)[key];\n  }\n\n  return Marionette.Behaviors.behaviorsLookup[key];\n}\n\n// Iterate over the behaviors object, for each behavior\n// instantiate it and get its grouped behaviors.\n// This accepts a list of behaviors in either an object or array form\nfunction parseBehaviors(view, behaviors) {\n  return _.chain(behaviors).map(function(options, key) {\n    const BehaviorClass = getBehaviorClass(options, key);\n    //if we're passed a class directly instead of an object\n    const _options = options === BehaviorClass ? {} : options;\n    const behavior = new BehaviorClass(_options, view);\n    const nestedBehaviors = parseBehaviors(view, _.result(behavior, 'behaviors'));\n\n    return [behavior].concat(nestedBehaviors);\n  }).flatten().value();\n}\n\nexport default {\n  _initBehaviors() {\n    this._behaviors = this._getBehaviors();\n  },\n\n  _getBehaviors() {\n    const behaviors = _.result(this, 'behaviors');\n\n    // Behaviors defined on a view can be a flat object literal\n    // or it can be a function that returns an object.\n    return _.isObject(behaviors) ? parseBehaviors(this, behaviors) : {};\n  },\n\n  _getBehaviorTriggers() {\n    const triggers = _invoke(this._behaviors, 'getTriggers');\n    return _.reduce(triggers, function(memo, _triggers) {\n      return _.extend(memo, _triggers);\n    }, {});\n  },\n\n  _getBehaviorEvents() {\n    const events = _invoke(this._behaviors, 'getEvents');\n    return _.reduce(events, function(memo, _events) {\n      return _.extend(memo, _events);\n    }, {});\n  },\n\n  // proxy behavior $el to the view's $el.\n  _proxyBehaviorViewProperties() {\n    _invoke(this._behaviors, 'proxyViewProperties');\n  },\n\n  // delegate modelEvents and collectionEvents\n  _delegateBehaviorEntityEvents() {\n    _invoke(this._behaviors, 'delegateEntityEvents');\n  },\n\n  // undelegate modelEvents and collectionEvents\n  _undelegateBehaviorEntityEvents() {\n    _invoke(this._behaviors, 'undelegateEntityEvents');\n  },\n\n  _destroyBehaviors(...args) {\n    // Call destroy on each behavior after\n    // destroying the view.\n    // This unbinds event listeners\n    // that behaviors have registered for.\n    _invoke(this._behaviors, 'destroy', ...args);\n  },\n\n  // Remove a behavior\n  _removeBehavior(behavior) {\n    // Don't worry about the clean up if the view is destroyed\n    if (this._isDestroyed) { return; }\n    this._behaviors = _.without(this._behaviors, behavior);\n  },\n\n  _bindBehaviorUIElements() {\n    _invoke(this._behaviors, 'bindUIElements');\n  },\n\n  _unbindBehaviorUIElements() {\n    _invoke(this._behaviors, 'unbindUIElements');\n  },\n\n  _triggerEventOnBehaviors() {\n    const behaviors = this._behaviors;\n    // Use good ol' for as this is a very hot function\n    for (let i = 0, length = behaviors && behaviors.length; i < length; i++) {\n      triggerMethod.apply(behaviors[i], arguments);\n    }\n  }\n};\n","import _ from 'underscore';\n\n// Borrow event splitter from Backbone\nconst delegateEventSplitter = /^(\\S+)\\s*(.*)$/;\n\nfunction uniqueName(eventName, selector) {\n  return `${ eventName }${ _.uniqueId('.evt') } ${ selector }`;\n}\n\n// Set event name to be namespaced using a unique index\n// to generate a non colliding event namespace\n// http://api.jquery.com/event.namespace/\nconst getUniqueEventName = function(eventName) {\n  const match = eventName.match(delegateEventSplitter);\n  return uniqueName(match[1], match[2]);\n};\n\nexport default getUniqueEventName;\n","// Add Feature flags here\n// e.g. 'class' => false\nconst FEATURES = {\n  childViewEventPrefix: true,\n  triggersStopPropagation: true,\n  triggersPreventDefault: true\n};\n\nfunction isEnabled(name) {\n  return !!FEATURES[name];\n}\n\nfunction setEnabled(name, state) {\n  return FEATURES[name] = state;\n}\n\nexport {\n  FEATURES,\n  setEnabled,\n  isEnabled\n};\n","import _ from 'underscore';\nimport getUniqueEventName from '../utils/get-unique-event-name';\nimport { isEnabled } from '../config/features';\n\n// Internal method to create an event handler for a given `triggerDef` like\n// 'click:foo'\nfunction buildViewTrigger(view, triggerDef) {\n  if (_.isString(triggerDef)) {\n    triggerDef = {event: triggerDef};\n  }\n\n  const eventName = triggerDef.event;\n\n  let shouldPreventDefault = !!triggerDef.preventDefault;\n\n  if (isEnabled('triggersPreventDefault')) {\n    shouldPreventDefault = triggerDef.preventDefault !== false;\n  }\n\n  let shouldStopPropagation = !!triggerDef.stopPropagation;\n\n  if (isEnabled('triggersStopPropagation')) {\n    shouldStopPropagation = triggerDef.stopPropagation !== false;\n  }\n\n  return function(event) {\n    if (shouldPreventDefault) {\n      event.preventDefault();\n    }\n\n    if (shouldStopPropagation) {\n      event.stopPropagation();\n    }\n\n    view.triggerMethod(eventName, view, event);\n  };\n}\n\nexport default {\n\n  // Configure `triggers` to forward DOM events to view\n  // events. `triggers: {\"click .foo\": \"do:foo\"}`\n  _getViewTriggers(view, triggers) {\n    // Configure the triggers, prevent default\n    // action and stop propagation of DOM events\n    return _.reduce(triggers, (events, value, key) => {\n      key = getUniqueEventName(key);\n      events[key] = buildViewTrigger(view, value);\n      return events;\n    }, {});\n  }\n\n};\n","// DomApi\n//  ---------\nimport _ from 'underscore';\nimport Backbone from 'backbone';\n\n// Performant method for returning the jQuery instance\nfunction getEl(el) {\n  return el instanceof Backbone.$ ? el : Backbone.$(el);\n}\n\n// Static setter\nexport function setDomApi(mixin) {\n  this.prototype.Dom = _.extend({}, this.prototype.Dom, mixin);\n  return this;\n}\n\nexport default {\n\n  // Returns a new HTML DOM node instance\n  createBuffer() {\n    return document.createDocumentFragment();\n  },\n\n  // Lookup the `selector` string\n  // Selector may also be a DOM element\n  // Returns an array-like object of nodes\n  getEl(selector) {\n    return getEl(selector);\n  },\n\n  // Finds the `selector` string with the el\n  // Returns an array-like object of nodes\n  findEl(el, selector, _$el = getEl(el)) {\n    return _$el.find(selector);\n  },\n\n  // Returns true if the el contains the node childEl\n  hasEl(el, childEl) {\n    return el.contains(childEl && childEl.parentNode);\n  },\n\n  // Detach `el` from the DOM without removing listeners\n  detachEl(el, _$el = getEl(el)) {\n    _$el.detach();\n  },\n\n  // Remove `oldEl` from the DOM and put `newEl` in its place\n  replaceEl(newEl, oldEl) {\n    if (newEl === oldEl) {\n      return;\n    }\n\n    const parent = oldEl.parentNode;\n\n    if (!parent) {\n      return;\n    }\n\n    parent.replaceChild(newEl, oldEl);\n  },\n\n  // Swaps the location of `el1` and `el2` in the DOM\n  swapEl(el1, el2) {\n    if (el1 === el2) {\n      return;\n    }\n\n    const parent1 = el1.parentNode;\n    const parent2 = el2.parentNode;\n\n    if (!parent1 || !parent2) {\n      return;\n    }\n\n    const next1 = el1.nextSibling;\n    const next2 = el2.nextSibling;\n\n    parent1.insertBefore(el2, next1);\n    parent2.insertBefore(el1, next2);\n  },\n\n  // Replace the contents of `el` with the HTML string of `html`\n  setContents(el, html, _$el = getEl(el)) {\n    _$el.html(html);\n  },\n\n  // Takes the DOM node `el` and appends the DOM node `contents`\n  // to the end of the element's contents.\n  appendContents(el, contents, {_$el = getEl(el), _$contents = getEl(contents)} = {}) {\n    _$el.append(_$contents);\n  },\n\n  // Does the el have child nodes\n  hasContents(el) {\n    return el.hasChildNodes();\n  },\n\n  // Remove the inner contents of `el` from the DOM while leaving\n  // `el` itself in the DOM.\n  detachContents(el, _$el = getEl(el)) {\n    _$el.contents().detach();\n  }\n};\n","import { triggerMethodOn } from '../common/trigger-method';\n\nexport function renderView(view) {\n  if (view._isRendered) {\n    return;\n  }\n\n  if (!view.supportsRenderLifecycle) {\n    triggerMethodOn(view, 'before:render', view);\n  }\n\n  view.render();\n\n  if (!view.supportsRenderLifecycle) {\n    view._isRendered = true;\n    triggerMethodOn(view, 'render', view);\n  }\n}\n\nexport function destroyView(view) {\n  if (view.destroy) {\n    view.destroy();\n    return;\n  }\n\n  if (!view.supportsDestroyLifecycle) {\n    triggerMethodOn(view, 'before:destroy', view);\n  }\n\n  const shouldTriggerDetach = view._isAttached && !view._shouldDisableEvents;\n\n  if (shouldTriggerDetach) {\n    triggerMethodOn(view, 'before:detach', view);\n  }\n\n  view.remove();\n\n  if (shouldTriggerDetach) {\n    view._isAttached = false;\n    triggerMethodOn(view, 'detach', view);\n  }\n\n  view._isDestroyed = true;\n\n  if (!view.supportsDestroyLifecycle) {\n    triggerMethodOn(view, 'destroy', view);\n  }\n}\n","import _ from 'underscore';\nimport deprecate from '../utils/deprecate';\nimport MarionetteError from '../error';\nimport Region from '../region';\n\n// return the region instance from the definition\nexport default function(definition, defaults) {\n  if (definition instanceof Region) {\n    return definition;\n  }\n\n  return buildRegionFromDefinition(definition, defaults);\n}\n\nfunction buildRegionFromDefinition(definition, defaults) {\n  const opts = _.extend({}, defaults);\n\n  if (_.isString(definition)) {\n    _.extend(opts, { el: definition });\n\n    return buildRegionFromObject(opts);\n  }\n\n  if (_.isFunction(definition)) {\n    _.extend(opts, { regionClass: definition });\n\n    return buildRegionFromObject(opts);\n  }\n\n  if (_.isObject(definition)) {\n    if (definition.selector) {\n      deprecate('The selector option on a Region definition object is deprecated. Use el to pass a selector string');\n    }\n\n    _.extend(opts, { el: definition.selector }, definition);\n\n    return buildRegionFromObject(opts);\n  }\n\n  throw new MarionetteError({\n    message: 'Improper region configuration type.',\n    url: 'marionette.region.html#region-configuration-types'\n  });\n}\n\nfunction buildRegionFromObject(definition) {\n  const RegionClass = definition.regionClass\n\n  const options = _.omit(definition, 'regionClass');\n\n  return new RegionClass(options);\n}\n","import _ from 'underscore';\nimport emulateCollection from './utils/emulate-collection';\n\n// Provide a container to store, retrieve and\n// shut down child views.\nconst Container = function() {\n  this._init();\n};\n\nemulateCollection(Container.prototype, '_views');\n\nfunction stringComparator(comparator, view) {\n  return view.model && view.model.get(comparator);\n}\n\n// Container Methods\n// -----------------\n\n_.extend(Container.prototype, {\n\n  // Initializes an empty container\n  _init() {\n    this._views = [];\n    this._viewsByCid = {};\n    this._indexByModel = {};\n    this._updateLength();\n  },\n\n  // Add a view to this container. Stores the view\n  // by `cid` and makes it searchable by the model\n  // cid (and model itself). Additionally it stores\n  // the view by index in the _views array\n  _add(view, index = this._views.length) {\n    const viewCid = view.cid;\n\n    // store the view\n    this._viewsByCid[viewCid] = view;\n\n    // index it by model\n    if (view.model) {\n      this._indexByModel[view.model.cid] = viewCid;\n    }\n\n    // add to end by default\n    this._views.splice(index, 0, view);\n\n    this._updateLength();\n  },\n\n  // Sort (mutate) and return the array of the child views.\n  _sort(comparator) {\n    if (typeof comparator === 'string') {\n      comparator = _.partial(stringComparator, comparator);\n      return this._sortBy(comparator);\n    }\n\n    if (comparator.length === 1) {\n      return this._sortBy(comparator);\n    }\n\n    return this._views.sort(comparator);\n  },\n\n  // Makes `_.sortBy` mutate the array to match `this._views.sort`\n  _sortBy(comparator) {\n    const sortedViews = _.sortBy(this._views, comparator);\n\n    this._set(sortedViews);\n\n    return sortedViews;\n  },\n\n  // Replace array contents without overwriting the reference.\n  _set(views) {\n    this._views.length = 0;\n\n    this._views.push.apply(this._views, views.slice(0));\n\n    this._updateLength();\n  },\n\n  // Swap views by index\n  _swap(view1, view2) {\n    const view1Index = this.findIndexByView(view1);\n    const view2Index = this.findIndexByView(view2);\n\n    if (view1Index === -1 || view2Index === -1) {\n      return;\n    }\n\n    const swapView = this._views[view1Index];\n    this._views[view1Index] = this._views[view2Index];\n    this._views[view2Index] = swapView;\n  },\n\n  // Find a view by the model that was attached to it.\n  // Uses the model's `cid` to find it.\n  findByModel(model) {\n    return this.findByModelCid(model.cid);\n  },\n\n  // Find a view by the `cid` of the model that was attached to it.\n  // Uses the model's `cid` to find the view `cid` and\n  // retrieve the view using it.\n  findByModelCid(modelCid) {\n    const viewCid = this._indexByModel[modelCid];\n    return this.findByCid(viewCid);\n  },\n\n  // Find a view by index.\n  findByIndex(index) {\n    return this._views[index];\n  },\n\n  // Find the index of a view instance\n  findIndexByView(view) {\n    return this._views.indexOf(view);\n  },\n\n  // Retrieve a view by its `cid` directly\n  findByCid(cid) {\n    return this._viewsByCid[cid];\n  },\n\n  hasView(view) {\n    return !!this.findByCid(view.cid);\n  },\n\n  // Remove a view and clean up index references.\n  _remove(view) {\n    if (!this._viewsByCid[view.cid]) {\n      return;\n    }\n\n    // delete model index\n    if (view.model) {\n      delete this._indexByModel[view.model.cid];\n    }\n\n    // remove the view from the container\n    delete this._viewsByCid[view.cid];\n\n    const index = this.findIndexByView(view);\n    this._views.splice(index, 1);\n\n    this._updateLength();\n  },\n\n  // Update the `.length` attribute on this container\n  _updateLength() {\n    this.length = this._views.length;\n  }\n});\n\nexport default Container;\n","//Internal utility for creating context style global utils\nconst proxy = function(method) {\n  return function(context, ...args) {\n    return method.apply(context, args);\n  };\n};\n\nexport default proxy;\n","// Marionette.extend\n// -----------------\n\nimport Backbone from 'backbone';\n\n// Borrow the Backbone `extend` method so we can use it as needed\nconst extend = Backbone.Model.extend;\n\nexport default extend;\n","/* global console */\n\nimport _ from 'underscore';\n\nimport Marionette from '../backbone.marionette';\n\nconst deprecate = function(message, test) {\n  if (_.isObject(message)) {\n    message = (\n      message.prev + ' is going to be removed in the future. ' +\n      'Please use ' + message.next + ' instead.' +\n      (message.url ? ' See: ' + message.url : '')\n    );\n  }\n\n  if (!Marionette.DEV_MODE) {\n    return;\n  }\n\n  if ((test === undefined || !test) && !deprecate._cache[message]) {\n    deprecate._warn('Deprecation warning: ' + message);\n    deprecate._cache[message] = true;\n  }\n};\n\n/* istanbul ignore next: can't clear console */\ndeprecate._console = typeof console !== 'undefined' ? console : {};\ndeprecate._warn = function() {\n  const warn = deprecate._console.warn || deprecate._console.log || _.noop;\n  return warn.apply(deprecate._console, arguments);\n};\ndeprecate._cache = {};\n\nexport default deprecate;\n","// Marionette.isNodeAttached\n// -------------------------\n\n// Determine if `el` is a child of the document\nconst isNodeAttached = function(el) {\n  return document.documentElement.contains(el && el.parentNode);\n};\n\nexport default isNodeAttached;\n","import _ from 'underscore';\n\n// Merge `keys` from `options` onto `this`\nconst mergeOptions = function(options, keys) {\n  if (!options) { return; }\n\n  _.each(keys, (key) => {\n    const option = options[key];\n    if (option !== undefined) {\n      this[key] = option;\n    }\n  });\n};\n\nexport default mergeOptions;\n","// Marionette.getOption\n// --------------------\n\n// Retrieve an object, function or other value from the\n// object or its `options`, with `options` taking precedence.\nconst getOption = function(optionName) {\n  if (!optionName) { return; }\n  if (this.options && (this.options[optionName] !== undefined)) {\n    return this.options[optionName];\n  } else {\n    return this[optionName];\n  }\n};\n\nexport default getOption;\n","import _ from 'underscore';\n\n// Marionette.normalizeMethods\n// ----------------------\n\n// Pass in a mapping of events => functions or function names\n// and return a mapping of events => functions\nconst normalizeMethods = function(hash) {\n  return _.reduce(hash, (normalizedHash, method, name) => {\n    if (!_.isFunction(method)) {\n      method = this[method];\n    }\n    if (method) {\n      normalizedHash[name] = method;\n    }\n    return normalizedHash;\n  }, {});\n};\n\nexport default normalizeMethods;\n","// Error\n// -----\n\nimport _ from 'underscore';\nimport extend from './utils/extend';\nimport {version} from '../package.json';\n\nconst errorProps = ['description', 'fileName', 'lineNumber', 'name', 'message', 'number'];\n\nconst MarionetteError = extend.call(Error, {\n  urlRoot: `http://marionettejs.com/docs/v${version}/`,\n\n  constructor(message, options) {\n    if (_.isObject(message)) {\n      options = message;\n      message = options.message;\n    } else if (!options) {\n      options = {};\n    }\n\n    const error = Error.call(this, message);\n    _.extend(this, _.pick(error, errorProps), _.pick(options, errorProps));\n\n    this.captureStackTrace();\n\n    if (options.url) {\n      this.url = this.urlRoot + options.url;\n    }\n  },\n\n  captureStackTrace() {\n    if (Error.captureStackTrace) {\n      Error.captureStackTrace(this, MarionetteError);\n    }\n  },\n\n  toString() {\n    return this.name + ': ' + this.message + (this.url ? ' See: ' + this.url : '');\n  }\n});\n\nMarionetteError.extend = extend;\n\nexport default MarionetteError;\n","import _ from 'underscore';\n\n// Internal utility for setting options consistently across Mn\nconst setOptions = function(options) {\n  this.options = _.extend({}, _.result(this, 'options'), options);\n};\n\nexport default setOptions;\n","import _setOptions from '../utils/set-options';\nimport getOption from '../common/get-option';\nimport mergeOptions from '../common/merge-options';\nimport normalizeMethods from '../common/normalize-methods';\nimport {\n  bindEvents,\n  unbindEvents\n} from '../common/bind-events';\n\nexport default {\n\n  // Imports the \"normalizeMethods\" to transform hashes of\n  // events=>function references/names to a hash of events=>function references\n  normalizeMethods,\n\n  _setOptions,\n\n  // A handy way to merge passed-in options onto the instance\n  mergeOptions,\n\n  // Enable getting options from this or this.options by name.\n  getOption,\n\n  // Enable binding view's events from another entity.\n  bindEvents,\n\n  // Enable unbinding view's events from another entity.\n  unbindEvents\n};\n","import _ from 'underscore';\nimport Radio from 'backbone.radio';\n\nimport {\n  bindRequests,\n  unbindRequests\n} from '../common/bind-requests';\n\nimport {\n  bindEvents,\n  unbindEvents\n} from '../common/bind-events';\n\nimport MarionetteError from '../error';\n\n// MixinOptions\n// - channelName\n// - radioEvents\n// - radioRequests\n\nexport default {\n\n  _initRadio() {\n    const channelName = _.result(this, 'channelName');\n\n    if (!channelName) {\n      return;\n    }\n\n    /* istanbul ignore next */\n    if (!Radio) {\n      throw new MarionetteError({\n        name: 'BackboneRadioMissing',\n        message: 'The dependency \"backbone.radio\" is missing.'\n      });\n    }\n\n    const channel = this._channel = Radio.channel(channelName);\n\n    const radioEvents = _.result(this, 'radioEvents');\n    this.bindEvents(channel, radioEvents);\n\n    const radioRequests = _.result(this, 'radioRequests');\n    this.bindRequests(channel, radioRequests);\n\n    this.on('destroy', this._destroyRadio);\n  },\n\n  _destroyRadio() {\n    this._channel.stopReplying(null, null, this);\n  },\n\n  getChannel() {\n    return this._channel;\n  },\n\n  // Proxy `bindEvents`\n  bindEvents: bindEvents,\n\n  // Proxy `unbindEvents`\n  unbindEvents: unbindEvents,\n\n  // Proxy `bindRequests`\n  bindRequests: bindRequests,\n\n  // Proxy `unbindRequests`\n  unbindRequests: unbindRequests\n\n};\n","// Object\n// ------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport extend from './utils/extend';\nimport { triggerMethod } from './common/trigger-method';\nimport CommonMixin from './mixins/common';\nimport RadioMixin from './mixins/radio';\n\nconst ClassOptions = [\n  'channelName',\n  'radioEvents',\n  'radioRequests'\n];\n\n// A Base Class that other Classes should descend from.\n// Object borrows many conventions and utilities from Backbone.\nconst MarionetteObject = function(options) {\n  if (!this.hasOwnProperty('options')) {\n    this._setOptions(options);\n  }\n  this.mergeOptions(options, ClassOptions);\n  this._setCid();\n  this._initRadio();\n  this.initialize.apply(this, arguments);\n};\n\nMarionetteObject.extend = extend;\n\n// Object Methods\n// --------------\n\n// Ensure it can trigger events with Backbone.Events\n_.extend(MarionetteObject.prototype, Backbone.Events, CommonMixin, RadioMixin, {\n  cidPrefix: 'mno',\n\n  // for parity with Marionette.AbstractView lifecyle\n  _isDestroyed: false,\n\n  isDestroyed() {\n    return this._isDestroyed;\n  },\n\n  //this is a noop method intended to be overridden by classes that extend from this base\n  initialize() {},\n\n  _setCid() {\n    if (this.cid) { return; }\n    this.cid = _.uniqueId(this.cidPrefix);\n  },\n\n  destroy(...args) {\n    if (this._isDestroyed) { return this; }\n\n    this.triggerMethod('before:destroy', this, ...args);\n\n    this._isDestroyed = true;\n    this.triggerMethod('destroy', this, ...args);\n    this.stopListening();\n\n    return this;\n  },\n\n  triggerMethod\n});\n\nexport default MarionetteObject;\n","// Template Cache\n// --------------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport MarionetteError from './error';\n\n// Manage templates stored in `<script>` blocks,\n// caching them for faster access.\nconst TemplateCache = function(templateId) {\n  this.templateId = templateId;\n};\n\n// TemplateCache object-level methods. Manage the template\n// caches from these method calls instead of creating\n// your own TemplateCache instances\n_.extend(TemplateCache, {\n\n  templateCaches: {},\n\n  // Get the specified template by id. Either\n  // retrieves the cached version, or loads it\n  // from the DOM.\n  get(templateId, options) {\n    let cachedTemplate = this.templateCaches[templateId];\n\n    if (!cachedTemplate) {\n      cachedTemplate = new TemplateCache(templateId);\n      this.templateCaches[templateId] = cachedTemplate;\n    }\n\n    return cachedTemplate.load(options);\n  },\n\n  // Clear templates from the cache. If no arguments\n  // are specified, clears all templates:\n  // `clear()`\n  //\n  // If arguments are specified, clears each of the\n  // specified templates from the cache:\n  // `clear(\"#t1\", \"#t2\", \"...\")`\n  clear(...args) {\n    let i;\n    const length = args.length;\n\n    if (length > 0) {\n      for (i = 0; i < length; i++) {\n        delete this.templateCaches[args[i]];\n      }\n    } else {\n      this.templateCaches = {};\n    }\n  }\n});\n\n// TemplateCache instance methods, allowing each\n// template cache object to manage its own state\n// and know whether or not it has been loaded\n_.extend(TemplateCache.prototype, {\n\n  // Internal method to load the template\n  load(options) {\n    // Guard clause to prevent loading this template more than once\n    if (this.compiledTemplate) {\n      return this.compiledTemplate;\n    }\n\n    // Load the template and compile it\n    const template = this.loadTemplate(this.templateId, options);\n    this.compiledTemplate = this.compileTemplate(template, options);\n\n    return this.compiledTemplate;\n  },\n\n  // Load a template from the DOM, by default. Override\n  // this method to provide your own template retrieval\n  // For asynchronous loading with AMD/RequireJS, consider\n  // using a template-loader plugin as described here:\n  // https://github.com/marionettejs/backbone.marionette/wiki/Using-marionette-with-requirejs\n  loadTemplate(templateId, options) {\n    const $template = Backbone.$(templateId);\n\n    if (!$template.length) {\n      throw new MarionetteError({\n        name: 'NoTemplateError',\n        message: `Could not find template: \"${templateId}\"`\n      });\n    }\n    return $template.html();\n  },\n\n  // Pre-compile the template before caching it. Override\n  // this method if you do not need to pre-compile a template\n  // (JST / RequireJS for example) or if you want to change\n  // the template engine used (Handebars, etc).\n  compileTemplate(rawTemplate, options) {\n    return _.template(rawTemplate, options);\n  }\n});\n\nexport default TemplateCache;\n","// Implementation of the invoke method (http://underscorejs.org/#invoke) with support for\n// lodash v3, v4, and underscore.js\nimport _ from 'underscore';\n\nexport default _.invokeMap || _.invoke;\n","import _ from 'underscore';\n\nimport {\n  bindEvents,\n  unbindEvents\n} from '../common/bind-events';\n\n// MixinOptions\n// - collectionEvents\n// - modelEvents\n\nexport default {\n  // Handle `modelEvents`, and `collectionEvents` configuration\n  _delegateEntityEvents(model, collection) {\n    this._undelegateEntityEvents(model, collection);\n\n    const modelEvents = _.result(this, 'modelEvents');\n    bindEvents.call(this, model, modelEvents);\n\n    const collectionEvents = _.result(this, 'collectionEvents');\n    bindEvents.call(this, collection, collectionEvents);\n  },\n\n  _undelegateEntityEvents(model, collection) {\n    const modelEvents = _.result(this, 'modelEvents');\n    unbindEvents.call(this, model, modelEvents);\n\n    const collectionEvents = _.result(this, 'collectionEvents');\n    unbindEvents.call(this, collection, collectionEvents);\n  }\n};\n","import _ from 'underscore';\n// allows for the use of the @ui. syntax within\n// a given key for triggers and events\n// swaps the @ui with the associated selector.\n// Returns a new, non-mutated, parsed events hash.\nconst normalizeUIKeys = function(hash, ui) {\n  return _.reduce(hash, (memo, val, key) => {\n    const normalizedKey = normalizeUIString(key, ui);\n    memo[normalizedKey] = val;\n    return memo;\n  }, {});\n};\n\n// utility method for parsing @ui. syntax strings\n// into associated selector\nconst normalizeUIString = function(uiString, ui) {\n  return uiString.replace(/@ui\\.[a-zA-Z-_$0-9]*/g, (r) => {\n    return ui[r.slice(4)];\n  });\n};\n\n// allows for the use of the @ui. syntax within\n// a given value for regions\n// swaps the @ui with the associated selector\nconst normalizeUIValues = function(hash, ui, properties) {\n  _.each(hash, (val, key) => {\n    if (_.isString(val)) {\n      hash[key] = normalizeUIString(val, ui);\n    } else if (_.isObject(val) && _.isArray(properties)) {\n      _.extend(val, normalizeUIValues(_.pick(val, properties), ui));\n      /* Value is an object, and we got an array of embedded property names to normalize. */\n      _.each(properties, (property) => {\n        const propertyVal = val[property];\n        if (_.isString(propertyVal)) {\n          val[property] = normalizeUIString(propertyVal, ui);\n        }\n      });\n    }\n  });\n  return hash;\n};\n\nexport default {\n\n  // normalize the keys of passed hash with the views `ui` selectors.\n  // `{\"@ui.foo\": \"bar\"}`\n  normalizeUIKeys(hash) {\n    const uiBindings = this._getUIBindings();\n    return normalizeUIKeys(hash, uiBindings);\n  },\n\n  // normalize the passed string with the views `ui` selectors.\n  // `\"@ui.bar\"`\n  normalizeUIString(uiString) {\n    const uiBindings = this._getUIBindings();\n    return normalizeUIString(uiString, uiBindings);\n  },\n\n  // normalize the values of passed hash with the views `ui` selectors.\n  // `{foo: \"@ui.bar\"}`\n  normalizeUIValues(hash, properties) {\n    const uiBindings = this._getUIBindings();\n    return normalizeUIValues(hash, uiBindings, properties);\n  },\n\n  _getUIBindings() {\n    const uiBindings = _.result(this, '_uiBindings');\n    const ui = _.result(this, 'ui');\n    return uiBindings || ui;\n  },\n\n  // This method binds the elements specified in the \"ui\" hash inside the view's code with\n  // the associated jQuery selectors.\n  _bindUIElements() {\n    if (!this.ui) { return; }\n\n    // store the ui hash in _uiBindings so they can be reset later\n    // and so re-rendering the view will be able to find the bindings\n    if (!this._uiBindings) {\n      this._uiBindings = this.ui;\n    }\n\n    // get the bindings result, as a function or otherwise\n    const bindings = _.result(this, '_uiBindings');\n\n    // empty the ui so we don't have anything to start with\n    this._ui = {};\n\n    // bind each of the selectors\n    _.each(bindings, (selector, key) => {\n      this._ui[key] = this.$(selector);\n    });\n\n    this.ui = this._ui;\n  },\n\n  _unbindUIElements() {\n    if (!this.ui || !this._uiBindings) { return; }\n\n    // delete all of the existing ui bindings\n    _.each(this.ui, ($el, name) => {\n      delete this.ui[name];\n    });\n\n    // reset the ui element to the original bindings configuration\n    this.ui = this._uiBindings;\n    delete this._uiBindings;\n    delete this._ui;\n  },\n\n  _getUI(name) {\n    return this._ui[name];\n  }\n};\n","// ViewMixin\n//  ---------\n\nimport Backbone from 'backbone';\nimport _ from 'underscore';\nimport { triggerMethod } from '../common/trigger-method';\nimport BehaviorsMixin from './behaviors';\nimport CommonMixin from './common';\nimport DelegateEntityEventsMixin from './delegate-entity-events';\nimport TriggersMixin from './triggers';\nimport UIMixin from './ui';\nimport { isEnabled } from '../config/features';\nimport DomApi from '../config/dom';\n\n// MixinOptions\n// - behaviors\n// - childViewEventPrefix\n// - childViewEvents\n// - childViewTriggers\n// - collectionEvents\n// - modelEvents\n// - triggers\n// - ui\n\n\nconst ViewMixin = {\n  Dom: DomApi,\n\n  supportsRenderLifecycle: true,\n  supportsDestroyLifecycle: true,\n\n  _isDestroyed: false,\n\n  isDestroyed() {\n    return !!this._isDestroyed;\n  },\n\n  _isRendered: false,\n\n  isRendered() {\n    return !!this._isRendered;\n  },\n\n  _isAttached: false,\n\n  isAttached() {\n    return !!this._isAttached;\n  },\n\n  // Overriding Backbone.View's `delegateEvents` to handle\n  // `events` and `triggers`\n  delegateEvents(eventsArg) {\n\n    this._proxyBehaviorViewProperties();\n    this._buildEventProxies();\n\n    const viewEvents = this._getEvents(eventsArg);\n\n    if (typeof eventsArg === 'undefined') {\n      this.events = viewEvents;\n    }\n\n    const combinedEvents = _.extend({},\n      this._getBehaviorEvents(),\n      viewEvents,\n      this._getBehaviorTriggers(),\n      this.getTriggers()\n    );\n\n    Backbone.View.prototype.delegateEvents.call(this, combinedEvents);\n\n    return this;\n  },\n\n  _getEvents(eventsArg) {\n    const events = eventsArg || this.events;\n\n    if (_.isFunction(events)) {\n      return this.normalizeUIKeys(events.call(this));\n    }\n\n    return this.normalizeUIKeys(events);\n  },\n\n  // Configure `triggers` to forward DOM events to view\n  // events. `triggers: {\"click .foo\": \"do:foo\"}`\n  getTriggers() {\n    if (!this.triggers) { return; }\n\n    // Allow `triggers` to be configured as a function\n    const triggers = this.normalizeUIKeys(_.result(this, 'triggers'));\n\n    // Configure the triggers, prevent default\n    // action and stop propagation of DOM events\n    return this._getViewTriggers(this, triggers);\n  },\n\n  // Handle `modelEvents`, and `collectionEvents` configuration\n  delegateEntityEvents() {\n    this._delegateEntityEvents(this.model, this.collection);\n\n    // bind each behaviors model and collection events\n    this._delegateBehaviorEntityEvents();\n\n    return this;\n  },\n\n  // Handle unbinding `modelEvents`, and `collectionEvents` configuration\n  undelegateEntityEvents() {\n    this._undelegateEntityEvents(this.model, this.collection);\n\n    // unbind each behaviors model and collection events\n    this._undelegateBehaviorEntityEvents();\n\n    return this;\n  },\n\n  // Handle destroying the view and its children.\n  destroy(...args) {\n    if (this._isDestroyed) { return this; }\n    const shouldTriggerDetach = this._isAttached && !this._shouldDisableEvents;\n\n    this.triggerMethod('before:destroy', this, ...args);\n    if (shouldTriggerDetach) {\n      this.triggerMethod('before:detach', this);\n    }\n\n    // unbind UI elements\n    this.unbindUIElements();\n\n    // remove the view from the DOM\n    this._removeElement();\n\n    if (shouldTriggerDetach) {\n      this._isAttached = false;\n      this.triggerMethod('detach', this);\n    }\n\n    // remove children after the remove to prevent extra paints\n    this._removeChildren();\n\n    this._isDestroyed = true;\n    this._isRendered = false;\n\n    // Destroy behaviors after _isDestroyed flag\n    this._destroyBehaviors(...args);\n\n    this.triggerMethod('destroy', this, ...args);\n\n    this.stopListening();\n\n    return this;\n  },\n\n  // Equates to this.$el.remove\n  _removeElement() {\n    this.$el.off().removeData();\n    this.Dom.detachEl(this.el, this.$el);\n  },\n\n  bindUIElements() {\n    this._bindUIElements();\n    this._bindBehaviorUIElements();\n\n    return this;\n  },\n\n  // This method unbinds the elements specified in the \"ui\" hash\n  unbindUIElements() {\n    this._unbindUIElements();\n    this._unbindBehaviorUIElements();\n\n    return this;\n  },\n\n  getUI(name) {\n    return this._getUI(name);\n  },\n\n  // used as the prefix for child view events\n  // that are forwarded through the layoutview\n  childViewEventPrefix() {\n    return isEnabled('childViewEventPrefix') ? 'childview' : false;\n  },\n\n  // import the `triggerMethod` to trigger events with corresponding\n  // methods if the method exists\n  triggerMethod() {\n    const ret = triggerMethod.apply(this, arguments);\n\n    this._triggerEventOnBehaviors.apply(this, arguments);\n\n    return ret;\n  },\n\n  // Cache `childViewEvents` and `childViewTriggers`\n  _buildEventProxies() {\n    this._childViewEvents = _.result(this, 'childViewEvents');\n    this._childViewTriggers = _.result(this, 'childViewTriggers');\n  },\n\n  _proxyChildViewEvents(view) {\n    this.listenTo(view, 'all', this._childViewEventHandler);\n  },\n\n  _childViewEventHandler(eventName, ...args) {\n    const childViewEvents = this.normalizeMethods(this._childViewEvents);\n\n    // call collectionView childViewEvent if defined\n    if (typeof childViewEvents !== 'undefined' && _.isFunction(childViewEvents[eventName])) {\n      childViewEvents[eventName].apply(this, args);\n    }\n\n    // use the parent view's proxyEvent handlers\n    const childViewTriggers = this._childViewTriggers;\n\n    // Call the event with the proxy name on the parent layout\n    if (childViewTriggers && _.isString(childViewTriggers[eventName])) {\n      this.triggerMethod(childViewTriggers[eventName], ...args);\n    }\n\n    const prefix = _.result(this, 'childViewEventPrefix');\n\n    if (prefix !== false) {\n      const childEventName = prefix + ':' + eventName;\n\n      this.triggerMethod(childEventName, ...args);\n    }\n  }\n};\n\n_.extend(ViewMixin, BehaviorsMixin, CommonMixin, DelegateEntityEventsMixin, TriggersMixin, UIMixin);\n\nexport default ViewMixin;\n","// Region\n// ------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport deprecate from './utils/deprecate';\nimport { renderView, destroyView } from './common/view';\nimport monitorViewEvents from './common/monitor-view-events';\nimport isNodeAttached from './common/is-node-attached';\nimport { triggerMethodOn } from './common/trigger-method';\nimport MarionetteObject from './object';\nimport MarionetteError from './error';\nimport View from './view';\nimport DomApi, { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'allowMissingEl',\n  'parentEl',\n  'replaceElement'\n];\n\nconst Region = MarionetteObject.extend({\n  Dom: DomApi,\n\n  cidPrefix: 'mnr',\n  replaceElement: false,\n  _isReplaced: false,\n  _isSwappingView: false,\n\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    // getOption necessary because options.el may be passed as undefined\n    this._initEl = this.el = this.getOption('el');\n\n    // Handle when this.el is passed in as a $ wrapped element.\n    this.el = this.el instanceof Backbone.$ ? this.el[0] : this.el;\n\n    if (!this.el) {\n      throw new MarionetteError({\n        name: 'NoElError',\n        message: 'An \"el\" must be specified for a region.'\n      });\n    }\n\n    this.$el = this.getEl(this.el);\n    MarionetteObject.call(this, options);\n  },\n\n  // Displays a backbone view instance inside of the region. Handles calling the `render`\n  // method for you. Reads content directly from the `el` attribute. The `preventDestroy`\n  // option can be used to prevent a view from the old view being destroyed on show.\n  show(view, options) {\n    if (!this._ensureElement(options)) {\n      return;\n    }\n\n    view = this._getView(view, options);\n\n    if (view === this.currentView) { return this; }\n\n    this._isSwappingView = !!this.currentView;\n\n    this.triggerMethod('before:show', this, view, options);\n\n    // Assume an attached view is already in the region for pre-existing DOM\n    if (!view._isAttached) {\n      this.empty(options);\n    }\n\n    this._setupChildView(view);\n\n    this.currentView = view;\n\n    renderView(view);\n\n    this._attachView(view, options);\n\n    this.triggerMethod('show', this, view, options);\n\n    this._isSwappingView = false;\n\n    return this;\n  },\n\n  _setupChildView(view) {\n    monitorViewEvents(view);\n\n    this._proxyChildViewEvents(view);\n\n    // We need to listen for if a view is destroyed in a way other than through the region.\n    // If this happens we need to remove the reference to the currentView since once a view\n    // has been destroyed we can not reuse it.\n    view.on('destroy', this._empty, this);\n  },\n\n  _proxyChildViewEvents(view) {\n    const parentView = this._parentView;\n\n    if (!parentView) { return; }\n\n    parentView._proxyChildViewEvents(view);\n  },\n\n  // If the regions parent view is not monitoring its attach/detach events\n  _shouldDisableMonitoring() {\n    return this._parentView && this._parentView.monitorViewEvents === false;\n  },\n\n  _attachView(view, options = {}) {\n    const shouldTriggerAttach = !view._isAttached && isNodeAttached(this.el) && !this._shouldDisableMonitoring();\n    const shouldReplaceEl = typeof options.replaceElement === 'undefined' ? !!_.result(this, 'replaceElement') : !!options.replaceElement;\n\n    if (shouldTriggerAttach) {\n      triggerMethodOn(view, 'before:attach', view);\n    }\n\n    if (shouldReplaceEl) {\n      this._replaceEl(view);\n    } else {\n      this.attachHtml(view);\n    }\n\n    if (shouldTriggerAttach) {\n      view._isAttached = true;\n      triggerMethodOn(view, 'attach', view);\n    }\n  },\n\n  _ensureElement(options = {}) {\n    if (!_.isObject(this.el)) {\n      this.$el = this.getEl(this.el);\n      this.el = this.$el[0];\n      // Make sure the $el contains only the el\n      this.$el = this.Dom.getEl(this.el);\n    }\n\n    if (!this.$el || this.$el.length === 0) {\n      const allowMissingEl = typeof options.allowMissingEl === 'undefined' ? !!_.result(this, 'allowMissingEl') : !!options.allowMissingEl;\n\n      if (allowMissingEl) {\n        return false;\n      } else {\n        throw new MarionetteError(`An \"el\" must exist in DOM for this region ${this.cid}`);\n      }\n    }\n    return true;\n  },\n\n  _getView(view) {\n    if (!view) {\n      throw new MarionetteError({\n        name: 'ViewNotValid',\n        message: 'The view passed is undefined and therefore invalid. You must pass a view instance to show.'\n      });\n    }\n\n    if (view._isDestroyed) {\n      throw new MarionetteError({\n        name: 'ViewDestroyedError',\n        message: `View (cid: \"${view.cid}\") has already been destroyed and cannot be used.`\n      });\n    }\n\n    if (view instanceof Backbone.View) {\n      return view;\n    }\n\n    const viewOptions = this._getViewOptions(view);\n\n    return new View(viewOptions);\n  },\n\n  // This allows for a template or a static string to be\n  // used as a template\n  _getViewOptions(viewOptions) {\n    if (_.isFunction(viewOptions)) {\n      return { template: viewOptions };\n    }\n\n    if (_.isObject(viewOptions)) {\n      return viewOptions;\n    }\n\n    const template = function() { return viewOptions; };\n\n    return { template };\n  },\n\n  // Override this method to change how the region finds the DOM element that it manages. Return\n  // a jQuery selector object scoped to a provided parent el or the document if none exists.\n  getEl(el) {\n    const context = _.result(this, 'parentEl');\n\n    if (context && _.isString(el)) {\n      return this.Dom.findEl(context, el);\n    }\n\n    return this.Dom.getEl(el);\n  },\n\n  _replaceEl(view) {\n    // always restore the el to ensure the regions el is present before replacing\n    this._restoreEl();\n\n    view.on('before:destroy', this._restoreEl, this);\n\n    this.Dom.replaceEl(view.el, this.el);\n\n    this._isReplaced = true;\n  },\n\n  // Restore the region's element in the DOM.\n  _restoreEl() {\n    // There is nothing to replace\n    if (!this._isReplaced) {\n      return;\n    }\n\n    const view = this.currentView;\n\n    if (!view) {\n      return;\n    }\n\n    this._detachView(view);\n\n    this._isReplaced = false;\n  },\n\n  // Check to see if the region's el was replaced.\n  isReplaced() {\n    return !!this._isReplaced;\n  },\n\n  // Check to see if a view is being swapped by another\n  isSwappingView() {\n    return !!this._isSwappingView;\n  },\n\n  // Override this method to change how the new view is appended to the `$el` that the\n  // region is managing\n  attachHtml(view) {\n    this.Dom.appendContents(this.el, view.el, {_$el: this.$el, _$contents: view.$el});\n  },\n\n  // Destroy the current view, if there is one. If there is no current view, it does\n  // nothing and returns immediately.\n  empty(options = { allowMissingEl: true }) {\n    const view = this.currentView;\n\n    // If there is no view in the region we should only detach current html\n    if (!view) {\n      if (this._ensureElement(options)) {\n        this.detachHtml();\n      }\n      return this;\n    }\n\n    const shouldDestroy = !options.preventDestroy;\n\n    if (!shouldDestroy) {\n      deprecate('The preventDestroy option is deprecated. Use Region#detachView');\n    }\n\n    this._empty(view, shouldDestroy);\n    return this;\n  },\n\n  _empty(view, shouldDestroy) {\n    view.off('destroy', this._empty, this);\n    this.triggerMethod('before:empty', this, view);\n\n    this._restoreEl();\n\n    delete this.currentView;\n\n    if (!view._isDestroyed) {\n      if (shouldDestroy) {\n        this.removeView(view);\n      } else {\n        this._detachView(view);\n      }\n      this._stopChildViewEvents(view);\n    }\n\n    this.triggerMethod('empty', this, view);\n  },\n\n  _stopChildViewEvents(view) {\n    const parentView = this._parentView;\n\n    if (!parentView) { return; }\n\n    this._parentView.stopListening(view);\n  },\n\n  destroyView(view) {\n    if (view._isDestroyed) {\n      return view;\n    }\n\n    view._shouldDisableEvents = this._shouldDisableMonitoring();\n    destroyView(view);\n    return view;\n  },\n\n  removeView(view) {\n    this.destroyView(view);\n  },\n\n  // Empties the Region without destroying the view\n  // Returns the detached view\n  detachView() {\n    const view = this.currentView;\n\n    if (!view) {\n      return;\n    }\n\n    this._empty(view);\n\n    return view;\n  },\n\n  _detachView(view) {\n    const shouldTriggerDetach = view._isAttached && !this._shouldDisableMonitoring();;\n    const shouldRestoreEl = this._isReplaced;\n    if (shouldTriggerDetach) {\n      triggerMethodOn(view, 'before:detach', view);\n    }\n\n    if (shouldRestoreEl) {\n      this.Dom.replaceEl(this.el, view.el);\n    } else {\n      this.detachHtml();\n    }\n\n    if (shouldTriggerDetach) {\n      view._isAttached = false;\n      triggerMethodOn(view, 'detach', view);\n    }\n  },\n\n  // Override this method to change how the region detaches current content\n  detachHtml() {\n    this.Dom.detachContents(this.el, this.$el);\n  },\n\n  // Checks whether a view is currently present within the region. Returns `true` if there is\n  // and `false` if no view is present.\n  hasView() {\n    return !!this.currentView;\n  },\n\n  // Reset the region by destroying any existing view and clearing out the cached `$el`.\n  // The next time a view is shown via this region, the region will re-query the DOM for\n  // the region's `el`.\n  reset(options) {\n    this.empty(options);\n\n    if (this.$el) {\n      this.el = this._initEl;\n    }\n\n    delete this.$el;\n    return this;\n  },\n\n  destroy(options) {\n    if (this._isDestroyed) { return this; }\n\n    this.reset(options);\n\n    if (this._name) {\n      this._parentView._removeReferences(this._name);\n    }\n    delete this._parentView;\n    delete this._name;\n\n    return MarionetteObject.prototype.destroy.apply(this, arguments);\n  }\n}, {\n  setDomApi\n});\n\nexport default Region;\n","import _ from 'underscore';\nimport _invoke from '../utils/invoke';\nimport buildRegion from '../common/build-region';\nimport Region from '../region';\n\n// MixinOptions\n// - regions\n// - regionClass\n\nexport default {\n  regionClass: Region,\n\n  // Internal method to initialize the regions that have been defined in a\n  // `regions` attribute on this View.\n  _initRegions() {\n\n    // init regions hash\n    this.regions = this.regions || {};\n    this._regions = {};\n\n    this.addRegions(_.result(this, 'regions'));\n  },\n\n  // Internal method to re-initialize all of the regions by updating\n  // the `el` that they point to\n  _reInitRegions() {\n    _invoke(this._regions, 'reset');\n  },\n\n  // Add a single region, by name, to the View\n  addRegion(name, definition) {\n    const regions = {};\n    regions[name] = definition;\n    return this.addRegions(regions)[name];\n  },\n\n  // Add multiple regions as a {name: definition, name2: def2} object literal\n  addRegions(regions) {\n    // If there's nothing to add, stop here.\n    if (_.isEmpty(regions)) {\n      return;\n    }\n\n    // Normalize region selectors hash to allow\n    // a user to use the @ui. syntax.\n    regions = this.normalizeUIValues(regions, ['selector', 'el']);\n\n    // Add the regions definitions to the regions property\n    this.regions = _.extend({}, this.regions, regions);\n\n    return this._addRegions(regions);\n  },\n\n  // internal method to build and add regions\n  _addRegions(regionDefinitions) {\n    const defaults = {\n      regionClass: this.regionClass,\n      parentEl: _.partial(_.result, this, 'el')\n    };\n\n    return _.reduce(regionDefinitions, (regions, definition, name) => {\n      regions[name] = buildRegion(definition, defaults);\n      this._addRegion(regions[name], name);\n      return regions;\n    }, {});\n  },\n\n  _addRegion(region, name) {\n    this.triggerMethod('before:add:region', this, name, region);\n\n    region._parentView = this;\n    region._name = name;\n\n    this._regions[name] = region;\n\n    this.triggerMethod('add:region', this, name, region);\n  },\n\n  // Remove a single region from the View, by name\n  removeRegion(name) {\n    const region = this._regions[name];\n\n    this._removeRegion(region, name);\n\n    return region;\n  },\n\n  // Remove all regions from the View\n  removeRegions() {\n    const regions = this._getRegions();\n\n    _.each(this._regions, _.bind(this._removeRegion, this));\n\n    return regions;\n  },\n\n  _removeRegion(region, name) {\n    this.triggerMethod('before:remove:region', this, name, region);\n\n    region.destroy();\n\n    this.triggerMethod('remove:region', this, name, region);\n  },\n\n  // Called in a region's destroy\n  _removeReferences(name) {\n    delete this.regions[name];\n    delete this._regions[name];\n  },\n\n  // Empty all regions in the region manager, but\n  // leave them attached\n  emptyRegions() {\n    const regions = this.getRegions();\n    _invoke(regions, 'empty');\n    return regions;\n  },\n\n  // Checks to see if view contains region\n  // Accepts the region name\n  // hasRegion('main')\n  hasRegion(name) {\n    return !!this.getRegion(name);\n  },\n\n  // Provides access to regions\n  // Accepts the region name\n  // getRegion('main')\n  getRegion(name) {\n    if (!this._isRendered) {\n      this.render();\n    }\n    return this._regions[name];\n  },\n\n  // Get all regions\n  _getRegions() {\n    return _.clone(this._regions);\n  },\n\n  getRegions() {\n    if (!this._isRendered) {\n      this.render();\n    }\n    return this._getRegions();\n  },\n\n  showChildView(name, view, ...args) {\n    const region = this.getRegion(name);\n    return region.show(view, ...args);\n  },\n\n  detachChildView(name) {\n    return this.getRegion(name).detachView();\n  },\n\n  getChildView(name) {\n    return this.getRegion(name).currentView;\n  }\n\n};\n","// Renderer\n// --------\n\nimport _ from 'underscore';\nimport MarionetteError from '../error';\nimport TemplateCache from '../template-cache';\n\n// Render a template with data by passing in the template\n// selector and the data to render.\nconst Renderer = {\n\n  // Render a template with data. The `template` parameter is\n  // passed to the `TemplateCache` object to retrieve the\n  // template function. Override this method to provide your own\n  // custom rendering and template handling for all of Marionette.\n  render(template, data) {\n    if (!template) {\n      throw new MarionetteError({\n        name: 'TemplateNotFoundError',\n        message: 'Cannot render the template since its false, null or undefined.'\n      });\n    }\n\n    const templateFunc = _.isFunction(template) ? template : TemplateCache.get(template);\n\n    return templateFunc(data);\n  }\n};\n\nexport default Renderer;\n","// View\n// ---------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport deprecate from './utils/deprecate';\nimport isNodeAttached from './common/is-node-attached';\nimport monitorViewEvents from './common/monitor-view-events';\nimport ViewMixin from './mixins/view';\nimport RegionsMixin from './mixins/regions';\nimport Renderer from './config/renderer';\nimport { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'behaviors',\n  'childViewEventPrefix',\n  'childViewEvents',\n  'childViewTriggers',\n  'collectionEvents',\n  'events',\n  'modelEvents',\n  'regionClass',\n  'regions',\n  'template',\n  'templateContext',\n  'triggers',\n  'ui'\n];\n\n// The standard view. Includes view events, automatic rendering\n// of Underscore templates, nested views, and more.\nconst View = Backbone.View.extend({\n\n  constructor(options) {\n    this.render = _.bind(this.render, this);\n\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    monitorViewEvents(this);\n\n    this._initBehaviors();\n    this._initRegions();\n\n    const args = Array.prototype.slice.call(arguments);\n    args[0] = this.options;\n    Backbone.View.prototype.constructor.apply(this, args);\n\n    this.delegateEntityEvents();\n\n    this._triggerEventOnBehaviors('initialize', this);\n  },\n\n  // Serialize the view's model *or* collection, if\n  // it exists, for the template\n  serializeData() {\n    if (!this.model && !this.collection) {\n      return {};\n    }\n\n    // If we have a model, we serialize that\n    if (this.model) {\n      return this.serializeModel();\n    }\n\n    // Otherwise, we serialize the collection,\n    // making it available under the `items` property\n    return {\n      items: this.serializeCollection()\n    };\n  },\n\n  // Prepares the special `model` property of a view\n  // for being displayed in the template. By default\n  // we simply clone the attributes. Override this if\n  // you need a custom transformation for your view's model\n  serializeModel() {\n    if (!this.model) { return {}; }\n    return _.clone(this.model.attributes);\n  },\n\n  // Serialize a collection by cloning each of\n  // its model's attributes\n  serializeCollection() {\n    if (!this.collection) { return {}; }\n    return this.collection.map(function(model) { return _.clone(model.attributes); });\n  },\n\n  // Overriding Backbone.View's `setElement` to handle\n  // if an el was previously defined. If so, the view might be\n  // rendered or attached on setElement.\n  setElement() {\n    const hasEl = !!this.el;\n\n    Backbone.View.prototype.setElement.apply(this, arguments);\n\n    if (hasEl) {\n      this._isRendered = this.Dom.hasContents(this.el);\n      this._isAttached = isNodeAttached(this.el);\n    }\n\n    if (this._isRendered) {\n      this.bindUIElements();\n    }\n\n    return this;\n  },\n\n  // Render the view, defaulting to underscore.js templates.\n  // You can override this in your view definition to provide\n  // a very specific rendering for your view. In general, though,\n  // you should override the `Marionette.Renderer` object to\n  // change how Marionette renders views.\n  // Subsequent renders after the first will re-render all nested\n  // views.\n  render() {\n    if (this._isDestroyed) { return this; }\n\n    this.triggerMethod('before:render', this);\n\n    // If this is not the first render call, then we need to\n    // re-initialize the `el` for each region\n    if (this._isRendered) {\n      this._reInitRegions();\n    }\n\n    this._renderTemplate();\n    this.bindUIElements();\n\n    this._isRendered = true;\n    this.triggerMethod('render', this);\n\n    return this;\n  },\n\n  // Internal method to render the template with the serialized data\n  // and template context via the `Marionette.Renderer` object.\n  _renderTemplate() {\n    const template = this.getTemplate();\n\n    // Allow template-less views\n    if (template === false) {\n      deprecate('template:false is deprecated.  Use _.noop.');\n      return;\n    }\n\n    // Add in entity data and template context\n    const data = this.mixinTemplateContext(this.serializeData());\n\n    // Render and add to el\n    const html = this._renderHtml(template, data);\n    this.attachElContent(html);\n  },\n\n  // Renders the data into the template\n  _renderHtml(template, data) {\n    return Renderer.render(template, data, this);\n  },\n\n  // Get the template for this view\n  // instance. You can set a `template` attribute in the view\n  // definition or pass a `template: \"whatever\"` parameter in\n  // to the constructor options.\n  getTemplate() {\n    return this.template;\n  },\n\n  // Mix in template context methods. Looks for a\n  // `templateContext` attribute, which can either be an\n  // object literal, or a function that returns an object\n  // literal. All methods and attributes from this object\n  // are copies to the object passed in.\n  mixinTemplateContext(target = {}) {\n    const templateContext = _.result(this, 'templateContext');\n    return _.extend(target, templateContext);\n  },\n\n  // Attaches the content of a given view.\n  // This method can be overridden to optimize rendering,\n  // or to render in a non standard way.\n  //\n  // For example, using `innerHTML` instead of `$el.html`\n  //\n  // ```js\n  // attachElContent(html) {\n  //   this.el.innerHTML = html;\n  //   return this;\n  // }\n  // ```\n  attachElContent(html) {\n    this.Dom.setContents(this.el, html, this.$el);\n\n    return this;\n  },\n\n  // called by ViewMixin destroy\n  _removeChildren() {\n    this.removeRegions();\n  },\n\n  _getImmediateChildren() {\n    return _.chain(this._getRegions())\n      .map('currentView')\n      .compact()\n      .value();\n  }\n}, {\n  // Sets the renderer for the Marionette.View class\n  setRenderer(renderer) {\n    this.prototype._renderHtml = renderer;\n    return this;\n  },\n\n  setDomApi\n});\n\n_.extend(View.prototype, ViewMixin, RegionsMixin);\n\nexport default View;\n","// Mix in methods from Underscore, for iteration, and other\n// collection related features.\n// Borrowing this code from Backbone.Collection:\n// https://github.com/jashkenas/backbone/blob/1.1.2/backbone.js#L962\n\nimport _ from 'underscore';\n\nconst methods = ['forEach', 'each', 'map', 'find', 'detect', 'filter',\n                'select', 'reject', 'every', 'all', 'some', 'any', 'include',\n                'contains', 'invoke', 'toArray', 'first', 'initial', 'rest',\n                'last', 'without', 'isEmpty', 'pluck', 'reduce', 'partition'];\n\nconst emulateCollection = function(object, listProperty) {\n  _.each(methods, function(method) {\n    object[method] = function() {\n      const list = _.result(this, listProperty);\n      const args = Array.prototype.slice.call(arguments);\n      return _[method].apply(_, [list].concat(args));\n    };\n  });\n};\n\nexport default emulateCollection;\n","import _ from 'underscore';\nimport emulateCollection from './utils/emulate-collection';\n\n// Provide a container to store, retrieve and\n// shut down child views.\nconst Container = function(views) {\n  this._views = {};\n  this._indexByModel = {};\n  this._indexByCustom = {};\n  this._updateLength();\n\n  _.each(views, _.bind(this.add, this));\n};\n\nemulateCollection(Container.prototype, '_getViews');\n\n// Container Methods\n// -----------------\n\n_.extend(Container.prototype, {\n\n  _getViews() {\n    return _.values(this._views);\n  },\n\n  // Add a view to this container. Stores the view\n  // by `cid` and makes it searchable by the model\n  // cid (and model itself). Optionally specify\n  // a custom key to store an retrieve the view.\n  add(view, customIndex) {\n    return this._add(view, customIndex)._updateLength();\n  },\n\n  // To be used when avoiding call _updateLength\n  // When you are done adding all your new views\n  // call _updateLength\n  _add(view, customIndex) {\n    const viewCid = view.cid;\n\n    // store the view\n    this._views[viewCid] = view;\n\n    // index it by model\n    if (view.model) {\n      this._indexByModel[view.model.cid] = viewCid;\n    }\n\n    // index by custom\n    if (customIndex) {\n      this._indexByCustom[customIndex] = viewCid;\n    }\n\n    return this;\n  },\n\n  // Find a view by the model that was attached to\n  // it. Uses the model's `cid` to find it.\n  findByModel(model) {\n    return this.findByModelCid(model.cid);\n  },\n\n  // Find a view by the `cid` of the model that was attached to\n  // it. Uses the model's `cid` to find the view `cid` and\n  // retrieve the view using it.\n  findByModelCid(modelCid) {\n    const viewCid = this._indexByModel[modelCid];\n    return this.findByCid(viewCid);\n  },\n\n  // Find a view by a custom indexer.\n  findByCustom(index) {\n    const viewCid = this._indexByCustom[index];\n    return this.findByCid(viewCid);\n  },\n\n  // Find by index. This is not guaranteed to be a\n  // stable index.\n  findByIndex(index) {\n    return _.values(this._views)[index];\n  },\n\n  // retrieve a view by its `cid` directly\n  findByCid(cid) {\n    return this._views[cid];\n  },\n\n  // Remove a view\n  remove(view) {\n    return this._remove(view)._updateLength();\n  },\n\n  // To be used when avoiding call _updateLength\n  // When you are done adding all your new views\n  // call _updateLength\n  _remove(view) {\n    const viewCid = view.cid;\n\n    // delete model index\n    if (view.model) {\n      delete this._indexByModel[view.model.cid];\n    }\n\n    // delete custom index\n    _.some(this._indexByCustom, _.bind(function(cid, key) {\n      if (cid === viewCid) {\n        delete this._indexByCustom[key];\n        return true;\n      }\n    }, this));\n\n    // remove the view from the container\n    delete this._views[viewCid];\n\n    return this;\n  },\n\n  // Update the `.length` attribute on this container\n  _updateLength() {\n    this.length = _.size(this._views);\n\n    return this;\n  }\n});\n\nexport default Container;\n","// Collection View\n// ---------------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport { renderView, destroyView } from './common/view';\nimport isNodeAttached from './common/is-node-attached';\nimport monitorViewEvents from './common/monitor-view-events';\nimport { triggerMethodOn } from './common/trigger-method';\nimport ChildViewContainer from './child-view-container';\nimport MarionetteError from './error';\nimport ViewMixin from './mixins/view';\nimport { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'behaviors',\n  'childView',\n  'childViewEventPrefix',\n  'childViewEvents',\n  'childViewOptions',\n  'childViewTriggers',\n  'collectionEvents',\n  'events',\n  'filter',\n  'emptyView',\n  'emptyViewOptions',\n  'modelEvents',\n  'reorderOnSort',\n  'sort',\n  'triggers',\n  'ui',\n  'viewComparator'\n];\n\n// A view that iterates over a Backbone.Collection\n// and renders an individual child view for each model.\nconst CollectionView = Backbone.View.extend({\n\n  // flag for maintaining the sorted order of the collection\n  sort: true,\n\n  // constructor\n  // option to pass `{sort: false}` to prevent the `CollectionView` from\n  // maintaining the sorted order of the collection.\n  // This will fallback onto appending childView's to the end.\n  //\n  // option to pass `{viewComparator: compFunction()}` to allow the `CollectionView`\n  // to use a custom sort order for the collection.\n  constructor(options) {\n    this.render = _.bind(this.render, this);\n\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    monitorViewEvents(this);\n\n    this._initBehaviors();\n    this.once('render', this._initialEvents);\n    this._initChildViewStorage();\n    this._bufferedChildren = [];\n\n    const args = Array.prototype.slice.call(arguments);\n    args[0] = this.options;\n    Backbone.View.prototype.constructor.apply(this, args);\n\n    this.delegateEntityEvents();\n\n    this._triggerEventOnBehaviors('initialize', this);\n  },\n\n  // Instead of inserting elements one by one into the page, it's much more performant to insert\n  // elements into a document fragment and then insert that document fragment into the page\n  _startBuffering() {\n    this._isBuffering = true;\n  },\n\n  _endBuffering() {\n    const shouldTriggerAttach = this._isAttached && this.monitorViewEvents !== false;\n    const triggerOnChildren = shouldTriggerAttach ? this._getImmediateChildren() : [];\n\n    this._isBuffering = false;\n\n    _.each(triggerOnChildren, child => {\n      triggerMethodOn(child, 'before:attach', child);\n    });\n\n    this.attachBuffer(this, this._createBuffer());\n\n    _.each(triggerOnChildren, child => {\n      child._isAttached = true;\n      triggerMethodOn(child, 'attach', child);\n    });\n\n    this._bufferedChildren = [];\n  },\n\n  _getImmediateChildren() {\n    return _.values(this.children._views);\n  },\n\n  // Configured the initial events that the collection view binds to.\n  _initialEvents() {\n    if (this.collection) {\n      this.listenTo(this.collection, 'add', this._onCollectionAdd);\n      this.listenTo(this.collection, 'update', this._onCollectionUpdate);\n      this.listenTo(this.collection, 'reset', this.render);\n\n      if (this.sort) {\n        this.listenTo(this.collection, 'sort', this._sortViews);\n      }\n    }\n  },\n\n  // Handle a child added to the collection\n  _onCollectionAdd(child, collection, opts) {\n    // `index` is present when adding with `at` since BB 1.2; indexOf fallback for < 1.2\n    let index = opts.at !== undefined && (opts.index || collection.indexOf(child));\n\n    // When filtered or when there is no initial index, calculate index.\n    if (this.filter || index === false) {\n      index = _.indexOf(this._filteredSortedModels(index), child);\n    }\n\n    if (this._shouldAddChild(child, index)) {\n      this._destroyEmptyView();\n      this._addChild(child, index)\n    }\n  },\n\n  // Handle collection update model removals\n  _onCollectionUpdate(collection, options) {\n    const changes = options.changes;\n    this._removeChildModels(changes.removed);\n  },\n\n  // Remove the child views and destroy them.\n  // This function also updates the indices of later views\n  // in the collection in order to keep the children in sync with the collection.\n  // \"models\" is an array of models and the corresponding views\n  // will be removed and destroyed from the CollectionView\n  _removeChildModels(models) {\n    // Used to determine where to update the remaining\n    // sibling view indices after these views are removed.\n    const removedViews = this._getRemovedViews(models);\n\n    if (!removedViews.length) {\n      return;\n    }\n\n    this.children._updateLength();\n\n    // decrement the index of views after this one\n    this._updateIndices(removedViews, false);\n\n    if (this.isEmpty()) {\n      this._showEmptyView();\n    }\n  },\n\n  // Returns the views that will be used for re-indexing\n  // through CollectionView#_updateIndices.\n  _getRemovedViews(models) {\n\n    // Returning a view means something was removed.\n    return _.reduce(models, (removingViews, model) => {\n      const view = model && this.children.findByModel(model);\n\n      if (!view || view._isDestroyed) {\n        return removingViews;\n      }\n\n      this._removeChildView(view);\n\n      removingViews.push(view);\n\n      return removingViews;\n    }, []);\n  },\n\n  _removeChildView(view) {\n    this.triggerMethod('before:remove:child', this, view);\n\n    this.children._remove(view);\n    view._shouldDisableEvents = this.monitorViewEvents === false;\n    destroyView(view);\n\n    this.stopListening(view);\n    this.triggerMethod('remove:child', this, view);\n  },\n\n  // Overriding Backbone.View's `setElement` to handle\n  // if an el was previously defined. If so, the view might be\n  // attached on setElement.\n  setElement() {\n    const hasEl = !!this.el;\n\n    Backbone.View.prototype.setElement.apply(this, arguments);\n\n    if (hasEl) {\n      this._isAttached = isNodeAttached(this.el);\n    }\n\n    return this;\n  },\n\n  // Render children views. Override this method to provide your own implementation of a\n  // render function for the collection view.\n  render() {\n    if (this._isDestroyed) { return this; }\n    this.triggerMethod('before:render', this);\n    this._renderChildren();\n    this._isRendered = true;\n    this.triggerMethod('render', this);\n    return this;\n  },\n\n  // An efficient rendering used for filtering. Instead of modifying the whole DOM for the\n  // collection view, we are only adding or removing the related childrenViews.\n  setFilter(filter, {preventRender} = {}) {\n    const canBeRendered = this._isRendered && !this._isDestroyed;\n    const filterChanged = this.filter !== filter;\n    const shouldRender = canBeRendered && filterChanged && !preventRender;\n\n    if (shouldRender) {\n      const previousModels = this._filteredSortedModels();\n      this.filter = filter;\n      const models = this._filteredSortedModels();\n      this._applyModelDeltas(models, previousModels);\n    } else {\n      this.filter = filter;\n    }\n\n    return this;\n  },\n\n  // `removeFilter` is actually an alias for removing filters.\n  removeFilter(options) {\n    return this.setFilter(null, options);\n  },\n\n  // Calculate and apply difference by cid between `models` and `previousModels`.\n  _applyModelDeltas(models, previousModels) {\n    const currentIds = {};\n    _.each(models, (model, index) => {\n      const addedChildNotExists = !this.children.findByModel(model);\n      if (addedChildNotExists) {\n        this._onCollectionAdd(model, this.collection, {at: index});\n      }\n      currentIds[model.cid] = true;\n    });\n\n    const removeModels = _.filter(previousModels, (prevModel) => {\n      return !currentIds[prevModel.cid] && this.children.findByModel(prevModel);\n    });\n\n    this._removeChildModels(removeModels);\n  },\n\n  // Reorder DOM after sorting. When your element's rendering do not use their index,\n  // you can pass reorderOnSort: true to only reorder the DOM after a sort instead of\n  // rendering all the collectionView.\n  reorder() {\n    const children = this.children;\n    const models = this._filteredSortedModels();\n\n    if (!models.length && this._showingEmptyView) { return this; }\n\n    const anyModelsAdded = _.some(models, function(model) {\n      return !children.findByModel(model);\n    });\n\n    // If there are any new models added due to filtering we need to add child views,\n    // so render as normal.\n    if (anyModelsAdded) {\n      this.render();\n    } else {\n\n      const filteredOutModels = [];\n\n      // Get the DOM nodes in the same order as the models and\n      // find the model that were children before but aren't in this new order.\n      const elsToReorder = _.reduce(this.children._views, function(viewEls, view) {\n        const index = _.indexOf(models, view.model);\n\n        if (index === -1) {\n          filteredOutModels.push(view.model);\n          return viewEls;\n        }\n\n        view._index = index;\n\n        viewEls[index] = view.el;\n\n        return viewEls;\n      }, new Array(models.length));\n\n      this.triggerMethod('before:reorder', this);\n\n      const elBuffer = this.Dom.createBuffer();\n\n      _.each(elsToReorder, (el) => {\n        this.Dom.appendContents(elBuffer, el);\n      });\n\n      // Since append moves elements that are already in the DOM, appending the elements\n      // will effectively reorder them.\n      this._appendReorderedChildren(elBuffer);\n\n      // remove any views that have been filtered out\n      this._removeChildModels(filteredOutModels);\n\n      this.triggerMethod('reorder', this);\n    }\n    return this;\n  },\n\n  // Render view after sorting. Override this method to change how the view renders\n  // after a `sort` on the collection.\n  resortView() {\n    if (this.reorderOnSort) {\n      this.reorder();\n    } else {\n      this._renderChildren();\n    }\n    return this;\n  },\n\n  // Internal method. This checks for any changes in the order of the collection.\n  // If the index of any view doesn't match, it will render.\n  _sortViews() {\n    const models = this._filteredSortedModels();\n\n    // check for any changes in sort order of views\n    const orderChanged = _.find(models, (item, index) => {\n      const view = this.children.findByModel(item);\n      return !view || view._index !== index;\n    });\n\n    if (orderChanged) {\n      this.resortView();\n    }\n  },\n\n  // Internal reference to what index a `emptyView` is.\n  _emptyViewIndex: -1,\n\n  // Internal method. Separated so that CompositeView can append to the childViewContainer\n  // if necessary\n  _appendReorderedChildren(children) {\n    this.Dom.appendContents(this.el, children, {_$el: this.$el});\n  },\n\n  // Internal method. Separated so that CompositeView can have more control over events\n  // being triggered, around the rendering process\n  _renderChildren() {\n    if (this._isRendered) {\n      this._destroyEmptyView();\n      this._destroyChildren();\n    }\n\n    const models = this._filteredSortedModels();\n    if (this.isEmpty({processedModels: models})) {\n      this._showEmptyView();\n    } else {\n      this.triggerMethod('before:render:children', this);\n      this._startBuffering();\n      this._showCollection(models);\n      this._endBuffering();\n      this.triggerMethod('render:children', this);\n    }\n  },\n\n  _createView(model, index) {\n    const ChildView = this._getChildView(model);\n    const childViewOptions = this._getChildViewOptions(model, index);\n    const view = this.buildChildView(model, ChildView, childViewOptions);\n    return view;\n  },\n\n  _setupChildView(view, index) {\n    monitorViewEvents(view);\n\n    // set up the child view event forwarding\n    this._proxyChildViewEvents(view);\n\n    if (this.sort) {\n      view._index = index;\n    }\n  },\n\n  // Internal method to loop through collection and show each child view.\n  _showCollection(models) {\n    _.each(models, _.bind(this._addChild, this));\n    this.children._updateLength();\n  },\n\n  // Allow the collection to be sorted by a custom view comparator\n  _filteredSortedModels(addedAt) {\n    if (!this.collection || !this.collection.length) { return []; }\n\n    const viewComparator = this.getViewComparator();\n    let models = this.collection.models;\n    addedAt = Math.min(Math.max(addedAt, 0), models.length - 1);\n\n    if (viewComparator) {\n      let addedModel;\n      // Preserve `at` location, even for a sorted view\n      if (addedAt) {\n        addedModel = models[addedAt];\n        models = models.slice(0, addedAt).concat(models.slice(addedAt + 1));\n      }\n      models = this._sortModelsBy(models, viewComparator);\n      if (addedModel) {\n        models.splice(addedAt, 0, addedModel);\n      }\n    }\n\n    // Filter after sorting in case the filter uses the index\n    models = this._filterModels(models);\n\n    return models;\n  },\n\n  getViewComparator() {\n    return this.viewComparator;\n  },\n\n  // Filter an array of models, if a filter exists\n  _filterModels(models) {\n    if (this.filter) {\n      models = _.filter(models, (model, index) => {\n        return this._shouldAddChild(model, index);\n      });\n    }\n    return models;\n  },\n\n  _sortModelsBy(models, comparator) {\n    if (typeof comparator === 'string') {\n      return _.sortBy(models, (model) => {\n        return model.get(comparator);\n      });\n    } else if (comparator.length === 1) {\n      return _.sortBy(models, _.bind(comparator, this));\n    } else {\n      return _.clone(models).sort(_.bind(comparator, this));\n    }\n  },\n\n  // Internal method to show an empty view in place of a collection of child views,\n  // when the collection is empty\n  _showEmptyView() {\n    const EmptyView = this._getEmptyView();\n\n    if (EmptyView && !this._showingEmptyView) {\n      this._showingEmptyView = true;\n\n      const model = new Backbone.Model();\n      let emptyViewOptions =\n        this.emptyViewOptions || this.childViewOptions;\n      if (_.isFunction(emptyViewOptions)) {\n        emptyViewOptions = emptyViewOptions.call(this, model, this._emptyViewIndex);\n      }\n\n      const view = this.buildChildView(model, EmptyView, emptyViewOptions);\n\n      this.triggerMethod('before:render:empty', this, view);\n      this.addChildView(view, 0);\n      this.triggerMethod('render:empty', this, view);\n    }\n  },\n\n  // Internal method to destroy an existing emptyView instance if one exists. Called when\n  // a collection view has been rendered empty, and then a child is added to the collection.\n  _destroyEmptyView() {\n    if (this._showingEmptyView) {\n      this.triggerMethod('before:remove:empty', this);\n\n      this._destroyChildren();\n      delete this._showingEmptyView;\n\n      this.triggerMethod('remove:empty', this);\n    }\n  },\n\n  // Retrieve the empty view class\n  _getEmptyView() {\n    const emptyView = this.emptyView;\n\n    if (!emptyView) { return; }\n\n    return this._getView(emptyView);\n  },\n\n  // Retrieve the `childView` class\n  // The `childView` property can be either a view class or a function that\n  // returns a view class. If it is a function, it will receive the model that\n  // will be passed to the view instance (created from the returned view class)\n  _getChildView(child) {\n    let childView = this.childView;\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'NoChildViewError',\n        message: 'A \"childView\" must be specified'\n      });\n    }\n\n    childView = this._getView(childView, child);\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'InvalidChildViewError',\n        message: '\"childView\" must be a view class or a function that returns a view class'\n      });\n    }\n\n    return childView;\n  },\n\n  // First check if the `view` is a view class (the common case)\n  // Then check if it's a function (which we assume that returns a view class)\n  _getView(view, child) {\n    if (view.prototype instanceof Backbone.View || view === Backbone.View) {\n      return view;\n    } else if (_.isFunction(view)) {\n      return view.call(this, child);\n    }\n  },\n\n  // Internal method for building and adding a child view\n  _addChild(child, index) {\n    const view = this._createView(child, index);\n    this.addChildView(view, index);\n\n    return view;\n  },\n\n  _getChildViewOptions(child, index) {\n    if (_.isFunction(this.childViewOptions)) {\n      return this.childViewOptions(child, index);\n    }\n\n    return this.childViewOptions;\n  },\n\n  // Render the child's view and add it to the HTML for the collection view at a given index.\n  // This will also update the indices of later views in the collection in order to keep the\n  // children in sync with the collection.\n  addChildView(view, index) {\n    this.triggerMethod('before:add:child', this, view);\n    this._setupChildView(view, index);\n\n    // Store the child view itself so we can properly remove and/or destroy it later\n    if (this._isBuffering) {\n      // Add to children, but don't update children's length.\n      this.children._add(view);\n    } else {\n      // increment indices of views after this one\n      this._updateIndices(view, true);\n      this.children.add(view);\n    }\n\n    renderView(view);\n\n    this._attachView(view, index);\n\n    this.triggerMethod('add:child', this, view);\n\n    return view;\n  },\n\n  // Internal method. This decrements or increments the indices of views after the added/removed\n  // view to keep in sync with the collection.\n  _updateIndices(views, increment) {\n    if (!this.sort) {\n      return;\n    }\n\n    if (!increment) {\n      _.each(_.sortBy(this.children._views, '_index'), (view, index) => {\n        view._index = index;\n      });\n\n      return;\n    }\n\n    const view = _.isArray(views) ? _.max(views, '_index') : views;\n\n    if (_.isObject(view)) {\n      // update the indexes of views after this one\n      _.each(this.children._views, (laterView) => {\n        if (laterView._index >= view._index) {\n          laterView._index += 1;\n        }\n      });\n    }\n  },\n\n  _attachView(view, index) {\n    // Only trigger attach if already attached and not buffering,\n    // otherwise _endBuffering() or Region#show() handles this.\n    const shouldTriggerAttach = !view._isAttached && !this._isBuffering && this._isAttached && this.monitorViewEvents !== false;\n\n    if (shouldTriggerAttach) {\n      triggerMethodOn(view, 'before:attach', view);\n    }\n\n    this.attachHtml(this, view, index);\n\n    if (shouldTriggerAttach) {\n      view._isAttached = true;\n      triggerMethodOn(view, 'attach', view);\n    }\n  },\n\n  // Build a `childView` for a model in the collection.\n  buildChildView(child, ChildViewClass, childViewOptions) {\n    const options = _.extend({model: child}, childViewOptions);\n    return new ChildViewClass(options);\n  },\n\n  // Remove the child view and destroy it. This function also updates the indices of later views\n  // in the collection in order to keep the children in sync with the collection.\n  removeChildView(view) {\n    if (!view || view._isDestroyed) {\n      return view;\n    }\n\n    this._removeChildView(view);\n    this.children._updateLength();\n    // decrement the index of views after this one\n    this._updateIndices(view, false);\n    return view;\n  },\n\n  // check if the collection is empty or optionally whether an array of pre-processed models is empty\n  isEmpty(options) {\n    let models;\n    if (_.result(options, 'processedModels')) {\n      models = options.processedModels;\n    } else {\n      models = this.collection ? this.collection.models : [];\n      models = this._filterModels(models);\n    }\n    return models.length === 0;\n  },\n\n  // You might need to override this if you've overridden attachHtml\n  attachBuffer(collectionView, buffer) {\n    this.Dom.appendContents(collectionView.el, buffer, {_$el: collectionView.$el});\n  },\n\n  // Create a fragment buffer from the currently buffered children\n  _createBuffer() {\n    const elBuffer = this.Dom.createBuffer();\n    _.each(this._bufferedChildren, (b) => {\n      this.Dom.appendContents(elBuffer, b.el, {_$contents: b.$el});\n    });\n    return elBuffer;\n  },\n\n  // Append the HTML to the collection's `el`. Override this method to do something other\n  // than `.append`.\n  attachHtml(collectionView, childView, index) {\n    if (collectionView._isBuffering) {\n      // buffering happens on reset events and initial renders\n      // in order to reduce the number of inserts into the\n      // document, which are expensive.\n      collectionView._bufferedChildren.splice(index, 0, childView);\n    } else {\n      // If we've already rendered the main collection, append\n      // the new child into the correct order if we need to. Otherwise\n      // append to the end.\n      if (!collectionView._insertBefore(childView, index)) {\n        collectionView._insertAfter(childView);\n      }\n    }\n  },\n\n  // Internal method. Check whether we need to insert the view into the correct position.\n  _insertBefore(childView, index) {\n    let currentView;\n    const findPosition = this.sort && (index < this.children.length - 1);\n    if (findPosition) {\n      // Find the view after this one\n      currentView = _.find(this.children._views, (view) => {\n        return view._index === index + 1;\n      });\n    }\n\n    if (currentView) {\n      this.beforeEl(currentView.el, childView.el);\n      return true;\n    }\n\n    return false;\n  },\n\n  // Override to handle DOM inserting differently\n  beforeEl(el, siblings) {\n    this.$(el).before(siblings);\n  },\n\n  // Internal method. Append a view to the end of the $el\n  _insertAfter(childView) {\n    this.Dom.appendContents(this.el, childView.el, {_$el: this.$el, _$contents: childView.$el});\n  },\n\n  // Internal method to set up the `children` object for storing all of the child views\n  _initChildViewStorage() {\n    this.children = new ChildViewContainer();\n  },\n\n  // called by ViewMixin destroy\n  _removeChildren() {\n    this._destroyChildren();\n  },\n\n  // Destroy the child views that this collection view is holding on to, if any\n  _destroyChildren(options) {\n    if (!this.children.length) {\n      return;\n    }\n\n    this.triggerMethod('before:destroy:children', this);\n    _.each(this.children._views, _.bind(this._removeChildView, this));\n    this.children._updateLength();\n    this.triggerMethod('destroy:children', this);\n  },\n\n  // Return true if the given child should be shown. Return false otherwise.\n  // The filter will be passed (child, index, collection), where\n  //  'child' is the given model\n  //  'index' is the index of that model in the collection\n  //  'collection' is the collection referenced by this CollectionView\n  _shouldAddChild(child, index) {\n    const filter = this.filter;\n    return !_.isFunction(filter) || filter.call(this, child, index, this.collection);\n  }\n}, {\n  setDomApi\n});\n\n_.extend(CollectionView.prototype, ViewMixin);\n\nexport default CollectionView;\n","// Next Collection View\n// ---------------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport { renderView, destroyView } from './common/view';\nimport isNodeAttached from './common/is-node-attached';\nimport monitorViewEvents from './common/monitor-view-events';\nimport { triggerMethodOn } from './common/trigger-method';\nimport ChildViewContainer from './next-child-view-container';\nimport MarionetteError from './error';\nimport Region from './region';\nimport ViewMixin from './mixins/view';\nimport { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'behaviors',\n  'childView',\n  'childViewEventPrefix',\n  'childViewEvents',\n  'childViewOptions',\n  'childViewTriggers',\n  'collectionEvents',\n  'emptyView',\n  'emptyViewOptions',\n  'events',\n  'modelEvents',\n  'sortWithCollection',\n  'triggers',\n  'ui',\n  'viewComparator',\n  'viewFilter'\n];\n\n// A view that iterates over a Backbone.Collection\n// and renders an individual child view for each model.\nconst CollectionView = Backbone.View.extend({\n  // flag for maintaining the sorted order of the collection\n  sortWithCollection: true,\n\n  // constructor\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    monitorViewEvents(this);\n\n    this.once('render', this._initialEvents);\n\n    // This children container isn't really used by a render, but it provides\n    // the ability to check `this.children.length` prior to rendering\n    // It also allows for cases where only addChildView is used\n    this._initChildViewStorage();\n    this._initBehaviors();\n\n    const args = Array.prototype.slice.call(arguments);\n    args[0] = this.options;\n    Backbone.View.prototype.constructor.apply(this, args);\n\n    // Init empty region\n    this.getEmptyRegion();\n\n    this.delegateEntityEvents();\n\n    this._triggerEventOnBehaviors('initialize', this);\n  },\n\n  // Internal method to set up the `children` object for storing all of the child views\n  _initChildViewStorage() {\n    this.children = new ChildViewContainer();\n  },\n\n  // Create an region to show the emptyView\n  getEmptyRegion() {\n    if (this._emptyRegion && !this._emptyRegion.isDestroyed()) {\n      return this._emptyRegion;\n    }\n\n    this._emptyRegion = new Region({ el: this.el, replaceElement: false });\n\n    this._emptyRegion._parentView = this;\n\n    return this._emptyRegion;\n  },\n\n  // Configured the initial events that the collection view binds to.\n  _initialEvents() {\n    this.listenTo(this.collection, {\n      'sort': this._onCollectionSort,\n      'reset': this._onCollectionReset,\n      'update': this._onCollectionUpdate\n    });\n  },\n\n  // Internal method. This checks for any changes in the order of the collection.\n  // If the index of any view doesn't match, it will re-sort.\n  _onCollectionSort() {\n    if (!this.sortWithCollection || this.viewComparator === false) {\n      return;\n    }\n\n    // If the data is changing we will handle the sort later\n    if (this.collection.length !== this.children.length) {\n      return;\n    }\n\n    // Additional check if the data is changing\n    const hasAddedModel = this.collection.some(model => {\n      return !this.children.findByModel(model);\n    });\n\n    if (hasAddedModel) {\n      return;\n    }\n\n    // If the only thing happening here is sorting, sort.\n    this.sort();\n  },\n\n  _onCollectionReset() {\n    this.render();\n  },\n\n  // Handle collection update model additions and  removals\n  _onCollectionUpdate(collection, options) {\n    const changes = options.changes;\n\n    // Remove first since it'll be a shorter array lookup.\n    const removedViews = changes.removed.length && this._removeChildModels(changes.removed);\n\n    this._addedViews = changes.added.length && this._addChildModels(changes.added);\n\n    this._detachChildren(removedViews);\n\n    this._showChildren();\n\n    // Destroy removed child views after all of the render is complete\n    this._removeChildViews(removedViews);\n  },\n\n  _removeChildModels(models) {\n    return _.map(models, _.bind(this._removeChildModel, this));\n  },\n\n  _removeChildModel(model) {\n    const view = this.children.findByModel(model);\n\n    this._removeChild(view);\n\n    return view;\n  },\n\n  _removeChild(view) {\n    this.triggerMethod('before:remove:child', this, view);\n\n    this.children._remove(view);\n\n    this.triggerMethod('remove:child', this, view);\n  },\n\n  // Added views are returned for consistency with _removeChildModels\n  _addChildModels(models) {\n    return _.map(models, _.bind(this._addChildModel, this));\n  },\n\n  _addChildModel(model) {\n    const view = this._createChildView(model);\n\n    this._addChild(view);\n\n    return view;\n  },\n\n  _createChildView(model) {\n    const ChildView = this._getChildView(model);\n    const childViewOptions = this._getChildViewOptions(model);\n    const view = this.buildChildView(model, ChildView, childViewOptions);\n\n    return view;\n  },\n\n  _addChild(view, index) {\n    this.triggerMethod('before:add:child', this, view);\n\n    this._setupChildView(view);\n    this.children._add(view, index);\n\n    this.triggerMethod('add:child', this, view);\n  },\n\n  // Retrieve the `childView` class\n  // The `childView` property can be either a view class or a function that\n  // returns a view class. If it is a function, it will receive the model that\n  // will be passed to the view instance (created from the returned view class)\n  _getChildView(child) {\n    let childView = this.childView;\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'NoChildViewError',\n        message: 'A \"childView\" must be specified'\n      });\n    }\n\n    childView = this._getView(childView, child);\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'InvalidChildViewError',\n        message: '\"childView\" must be a view class or a function that returns a view class'\n      });\n    }\n\n    return childView;\n  },\n\n  // First check if the `view` is a view class (the common case)\n  // Then check if it's a function (which we assume that returns a view class)\n  _getView(view, child) {\n    if (view.prototype instanceof Backbone.View || view === Backbone.View) {\n      return view;\n    } else if (_.isFunction(view)) {\n      return view.call(this, child);\n    }\n  },\n\n  _getChildViewOptions(child) {\n    if (_.isFunction(this.childViewOptions)) {\n      return this.childViewOptions(child);\n    }\n\n    return this.childViewOptions;\n  },\n\n  // Build a `childView` for a model in the collection.\n  // Override to customize the build\n  buildChildView(child, ChildViewClass, childViewOptions) {\n    const options = _.extend({model: child}, childViewOptions);\n    return new ChildViewClass(options);\n  },\n\n  _setupChildView(view) {\n    monitorViewEvents(view);\n\n    // We need to listen for if a view is destroyed in a way other\n    // than through the CollectionView.\n    // If this happens we need to remove the reference to the view\n    // since once a view has been destroyed we can not reuse it.\n    view.on('destroy', this.removeChildView, this);\n\n    // set up the child view event forwarding\n    this._proxyChildViewEvents(view);\n  },\n\n  // used by ViewMixin's `_childViewEventHandler`\n  _getImmediateChildren() {\n    return this.children._views;\n  },\n\n  // Overriding Backbone.View's `setElement` to handle\n  // if an el was previously defined. If so, the view might be\n  // attached on setElement.\n  setElement() {\n    const hasEl = !!this.el;\n\n    Backbone.View.prototype.setElement.apply(this, arguments);\n\n    if (hasEl) {\n      this._isAttached = isNodeAttached(this.el);\n    }\n\n    return this;\n  },\n\n  // Render children views.\n  render() {\n    if (this._isDestroyed) { return this; }\n    this.triggerMethod('before:render', this);\n\n    this._destroyChildren();\n\n    // After all children have been destroyed re-init the container\n    this.children._init();\n\n    if (this.collection) {\n      this._addChildModels(this.collection.models);\n    }\n\n    this._showChildren();\n\n    this._isRendered = true;\n\n    this.triggerMethod('render', this);\n    return this;\n  },\n\n  // Sorts the children then filters and renders the results.\n  sort() {\n    if (this._isDestroyed) { return this; }\n\n    if (!this.children.length) { return this; }\n\n    this._showChildren();\n\n    return this;\n  },\n\n  _showChildren() {\n    if (this.isEmpty()) {\n      this._showEmptyView();\n      return;\n    }\n\n    this._sortChildren();\n\n    this.filter();\n  },\n\n  // Returns true if the collectionView is considered empty.\n  // This is called twice during a render. Once to check the data,\n  // and again when views are filtered. Override this function to\n  // customize what empty means.\n  isEmpty(allViewsFiltered) {\n    return allViewsFiltered || !this.children.length;\n  },\n\n  _showEmptyView() {\n    const EmptyView = this._getEmptyView();\n\n    if (!EmptyView) {\n      return;\n    }\n\n    const options = this._getEmptyViewOptions();\n\n    const emptyRegion = this.getEmptyRegion();\n\n    emptyRegion.show(new EmptyView(options));\n  },\n\n  // Retrieve the empty view class\n  _getEmptyView() {\n    const emptyView = this.emptyView;\n\n    if (!emptyView) { return; }\n\n    return this._getView(emptyView);\n  },\n\n  // Remove the emptyView\n  _destroyEmptyView() {\n    const emptyRegion = this.getEmptyRegion();\n    // Only empty if a view is show so the region\n    // doesn't detach any other unrelated HTML\n    if (emptyRegion.hasView()) {\n      emptyRegion.empty();\n    }\n  },\n\n  //\n  _getEmptyViewOptions() {\n    const emptyViewOptions = this.emptyViewOptions || this.childViewOptions;\n\n    if (_.isFunction(emptyViewOptions)) {\n      return emptyViewOptions.call(this);\n    }\n\n    return emptyViewOptions;\n  },\n\n  // Sorts views by viewComparator and sets the children to the new order\n  _sortChildren() {\n    if (this.viewComparator === false) { return; }\n\n    this.triggerMethod('before:sort', this);\n\n    let viewComparator = this.getComparator();\n\n    if (_.isFunction(viewComparator)) {\n      // Must use native bind to preserve length\n      viewComparator = viewComparator.bind(this);\n    }\n\n    this.children._sort(viewComparator);\n\n    this.triggerMethod('sort', this);\n  },\n\n  // Sets the view's `viewComparator` and applies the sort if the view is ready.\n  // To prevent the render pass `{ preventRender: true }` as the 2nd argument.\n  setComparator(comparator, {preventRender} = {}) {\n    const comparatorChanged = this.viewComparator !== comparator;\n    const shouldSort = comparatorChanged && !preventRender;\n\n    this.viewComparator = comparator;\n\n    if (shouldSort) {\n      this.sort();\n    }\n\n    return this;\n  },\n\n  // Clears the `viewComparator` and follows the same rules for rendering as `setComparator`.\n  removeComparator(options) {\n    return this.setComparator(null, options);\n  },\n\n  // If viewComparator is overriden it will be returned here.\n  // Additionally override this function to provide custom\n  // viewComparator logic\n  getComparator() {\n    return this.viewComparator || this._viewComparator;\n  },\n\n  // Default internal view comparator that order the views by\n  // the order of the collection\n  _viewComparator(view) {\n    if (!this.collection) { return; }\n    return this.collection.indexOf(view.model);\n  },\n\n  // This method re-filters the children views and re-renders the results\n  filter() {\n    if (this._isDestroyed) { return this; }\n\n    if (!this.children.length) { return this; }\n\n    const filteredViews = this._filterChildren();\n\n    this._renderChildren(filteredViews);\n\n    return this;\n  },\n\n  _isAddedAtEnd(addedView, index, addedViews) {\n    const viewIndex = this.children._views.length - addedViews.length + index;\n    return addedView === this.children._views[viewIndex];\n  },\n\n  _filterChildren() {\n    const viewFilter = this._getFilter();\n    const addedViews = this._addedViews;\n\n    delete this._addedViews;\n\n    if (!viewFilter) {\n      if (addedViews && _.every(addedViews, _.bind(this._isAddedAtEnd, this))) {\n        return addedViews;\n      }\n\n      return this.children._views;\n    }\n\n    this.triggerMethod('before:filter', this);\n\n    const filteredViews = _.partition(this.children._views, _.bind(viewFilter, this));\n\n    this._detachChildren(filteredViews[1]);\n\n    this.triggerMethod('filter', this);\n\n    return filteredViews[0];\n  },\n\n  // This method returns a function for the viewFilter\n  _getFilter() {\n    const viewFilter = this.getFilter();\n\n    if (!viewFilter) { return false; }\n\n    if (_.isFunction(viewFilter)) {\n      return viewFilter;\n    }\n\n    // Support filter predicates `{ fooFlag: true }`\n    if (_.isObject(viewFilter)) {\n      const matcher = _.matches(viewFilter);\n      return function(view) {\n        return matcher(view.model && view.model.attributes);\n      };\n    }\n\n    // Filter by model attribute\n    if (_.isString(viewFilter)) {\n      return function(view) {\n        return view.model && view.model.get(viewFilter);\n      };\n    }\n\n    throw new MarionetteError({\n      name: 'InvalidViewFilterError',\n      message: '\"viewFilter\" must be a function, predicate object literal, a string indicating a model attribute, or falsy'\n    });\n  },\n\n  // Override this function to provide custom\n  // viewFilter logic\n  getFilter() {\n    return this.viewFilter;\n  },\n\n  // Sets the view's `viewFilter` and applies the filter if the view is ready.\n  // To prevent the render pass `{ preventRender: true }` as the 2nd argument.\n  setFilter(filter, {preventRender} = {}) {\n    const filterChanged = this.viewFilter !== filter;\n    const shouldRender = filterChanged && !preventRender;\n\n    this.viewFilter = filter;\n\n    if (shouldRender) {\n      this.filter();\n    }\n\n    return this;\n  },\n\n  // Clears the `viewFilter` and follows the same rules for rendering as `setFilter`.\n  removeFilter(options) {\n    return this.setFilter(null, options);\n  },\n\n  _detachChildren(detachingViews) {\n    _.each(detachingViews, _.bind(this._detachChildView, this));\n  },\n\n  _detachChildView(view) {\n    const shouldTriggerDetach = view._isAttached && this.monitorViewEvents !== false;\n    if (shouldTriggerDetach) {\n      triggerMethodOn(view, 'before:detach', view);\n    }\n\n    this.detachHtml(view);\n\n    if (shouldTriggerDetach) {\n      view._isAttached = false;\n      triggerMethodOn(view, 'detach', view);\n    }\n  },\n\n  // Override this method to change how the collectionView detaches a child view\n  detachHtml(view) {\n    this.Dom.detachEl(view.el, view.$el);\n  },\n\n  _renderChildren(views) {\n    if (this.isEmpty(!views.length)) {\n      this._showEmptyView();\n      return;\n    }\n\n    this._destroyEmptyView();\n\n    this.triggerMethod('before:render:children', this, views);\n\n    const els = this._getBuffer(views);\n\n    this._attachChildren(els, views);\n\n    this.triggerMethod('render:children', this, views);\n  },\n\n  _attachChildren(els, views) {\n    const shouldTriggerAttach = this._isAttached && this.monitorViewEvents !== false;\n\n    views = shouldTriggerAttach ? views : [];\n\n    _.each(views, view => {\n      if (view._isAttached) { return; }\n      triggerMethodOn(view, 'before:attach', view);\n    });\n\n    this.attachHtml(els);\n\n    _.each(views, view => {\n      if (view._isAttached) { return; }\n      view._isAttached = true;\n      triggerMethodOn(view, 'attach', view);\n    });\n  },\n\n  // Renders each view in children and creates a fragment buffer from them\n  _getBuffer(views) {\n    const elBuffer = this.Dom.createBuffer();\n\n    _.each(views, view => {\n      renderView(view);\n      this.Dom.appendContents(elBuffer, view.el, {_$contents: view.$el});\n    });\n\n    return elBuffer;\n  },\n\n  // Override this method to do something other than `.append`.\n  // You can attach any HTML at this point including the els.\n  attachHtml(els) {\n    this.Dom.appendContents(this.el, els, {_$el: this.$el});\n  },\n\n  swapChildViews(view1, view2) {\n    if (!this.children.hasView(view1) || !this.children.hasView(view2)) {\n      throw new MarionetteError({\n        name: 'ChildSwapError',\n        message: 'Both views must be children of the collection view'\n      });\n    }\n\n    this.children._swap(view1, view2);\n    this.Dom.swapEl(view1.el, view2.el);\n\n    // If the views are not filtered the same, refilter\n    if (this.Dom.hasEl(this.el, view1.el) !== this.Dom.hasEl(this.el, view2.el)) {\n      this.filter();\n    }\n\n    return this;\n  },\n\n  // Render the child's view and add it to the HTML for the collection view at a given index, based on the current sort\n  addChildView(view, index) {\n    if (!view || view._isDestroyed) {\n      return view;\n    }\n\n    this._addChild(view, index);\n    this._addedViews = [view];\n    this._showChildren();\n\n    return view;\n  },\n\n  // Detach a view from the children.  Best used when adding a\n  // childView from `addChildView`\n  detachChildView(view) {\n    this.removeChildView(view, { shouldDetach: true });\n\n    return view;\n  },\n\n  // Remove the child view and destroy it.  Best used when adding a\n  // childView from `addChildView`\n  // The options argument is for internal use only\n  removeChildView(view, options) {\n    if (!view) {\n      return view;\n    }\n\n    this._removeChildView(view, options);\n\n    this._removeChild(view);\n\n    if (this.isEmpty()) {\n      this._showEmptyView();\n    }\n\n    return view;\n  },\n\n  _removeChildViews(views) {\n    _.each(views, _.bind(this._removeChildView, this));\n  },\n\n  _removeChildView(view, {shouldDetach} = {}) {\n    view.off('destroy', this.removeChildView, this);\n\n    if (shouldDetach) {\n      this._detachChildView(view);\n    } else {\n      this._destroyChildView(view);\n    }\n\n    this.stopListening(view);\n  },\n\n  _destroyChildView(view) {\n    if (view._isDestroyed) {\n      return;\n    }\n\n    view._shouldDisableEvents = this.monitorViewEvents === false;\n    destroyView(view);\n  },\n\n  // called by ViewMixin destroy\n  _removeChildren() {\n    this._destroyChildren();\n    const emptyRegion = this.getEmptyRegion();\n    emptyRegion.destroy();\n    delete this._addedViews;\n  },\n\n  // Destroy the child views that this collection view is holding on to, if any\n  _destroyChildren() {\n    if (!this.children || !this.children.length) {\n      return;\n    }\n\n    this.triggerMethod('before:destroy:children', this);\n    if (this.monitorViewEvents === false) {\n      this.Dom.detachContents(this.el, this.$el);\n    }\n    _.each(this.children._views, _.bind(this._removeChildView, this));\n    this.triggerMethod('destroy:children', this);\n  }\n}, {\n  setDomApi\n});\n\n_.extend(CollectionView.prototype, ViewMixin);\n\nexport default CollectionView;\n","// Composite View\n// --------------\n\nimport _ from 'underscore';\nimport deprecate from './utils/deprecate';\nimport MarionetteError from './error';\nimport CollectionView from './collection-view';\nimport View from './view';\n\nconst ClassOptions = [\n  'childViewContainer',\n  'template',\n  'templateContext'\n];\n\n// Used for rendering a branch-leaf, hierarchical structure.\n// Extends directly from CollectionView\n// @deprecated\nconst CompositeView = CollectionView.extend({\n\n  // Setting up the inheritance chain which allows changes to\n  // Marionette.CollectionView.prototype.constructor which allows overriding\n  // option to pass '{sort: false}' to prevent the CompositeView from\n  // maintaining the sorted order of the collection.\n  // This will fallback onto appending childView's to the end.\n  constructor(options) {\n    deprecate('CompositeView is deprecated. Convert to View at your earliest convenience');\n\n    this.mergeOptions(options, ClassOptions);\n\n    CollectionView.prototype.constructor.apply(this, arguments);\n  },\n\n  // Configured the initial events that the composite view\n  // binds to. Override this method to prevent the initial\n  // events, or to add your own initial events.\n  _initialEvents() {\n\n    // Bind only after composite view is rendered to avoid adding child views\n    // to nonexistent childViewContainer\n\n    if (this.collection) {\n      this.listenTo(this.collection, 'add', this._onCollectionAdd);\n      this.listenTo(this.collection, 'update', this._onCollectionUpdate);\n      this.listenTo(this.collection, 'reset', this.renderChildren);\n\n      if (this.sort) {\n        this.listenTo(this.collection, 'sort', this._sortViews);\n      }\n    }\n  },\n\n  // Retrieve the `childView` to be used when rendering each of\n  // the items in the collection. The default is to return\n  // `this.childView` or Marionette.CompositeView if no `childView`\n  // has been defined. As happens in CollectionView, `childView` can\n  // be a function (which should return a view class).\n  _getChildView(child) {\n    let childView = this.childView;\n\n    // for CompositeView, if `childView` is not specified, we'll get the same\n    // composite view class rendered for each child in the collection\n    // then check if the `childView` is a view class (the common case)\n    // finally check if it's a function (which we assume that returns a view class)\n    if (!childView) {\n      return this.constructor;\n    }\n\n    childView = this._getView(childView, child);\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'InvalidChildViewError',\n        message: '\"childView\" must be a view class or a function that returns a view class'\n      });\n    }\n\n    return childView;\n  },\n\n  // Return the serialized model\n  serializeData() {\n    return this.serializeModel();\n  },\n\n  // Renders the model and the collection.\n  render() {\n    if (this._isDestroyed) { return this; }\n    this._isRendering = true;\n    this.resetChildViewContainer();\n\n    this.triggerMethod('before:render', this);\n\n    this._renderTemplate();\n    this.bindUIElements();\n    this.renderChildren();\n\n    this._isRendering = false;\n    this._isRendered = true;\n    this.triggerMethod('render', this);\n    return this;\n  },\n\n  renderChildren() {\n    if (this._isRendered || this._isRendering) {\n      CollectionView.prototype._renderChildren.call(this);\n    }\n  },\n\n  // You might need to override this if you've overridden attachHtml\n  attachBuffer(compositeView, buffer) {\n    const $container = this.getChildViewContainer(compositeView);\n    this.Dom.appendContents($container[0], buffer, {_$el: $container});\n  },\n\n  // Internal method. Append a view to the end of the $el.\n  // Overidden from CollectionView to ensure view is appended to\n  // childViewContainer\n  _insertAfter(childView) {\n    const $container = this.getChildViewContainer(this, childView);\n    this.Dom.appendContents($container[0], childView.el, {_$el: $container, _$contents: childView.$el});\n  },\n\n  // Internal method. Append reordered childView'.\n  // Overidden from CollectionView to ensure reordered views\n  // are appended to childViewContainer\n  _appendReorderedChildren(children) {\n    const $container = this.getChildViewContainer(this);\n    this.Dom.appendContents($container[0], children, {_$el: $container});\n  },\n\n  // Internal method to ensure an `$childViewContainer` exists, for the\n  // `attachHtml` method to use.\n  getChildViewContainer(containerView, childView) {\n    if (!!containerView.$childViewContainer) {\n      return containerView.$childViewContainer;\n    }\n\n    let container;\n    const childViewContainer = containerView.childViewContainer;\n    if (childViewContainer) {\n\n      const selector = _.result(containerView, 'childViewContainer');\n\n      if (selector.charAt(0) === '@' && containerView.ui) {\n        container = containerView.ui[selector.substr(4)];\n      } else {\n        container = this.$(selector);\n      }\n\n      if (container.length <= 0) {\n        throw new MarionetteError({\n          name: 'ChildViewContainerMissingError',\n          message: `The specified \"childViewContainer\" was not found: ${containerView.childViewContainer}`\n        });\n      }\n\n    } else {\n      container = containerView.$el;\n    }\n\n    containerView.$childViewContainer = container;\n    return container;\n  },\n\n  // Internal method to reset the `$childViewContainer` on render\n  resetChildViewContainer() {\n    if (this.$childViewContainer) {\n      this.$childViewContainer = undefined;\n    }\n  }\n});\n\n// To prevent duplication but allow the best View organization\n// Certain View methods are mixed directly into the deprecated CompositeView\nconst MixinFromView = _.pick(View.prototype, 'serializeModel', 'getTemplate', '_renderTemplate', '_renderHtml', 'mixinTemplateContext', 'attachElContent');\n_.extend(CompositeView.prototype, MixinFromView);\n\nexport default CompositeView;\n","// Behavior\n// --------\n\n// A Behavior is an isolated set of DOM /\n// user interactions that can be mixed into any View.\n// Behaviors allow you to blackbox View specific interactions\n// into portable logical chunks, keeping your views simple and your code DRY.\n\nimport _ from 'underscore';\nimport deprecate from './utils/deprecate';\nimport getUniqueEventName from './utils/get-unique-event-name';\nimport MarionetteObject from './object';\nimport DelegateEntityEventsMixin from './mixins/delegate-entity-events';\nimport TriggersMixin from './mixins/triggers';\nimport UIMixin from './mixins/ui';\n\nconst ClassOptions = [\n  'collectionEvents',\n  'events',\n  'modelEvents',\n  'triggers',\n  'ui'\n];\n\nconst Behavior = MarionetteObject.extend({\n  cidPrefix: 'mnb',\n\n  constructor(options, view) {\n    // Setup reference to the view.\n    // this comes in handle when a behavior\n    // wants to directly talk up the chain\n    // to the view.\n    this.view = view;\n\n    if (this.defaults) {\n      deprecate('Behavior defaults are deprecated. For similar functionality set options on the Behavior class.');\n    }\n\n    this.defaults = _.clone(_.result(this, 'defaults', {}));\n\n    this._setOptions(_.extend({}, this.defaults, options));\n    this.mergeOptions(this.options, ClassOptions);\n\n    // Construct an internal UI hash using\n    // the behaviors UI hash and then the view UI hash.\n    // This allows the user to use UI hash elements\n    // defined in the parent view as well as those\n    // defined in the given behavior.\n    // This order will help the reuse and share of a behavior\n    // between multiple views, while letting a view override a\n    // selector under an UI key.\n    this.ui = _.extend({}, _.result(this, 'ui'), _.result(view, 'ui'));\n\n    MarionetteObject.apply(this, arguments);\n  },\n\n  // proxy behavior $ method to the view\n  // this is useful for doing jquery DOM lookups\n  // scoped to behaviors view.\n  $() {\n    return this.view.$.apply(this.view, arguments);\n  },\n\n  // Stops the behavior from listening to events.\n  // Overrides Object#destroy to prevent additional events from being triggered.\n  destroy() {\n    this.stopListening();\n\n    this.view._removeBehavior(this);\n\n    return this;\n  },\n\n  proxyViewProperties() {\n    this.$el = this.view.$el;\n    this.el = this.view.el;\n\n    return this;\n  },\n\n  bindUIElements() {\n    this._bindUIElements();\n\n    return this;\n  },\n\n  unbindUIElements() {\n    this._unbindUIElements();\n\n    return this;\n  },\n\n  getUI(name) {\n    return this._getUI(name);\n  },\n\n  // Handle `modelEvents`, and `collectionEvents` configuration\n  delegateEntityEvents() {\n    this._delegateEntityEvents(this.view.model, this.view.collection);\n\n    return this;\n  },\n\n  undelegateEntityEvents() {\n    this._undelegateEntityEvents(this.view.model, this.view.collection);\n\n    return this;\n  },\n\n  getEvents() {\n    // Normalize behavior events hash to allow\n    // a user to use the @ui. syntax.\n    const behaviorEvents = this.normalizeUIKeys(_.result(this, 'events'));\n\n    // binds the handler to the behavior and builds a unique eventName\n    return _.reduce(behaviorEvents, (events, behaviorHandler, key) => {\n      if (!_.isFunction(behaviorHandler)) {\n        behaviorHandler = this[behaviorHandler];\n      }\n      if (!behaviorHandler) { return; }\n      key = getUniqueEventName(key);\n      events[key] = _.bind(behaviorHandler, this);\n      return events;\n    }, {});\n  },\n\n  // Internal method to build all trigger handlers for a given behavior\n  getTriggers() {\n    if (!this.triggers) { return; }\n\n    // Normalize behavior triggers hash to allow\n    // a user to use the @ui. syntax.\n    const behaviorTriggers = this.normalizeUIKeys(_.result(this, 'triggers'));\n\n    return this._getViewTriggers(this.view, behaviorTriggers);\n  }\n\n});\n\n_.extend(Behavior.prototype, DelegateEntityEventsMixin, TriggersMixin, UIMixin);\n\nexport default Behavior;\n","// Application\n// -----------\nimport buildRegion from './common/build-region';\nimport MarionetteObject from './object';\nimport Region from './region';\n\nconst ClassOptions = [\n  'region',\n  'regionClass'\n];\n\n// A container for a Marionette application.\nconst Application = MarionetteObject.extend({\n  cidPrefix: 'mna',\n\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    this._initRegion();\n\n    MarionetteObject.prototype.constructor.apply(this, arguments);\n  },\n\n  regionClass: Region,\n\n  _initRegion() {\n    const region = this.region;\n\n    if (!region) { return; }\n\n    const defaults = {\n      regionClass: this.regionClass\n    };\n\n    this._region = buildRegion(region, defaults);\n  },\n\n  getRegion() {\n    return this._region;\n  },\n\n  showView(view, ...args) {\n    const region = this.getRegion();\n    return region.show(view, ...args);\n  },\n\n  getView() {\n    return this.getRegion().currentView;\n  },\n\n  // kick off all of the application's processes.\n  start(options) {\n    this.triggerMethod('before:start', this, options);\n    this.triggerMethod('start', this, options);\n    return this;\n  }\n\n});\n\nexport default Application;\n","// App Router\n// ----------\n\n// Reduce the boilerplate code of handling route events\n// and then calling a single method on another object,\n// called a controller.\n// Have your routers configured to call the method on\n// your controller, directly.\n//\n// Configure an AppRouter with `appRoutes`.\n//\n// App routers can only take one `controller` object.\n// It is recommended that you divide your controller\n// objects in to smaller pieces of related functionality\n// and have multiple routers / controllers, instead of\n// just one giant router and controller.\n//\n// You can also add standard routes to an AppRouter.\n\nimport Backbone from 'backbone';\nimport _ from 'underscore';\nimport { triggerMethod } from './common/trigger-method';\nimport MarionetteError from './error';\nimport CommonMixin from './mixins/common';\n\nconst ClassOptions = [\n  'appRoutes',\n  'controller'\n];\n\nconst AppRouter = Backbone.Router.extend({\n\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    Backbone.Router.apply(this, arguments);\n\n    const appRoutes = this.appRoutes;\n    const controller = this._getController();\n    this.processAppRoutes(controller, appRoutes);\n    this.on('route', this._processOnRoute, this);\n  },\n\n  // Similar to route method on a Backbone Router but\n  // method is called on the controller\n  appRoute(route, methodName) {\n    const controller = this._getController();\n    this._addAppRoute(controller, route, methodName);\n    return this;\n  },\n\n  // process the route event and trigger the onRoute\n  // method call, if it exists\n  _processOnRoute(routeName, routeArgs) {\n    // make sure an onRoute before trying to call it\n    if (_.isFunction(this.onRoute)) {\n      // find the path that matches the current route\n      const routePath = _.invert(this.appRoutes)[routeName];\n      this.onRoute(routeName, routePath, routeArgs);\n    }\n  },\n\n  // Internal method to process the `appRoutes` for the\n  // router, and turn them in to routes that trigger the\n  // specified method on the specified `controller`.\n  processAppRoutes(controller, appRoutes) {\n    if (!appRoutes) { return this; }\n\n    const routeNames = _.keys(appRoutes).reverse(); // Backbone requires reverted order of routes\n\n    _.each(routeNames, route => {\n      this._addAppRoute(controller, route, appRoutes[route]);\n    });\n\n    return this;\n  },\n\n  _getController() {\n    return this.controller;\n  },\n\n  _addAppRoute(controller, route, methodName) {\n    const method = controller[methodName];\n\n    if (!method) {\n      throw new MarionetteError(`Method \"${methodName}\" was not found on the controller`);\n    }\n\n    this.route(route, methodName, _.bind(method, controller));\n  },\n\n  triggerMethod: triggerMethod\n});\n\n_.extend(AppRouter.prototype, CommonMixin);\n\nexport default AppRouter;\n","import Backbone from 'backbone';\nimport {version} from '../package.json';\n\nimport proxy from './utils/proxy';\nimport extend from './utils/extend';\nimport deprecate from './utils/deprecate';\n\nimport isNodeAttached from './common/is-node-attached';\nimport mergeOptions from './common/merge-options';\nimport getOption from './common/get-option';\nimport normalizeMethods from './common/normalize-methods';\nimport monitorViewEvents from './common/monitor-view-events';\n\nimport {\n  bindEvents,\n  unbindEvents\n} from './common/bind-events';\n\nimport {\n  bindRequests,\n  unbindRequests\n} from './common/bind-requests';\n\nimport {\n  triggerMethod,\n  triggerMethodOn\n} from './common/trigger-method';\n\n\nimport MarionetteObject from './object';\nimport TemplateCache from './template-cache';\nimport View from './view';\nimport CollectionView from './collection-view';\nimport NextCollectionView from './next-collection-view';\nimport CompositeView from './composite-view';\nimport Behavior from './behavior';\nimport Region from './region';\nimport Application from './application';\nimport AppRouter from './app-router';\nimport MarionetteError from './error';\n\nimport behaviorsLookup from './config/behaviors-lookup';\nimport DomApi from './config/dom';\nimport Renderer from './config/renderer';\n\nimport {\n  FEATURES,\n  isEnabled,\n  setEnabled\n} from './config/features';\n\nconst previousMarionette = Backbone.Marionette;\nconst Marionette = Backbone.Marionette = {};\n\n// This allows you to run multiple instances of Marionette on the same\n// webapp. After loading the new version, call `noConflict()` to\n// get a reference to it. At the same time the old version will be\n// returned to Backbone.Marionette.\nMarionette.noConflict = function() {\n  Backbone.Marionette = previousMarionette;\n  return this;\n};\n\n// Utilities\nMarionette.bindEvents = proxy(bindEvents);\nMarionette.unbindEvents = proxy(unbindEvents);\nMarionette.bindRequests = proxy(bindRequests);\nMarionette.unbindRequests = proxy(unbindRequests);\nMarionette.mergeOptions = proxy(mergeOptions);\nMarionette.getOption = proxy(getOption);\nMarionette.normalizeMethods = proxy(normalizeMethods);\nMarionette.extend = extend;\nMarionette.isNodeAttached = isNodeAttached;\nMarionette.deprecate = deprecate;\nMarionette.triggerMethod = proxy(triggerMethod);\nMarionette.triggerMethodOn = triggerMethodOn;\nMarionette.isEnabled = isEnabled;\nMarionette.setEnabled = setEnabled;\nMarionette.monitorViewEvents = monitorViewEvents;\n\nMarionette.Behaviors = {};\nMarionette.Behaviors.behaviorsLookup = behaviorsLookup;\n\n// Classes\nMarionette.Application = Application;\nMarionette.AppRouter = AppRouter;\nMarionette.Renderer = Renderer;\nMarionette.TemplateCache = TemplateCache;\nMarionette.View = View;\nMarionette.CollectionView = CollectionView;\nMarionette.NextCollectionView = NextCollectionView;\nMarionette.CompositeView = CompositeView;\nMarionette.Behavior = Behavior;\nMarionette.Region = Region;\nMarionette.Error = MarionetteError;\nMarionette.Object = MarionetteObject;\n\n// Configuration\nMarionette.DEV_MODE = false;\nMarionette.FEATURES = FEATURES;\nMarionette.VERSION = version;\nMarionette.DomApi = DomApi;\nMarionette.setDomApi = function(mixin) {\n  CollectionView.setDomApi(mixin);\n  CompositeView.setDomApi(mixin);\n  NextCollectionView.setDomApi(mixin);\n  Region.setDomApi(mixin);\n  View.setDomApi(mixin);\n};\n\nexport default Marionette;\n","import MarionetteError from '../error';\n\n// Placeholder method to be extended by the user.\n// The method should define the object that stores the behaviors.\n// i.e.\n//\n// ```js\n// Marionette.Behaviors.behaviorsLookup: function() {\n//   return App.Behaviors\n// }\n// ```\nexport default function behaviorsLookup() {\n  throw new MarionetteError({\n    message: 'You must define where your behaviors are stored.',\n    url: 'marionette.behaviors.md#behaviorslookup'\n  });\n}\n"]}
\ No newline at end of file
diff --git a/js/3rdparty/backbone.radio.js b/js/3rdparty/backbone.radio.js
new file mode 100644
index 000000000..b95fc47a7
--- /dev/null
+++ b/js/3rdparty/backbone.radio.js
@@ -0,0 +1,350 @@
+// Backbone.Radio v2.0.0
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('underscore'), require('backbone')) :
+  typeof define === 'function' && define.amd ? define(['underscore', 'backbone'], factory) :
+  (global.Backbone = global.Backbone || {}, global.Backbone.Radio = factory(global._,global.Backbone));
+}(this, function (_,Backbone) { 'use strict';
+
+  _ = 'default' in _ ? _['default'] : _;
+  Backbone = 'default' in Backbone ? Backbone['default'] : Backbone;
+
+  var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj;
+  };
+
+  var previousRadio = Backbone.Radio;
+
+  var Radio = Backbone.Radio = {};
+
+  Radio.VERSION = '2.0.0';
+
+  // This allows you to run multiple instances of Radio on the same
+  // webapp. After loading the new version, call `noConflict()` to
+  // get a reference to it. At the same time the old version will be
+  // returned to Backbone.Radio.
+  Radio.noConflict = function () {
+    Backbone.Radio = previousRadio;
+    return this;
+  };
+
+  // Whether or not we're in DEBUG mode or not. DEBUG mode helps you
+  // get around the issues of lack of warnings when events are mis-typed.
+  Radio.DEBUG = false;
+
+  // Format debug text.
+  Radio._debugText = function (warning, eventName, channelName) {
+    return warning + (channelName ? ' on the ' + channelName + ' channel' : '') + ': "' + eventName + '"';
+  };
+
+  // This is the method that's called when an unregistered event was called.
+  // By default, it logs warning to the console. By overriding this you could
+  // make it throw an Error, for instance. This would make firing a nonexistent event
+  // have the same consequence as firing a nonexistent method on an Object.
+  Radio.debugLog = function (warning, eventName, channelName) {
+    if (Radio.DEBUG && console && console.warn) {
+      console.warn(Radio._debugText(warning, eventName, channelName));
+    }
+  };
+
+  var eventSplitter = /\s+/;
+
+  // An internal method used to handle Radio's method overloading for Requests.
+  // It's borrowed from Backbone.Events. It differs from Backbone's overload
+  // API (which is used in Backbone.Events) in that it doesn't support space-separated
+  // event names.
+  Radio._eventsApi = function (obj, action, name, rest) {
+    if (!name) {
+      return false;
+    }
+
+    var results = {};
+
+    // Handle event maps.
+    if ((typeof name === 'undefined' ? 'undefined' : _typeof(name)) === 'object') {
+      for (var key in name) {
+        var result = obj[action].apply(obj, [key, name[key]].concat(rest));
+        eventSplitter.test(key) ? _.extend(results, result) : results[key] = result;
+      }
+      return results;
+    }
+
+    // Handle space separated event names.
+    if (eventSplitter.test(name)) {
+      var names = name.split(eventSplitter);
+      for (var i = 0, l = names.length; i < l; i++) {
+        results[names[i]] = obj[action].apply(obj, [names[i]].concat(rest));
+      }
+      return results;
+    }
+
+    return false;
+  };
+
+  // An optimized way to execute callbacks.
+  Radio._callHandler = function (callback, context, args) {
+    var a1 = args[0],
+        a2 = args[1],
+        a3 = args[2];
+    switch (args.length) {
+      case 0:
+        return callback.call(context);
+      case 1:
+        return callback.call(context, a1);
+      case 2:
+        return callback.call(context, a1, a2);
+      case 3:
+        return callback.call(context, a1, a2, a3);
+      default:
+        return callback.apply(context, args);
+    }
+  };
+
+  // A helper used by `off` methods to the handler from the store
+  function removeHandler(store, name, callback, context) {
+    var event = store[name];
+    if ((!callback || callback === event.callback || callback === event.callback._callback) && (!context || context === event.context)) {
+      delete store[name];
+      return true;
+    }
+  }
+
+  function removeHandlers(store, name, callback, context) {
+    store || (store = {});
+    var names = name ? [name] : _.keys(store);
+    var matched = false;
+
+    for (var i = 0, length = names.length; i < length; i++) {
+      name = names[i];
+
+      // If there's no event by this name, log it and continue
+      // with the loop
+      if (!store[name]) {
+        continue;
+      }
+
+      if (removeHandler(store, name, callback, context)) {
+        matched = true;
+      }
+    }
+
+    return matched;
+  }
+
+  /*
+   * tune-in
+   * -------
+   * Get console logs of a channel's activity
+   *
+   */
+
+  var _logs = {};
+
+  // This is to produce an identical function in both tuneIn and tuneOut,
+  // so that Backbone.Events unregisters it.
+  function _partial(channelName) {
+    return _logs[channelName] || (_logs[channelName] = _.bind(Radio.log, Radio, channelName));
+  }
+
+  _.extend(Radio, {
+
+    // Log information about the channel and event
+    log: function log(channelName, eventName) {
+      if (typeof console === 'undefined') {
+        return;
+      }
+      var args = _.toArray(arguments).slice(2);
+      console.log('[' + channelName + '] "' + eventName + '"', args);
+    },
+
+    // Logs all events on this channel to the console. It sets an
+    // internal value on the channel telling it we're listening,
+    // then sets a listener on the Backbone.Events
+    tuneIn: function tuneIn(channelName) {
+      var channel = Radio.channel(channelName);
+      channel._tunedIn = true;
+      channel.on('all', _partial(channelName));
+      return this;
+    },
+
+    // Stop logging all of the activities on this channel to the console
+    tuneOut: function tuneOut(channelName) {
+      var channel = Radio.channel(channelName);
+      channel._tunedIn = false;
+      channel.off('all', _partial(channelName));
+      delete _logs[channelName];
+      return this;
+    }
+  });
+
+  /*
+   * Backbone.Radio.Requests
+   * -----------------------
+   * A messaging system for requesting data.
+   *
+   */
+
+  function makeCallback(callback) {
+    return _.isFunction(callback) ? callback : function () {
+      return callback;
+    };
+  }
+
+  Radio.Requests = {
+
+    // Make a request
+    request: function request(name) {
+      var args = _.toArray(arguments).slice(1);
+      var results = Radio._eventsApi(this, 'request', name, args);
+      if (results) {
+        return results;
+      }
+      var channelName = this.channelName;
+      var requests = this._requests;
+
+      // Check if we should log the request, and if so, do it
+      if (channelName && this._tunedIn) {
+        Radio.log.apply(this, [channelName, name].concat(args));
+      }
+
+      // If the request isn't handled, log it in DEBUG mode and exit
+      if (requests && (requests[name] || requests['default'])) {
+        var handler = requests[name] || requests['default'];
+        args = requests[name] ? args : arguments;
+        return Radio._callHandler(handler.callback, handler.context, args);
+      } else {
+        Radio.debugLog('An unhandled request was fired', name, channelName);
+      }
+    },
+
+    // Set up a handler for a request
+    reply: function reply(name, callback, context) {
+      if (Radio._eventsApi(this, 'reply', name, [callback, context])) {
+        return this;
+      }
+
+      this._requests || (this._requests = {});
+
+      if (this._requests[name]) {
+        Radio.debugLog('A request was overwritten', name, this.channelName);
+      }
+
+      this._requests[name] = {
+        callback: makeCallback(callback),
+        context: context || this
+      };
+
+      return this;
+    },
+
+    // Set up a handler that can only be requested once
+    replyOnce: function replyOnce(name, callback, context) {
+      if (Radio._eventsApi(this, 'replyOnce', name, [callback, context])) {
+        return this;
+      }
+
+      var self = this;
+
+      var once = _.once(function () {
+        self.stopReplying(name);
+        return makeCallback(callback).apply(this, arguments);
+      });
+
+      return this.reply(name, once, context);
+    },
+
+    // Remove handler(s)
+    stopReplying: function stopReplying(name, callback, context) {
+      if (Radio._eventsApi(this, 'stopReplying', name)) {
+        return this;
+      }
+
+      // Remove everything if there are no arguments passed
+      if (!name && !callback && !context) {
+        delete this._requests;
+      } else if (!removeHandlers(this._requests, name, callback, context)) {
+        Radio.debugLog('Attempted to remove the unregistered request', name, this.channelName);
+      }
+
+      return this;
+    }
+  };
+
+  /*
+   * Backbone.Radio.channel
+   * ----------------------
+   * Get a reference to a channel by name.
+   *
+   */
+
+  Radio._channels = {};
+
+  Radio.channel = function (channelName) {
+    if (!channelName) {
+      throw new Error('You must provide a name for the channel.');
+    }
+
+    if (Radio._channels[channelName]) {
+      return Radio._channels[channelName];
+    } else {
+      return Radio._channels[channelName] = new Radio.Channel(channelName);
+    }
+  };
+
+  /*
+   * Backbone.Radio.Channel
+   * ----------------------
+   * A Channel is an object that extends from Backbone.Events,
+   * and Radio.Requests.
+   *
+   */
+
+  Radio.Channel = function (channelName) {
+    this.channelName = channelName;
+  };
+
+  _.extend(Radio.Channel.prototype, Backbone.Events, Radio.Requests, {
+
+    // Remove all handlers from the messaging systems of this channel
+    reset: function reset() {
+      this.off();
+      this.stopListening();
+      this.stopReplying();
+      return this;
+    }
+  });
+
+  /*
+   * Top-level API
+   * -------------
+   * Supplies the 'top-level API' for working with Channels directly
+   * from Backbone.Radio.
+   *
+   */
+
+  var channel;
+  var args;
+  var systems = [Backbone.Events, Radio.Requests];
+  _.each(systems, function (system) {
+    _.each(system, function (method, methodName) {
+      Radio[methodName] = function (channelName) {
+        args = _.toArray(arguments).slice(1);
+        channel = this.channel(channelName);
+        return channel[methodName].apply(channel, args);
+      };
+    });
+  });
+
+  Radio.reset = function (channelName) {
+    var channels = !channelName ? this._channels : [this._channels[channelName]];
+    _.each(channels, function (channel) {
+      channel.reset();
+    });
+  };
+
+  return Radio;
+
+}));
+//# sourceMappingURL=./backbone.radio.js.map
\ No newline at end of file
diff --git a/js/3rdparty/backbone.radio.js.map b/js/3rdparty/backbone.radio.js.map
new file mode 100644
index 000000000..feb2e83f7
--- /dev/null
+++ b/js/3rdparty/backbone.radio.js.map
@@ -0,0 +1 @@
+{"version":3,"names":[],"mappings":"","sources":["backbone.radio.js"],"sourcesContent":["// Backbone.Radio v2.0.0\n\n(function (global, factory) {\n  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('underscore'), require('backbone')) :\n  typeof define === 'function' && define.amd ? define(['underscore', 'backbone'], factory) :\n  (global.Backbone = global.Backbone || {}, global.Backbone.Radio = factory(global._,global.Backbone));\n}(this, function (_,Backbone) { 'use strict';\n\n  _ = 'default' in _ ? _['default'] : _;\n  Backbone = 'default' in Backbone ? Backbone['default'] : Backbone;\n\n  var _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n    return typeof obj;\n  } : function (obj) {\n    return obj && typeof Symbol === \"function\" && obj.constructor === Symbol ? \"symbol\" : typeof obj;\n  };\n\n  var previousRadio = Backbone.Radio;\n\n  var Radio = Backbone.Radio = {};\n\n  Radio.VERSION = '2.0.0';\n\n  // This allows you to run multiple instances of Radio on the same\n  // webapp. After loading the new version, call `noConflict()` to\n  // get a reference to it. At the same time the old version will be\n  // returned to Backbone.Radio.\n  Radio.noConflict = function () {\n    Backbone.Radio = previousRadio;\n    return this;\n  };\n\n  // Whether or not we're in DEBUG mode or not. DEBUG mode helps you\n  // get around the issues of lack of warnings when events are mis-typed.\n  Radio.DEBUG = false;\n\n  // Format debug text.\n  Radio._debugText = function (warning, eventName, channelName) {\n    return warning + (channelName ? ' on the ' + channelName + ' channel' : '') + ': \"' + eventName + '\"';\n  };\n\n  // This is the method that's called when an unregistered event was called.\n  // By default, it logs warning to the console. By overriding this you could\n  // make it throw an Error, for instance. This would make firing a nonexistent event\n  // have the same consequence as firing a nonexistent method on an Object.\n  Radio.debugLog = function (warning, eventName, channelName) {\n    if (Radio.DEBUG && console && console.warn) {\n      console.warn(Radio._debugText(warning, eventName, channelName));\n    }\n  };\n\n  var eventSplitter = /\\s+/;\n\n  // An internal method used to handle Radio's method overloading for Requests.\n  // It's borrowed from Backbone.Events. It differs from Backbone's overload\n  // API (which is used in Backbone.Events) in that it doesn't support space-separated\n  // event names.\n  Radio._eventsApi = function (obj, action, name, rest) {\n    if (!name) {\n      return false;\n    }\n\n    var results = {};\n\n    // Handle event maps.\n    if ((typeof name === 'undefined' ? 'undefined' : _typeof(name)) === 'object') {\n      for (var key in name) {\n        var result = obj[action].apply(obj, [key, name[key]].concat(rest));\n        eventSplitter.test(key) ? _.extend(results, result) : results[key] = result;\n      }\n      return results;\n    }\n\n    // Handle space separated event names.\n    if (eventSplitter.test(name)) {\n      var names = name.split(eventSplitter);\n      for (var i = 0, l = names.length; i < l; i++) {\n        results[names[i]] = obj[action].apply(obj, [names[i]].concat(rest));\n      }\n      return results;\n    }\n\n    return false;\n  };\n\n  // An optimized way to execute callbacks.\n  Radio._callHandler = function (callback, context, args) {\n    var a1 = args[0],\n        a2 = args[1],\n        a3 = args[2];\n    switch (args.length) {\n      case 0:\n        return callback.call(context);\n      case 1:\n        return callback.call(context, a1);\n      case 2:\n        return callback.call(context, a1, a2);\n      case 3:\n        return callback.call(context, a1, a2, a3);\n      default:\n        return callback.apply(context, args);\n    }\n  };\n\n  // A helper used by `off` methods to the handler from the store\n  function removeHandler(store, name, callback, context) {\n    var event = store[name];\n    if ((!callback || callback === event.callback || callback === event.callback._callback) && (!context || context === event.context)) {\n      delete store[name];\n      return true;\n    }\n  }\n\n  function removeHandlers(store, name, callback, context) {\n    store || (store = {});\n    var names = name ? [name] : _.keys(store);\n    var matched = false;\n\n    for (var i = 0, length = names.length; i < length; i++) {\n      name = names[i];\n\n      // If there's no event by this name, log it and continue\n      // with the loop\n      if (!store[name]) {\n        continue;\n      }\n\n      if (removeHandler(store, name, callback, context)) {\n        matched = true;\n      }\n    }\n\n    return matched;\n  }\n\n  /*\n   * tune-in\n   * -------\n   * Get console logs of a channel's activity\n   *\n   */\n\n  var _logs = {};\n\n  // This is to produce an identical function in both tuneIn and tuneOut,\n  // so that Backbone.Events unregisters it.\n  function _partial(channelName) {\n    return _logs[channelName] || (_logs[channelName] = _.bind(Radio.log, Radio, channelName));\n  }\n\n  _.extend(Radio, {\n\n    // Log information about the channel and event\n    log: function log(channelName, eventName) {\n      if (typeof console === 'undefined') {\n        return;\n      }\n      var args = _.toArray(arguments).slice(2);\n      console.log('[' + channelName + '] \"' + eventName + '\"', args);\n    },\n\n    // Logs all events on this channel to the console. It sets an\n    // internal value on the channel telling it we're listening,\n    // then sets a listener on the Backbone.Events\n    tuneIn: function tuneIn(channelName) {\n      var channel = Radio.channel(channelName);\n      channel._tunedIn = true;\n      channel.on('all', _partial(channelName));\n      return this;\n    },\n\n    // Stop logging all of the activities on this channel to the console\n    tuneOut: function tuneOut(channelName) {\n      var channel = Radio.channel(channelName);\n      channel._tunedIn = false;\n      channel.off('all', _partial(channelName));\n      delete _logs[channelName];\n      return this;\n    }\n  });\n\n  /*\n   * Backbone.Radio.Requests\n   * -----------------------\n   * A messaging system for requesting data.\n   *\n   */\n\n  function makeCallback(callback) {\n    return _.isFunction(callback) ? callback : function () {\n      return callback;\n    };\n  }\n\n  Radio.Requests = {\n\n    // Make a request\n    request: function request(name) {\n      var args = _.toArray(arguments).slice(1);\n      var results = Radio._eventsApi(this, 'request', name, args);\n      if (results) {\n        return results;\n      }\n      var channelName = this.channelName;\n      var requests = this._requests;\n\n      // Check if we should log the request, and if so, do it\n      if (channelName && this._tunedIn) {\n        Radio.log.apply(this, [channelName, name].concat(args));\n      }\n\n      // If the request isn't handled, log it in DEBUG mode and exit\n      if (requests && (requests[name] || requests['default'])) {\n        var handler = requests[name] || requests['default'];\n        args = requests[name] ? args : arguments;\n        return Radio._callHandler(handler.callback, handler.context, args);\n      } else {\n        Radio.debugLog('An unhandled request was fired', name, channelName);\n      }\n    },\n\n    // Set up a handler for a request\n    reply: function reply(name, callback, context) {\n      if (Radio._eventsApi(this, 'reply', name, [callback, context])) {\n        return this;\n      }\n\n      this._requests || (this._requests = {});\n\n      if (this._requests[name]) {\n        Radio.debugLog('A request was overwritten', name, this.channelName);\n      }\n\n      this._requests[name] = {\n        callback: makeCallback(callback),\n        context: context || this\n      };\n\n      return this;\n    },\n\n    // Set up a handler that can only be requested once\n    replyOnce: function replyOnce(name, callback, context) {\n      if (Radio._eventsApi(this, 'replyOnce', name, [callback, context])) {\n        return this;\n      }\n\n      var self = this;\n\n      var once = _.once(function () {\n        self.stopReplying(name);\n        return makeCallback(callback).apply(this, arguments);\n      });\n\n      return this.reply(name, once, context);\n    },\n\n    // Remove handler(s)\n    stopReplying: function stopReplying(name, callback, context) {\n      if (Radio._eventsApi(this, 'stopReplying', name)) {\n        return this;\n      }\n\n      // Remove everything if there are no arguments passed\n      if (!name && !callback && !context) {\n        delete this._requests;\n      } else if (!removeHandlers(this._requests, name, callback, context)) {\n        Radio.debugLog('Attempted to remove the unregistered request', name, this.channelName);\n      }\n\n      return this;\n    }\n  };\n\n  /*\n   * Backbone.Radio.channel\n   * ----------------------\n   * Get a reference to a channel by name.\n   *\n   */\n\n  Radio._channels = {};\n\n  Radio.channel = function (channelName) {\n    if (!channelName) {\n      throw new Error('You must provide a name for the channel.');\n    }\n\n    if (Radio._channels[channelName]) {\n      return Radio._channels[channelName];\n    } else {\n      return Radio._channels[channelName] = new Radio.Channel(channelName);\n    }\n  };\n\n  /*\n   * Backbone.Radio.Channel\n   * ----------------------\n   * A Channel is an object that extends from Backbone.Events,\n   * and Radio.Requests.\n   *\n   */\n\n  Radio.Channel = function (channelName) {\n    this.channelName = channelName;\n  };\n\n  _.extend(Radio.Channel.prototype, Backbone.Events, Radio.Requests, {\n\n    // Remove all handlers from the messaging systems of this channel\n    reset: function reset() {\n      this.off();\n      this.stopListening();\n      this.stopReplying();\n      return this;\n    }\n  });\n\n  /*\n   * Top-level API\n   * -------------\n   * Supplies the 'top-level API' for working with Channels directly\n   * from Backbone.Radio.\n   *\n   */\n\n  var channel;\n  var args;\n  var systems = [Backbone.Events, Radio.Requests];\n  _.each(systems, function (system) {\n    _.each(system, function (method, methodName) {\n      Radio[methodName] = function (channelName) {\n        args = _.toArray(arguments).slice(1);\n        channel = this.channel(channelName);\n        return channel[methodName].apply(channel, args);\n      };\n    });\n  });\n\n  Radio.reset = function (channelName) {\n    var channels = !channelName ? this._channels : [this._channels[channelName]];\n    _.each(channels, function (channel) {\n      channel.reset();\n    });\n  };\n\n  return Radio;\n\n}));\n"],"file":"backbone.radio.js","sourceRoot":"/source/"}
\ No newline at end of file
diff --git a/js/bookmarks.js b/js/bookmarks.js
index a1367d9e7..016a5e51b 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -1,4 +1,4 @@
-var Backbone = OC.Backbone
+var Radio = Backbone.Radio
 
 var Bookmark = Backbone.Model.extend({
   defaults: {
@@ -28,48 +28,95 @@ var Tags = Backbone.Collection.extend({
 })
 
 
-var AppView = Marionette.View.extend({
-  template: _.template('<div id="app-navigation"></div><div id="app-content"></div>')
-, regions: {
-    'navigation': '#app-navigation'
-  , 'content': '#app-content'
-  }
-, initialize: function() {
+var App = Marionette.Application.extend({
+  region: '#content'
+, onBeforeStart: function() {
     this.bookmarks = new Bookmarks
     this.bookmarks.fetch()
     this.tags = new Tags
     this.tags.fetch()
+
+    this.router = new Router
+  }
+, onStart: function() {
+    this.showView(new AppView({bookmarks: this.bookmarks, tags: this.tags}));
+    Backbone.history.start();
+  }
+});
+
+var Router = Marionette.AppRouter.extend({
+  controller: {
+    showAllBookmarks: function() {
+    }
+  , showFavoriteBookmarks: function() {
+    }
+  , showSharedBookmarks: function() {
+    }
+  , showTags: function() {
+    }
+  , showTag: function(tag) {
+    }
+  }
+, appRoutes: {
+    'all': 'showAllBookmarks'
+  , 'favorites': 'showFavoriteBookmarks'
+  , 'shared': 'showSharedBookmarks'
+  , 'tags': 'showTags'
+  , 'tag/:tag': 'showTag'
+  }
+, onRoute: function(name, path, args) {
+    Radio.channel('nav').trigger('navigate', path, args)
+  }
+})
+
+var AppView = Marionette.View.extend({
+  template: _.template('<div id="app-navigation"><div id="navigation-slot"></div><h3>Favorite tags</h3><div id="favorite-tags-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
+, regions: {
+    'navigation': {
+      el: '#navigation-slot'
+    , replaceElement: true
+    }
+  , 'content': {
+      el: '#content-slot'
+    , replaceElement: true
+    }
+  , 'tags': {
+      el: '#favorite-tags-slot'
+    , replaceElement: true
+    }
+  }
+, initialize: function(options) {
+    this.bookmarks = options.bookmarks
+    this.tags = options.tags
   }
 , onRender: function() {
-    this.showChildView('navigation', new NavigationView({tags: this.tags}));
+    this.showChildView('navigation', new NavigationView);
     this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
+    this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
   }
 })
 
+
 var NavigationView = Marionette.View.extend({
   className: 'navigation'
-, template: _.template('<ul><li data-id="all" class="all"><a href="#">All bookmarks</a></li><li data-id="facorites" class="favorites"><a href="#">Favorites</a></li><li data-id="shared" class="shared"><a href="#">Shared</a></li><li data-id="tags" class="tags"><a href="#">Tags</a></li></ul>Favorite tags<div id="favorite-tags-slot"></div>')
+, tagName: 'ul'
+, template: _.template('<li data-id="all" class="all"><a href="#">All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#">Favorites</a></li><li data-id="shared" class="shared"><a href="#">Shared</a></li><li data-id="tags" class="tags"><a href="#">Tags</a></li>')
 , events: {
     'click .all': 'onClick'
-  , 'lick .favorites': 'onClick'
+  , 'click .favorites': 'onClick'
   , 'click .shared': 'onClick'
+  , 'click .tags': 'onClick'
   }
-, regions: {
-    'tags': '#favorite-tags-slot'
-  }
-, initialize: function(options) {
-    this.tags = options.tags
+, initialize: function() {
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
   }
 , onClick: function(e) {
     e.preventDefault()
-    this.triggerMethod('navigation:open', e.target.parentNode.dataset.id)
+    Backbone.history.navigate(e.target.parentNode.dataset.id, {trigger: true})
   }
-, onNavigationOpen: function(category) {
+, onNavigate: function(category) {
     $('.active', this.$el).removeClass('active')
-    $('.'+category, this.$el).addClass('active')
-  }
-, onRender: function() {
-    this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
+    if (category && category.indexOf('tag/') !== 0) $('.'+category, this.$el).addClass('active')
   }
 })
 
@@ -81,7 +128,23 @@ var TagsNavigationView = Marionette.CollectionView.extend({
 var TagsNavigationTagView = Marionette.View.extend({
   className: 'tag-nav-item'
 , tagName: 'li'
-, template: _.template('<li><a href="#"><%- name %></a></li>')
+, template: _.template('<a href="#"><i><%- name %></a></i>')
+, events: {
+    'click': 'open'
+  }
+, initialize: function() {
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
+  }
+, open: function(e) {
+    e.preventDefault()
+    Backbone.history.navigate('tag/' + this.model.get('name'), {trigger: true});
+  }
+, onNavigate: function(category, args) {
+    this.$el.removeClass('active')
+    if (category && category.indexOf('tag/') === 0 && args[0] === this.model.get('name')) {
+      this.$el.addClass('active')
+    }
+  }
 })
 
 var ContentView = Marionette.View.extend({
@@ -146,14 +209,14 @@ Backbone.sync = function(method, model, options) {
     success: function(json) {
       console.log(json)
       if (!(model instanceof Tags)) options.success(json.data)
-      else options.success(json)
+      else options.success(json.map(function(name){return {name: name}}))
     }
   }))
 }
 
 // init
 
-var view = new AppView()
+var app = new App()
 $(function() {
-  $('#content').append(view.render().el)
+  app.start()
 })

From 59e8258691cab58050bb03c1883c5f3639c5b9fc Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 9 Sep 2017 17:55:39 +0200
Subject: [PATCH 005/110] Allow filter by tag

---
 js/bookmarks.js | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 016a5e51b..4da29fd2f 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -32,11 +32,10 @@ var App = Marionette.Application.extend({
   region: '#content'
 , onBeforeStart: function() {
     this.bookmarks = new Bookmarks
-    this.bookmarks.fetch()
     this.tags = new Tags
     this.tags.fetch()
 
-    this.router = new Router
+    this.router = new Router({app: this})
   }
 , onStart: function() {
     this.showView(new AppView({bookmarks: this.bookmarks, tags: this.tags}));
@@ -47,14 +46,19 @@ var App = Marionette.Application.extend({
 var Router = Marionette.AppRouter.extend({
   controller: {
     showAllBookmarks: function() {
+      this.app.bookmarks.fetch()
     }
   , showFavoriteBookmarks: function() {
     }
   , showSharedBookmarks: function() {
+      this.app.bookmarks.fetch()
     }
   , showTags: function() {
     }
   , showTag: function(tag) {
+      this.app.bookmarks.fetch({
+        data: {tags: [tag]}
+      })
     }
   }
 , appRoutes: {
@@ -64,6 +68,9 @@ var Router = Marionette.AppRouter.extend({
   , 'tags': 'showTags'
   , 'tag/:tag': 'showTag'
   }
+, initialize: function(options) {
+    this.controller.app = options.app
+  }
 , onRoute: function(name, path, args) {
     Radio.channel('nav').trigger('navigate', path, args)
   }

From 4db969dd8fb24cd47c1d1db0ef3d88565aa3c688 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 9 Sep 2017 20:20:12 +0200
Subject: [PATCH 006/110] Implement 'add bookmark' functionality

---
 js/bookmarks.js | 58 ++++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 53 insertions(+), 5 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 4da29fd2f..969cc0976 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -2,12 +2,12 @@ var Radio = Backbone.Radio
 
 var Bookmark = Backbone.Model.extend({
   defaults: {
-    id: '',
-    url: '',
+    /*url: '',
     title: '',
-    description: '',
+    description: '',*/
     tags: Tags
   }
+, url: 'bookmark'
 })
 
 var Bookmarks = Backbone.Collection.extend({
@@ -17,9 +17,9 @@ var Bookmarks = Backbone.Collection.extend({
 
 var Tag = Backbone.Model.extend({
   defaults: {
-    id: ''
-  , name: ''
+    name: ''
   }
+, url: 'tag'
 })
 
 var Tags = Backbone.Collection.extend({
@@ -182,6 +182,54 @@ var ContentView = Marionette.View.extend({
 var AddBookmarkView = Marionette.View.extend({
   template: _.template('<input type="text" value="" placeholder="Address"/><button title="Add" class="icon-add"></button>')
 , className: 'add-bookmark'
+, events: {
+    'click button': 'submit'
+  , 'keydown input': 'onKeydown'
+  }
+, ui: {
+    'input': 'input'
+  , 'button': 'button'
+  }
+, onKeydown: function(e) {
+    if (e.which != 13) return
+    // Enter
+    this.submit()
+  }
+, submit: function() {
+    if (this.pending) return
+    var $input = this.getUI('input')
+    var url = $input.val()
+    var bm = new Bookmark({url: url})
+    this.setPending(true)
+    var that = this
+    bm.save(null,{
+      success: function() {
+      Backbone.history.navigate('all', {trigger: true})
+      app.bookmarks.fetch()
+      $input.val('')
+      that.setPending(false)
+    }
+    , error: function() {
+        that.setPending(false)
+        that.getUI('button').removeClass('icon-add')
+        that.getUI('button').addClass('icon-error-color')
+      }
+    })
+  }
+, setPending: function(pending) {
+    if (pending) {
+      this.getUI('button').removeClass('icon-add')
+      this.getUI('button').removeClass('icon-error-color')
+      this.getUI('button').addClass('icon-loading-small')
+      this.getUI('button').prop('disabled', true)
+    }else {
+      this.getUI('button').removeClass('icon-error-color')
+      this.getUI('button').addClass('icon-add')
+      this.getUI('button').removeClass('icon-loading-small')
+      this.getUI('button').prop('disabled', false) 
+    }
+    this.pending = pending
+  }
 })
 
 

From 9780995588d76cb6f251c03de3bcd4e0a429efee Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 10 Sep 2017 01:54:01 +0200
Subject: [PATCH 007/110] Preliminary detail view for bookmarks

---
 css/bookmarks.css | 29 +++++++++++++++++++++++++++--
 js/bookmarks.js   | 38 +++++++++++++++++++++++++++++++++++---
 2 files changed, 62 insertions(+), 5 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 788a5c9f8..267bd9177 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -26,12 +26,23 @@
 }
 
 .bookmark-card {
-  width: 5cm;
-  height: 5cm;
+  box-sizing: border-box; /*necessary for hover effect goodness to work*/
+  width: 6cm;
+  height: 6cm;
   float: left;
   padding: .5cm;
   border-right: 1px solid #ebebeb;
   border-bottom: 1px solid #ebebeb;
+  overflow: hidden;
+  transition: transform .5s;
+}
+.bookmark-card:hover {
+  position: relative;
+  background: white;
+  transform: scale(1.05);
+  z-index: 1;
+  border-top: 1px solid #ebebeb;
+  border-left: 1px solid #ebebeb;
 }
 .bookmark-card h1 {
   font-size: .5cm;
@@ -39,3 +50,17 @@
 .bookmark-card h2 {
   font-size: .4cm;
 }
+
+.bookmark-detail {
+	position: absolute;
+	top: 0;
+  z-index: 2;
+	width: 100%;
+	height: 100%;
+  box-sizing: border-box;
+  padding: .5cm;
+	background: white; 
+}
+.bookmark-detail h1 {
+  font-size: .8cm;
+}
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 969cc0976..fc1bd171a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -60,6 +60,8 @@ var Router = Marionette.AppRouter.extend({
         data: {tags: [tag]}
       })
     }
+  , showBookmark: function() {
+    }
   }
 , appRoutes: {
     'all': 'showAllBookmarks'
@@ -67,6 +69,7 @@ var Router = Marionette.AppRouter.extend({
   , 'shared': 'showSharedBookmarks'
   , 'tags': 'showTags'
   , 'tag/:tag': 'showTag'
+  , 'bookmark/:bookmark': 'showBookmark'
   }
 , initialize: function(options) {
     this.controller.app = options.app
@@ -104,6 +107,12 @@ var AppView = Marionette.View.extend({
 })
 
 
+var nav_ids = {
+  all: true
+, favorites: true
+, shared: true
+, tags: true
+}
 var NavigationView = Marionette.View.extend({
   className: 'navigation'
 , tagName: 'ul'
@@ -123,7 +132,7 @@ var NavigationView = Marionette.View.extend({
   }
 , onNavigate: function(category) {
     $('.active', this.$el).removeClass('active')
-    if (category && category.indexOf('tag/') !== 0) $('.'+category, this.$el).addClass('active')
+    if (category && nav_ids[category]) $('.'+category, this.$el).addClass('active')
   }
 })
 
@@ -155,7 +164,7 @@ var TagsNavigationTagView = Marionette.View.extend({
 })
 
 var ContentView = Marionette.View.extend({
-  template: _.template('<div id="add-bookmark-slot"></div><div id="view-bookmarks-slot"></div>')
+  template: _.template('<div id="add-bookmark-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
     'addBookmarks':  {
       el: '#add-bookmark-slot'
@@ -165,14 +174,25 @@ var ContentView = Marionette.View.extend({
       el: '#view-bookmarks-slot'
     , replaceElement: true
     }
+  , 'bookmarkDetail': {
+      el: '#bookmark-detail-slot'
+    , replaceElement: true
+    }
   }
 , initialize: function(options) {
     this.bookmarks = options.bookmarks
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
   }
 , onRender: function() {
     this.showChildView('addBookmarks', new AddBookmarkView());
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
+, onNavigate: function(path, args) {
+    if ('bookmark/:bookmark' === path) {
+      var bm = app.bookmarks.get(args[0])
+      this.showChildView('bookmarkDetail', new BookmarkDetailView({model: bm}))
+    }
+  }
 })
 
 
@@ -253,10 +273,22 @@ var BookmarkCardView = Marionette.View.extend({
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
-  },
+  }
+, open: function() {
+    Backbone.history.navigate('bookmark/'+this.model.get('id'), {trigger: true})
+  }
 })
 
 
+var BookmarkDetailView = Marionette.View.extend({
+  template: _.template('<h1><%- title %></h1><h2><%- new URL(url).host %></h2>'),
+  className: "bookmark-detail",
+  events: {
+  },
+  initialize: function() {
+    this.listenTo(this.model, "change", this.render);
+  },
+})
 
 var _sync = Backbone.sync
 Backbone.sync = function(method, model, options) {

From af7d9a76931a0d538b15e703fda0ea282c12911a Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Mon, 11 Sep 2017 13:20:05 +0200
Subject: [PATCH 008/110] Implement detail-view#close

---
 css/bookmarks.css | 27 ++++++++++++++++++++++++++-
 js/bookmarks.js   | 24 +++++++++++++++++++++---
 2 files changed, 47 insertions(+), 4 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 267bd9177..7a631946d 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -36,6 +36,10 @@
   overflow: hidden;
   transition: transform .5s;
 }
+.bookmark-card,
+.bookmark-card * {
+  cursor: pointer;
+}
 .bookmark-card:hover {
   position: relative;
   background: white;
@@ -50,6 +54,9 @@
 .bookmark-card h2 {
   font-size: .4cm;
 }
+.bookmark-card h2 :link:hover {
+  text-decoration: underline;
+}
 
 .bookmark-detail {
 	position: absolute;
@@ -58,9 +65,27 @@
 	width: 100%;
 	height: 100%;
   box-sizing: border-box;
-  padding: .5cm;
+  padding: 1cm;
 	background: white; 
 }
 .bookmark-detail h1 {
   font-size: .8cm;
 }
+.bookmark-detail h2 :link:hover {
+  text-decoration: underline;
+}
+.bookmark-detail .close {
+  position: absolute;
+  top: .1cm;
+  right: .1cm;
+  width: 1cm;
+  height: 1cm;
+  cursor: pointer;
+}
+.bookmark-detail .actions {
+  float: right;
+}
+.bookmark-detail .actions button {
+  height: 1cm;
+  width: 1cm;
+}
diff --git a/js/bookmarks.js b/js/bookmarks.js
index fc1bd171a..f31412b2b 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -190,7 +190,12 @@ var ContentView = Marionette.View.extend({
 , onNavigate: function(path, args) {
     if ('bookmark/:bookmark' === path) {
       var bm = app.bookmarks.get(args[0])
-      this.showChildView('bookmarkDetail', new BookmarkDetailView({model: bm}))
+      var view = new BookmarkDetailView({model: bm})
+      this.showChildView('bookmarkDetail', view)
+      var that = this
+      view.on('close', function() {
+        that.detachChildView('bookmarkDetail')
+      })
     }
   }
 })
@@ -266,7 +271,7 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<h1><%- title %></h1><h2><%- new URL(url).host %></h2>'),
+  template: _.template('<h1><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2>'),
   className: "bookmark-card",
   events: {
     "click": "open",
@@ -281,15 +286,28 @@ var BookmarkCardView = Marionette.View.extend({
 
 
 var BookmarkDetailView = Marionette.View.extend({
-  template: _.template('<h1><%- title %></h1><h2><%- new URL(url).host %></h2>'),
+  template: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2><div class="close icon-close"></div>'),
   className: "bookmark-detail",
+  ui: {
+    'close': '.close'
+  , 'edit': '.edit'
+  , 'delete': '.delete'
+  },
   events: {
+    'click @ui.close': 'close'
+  , 'click @ui.edit': 'edit'
+  , 'click @ui.delete': 'delete'
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
   },
+  close: function() {
+    Backbone.history.history.back();
+    this.triggerMethod('close')
+  }
 })
 
+
 var _sync = Backbone.sync
 Backbone.sync = function(method, model, options) {
   _sync(method, model, _.extend({}, options, {

From 94477afba159e2fbdc8913191a123297f77d3af2 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Mon, 11 Sep 2017 23:06:25 +0200
Subject: [PATCH 009/110] Move add-bookmarks widget to the sidebar

---
 css/bookmarks.css | 11 ++++++-----
 js/bookmarks.js   | 20 ++++++++++----------
 2 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 7a631946d..9aa111b53 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -11,13 +11,14 @@
 }
 .add-bookmark input {
   width: 93%;
-  font-size: .6cm;
-  border: none;
-  width: calc(100% - 1.5cm);
+  width: calc(100% - 40px);
 }
 .add-bookmark button {
-  width: 1cm;
-  height: 1cm;
+	width: 13px;
+	height: 13px;
+	padding: 7px;
+	box-sizing: content-box;
+	vertical-align: sub;
 }
 
 .bookmarks-empty {
diff --git a/js/bookmarks.js b/js/bookmarks.js
index f31412b2b..b0fc2a07a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -80,9 +80,13 @@ var Router = Marionette.AppRouter.extend({
 })
 
 var AppView = Marionette.View.extend({
-  template: _.template('<div id="app-navigation"><div id="navigation-slot"></div><h3>Favorite tags</h3><div id="favorite-tags-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
+  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Favorite tags</h3><div id="favorite-tags-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
 , regions: {
-    'navigation': {
+    'addBookmarks':  {
+      el: '#add-bookmark-slot'
+    , replaceElement: true
+    }
+  , 'navigation': {
       el: '#navigation-slot'
     , replaceElement: true
     }
@@ -100,6 +104,7 @@ var AppView = Marionette.View.extend({
     this.tags = options.tags
   }
 , onRender: function() {
+    this.showChildView('addBookmarks', new AddBookmarkView());
     this.showChildView('navigation', new NavigationView);
     this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
     this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
@@ -144,7 +149,7 @@ var TagsNavigationView = Marionette.CollectionView.extend({
 var TagsNavigationTagView = Marionette.View.extend({
   className: 'tag-nav-item'
 , tagName: 'li'
-, template: _.template('<a href="#"><i><%- name %></a></i>')
+, template: _.template('<a href="#"><%- name %></a>')
 , events: {
     'click': 'open'
   }
@@ -164,13 +169,9 @@ var TagsNavigationTagView = Marionette.View.extend({
 })
 
 var ContentView = Marionette.View.extend({
-  template: _.template('<div id="add-bookmark-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+  template: _.template('<div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
-    'addBookmarks':  {
-      el: '#add-bookmark-slot'
-    , replaceElement: true
-    }
-  , 'viewBookmarks': {
+    'viewBookmarks': {
       el: '#view-bookmarks-slot'
     , replaceElement: true
     }
@@ -184,7 +185,6 @@ var ContentView = Marionette.View.extend({
     this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
   }
 , onRender: function() {
-    this.showChildView('addBookmarks', new AddBookmarkView());
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
 , onNavigate: function(path, args) {

From 28dc28f0a239d050c1f3455bbc46a74af90626e8 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 23 Sep 2017 18:00:47 +0200
Subject: [PATCH 010/110] List view instead of grid, + bulk select tickboxes

---
 css/bookmarks.css | 27 +++++++++++++++++----------
 js/bookmarks.js   | 10 +++++++++-
 2 files changed, 26 insertions(+), 11 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 9aa111b53..8faf19f37 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -27,27 +27,34 @@
 }
 
 .bookmark-card {
+  position: relative;
   box-sizing: border-box; /*necessary for hover effect goodness to work*/
-  width: 6cm;
-  height: 6cm;
-  float: left;
+  height: 2.5cm;
   padding: .5cm;
-  border-right: 1px solid #ebebeb;
+  padding-left: .6cm;
   border-bottom: 1px solid #ebebeb;
   overflow: hidden;
-  transition: transform .5s;
+  transition: padding-left .5s;
 }
 .bookmark-card,
 .bookmark-card * {
   cursor: pointer;
 }
+.bookmark-card.active,
 .bookmark-card:hover {
-  position: relative;
+  padding-left: 1cm;
   background: white;
-  transform: scale(1.05);
-  z-index: 1;
-  border-top: 1px solid #ebebeb;
-  border-left: 1px solid #ebebeb;
+  box-shadow: inset 2px 0 #0082c9;
+}
+.bookmark-card input[type="checkbox"] {
+  position: absolute;
+  left: .1cm;
+  top: 20%;
+  opacity: .4;
+}
+.bookmark-card:hover input[type="checkbox"],
+.bookmark-card.active input[type="checkbox"] {
+  opacity: .7;
 }
 .bookmark-card h1 {
   font-size: .5cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index b0fc2a07a..1e5e273ea 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -271,10 +271,14 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<h1><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2>'),
+  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2>'),
   className: "bookmark-card",
+  ui: {
+    "checkbox": 'input[type="checkbox"]'
+  },
   events: {
     "click": "open",
+    "click @ui.checkbox": "select"
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
@@ -282,6 +286,10 @@ var BookmarkCardView = Marionette.View.extend({
 , open: function() {
     Backbone.history.navigate('bookmark/'+this.model.get('id'), {trigger: true})
   }
+, select: function(e) {
+    e.stopPropagation()
+    this.$el.toggleClass('active')
+  }
 })
 
 

From ba616217d1c77c1797e28ac8f2fbaee684b86329 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 27 Sep 2017 19:14:13 +0200
Subject: [PATCH 011/110] Go back to  grid, this time with flexbox

---
 css/bookmarks.css |  39 ++++++++++----
 js/bookmarks.js   | 131 ++++++++++++++++++++++++++--------------------
 2 files changed, 104 insertions(+), 66 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 8faf19f37..9b9f97844 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -21,40 +21,58 @@
 	vertical-align: sub;
 }
 
+.bulk-actions {
+  position: fixed;
+  top: .5cm;
+  right: 1cm;
+}
+
 .bookmarks-empty {
   width: 5cm;
   margin: 20% auto;
 }
 
+.bookmarks {
+  display: flex;
+  flex-wrap: wrap;
+  overflow: hidden;
+}
 .bookmark-card {
   position: relative;
   box-sizing: border-box; /*necessary for hover effect goodness to work*/
-  height: 2.5cm;
+  flex-grow: 1;
+  width: 6cm;
+  height: 6cm;
   padding: .5cm;
-  padding-left: .6cm;
   border-bottom: 1px solid #ebebeb;
+  border-right: 1px solid #ebebeb;
   overflow: hidden;
-  transition: padding-left .5s;
+  transition: transform .5s;
+  background: white;
 }
 .bookmark-card,
 .bookmark-card * {
   cursor: pointer;
 }
-.bookmark-card.active,
+.bookmark-card.active {
+  box-shadow: inset 0 0 10px #0082c9;
+}
 .bookmark-card:hover {
-  padding-left: 1cm;
-  background: white;
-  box-shadow: inset 2px 0 #0082c9;
+  transform: scale(1.03);
+  border-left: 1px solid #ebebeb;
+  border-top: 1px solid #ebebeb;
+  z-index: 1;
 }
 .bookmark-card input[type="checkbox"] {
+  display: none;
   position: absolute;
   left: .1cm;
-  top: 20%;
-  opacity: .4;
+  top: 0;
+  opacity: .7;
 }
 .bookmark-card:hover input[type="checkbox"],
 .bookmark-card.active input[type="checkbox"] {
-  opacity: .7;
+  display: inline-block;
 }
 .bookmark-card h1 {
   font-size: .5cm;
@@ -93,6 +111,7 @@
 .bookmark-detail .actions {
   float: right;
 }
+.bulk-actions button,
 .bookmark-detail .actions button {
   height: 1cm;
   width: 1cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 1e5e273ea..2f136ef26 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -112,6 +112,58 @@ var AppView = Marionette.View.extend({
 })
 
 
+var AddBookmarkView = Marionette.View.extend({
+  template: _.template('<input type="text" value="" placeholder="Address"/><button title="Add" class="icon-add"></button>')
+, className: 'add-bookmark'
+, events: {
+    'click button': 'submit'
+  , 'keydown input': 'onKeydown'
+  }
+, ui: {
+    'input': 'input'
+  , 'button': 'button'
+  }
+, onKeydown: function(e) {
+    if (e.which != 13) return
+    // Enter
+    this.submit()
+  }
+, submit: function() {
+    if (this.pending) return
+    var $input = this.getUI('input')
+    var url = $input.val()
+    var bm = new Bookmark({url: url})
+    this.setPending(true)
+    var that = this
+    bm.save(null,{
+      success: function() {
+      Backbone.history.navigate('all', {trigger: true})
+      app.bookmarks.fetch()
+      $input.val('')
+      that.setPending(false)
+    }
+    , error: function() {
+        that.setPending(false)
+        that.getUI('button').removeClass('icon-add')
+        that.getUI('button').addClass('icon-error-color')
+      }
+    })
+  }
+, setPending: function(pending) {
+    if (pending) {
+      this.getUI('button').removeClass('icon-add')
+      this.getUI('button').removeClass('icon-error-color')
+      this.getUI('button').addClass('icon-loading-small')
+      this.getUI('button').prop('disabled', true)
+    }else {
+      this.getUI('button').removeClass('icon-error-color')
+      this.getUI('button').addClass('icon-add')
+      this.getUI('button').removeClass('icon-loading-small')
+      this.getUI('button').prop('disabled', false) 
+    }
+    this.pending = pending
+  }
+})
 var nav_ids = {
   all: true
 , favorites: true
@@ -169,9 +221,13 @@ var TagsNavigationTagView = Marionette.View.extend({
 })
 
 var ContentView = Marionette.View.extend({
-  template: _.template('<div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+  template: _.template('<div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
-    'viewBookmarks': {
+    'bulkActions': {
+      el: '#bulk-action-slot'
+    , replaceElement: true
+    }
+  , 'viewBookmarks': {
       el: '#view-bookmarks-slot'
     , replaceElement: true
     }
@@ -182,6 +238,15 @@ var ContentView = Marionette.View.extend({
   }
 , initialize: function(options) {
     this.bookmarks = options.bookmarks
+    var selected = new Bookmarks
+    this.bookmarks.on('select', function(model) {
+      selected.add(model)
+      if (selected.models.length == 1) this.showChildView('bulkActions', new BulkActionsView({collection: selected}))
+    })
+    this.bookmarks.on('unselect', function(model) {
+      selected.remove(model)
+      if (selected.models.length == 0) this.detachChildView('bulkActions')
+    })
     this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
   }
 , onRender: function() {
@@ -202,63 +267,12 @@ var ContentView = Marionette.View.extend({
 
 
 
-
-
-var AddBookmarkView = Marionette.View.extend({
-  template: _.template('<input type="text" value="" placeholder="Address"/><button title="Add" class="icon-add"></button>')
-, className: 'add-bookmark'
-, events: {
-    'click button': 'submit'
-  , 'keydown input': 'onKeydown'
-  }
-, ui: {
-    'input': 'input'
-  , 'button': 'button'
-  }
-, onKeydown: function(e) {
-    if (e.which != 13) return
-    // Enter
-    this.submit()
-  }
-, submit: function() {
-    if (this.pending) return
-    var $input = this.getUI('input')
-    var url = $input.val()
-    var bm = new Bookmark({url: url})
-    this.setPending(true)
-    var that = this
-    bm.save(null,{
-      success: function() {
-      Backbone.history.navigate('all', {trigger: true})
-      app.bookmarks.fetch()
-      $input.val('')
-      that.setPending(false)
-    }
-    , error: function() {
-        that.setPending(false)
-        that.getUI('button').removeClass('icon-add')
-        that.getUI('button').addClass('icon-error-color')
-      }
-    })
-  }
-, setPending: function(pending) {
-    if (pending) {
-      this.getUI('button').removeClass('icon-add')
-      this.getUI('button').removeClass('icon-error-color')
-      this.getUI('button').addClass('icon-loading-small')
-      this.getUI('button').prop('disabled', true)
-    }else {
-      this.getUI('button').removeClass('icon-error-color')
-      this.getUI('button').addClass('icon-add')
-      this.getUI('button').removeClass('icon-loading-small')
-      this.getUI('button').prop('disabled', false) 
-    }
-    this.pending = pending
-  }
+var BulkActionsView = Marionette.View.extend({
+  className: 'bulk-actions'
+, template: _.template('<button class="delete icon-delete"></button>')
 })
 
 
-
 var BookmarksView = Marionette.CollectionView.extend({
   className: 'bookmarks'
 , childView: function() {return BookmarkCardView}
@@ -288,6 +302,11 @@ var BookmarkCardView = Marionette.View.extend({
   }
 , select: function(e) {
     e.stopPropagation()
+    if (this.$el.hasClass('active')) {
+      this.triggerMethod('unselecct', this.model)
+    }else{
+      this.triggerMethod('select', this.model)
+    }
     this.$el.toggleClass('active')
   }
 })

From c2f8cb3a6c7396b487385236e0998cfac2f18419 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 27 Sep 2017 19:54:33 +0200
Subject: [PATCH 012/110] Implement search

---
 js/bookmarks.js | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 2f136ef26..c4a6d37e2 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -62,6 +62,11 @@ var Router = Marionette.AppRouter.extend({
     }
   , showBookmark: function() {
     }
+  , search: function(query) {
+      this.app.bookmarks.fetch({
+        data: {search: query.split(' ')}
+      })
+    }
   }
 , appRoutes: {
     'all': 'showAllBookmarks'
@@ -70,6 +75,7 @@ var Router = Marionette.AppRouter.extend({
   , 'tags': 'showTags'
   , 'tag/:tag': 'showTag'
   , 'bookmark/:bookmark': 'showBookmark'
+  , 'search/:query': 'search'
   }
 , initialize: function(options) {
     this.controller.app = options.app
@@ -102,6 +108,7 @@ var AppView = Marionette.View.extend({
 , initialize: function(options) {
     this.bookmarks = options.bookmarks
     this.tags = options.tags
+    this.searchController = new SearchController
   }
 , onRender: function() {
     this.showChildView('addBookmarks', new AddBookmarkView());
@@ -112,6 +119,39 @@ var AppView = Marionette.View.extend({
 })
 
 
+var SearchController = Marionette.View.extend({
+  el: '#searchbox'
+, initialize: function() {
+    var that = this
+    // register a dummy search plugin
+    OC.Plugins.register('OCA.Search', { attach: function(search) {
+        search.setFilter('bookmarks', function(query) {
+          that.submit(query)
+        })
+      }
+    });
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
+  }
+, events: {
+    'keydown': 'onKeydown'
+  }
+, onRender: function() {
+    this.$el.show()
+  }
+, onNavigate: function(route, query) {
+    if (route === 'search/:query') this.$el.val(query)
+  }
+, submit: function(query) {
+    if (query !== '') {
+      Backbone.history.navigate('search/'+query)
+      app.router.controller.search(query)
+    }else {
+      Backbone.history.navigate('all')
+      app.router.controller.showAllBookmarks()
+    }
+  }
+})
+
 var AddBookmarkView = Marionette.View.extend({
   template: _.template('<input type="text" value="" placeholder="Address"/><button title="Add" class="icon-add"></button>')
 , className: 'add-bookmark'

From c3ad0f41c25a45ca3f9550f8f0706fdc4033e34c Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 18:35:38 +0100
Subject: [PATCH 013/110] UI: Escape url params

---
 js/bookmarks.js | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index c4a6d37e2..1c5255295 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -57,14 +57,14 @@ var Router = Marionette.AppRouter.extend({
     }
   , showTag: function(tag) {
       this.app.bookmarks.fetch({
-        data: {tags: [tag]}
+        data: {item: {tags: [decodeURIComponent(tag)]}}
       })
     }
   , showBookmark: function() {
     }
   , search: function(query) {
       this.app.bookmarks.fetch({
-        data: {search: query.split(' ')}
+        data: {search: decodeURIComponent(query).split(' ')}
       })
     }
   }
@@ -139,15 +139,14 @@ var SearchController = Marionette.View.extend({
     this.$el.show()
   }
 , onNavigate: function(route, query) {
-    if (route === 'search/:query') this.$el.val(query)
+    if (route === 'search/:query') this.$el.val(decodeURIComponent(query))
   }
 , submit: function(query) {
     if (query !== '') {
+      query = encodeURIComponent(query)
       Backbone.history.navigate('search/'+query)
-      app.router.controller.search(query)
     }else {
       Backbone.history.navigate('all')
-      app.router.controller.showAllBookmarks()
     }
   }
 })
@@ -250,11 +249,11 @@ var TagsNavigationTagView = Marionette.View.extend({
   }
 , open: function(e) {
     e.preventDefault()
-    Backbone.history.navigate('tag/' + this.model.get('name'), {trigger: true});
+    Backbone.history.navigate('tag/' + encodeURIComponent(this.model.get('name')), {trigger: true});
   }
 , onNavigate: function(category, args) {
     this.$el.removeClass('active')
-    if (category && category.indexOf('tag/') === 0 && args[0] === this.model.get('name')) {
+    if (category && category.indexOf('tag/') === 0 && decodeURIComponent(args[0]) === this.model.get('name')) {
       this.$el.addClass('active')
     }
   }

From 80d0f2d94e5d803c4115d38f7fc978a600f93853 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 20:52:00 +0100
Subject: [PATCH 014/110] Add bulkActions and implement bulk delete

---
 css/bookmarks.css | 16 ++++++++-----
 js/bookmarks.js   | 61 ++++++++++++++++++++++++++++++++++-------------
 2 files changed, 55 insertions(+), 22 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 9b9f97844..9bd4934c3 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -22,9 +22,9 @@
 }
 
 .bulk-actions {
-  position: fixed;
-  top: .5cm;
-  right: 1cm;
+  border-bottom: 1px solid #ebebeb;
+  padding: 5px;
+  text-align: right;
 }
 
 .bookmarks-empty {
@@ -54,15 +54,19 @@
 .bookmark-card * {
   cursor: pointer;
 }
-.bookmark-card.active {
-  box-shadow: inset 0 0 10px #0082c9;
-}
 .bookmark-card:hover {
   transform: scale(1.03);
   border-left: 1px solid #ebebeb;
   border-top: 1px solid #ebebeb;
   z-index: 1;
 }
+.bookmark-card.active,
+.bookmark-card.active:hover {
+  transform: none;
+  border-left: none;
+  border-top: none;
+  box-shadow: inset 0 0 10px #0082c9;
+}
 .bookmark-card input[type="checkbox"] {
   display: none;
   position: absolute;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 1c5255295..b15f24a3b 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -7,7 +7,7 @@ var Bookmark = Backbone.Model.extend({
     description: '',*/
     tags: Tags
   }
-, url: 'bookmark'
+, urlRoot: 'bookmark'
 })
 
 var Bookmarks = Backbone.Collection.extend({
@@ -144,9 +144,9 @@ var SearchController = Marionette.View.extend({
 , submit: function(query) {
     if (query !== '') {
       query = encodeURIComponent(query)
-      Backbone.history.navigate('search/'+query)
+      Backbone.history.navigate('search/'+query, {trigger: true})
     }else {
-      Backbone.history.navigate('all')
+      Backbone.history.navigate('all', {trigger: true})
     }
   }
 })
@@ -263,8 +263,7 @@ var ContentView = Marionette.View.extend({
   template: _.template('<div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
     'bulkActions': {
-      el: '#bulk-action-slot'
-    , replaceElement: true
+      el: '#bulk-actions-slot'
     }
   , 'viewBookmarks': {
       el: '#view-bookmarks-slot'
@@ -277,17 +276,24 @@ var ContentView = Marionette.View.extend({
   }
 , initialize: function(options) {
     this.bookmarks = options.bookmarks
-    var selected = new Bookmarks
-    this.bookmarks.on('select', function(model) {
-      selected.add(model)
-      if (selected.models.length == 1) this.showChildView('bulkActions', new BulkActionsView({collection: selected}))
-    })
-    this.bookmarks.on('unselect', function(model) {
-      selected.remove(model)
-      if (selected.models.length == 0) this.detachChildView('bulkActions')
-    })
+    this.selected = new Bookmarks
+    this.listenTo(this.bookmarks, 'select', this.onSelect)
+    this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
     this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
   }
+, onSelect: function(model) {
+    this.selected.add(model)
+    if (this.selected.length == 1) this.showChildView('bulkActions', new BulkActionsView({collection: this.selected}))
+  }
+, onUnselect: function(model) {
+    var that = this
+    this.selected.remove(model)
+    if (this.selected.length == 0) {
+      this.getRegion('bulkActions').currentView.$el.slideUp(function() {
+        that.getRegion('bulkActions').empty()
+      })
+    }
+  }
 , onRender: function() {
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
@@ -309,6 +315,29 @@ var ContentView = Marionette.View.extend({
 var BulkActionsView = Marionette.View.extend({
   className: 'bulk-actions'
 , template: _.template('<button class="delete icon-delete"></button>')
+, events: {
+    'click .delete': 'delete'
+  }
+, initialize: function(opts) {
+    this.selected = opts.collection
+  }
+, delete: function() {
+    var that = this
+    this.selected.forEach(function(model) {
+      model.trigger('unselect', model)
+      model.destroy({
+        error: function() {
+          Backbone.history.navigate('all', {trigger: true})
+        }
+      })
+    })
+  }
+, onAttach: function() {
+    this.$el.css('display', 'none')
+    this.$el.slideDown()
+  }
+, onBeforeDestroy: function() {
+  }
 })
 
 
@@ -342,9 +371,9 @@ var BookmarkCardView = Marionette.View.extend({
 , select: function(e) {
     e.stopPropagation()
     if (this.$el.hasClass('active')) {
-      this.triggerMethod('unselecct', this.model)
+      this.model.trigger('unselect', this.model)
     }else{
-      this.triggerMethod('select', this.model)
+      this.model.trigger('select', this.model)
     }
     this.$el.toggleClass('active')
   }

From 6d46f32fd9b00f9a66a39c6a7332d26b1e10db1a Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 21:10:25 +0100
Subject: [PATCH 015/110] Polish selection styles

---
 css/bookmarks.css | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 9bd4934c3..5a7ef4d06 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -25,6 +25,7 @@
   border-bottom: 1px solid #ebebeb;
   padding: 5px;
   text-align: right;
+  background: #e9f7ff;
 }
 
 .bookmarks-empty {
@@ -44,10 +45,9 @@
   width: 6cm;
   height: 6cm;
   padding: .5cm;
-  border-bottom: 1px solid #ebebeb;
-  border-right: 1px solid #ebebeb;
+  border: 1px solid #ebebeb;
   overflow: hidden;
-  transition: transform .5s;
+  transition: transform .5s, z-index .5s, border .5s;
   background: white;
 }
 .bookmark-card,
@@ -56,15 +56,13 @@
 }
 .bookmark-card:hover {
   transform: scale(1.03);
-  border-left: 1px solid #ebebeb;
-  border-top: 1px solid #ebebeb;
+  border: 2px solid #ebebeb;
   z-index: 1;
 }
 .bookmark-card.active,
 .bookmark-card.active:hover {
   transform: none;
-  border-left: none;
-  border-top: none;
+  border: 1px solid #0082c9;
   box-shadow: inset 0 0 10px #0082c9;
 }
 .bookmark-card input[type="checkbox"] {

From b481bcf060831fc0a3fb68388626595dcd162394 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 21:34:00 +0100
Subject: [PATCH 016/110] [UI] Bulk actions: Add reset button

---
 css/bookmarks.css | 10 ++++++++--
 js/bookmarks.js   | 27 +++++++++++++++++++++------
 2 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 5a7ef4d06..eeba0ab81 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -22,11 +22,17 @@
 }
 
 .bulk-actions {
+  position: relative;
   border-bottom: 1px solid #ebebeb;
-  padding: 5px;
-  text-align: right;
+  padding: 5px .5cm;
   background: #e9f7ff;
 }
+.bulk-actions .close {
+  position: absolute;
+  right: .5cm;
+  top: .5cm;
+  cursor: pointer;
+}
 
 .bookmarks-empty {
   width: 5cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index b15f24a3b..42a8a8981 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -286,11 +286,11 @@ var ContentView = Marionette.View.extend({
     if (this.selected.length == 1) this.showChildView('bulkActions', new BulkActionsView({collection: this.selected}))
   }
 , onUnselect: function(model) {
-    var that = this
     this.selected.remove(model)
     if (this.selected.length == 0) {
-      this.getRegion('bulkActions').currentView.$el.slideUp(function() {
-        that.getRegion('bulkActions').empty()
+      var bulkRegion = this.getRegion('bulkActions')
+      bulkRegion.currentView.close(function() {
+        bulkRegion.empty()
       })
     }
   }
@@ -314,9 +314,10 @@ var ContentView = Marionette.View.extend({
 
 var BulkActionsView = Marionette.View.extend({
   className: 'bulk-actions'
-, template: _.template('<button class="delete icon-delete"></button>')
+, template: _.template('<button class="delete icon-delete"></button><div class="close icon-close"></div>')
 , events: {
     'click .delete': 'delete'
+  , 'click .close': 'abort'
   }
 , initialize: function(opts) {
     this.selected = opts.collection
@@ -336,7 +337,13 @@ var BulkActionsView = Marionette.View.extend({
     this.$el.css('display', 'none')
     this.$el.slideDown()
   }
-, onBeforeDestroy: function() {
+, abort: function() {
+    this.selected.models.slice().forEach(function(model) {
+      model.trigger('unselect', model)
+    })
+  }
+, close: function(cb) {
+    this.$el.slideUp(cb)
   }
 })
 
@@ -364,6 +371,8 @@ var BookmarkCardView = Marionette.View.extend({
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
+    this.listenTo(this.model, "select", this.onSelect);
+    this.listenTo(this.model, "unselect", this.onUnselect);
   }
 , open: function() {
     Backbone.history.navigate('bookmark/'+this.model.get('id'), {trigger: true})
@@ -375,7 +384,13 @@ var BookmarkCardView = Marionette.View.extend({
     }else{
       this.model.trigger('select', this.model)
     }
-    this.$el.toggleClass('active')
+  }
+, onSelect: function() {
+    this.$el.addClass('active')
+  }
+, onUnselect: function() {
+    this.$el.removeClass('active')
+    this.render()
   }
 })
 

From 870a5493723c5977035aef7cf0f77b67bfa45c32 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 22:10:09 +0100
Subject: [PATCH 017/110] UI: Remove magnifying animation

---
 css/bookmarks.css | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index eeba0ab81..4f7ab51dd 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -53,7 +53,6 @@
   padding: .5cm;
   border: 1px solid #ebebeb;
   overflow: hidden;
-  transition: transform .5s, z-index .5s, border .5s;
   background: white;
 }
 .bookmark-card,
@@ -61,9 +60,7 @@
   cursor: pointer;
 }
 .bookmark-card:hover {
-  transform: scale(1.03);
-  border: 2px solid #ebebeb;
-  z-index: 1;
+  background: #fcfcfc;
 }
 .bookmark-card.active,
 .bookmark-card.active:hover {

From 8de068c6d1057bbb34914f91b024415f342dd1ba Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 22:20:39 +0100
Subject: [PATCH 018/110] UI Polish select boxes

---
 css/bookmarks.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 4f7ab51dd..bdf88a3ef 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -72,8 +72,9 @@
   display: none;
   position: absolute;
   left: .1cm;
-  top: 0;
+  top: .3cm;
   opacity: .7;
+  width: .4cm;
 }
 .bookmark-card:hover input[type="checkbox"],
 .bookmark-card.active input[type="checkbox"] {

From 5093813caa6a7e0f43a5daf9b1d55fb02a2669eb Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 10 Jan 2018 22:54:54 +0100
Subject: [PATCH 019/110] UI: Add clickable tags to bookmarks in overview

---
 css/bookmarks.css | 16 ++++++++++++++++
 js/bookmarks.js   | 12 +++++++++++-
 2 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index bdf88a3ef..41eeaa849 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -89,6 +89,22 @@
 .bookmark-card h2 :link:hover {
   text-decoration: underline;
 }
+.bookmark-card .tags {
+  max-height: 2.5cm;
+  overflow: hidden;
+  position: absolute;
+  bottom: .5cm;
+}
+.bookmark-card .tag-nav-item {
+  border-radius: .2cm;
+  background: #ebebeb;
+  display: inline-block;
+  padding: 0 .2cm;
+  margin: .1cm;
+}
+.bookmark-card .tag-nav-item:hover {
+  background: #e0e0e0;
+}
 
 .bookmark-detail {
 	position: absolute;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 42a8a8981..77296f5aa 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -249,6 +249,7 @@ var TagsNavigationTagView = Marionette.View.extend({
   }
 , open: function(e) {
     e.preventDefault()
+    e.stopPropagation() // for when tags are displayed in BookmarkCardView, we don't want that view to get the click, too
     Backbone.history.navigate('tag/' + encodeURIComponent(this.model.get('name')), {trigger: true});
   }
 , onNavigate: function(category, args) {
@@ -360,11 +361,14 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2>'),
+  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2><div class="tags"></div>'),
   className: "bookmark-card",
   ui: {
     "checkbox": 'input[type="checkbox"]'
   },
+  regions: {
+    'tags': '.tags'
+  },
   events: {
     "click": "open",
     "click @ui.checkbox": "select"
@@ -374,6 +378,12 @@ var BookmarkCardView = Marionette.View.extend({
     this.listenTo(this.model, "select", this.onSelect);
     this.listenTo(this.model, "unselect", this.onUnselect);
   }
+, onRender: function() {
+    var tags = new Tags(this.model.get('tags').map(function(id) {
+      return new Tag({name: id})
+    }))
+    this.showChildView('tags', new TagsNavigationView({collection: tags}))
+  }
 , open: function() {
     Backbone.history.navigate('bookmark/'+this.model.get('id'), {trigger: true})
   }

From d2d48a791f19a4ff03aa0983cd4094743a206c9f Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 12 Jan 2018 11:52:12 +0100
Subject: [PATCH 020/110] UI: Implement import/export

---
 css/bookmarks.css | 37 ++++++++++++++++++++++++++++
 js/bookmarks.js   | 62 ++++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 98 insertions(+), 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 41eeaa849..0bc8ce8ea 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,3 +1,13 @@
+#content > div {
+  height: 100%;
+}
+#app-navigation {
+  height: 100%;
+  position: relative;
+}
+#app-navigation > ul {
+  height: auto;
+}
 #app-navigation h3 {
 	padding-top: .7cm;
 	padding-left: 0.1cm;
@@ -138,3 +148,30 @@
   height: 1cm;
   width: 1cm;
 }
+
+.settings {
+  width: 98%;
+  position: absolute;
+  bottom: 0;
+  padding: .1cm;
+}
+.settings .open {
+  width: 98%;
+  height: 1cm;
+}
+.settings .icon-settings {
+  display: inline-block;
+  vertical-align: text-bottom;
+}
+.settings .settings-content {
+  display: none;
+}
+.settings .import-form {
+  display: inline-block;
+}
+.settings .import {
+  display: none;
+}
+.settings .upload {
+  display: none;
+}
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 77296f5aa..238ce8c15 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -86,7 +86,7 @@ var Router = Marionette.AppRouter.extend({
 })
 
 var AppView = Marionette.View.extend({
-  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Favorite tags</h3><div id="favorite-tags-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
+  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Favorite tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
 , regions: {
     'addBookmarks':  {
       el: '#add-bookmark-slot'
@@ -104,6 +104,10 @@ var AppView = Marionette.View.extend({
       el: '#favorite-tags-slot'
     , replaceElement: true
     }
+  , 'settings': {
+      el: '#settings-slot'
+    , replaceElement: true
+    }
   }
 , initialize: function(options) {
     this.bookmarks = options.bookmarks
@@ -115,6 +119,7 @@ var AppView = Marionette.View.extend({
     this.showChildView('navigation', new NavigationView);
     this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
     this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
+    this.showChildView('settings', new SettingsView())
   }
 })
 
@@ -260,6 +265,61 @@ var TagsNavigationTagView = Marionette.View.extend({
   }
 })
 
+var SettingsView = Marionette.View.extend({
+  className: 'settings'
+, template: _.template('<button class="open"><i class="icon-settings"></i> Settings</button><div class="settings-content"><h3>Import & Export</h3><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade">Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export">Export</button><div class="import-status"></div></div>')
+, ui: {
+    'content': '.settings-content'
+  , 'import': '.import'
+  , 'form': '.import-form'
+  , 'iframe': '.upload'
+  , 'status': '.import-status'
+  }
+, events: {
+    'click .open': 'open'
+  , 'click .import-facade': 'importTrigger'
+  , 'change @ui.import': 'importSubmit'
+  , 'load @ui.iframe': 'importResult'
+  , 'click .export': 'exportTrigger'
+  }
+, open: function() {
+    this.getUI('content').slideToggle()
+  }
+, importTrigger: function(e) {
+    e.preventDefault()
+    this.getUI('import').click()
+  }
+, importSubmit: function(e) {
+    e.preventDefault()
+    this.getUI('iframe').load(this.importResult.bind(this));
+    this.getUI('form').submit();
+    this.getUI('status').text(t('bookmark', 'Uploading...'));
+  }
+, importResult: function () {
+    var data;
+    try {
+      data = $.parseJSON(this.getUI('iframe').contents().text());
+    } catch (e) {
+      this.getUI('status').text(t('bookmark', 'Import error'));
+      return;
+    }
+    if (data.status == 'error') {
+      var list = $("<ul></ul>").addClass('setting_error_list');
+      console.log(data);
+      $.each(data.data, function (index, item) {
+        list.append($("<li></li>").text(item));
+      });
+      this.getUI('status').html(list);
+      return
+    }
+    this.getUI('status').text(t('bookmark', 'Import completed successfully.'));
+    Backbone.history.navigate('all', {trigger: true})
+  }
+, exportTrigger: function() {
+    window.location = 'bookmark/export?requesttoken='+oc_requesttoken
+  }
+})
+
 var ContentView = Marionette.View.extend({
   template: _.template('<div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {

From afad68040c0a9732eb9c770a5f2981dac1c01d0f Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 12 Jan 2018 22:32:10 +0100
Subject: [PATCH 021/110] Polishing: Add icons

---
 css/bookmarks.css | 6 ++++++
 js/bookmarks.js   | 6 +++---
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 0bc8ce8ea..83f08ef1b 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -94,7 +94,9 @@
   font-size: .5cm;
 }
 .bookmark-card h2 {
+  margin-top: .1cm;
   font-size: .4cm;
+  opacity: .4;
 }
 .bookmark-card h2 :link:hover {
   text-decoration: underline;
@@ -129,6 +131,10 @@
 .bookmark-detail h1 {
   font-size: .8cm;
 }
+.bookmark-detail h2 {
+  margin-top: .3cm;
+  opacity: .4;
+}
 .bookmark-detail h2 :link:hover {
   text-decoration: underline;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 238ce8c15..de0d3642a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -217,7 +217,7 @@ var nav_ids = {
 var NavigationView = Marionette.View.extend({
   className: 'navigation'
 , tagName: 'ul'
-, template: _.template('<li data-id="all" class="all"><a href="#">All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#">Favorites</a></li><li data-id="shared" class="shared"><a href="#">Shared</a></li><li data-id="tags" class="tags"><a href="#">Tags</a></li>')
+, template: _.template('<li data-id="all" class="all"><a href="#"><img src="../../../core/img/places/home.svg?v=1" />All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><img src="../../../apps/files/css/../img/star.svg?v=1" />Favorites</a></li><li data-id="shared" class="shared"><a href="#"><img src="../../../apps/files/css/../img/share.svg?v=1" />Shared</a></li><li data-id="tags" class="tags"><a href="#"><img src="../../../apps/systemtags/css/../img/tag.svg?v=1" />Tags</a></li>')
 , events: {
     'click .all': 'onClick'
   , 'click .favorites': 'onClick'
@@ -421,7 +421,7 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2><div class="tags"></div>'),
+  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><img src="../../../apps/files/css/../img/public.svg?v=1" /><%- new URL(url).host %></a></h2><div class="tags"></div>'),
   className: "bookmark-card",
   ui: {
     "checkbox": 'input[type="checkbox"]'
@@ -466,7 +466,7 @@ var BookmarkCardView = Marionette.View.extend({
 
 
 var BookmarkDetailView = Marionette.View.extend({
-  template: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><%- new URL(url).host %></a></h2><div class="close icon-close"></div>'),
+  template: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><img src="../../../apps/files/css/../img/public.svg?v=1" /><%- new URL(url).host %></a></h2><div class="close icon-close"></div>'),
   className: "bookmark-detail",
   ui: {
     'close': '.close'

From c396e73435a4516c9af55e0d7e7f6df039d911ce Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 12 Jan 2018 22:51:36 +0100
Subject: [PATCH 022/110] Refactor bulkActions handling

---
 css/bookmarks.css |  1 +
 js/bookmarks.js   | 26 ++++++++++++--------------
 2 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 83f08ef1b..481aa73aa 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -32,6 +32,7 @@
 }
 
 .bulk-actions {
+  display: none;
   position: relative;
   border-bottom: 1px solid #ebebeb;
   padding: 5px .5cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index de0d3642a..e4fe6b7e4 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -325,6 +325,7 @@ var ContentView = Marionette.View.extend({
 , regions: {
     'bulkActions': {
       el: '#bulk-actions-slot'
+    , replaceElement: true
     }
   , 'viewBookmarks': {
       el: '#view-bookmarks-slot'
@@ -342,18 +343,14 @@ var ContentView = Marionette.View.extend({
     this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
     this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
   }
+, onRender: function() {
+    this.showChildView('bulkActions', new BulkActionsView({collection: this.selected}))
+  }
 , onSelect: function(model) {
     this.selected.add(model)
-    if (this.selected.length == 1) this.showChildView('bulkActions', new BulkActionsView({collection: this.selected}))
   }
 , onUnselect: function(model) {
     this.selected.remove(model)
-    if (this.selected.length == 0) {
-      var bulkRegion = this.getRegion('bulkActions')
-      bulkRegion.currentView.close(function() {
-        bulkRegion.empty()
-      })
-    }
   }
 , onRender: function() {
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
@@ -382,6 +379,14 @@ var BulkActionsView = Marionette.View.extend({
   }
 , initialize: function(opts) {
     this.selected = opts.collection
+    this.listenTo(this.selected, 'remove', this.onReduceSelection)
+    this.listenTo(this.selected, 'add', this.onExtendSelection)
+  }
+, onReduceSelection: function() {
+    if (this.selected.length == 0) this.$el.slideUp()
+  }
+, onExtendSelection: function() {
+    if (this.selected.length == 1) this.$el.slideDown()
   }
 , delete: function() {
     var that = this
@@ -394,18 +399,11 @@ var BulkActionsView = Marionette.View.extend({
       })
     })
   }
-, onAttach: function() {
-    this.$el.css('display', 'none')
-    this.$el.slideDown()
-  }
 , abort: function() {
     this.selected.models.slice().forEach(function(model) {
       model.trigger('unselect', model)
     })
   }
-, close: function(cb) {
-    this.$el.slideUp(cb)
-  }
 })
 
 

From 88cb2685537a06ce7cc50e6d9884684225dc5531 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 12 Jan 2018 23:19:05 +0100
Subject: [PATCH 023/110] Responsive menu

---
 css/bookmarks.css | 19 +++++++++++++++++++
 js/bookmarks.js   | 25 +++++++++++++++++++------
 2 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 481aa73aa..20d4f65ae 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -14,6 +14,25 @@
 	border-top: 1px solid #ededed;
 }
 
+#app-content {
+  transition: transform .5s ease;
+  transform: none;
+}
+.mobile-nav {
+  padding: .3cm;
+  display: none;
+}
+.mobile-nav .toggle-menu {
+  display: inline-block;
+}
+@media only screen and (max-width: 768px) {
+  .mobile-nav-open #app-content {
+    transform: translate(250px, 0);
+  }
+  .mobile-nav {
+    display: block;
+  }
+}
 
 .add-bookmark {
   padding: .1cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index e4fe6b7e4..9ebfc35ec 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -321,9 +321,13 @@ var SettingsView = Marionette.View.extend({
 })
 
 var ContentView = Marionette.View.extend({
-  template: _.template('<div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+  template: _.template('<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
-    'bulkActions': {
+    'mobileNav': {
+      el: '#mobile-nav-slot'
+    , replaceElement: true
+    }
+  , 'bulkActions': {
       el: '#bulk-actions-slot'
     , replaceElement: true
     }
@@ -344,7 +348,9 @@ var ContentView = Marionette.View.extend({
     this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
   }
 , onRender: function() {
+    this.showChildView('mobileNav', new MobileNavView())
     this.showChildView('bulkActions', new BulkActionsView({collection: this.selected}))
+    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
 , onSelect: function(model) {
     this.selected.add(model)
@@ -352,9 +358,6 @@ var ContentView = Marionette.View.extend({
 , onUnselect: function(model) {
     this.selected.remove(model)
   }
-, onRender: function() {
-    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
-  }
 , onNavigate: function(path, args) {
     if ('bookmark/:bookmark' === path) {
       var bm = app.bookmarks.get(args[0])
@@ -368,7 +371,17 @@ var ContentView = Marionette.View.extend({
   }
 })
 
-
+var MobileNavView = Marionette.View.extend({
+  className: 'mobile-nav'
+, template: _.template('<a href="#" class="icon-menu toggle-menu"></a>')
+, events: {
+    'click .toggle-menu': 'toggleMenu'
+  }
+, toggleMenu: function(e) {
+    e.preventDefault()
+    $('body').toggleClass('mobile-nav-open')
+  }
+})
 
 var BulkActionsView = Marionette.View.extend({
   className: 'bulk-actions'

From b37afb1a0e08da65581c877c77b7803e1f712862 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 12 Jan 2018 23:43:24 +0100
Subject: [PATCH 024/110] Restyle: Settings toggle button

---
 css/bookmarks.css | 12 +++++++++++-
 js/bookmarks.js   |  5 +++--
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 20d4f65ae..fae7c3018 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -180,10 +180,20 @@
   position: absolute;
   bottom: 0;
   padding: .1cm;
+  margin-bottom: .2cm;
 }
 .settings .open {
+  display: inline-block;
   width: 98%;
-  height: 1cm;
+  font-size: .4cm;
+  padding: .2cm;
+  opacity: .7;
+}
+.settings .open:hover {
+  opacity: 1;
+}
+.settings .open img {
+  vertical-align: text-bottom;
 }
 .settings .icon-settings {
   display: inline-block;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 9ebfc35ec..16fbebea0 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -267,7 +267,7 @@ var TagsNavigationTagView = Marionette.View.extend({
 
 var SettingsView = Marionette.View.extend({
   className: 'settings'
-, template: _.template('<button class="open"><i class="icon-settings"></i> Settings</button><div class="settings-content"><h3>Import & Export</h3><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade">Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export">Export</button><div class="import-status"></div></div>')
+, template: _.template('<a href="#" class="open"><img src="../../../core/img/actions/settings.svg?v=1" /> Settings</a><div class="settings-content"><h3>Import & Export</h3><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade">Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export">Export</button><div class="import-status"></div></div>')
 , ui: {
     'content': '.settings-content'
   , 'import': '.import'
@@ -282,7 +282,8 @@ var SettingsView = Marionette.View.extend({
   , 'load @ui.iframe': 'importResult'
   , 'click .export': 'exportTrigger'
   }
-, open: function() {
+, open: function(e) {
+    e.preventDefault()
     this.getUI('content').slideToggle()
   }
 , importTrigger: function(e) {

From 48b63aadd80051382b1f9d2e8722be06228a19d1 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 13 Jan 2018 20:03:23 +0100
Subject: [PATCH 025/110] UI: hide add-bookmark form behind nice nav entry

---
 css/bookmarks.css | 38 ++++++++++++++++++++++++++++++--------
 js/bookmarks.js   | 38 +++++++++++++++++++++++++++-----------
 2 files changed, 57 insertions(+), 19 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index fae7c3018..62f7f5e5f 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -35,19 +35,41 @@
 }
 
 .add-bookmark {
-  padding: .1cm;
   border-bottom: 1px solid #ebebeb;
 }
 .add-bookmark input {
-  width: 93%;
-  width: calc(100% - 40px);
+	margin: 0;
+	width: 100%;
+	padding: 12px 40px 12px 12px;
+	box-sizing: border-box;
+	background-color: transparent;
+	border: none;
+	border-bottom: 1px solid #eee;
+	border-radius: 0;
 }
 .add-bookmark button {
-	width: 13px;
-	height: 13px;
-	padding: 7px;
-	box-sizing: content-box;
-	vertical-align: sub;
+	position: absolute;
+	right: 0;
+	top: 0;
+  min-height: 34px;
+	padding: 10px 20px;
+	background-color: transparent;
+	border: none;
+	opacity: .5;
+  font-weight: bold;
+}
+.add-bookmark li.link a span {
+  margin-left: 28px;
+}
+.add-bookmark li.link a span::before {
+	position: absolute;
+	left: 14px;
+	content: '+';
+	font-weight: bold;
+	font-size: 28px;
+}
+.add-bookmark .form {
+  display: none;
 }
 
 .bulk-actions {
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 16fbebea0..f0382cb32 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -157,35 +157,51 @@ var SearchController = Marionette.View.extend({
 })
 
 var AddBookmarkView = Marionette.View.extend({
-  template: _.template('<input type="text" value="" placeholder="Address"/><button title="Add" class="icon-add"></button>')
+  template: _.template('<li class="link"><a href="#"><span>Add Bookmark</span></a></li><li class="form"><input type="text" value="" placeholder="Address..."/><button title="Add" class="icon-add"></button></li>')
 , className: 'add-bookmark'
+, tagName: 'ul'
 , events: {
-    'click button': 'submit'
-  , 'keydown input': 'onKeydown'
+    'click @ui.link': 'activate'
+  , 'click @ui.button': 'submit'
+  , 'keydown @ui.input': 'onKeydown'
+  , 'blur @ui.input': 'deactivate'
   }
 , ui: {
-    'input': 'input'
+    'link': '.link a'
+  , 'linkEntry': '.link'
+  , 'formEntry': '.form'
+  , 'input': 'input'
   , 'button': 'button'
   }
+, activate: function() {
+    this.getUI('linkEntry').hide()
+    this.getUI('formEntry').show()
+    this.getUI('input').focus()
+  }
+, deactivate: function() {
+    this.getUI('linkEntry').show()
+    this.getUI('formEntry').hide()
+    this.getUI('input').val('')
+  }
 , onKeydown: function(e) {
     if (e.which != 13) return
     // Enter
     this.submit()
   }
-, submit: function() {
-    if (this.pending) return
+, submit: function(e) {
     var $input = this.getUI('input')
+    if (this.pending || $input.val() === '') return
     var url = $input.val()
     var bm = new Bookmark({url: url})
     this.setPending(true)
     var that = this
     bm.save(null,{
       success: function() {
-      Backbone.history.navigate('all', {trigger: true})
-      app.bookmarks.fetch()
-      $input.val('')
-      that.setPending(false)
-    }
+				Backbone.history.navigate('all', {trigger: true})
+				app.bookmarks.fetch()
+				that.setPending(false)
+        that.deactivate()
+			}
     , error: function() {
         that.setPending(false)
         that.getUI('button').removeClass('icon-add')

From 60aa47030669b0d9719beab07bb52ce42fad39a9 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 13 Jan 2018 20:25:55 +0100
Subject: [PATCH 026/110] UI: Use official app settings styles

---
 css/bookmarks.css | 27 ---------------------------
 js/bookmarks.js   |  7 ++++---
 2 files changed, 4 insertions(+), 30 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 62f7f5e5f..254d05bd8 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -197,33 +197,6 @@
   width: 1cm;
 }
 
-.settings {
-  width: 98%;
-  position: absolute;
-  bottom: 0;
-  padding: .1cm;
-  margin-bottom: .2cm;
-}
-.settings .open {
-  display: inline-block;
-  width: 98%;
-  font-size: .4cm;
-  padding: .2cm;
-  opacity: .7;
-}
-.settings .open:hover {
-  opacity: 1;
-}
-.settings .open img {
-  vertical-align: text-bottom;
-}
-.settings .icon-settings {
-  display: inline-block;
-  vertical-align: text-bottom;
-}
-.settings .settings-content {
-  display: none;
-}
 .settings .import-form {
   display: inline-block;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index f0382cb32..a4e55738a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -283,16 +283,17 @@ var TagsNavigationTagView = Marionette.View.extend({
 
 var SettingsView = Marionette.View.extend({
   className: 'settings'
-, template: _.template('<a href="#" class="open"><img src="../../../core/img/actions/settings.svg?v=1" /> Settings</a><div class="settings-content"><h3>Import & Export</h3><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade">Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export">Export</button><div class="import-status"></div></div>')
+, id: 'app-settings'
+, template: _.template('<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade">Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export">Export</button><div class="import-status"></div></div>')
 , ui: {
-    'content': '.settings-content'
+    'content': '#app-settings-content'
   , 'import': '.import'
   , 'form': '.import-form'
   , 'iframe': '.upload'
   , 'status': '.import-status'
   }
 , events: {
-    'click .open': 'open'
+    'click .settings-button': 'open'
   , 'click .import-facade': 'importTrigger'
   , 'change @ui.import': 'importSubmit'
   , 'load @ui.iframe': 'importResult'

From b33f676eda30b047d153512b13c3c4d7ea644f28 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 13 Jan 2018 21:25:48 +0100
Subject: [PATCH 027/110] UI: Add quick menu to bookmark cards

---
 css/bookmarks.css | 15 +++++++++++++++
 js/bookmarks.js   | 34 +++++++++++++++++++++++++++++-----
 2 files changed, 44 insertions(+), 5 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 254d05bd8..b6d29b93f 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -134,6 +134,7 @@
 }
 .bookmark-card h1 {
   font-size: .5cm;
+  padding-right: .5cm;
 }
 .bookmark-card h2 {
   margin-top: .1cm;
@@ -143,6 +144,20 @@
 .bookmark-card h2 :link:hover {
   text-decoration: underline;
 }
+.bookmark-card .actions {
+  display: none;
+  position: absolute;
+  top: .5cm;
+  right: .5cm;
+}
+.bookmark-card:hover .actions,
+.bookmark-card.actions-open .actions {
+  display: block;
+}
+.bookmark-card .actions .popovermenu {
+  top: 24px;
+  right: -14px;
+}
 .bookmark-card .tags {
   max-height: 2.5cm;
   overflow: hidden;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index a4e55738a..b5e81707b 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -450,22 +450,30 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><img src="../../../apps/files/css/../img/public.svg?v=1" /><%- new URL(url).host %></a></h2><div class="tags"></div>'),
+  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><img src="../../../apps/files/css/../img/public.svg?v=1" /><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div><div class="tags"></div>'),
   className: "bookmark-card",
   ui: {
-    "checkbox": 'input[type="checkbox"]'
+    'checkbox': 'input[type="checkbox"]'
+  , 'actionsToggle': '.actions .toggle'
+  , 'actionsMenu': '.actions .popovermenu'
   },
   regions: {
     'tags': '.tags'
   },
   events: {
-    "click": "open",
-    "click @ui.checkbox": "select"
+    "click": "open"
+  , "click @ui.checkbox": "select"
+  , 'click @ui.actionsToggle': 'toggleActions'
+  , 'blur @ui.actionsToggle': 'closeActions'
+  , 'click .action-delete': 'actionDelete'
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
     this.listenTo(this.model, "select", this.onSelect);
     this.listenTo(this.model, "unselect", this.onUnselect);
+    
+    this.onDocumentClick = this.closeActions.bind(this)
+    $(window.document).click(this.onDocumentClick)
   }
 , onRender: function() {
     var tags = new Tags(this.model.get('tags').map(function(id) {
@@ -473,7 +481,8 @@ var BookmarkCardView = Marionette.View.extend({
     }))
     this.showChildView('tags', new TagsNavigationView({collection: tags}))
   }
-, open: function() {
+, open: function(e) {
+    if (e.target !== this.el && e.target !== this.$('h1')[0]) return
     Backbone.history.navigate('bookmark/'+this.model.get('id'), {trigger: true})
   }
 , select: function(e) {
@@ -491,6 +500,21 @@ var BookmarkCardView = Marionette.View.extend({
     this.$el.removeClass('active')
     this.render()
   }
+, onDdestroy: function() {
+    $(window.document).unbind('click', this.onDocumentClick)
+  }
+, toggleActions: function(e) {
+    this.getUI('actionsMenu').toggleClass('open')
+    this.$el.toggleClass('actions-open')
+  }
+, closeActions: function(e) {
+    if (e.target === this.getUI('actionsToggle')[0]) return
+    this.getUI('actionsMenu').removeClass('open')
+    this.$el.removeClass('actions-open')
+  }
+, actionDelete: function() {
+    this.model.destroy()
+  }
 })
 
 

From f1a41cc7f0365d11928cd8470842af6c57fdff84 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 13 Jan 2018 21:46:01 +0100
Subject: [PATCH 028/110] UI: Use the official nc icon classes

---
 css/bookmarks.css | 7 ++++++-
 js/bookmarks.js   | 4 ++--
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index b6d29b93f..a281f437d 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -8,6 +8,11 @@
 #app-navigation > ul {
   height: auto;
 }
+.navigation a > span {
+  display: inline-block;
+  vertical-align: text-bottom;
+  margin-right: 12px;
+}
 #app-navigation h3 {
 	padding-top: .7cm;
 	padding-left: 0.1cm;
@@ -63,7 +68,7 @@
 }
 .add-bookmark li.link a span::before {
 	position: absolute;
-	left: 14px;
+	left: 12px;
 	content: '+';
 	font-weight: bold;
 	font-size: 28px;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index b5e81707b..ff4005158 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -233,7 +233,7 @@ var nav_ids = {
 var NavigationView = Marionette.View.extend({
   className: 'navigation'
 , tagName: 'ul'
-, template: _.template('<li data-id="all" class="all"><a href="#"><img src="../../../core/img/places/home.svg?v=1" />All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><img src="../../../apps/files/css/../img/star.svg?v=1" />Favorites</a></li><li data-id="shared" class="shared"><a href="#"><img src="../../../apps/files/css/../img/share.svg?v=1" />Shared</a></li><li data-id="tags" class="tags"><a href="#"><img src="../../../apps/systemtags/css/../img/tag.svg?v=1" />Tags</a></li>')
+, template: _.template('<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li><li data-id="tags" class="tags"><a href="#"><span class="icon-tag"></span>Tags</a></li>')
 , events: {
     'click .all': 'onClick'
   , 'click .favorites': 'onClick'
@@ -284,7 +284,7 @@ var TagsNavigationTagView = Marionette.View.extend({
 var SettingsView = Marionette.View.extend({
   className: 'settings'
 , id: 'app-settings'
-, template: _.template('<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade">Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export">Export</button><div class="import-status"></div></div>')
+, template: _.template('<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade"><span class="icon-upload"></span> Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export"><span class="icon-download"></span> Export</button><div class="import-status"></div></div>')
 , ui: {
     'content': '#app-settings-content'
   , 'import': '.import'

From 749eed132bbb58cbf1234f335f9800fac225d4e1 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 13 Jan 2018 21:54:16 +0100
Subject: [PATCH 029/110] UI: Use external link icon for bm links

---
 css/bookmarks.css | 10 ++++++++++
 js/bookmarks.js   |  4 ++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index a281f437d..733409fbd 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -146,6 +146,11 @@
   font-size: .4cm;
   opacity: .4;
 }
+.bookmark-card h2 :link span {
+  display: inline-block;
+  vertical-align: text-bottom;
+  margin-right: 3px;
+}
 .bookmark-card h2 :link:hover {
   text-decoration: underline;
 }
@@ -200,6 +205,11 @@
 .bookmark-detail h2 :link:hover {
   text-decoration: underline;
 }
+.bookmark-detail h2 :link span {
+  display: inline-block;
+  vertical-align: middle;
+  margin-right: 3px;
+}
 .bookmark-detail .close {
   position: absolute;
   top: .1cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index ff4005158..c88b795f7 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -450,7 +450,7 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><img src="../../../apps/files/css/../img/public.svg?v=1" /><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div><div class="tags"></div>'),
+  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div><div class="tags"></div>'),
   className: "bookmark-card",
   ui: {
     'checkbox': 'input[type="checkbox"]'
@@ -519,7 +519,7 @@ var BookmarkCardView = Marionette.View.extend({
 
 
 var BookmarkDetailView = Marionette.View.extend({
-  template: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><img src="../../../apps/files/css/../img/public.svg?v=1" /><%- new URL(url).host %></a></h2><div class="close icon-close"></div>'),
+  template: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="close icon-close"></div>'),
   className: "bookmark-detail",
   ui: {
     'close': '.close'

From 538214e719edb458f65f19ac7b2de2133eb049c5 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 13 Jan 2018 22:16:10 +0100
Subject: [PATCH 030/110] UI: Add "select all" button to bulk actions

---
 css/bookmarks.css | 22 +++++++++++++++++++---
 js/bookmarks.js   | 13 ++++++++++---
 2 files changed, 29 insertions(+), 6 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 733409fbd..5dfbee1a9 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -84,10 +84,27 @@
   padding: 5px .5cm;
   background: #e9f7ff;
 }
-.bulk-actions .close {
+.bulk-actions .selection-tools {
   position: absolute;
   right: .5cm;
-  top: .5cm;
+  top: 5px;
+}
+.bulk-actions .close {
+  display: inline-block;
+  cursor: pointer;
+  margin: 3px 3px 3px 0; 
+  padding: 6px 12px;
+  width: auto;
+  min-height: 34px;
+  cursor: pointer;
+  box-sizing: border-box;
+}
+.bulk-actions .close span {
+  display: inline-block;
+  vertical-align: text-top;
+}
+button span,
+.bulk-actions .close span {
   cursor: pointer;
 }
 
@@ -221,7 +238,6 @@
 .bookmark-detail .actions {
   float: right;
 }
-.bulk-actions button,
 .bookmark-detail .actions button {
   height: 1cm;
   width: 1cm;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index c88b795f7..16735a67a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -367,7 +367,7 @@ var ContentView = Marionette.View.extend({
   }
 , onRender: function() {
     this.showChildView('mobileNav', new MobileNavView())
-    this.showChildView('bulkActions', new BulkActionsView({collection: this.selected}))
+    this.showChildView('bulkActions', new BulkActionsView({all: this.bookmarks, selected: this.selected}))
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
 , onSelect: function(model) {
@@ -403,13 +403,15 @@ var MobileNavView = Marionette.View.extend({
 
 var BulkActionsView = Marionette.View.extend({
   className: 'bulk-actions'
-, template: _.template('<button class="delete icon-delete"></button><div class="close icon-close"></div>')
+, template: _.template('<button class="delete"><span class="icon-delete"></span></button><div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div>')
 , events: {
     'click .delete': 'delete'
+  , 'click .select-all': 'selectAll'
   , 'click .close': 'abort'
   }
 , initialize: function(opts) {
-    this.selected = opts.collection
+    this.all = opts.all
+    this.selected = opts.selected
     this.listenTo(this.selected, 'remove', this.onReduceSelection)
     this.listenTo(this.selected, 'add', this.onExtendSelection)
   }
@@ -430,6 +432,11 @@ var BulkActionsView = Marionette.View.extend({
       })
     })
   }
+, selectAll: function() {
+    this.all.forEach(function(model) {
+      model.trigger('select', model) 
+    })
+  }
 , abort: function() {
     this.selected.models.slice().forEach(function(model) {
       model.trigger('unselect', model)

From 4d5bddc465f91be613f8b6649138833577aa3fa8 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 14 Jan 2018 00:31:17 +0100
Subject: [PATCH 031/110] UI: Turn detail view into a drawer

instead of an all-page view
---
 css/bookmarks.css | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 5dfbee1a9..f348d881b 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -205,15 +205,24 @@ button span,
 .bookmark-detail {
 	position: absolute;
 	top: 0;
+  right: 0;
   z-index: 2;
-	width: 100%;
+	width: 500px;
 	height: 100%;
   box-sizing: border-box;
   padding: 1cm;
-	background: white; 
+	background: white;
+  border-left: 1px solid #ebebeb;
+}
+@media only screen and (max-width: 768px) {
+  .bookmark-detail {
+    width: auto;
+    left: 0;
+  }
 }
 .bookmark-detail h1 {
   font-size: .8cm;
+  line-height: 1;
 }
 .bookmark-detail h2 {
   margin-top: .3cm;

From fb6aec4cf8bbe78b23542ed0c810171af5b63163 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 19 Jan 2018 22:37:06 +0100
Subject: [PATCH 032/110] Basic editing functionality

---
 css/bookmarks.css | 25 ++++++++++++++++++++++++-
 js/bookmarks.js   | 34 +++++++++++++++++++++++++++++++++-
 2 files changed, 57 insertions(+), 2 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index f348d881b..b7f57bf57 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -223,6 +223,7 @@ button span,
 .bookmark-detail h1 {
   font-size: .8cm;
   line-height: 1;
+  padding-right: 2.3cm;
 }
 .bookmark-detail h2 {
   margin-top: .3cm;
@@ -245,13 +246,35 @@ button span,
   cursor: pointer;
 }
 .bookmark-detail .actions {
-  float: right;
+  position: absolute;
+  right: 1cm;
 }
 .bookmark-detail .actions button {
   height: 1cm;
   width: 1cm;
 }
 
+.bookmark-detail.editing h1 {
+  padding-right: 0;
+}
+.bookmark-detail.editing .actions button {
+  height: auto;
+  width: auto;
+}
+.bookmark-detail .input-url,
+.bookmark-detail .input-title,
+.bookmark-detail .input-desc {
+  width: 100%;
+  font-size: inherit;
+}
+.bookmark-detail .input-url {
+  padding-left: 25px;
+  background-position: 5px;
+}
+.bookmark-detail .input-desc {
+  height: 300px;
+}
+
 .settings .import-form {
   display: inline-block;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 16735a67a..914ac9cc8 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -526,7 +526,14 @@ var BookmarkCardView = Marionette.View.extend({
 
 
 var BookmarkDetailView = Marionette.View.extend({
-  template: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="close icon-close"></div>'),
+  getTemplate: function() {
+    if (this.editing) {
+      return this.templateEditing
+    }
+    return this.templateDefault
+  },
+  templateDefault: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="close icon-close"></div><div class="description"><%- description %></div>'),
+  templateEditing: _.template('<h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="close icon-close"></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>'),
   className: "bookmark-detail",
   ui: {
     'close': '.close'
@@ -537,6 +544,8 @@ var BookmarkDetailView = Marionette.View.extend({
     'click @ui.close': 'close'
   , 'click @ui.edit': 'edit'
   , 'click @ui.delete': 'delete'
+  , 'click .submit': 'submit'
+  , 'click .cancel': 'cancel'
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
@@ -544,6 +553,29 @@ var BookmarkDetailView = Marionette.View.extend({
   close: function() {
     Backbone.history.history.back();
     this.triggerMethod('close')
+  },
+  setEditing: function(isEditing) {
+    if (isEditing) {
+      this.editing = true
+      this.$el.addClass('editing')
+    }else{
+      this.editing = false
+      this.$el.removeClass('editing')
+    }
+    this.render()
+  },
+  edit: function() {
+    this.setEditing(true)
+  }
+, submit: function() {
+    this.model.set('title', this.$('.input-title').val())
+    this.model.set('url', this.$('.input-url').val())
+    this.model.set('description', this.$('.input-desc').val())
+    this.model.save()
+    this.cancel()
+  }
+, cancel: function() {
+    this.setEditing(false)
   }
 })
 

From cd99f998afb6882e21cfc266530604625f4019ec Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 19 Jan 2018 22:53:50 +0100
Subject: [PATCH 033/110] Fix bookmark detail view url access

---
 js/bookmarks.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 914ac9cc8..e72c8dee5 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -378,13 +378,15 @@ var ContentView = Marionette.View.extend({
   }
 , onNavigate: function(path, args) {
     if ('bookmark/:bookmark' === path) {
-      var bm = app.bookmarks.get(args[0])
-      var view = new BookmarkDetailView({model: bm})
-      this.showChildView('bookmarkDetail', view)
       var that = this
+      var bm = new Bookmark({id: args[0]})
+      var view = new BookmarkDetailView({model: bm})
       view.on('close', function() {
         that.detachChildView('bookmarkDetail')
-      })
+      }) 
+      bm.fetch({success: function() {
+        that.showChildView('bookmarkDetail', view)
+      }})
     }
   }
 })
@@ -585,7 +587,7 @@ Backbone.sync = function(method, model, options) {
   _sync(method, model, _.extend({}, options, {
     success: function(json) {
       console.log(json)
-      if (!(model instanceof Tags)) options.success(json.data)
+      if (!(model instanceof Tags)) options.success(json.item || json.data)
       else options.success(json.map(function(name){return {name: name}}))
     }
   }))

From 10ed6bf674e93c2480905ca8c22f1138daa5cb8e Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 20 Jan 2018 16:18:58 +0100
Subject: [PATCH 034/110] Implement tag editing

---
 controller/rest/bookmarkcontroller.php        | 15 +++++----
 .../rest/internalbookmarkcontroller.php       |  5 +--
 css/bookmarks.css                             | 31 ++++++++++++++++--
 js/bookmarks.js                               | 32 +++++++++++++++++--
 4 files changed, 70 insertions(+), 13 deletions(-)

diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index d7959ac3e..704bf10d6 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -251,15 +251,16 @@ public function legacyEditBookmark($id = null, $url = "", $item = array(), $titl
 	 * @param array $item
 	 * @param string $title
 	 * @param bool $is_public Description
-	 * @param null $record_id
+	 * @param int $record_id
 	 * @param string $description
+	 * @param array $tags
 	 * @return JSONResponse
 	 *
 	 * @NoAdminRequired
 	 * @NoCSRFRequired
 	 * @CORS
 	 */
-	public function editBookmark($id = null, $url = null, $item = null, $title = null, $is_public = null, $record_id = null, $description = null) {
+	public function editBookmark($id = null, $url = null, $item = null, $title = null, $is_public = null, $record_id = null, $description = null, $tags = null) {
 
 		if ($record_id !== null) {
 			$id = $record_id;
@@ -274,6 +275,12 @@ public function editBookmark($id = null, $url = null, $item = null, $title = nul
 		];
 		if (is_array($item) && isset($item['tags']) && is_array($item['tags'])) {
 			$newProps['tags'] = $item['tags'];
+		}elseif (is_array($tags)) {
+		    \OCP\Util::writeLog('bookmarks', var_export($tags, true), \OCP\Util::ERROR);
+			$newProps['tags'] = $tags;
+		}else{
+		    \OCP\Util::writeLog('bookmarks', var_export($tags, true), \OCP\Util::ERROR);
+			$newProps['tags'] = [];
 		}
 		foreach ($newProps as $prop => $value) {
 			if(!is_null($value)) {
@@ -287,10 +294,6 @@ public function editBookmark($id = null, $url = null, $item = null, $title = nul
 			return new JSONResponse(array(), Http::STATUS_BAD_REQUEST);
 		}
 
-		if ($bookmark['tags'] === false) {
-			$bookmark['tags'] = [];
-		}
-
 		$id = $this->bookmarks->editBookmark($this->userId, $bookmark['id'], $bookmark['url'], $bookmark['title'], $bookmark['tags'], $bookmark['description'], $bookmark['public']);
 
 		$bm = $this->bookmarks->findUniqueBookmark($id, $this->userId);
diff --git a/controller/rest/internalbookmarkcontroller.php b/controller/rest/internalbookmarkcontroller.php
index f7da78dbe..2005220a3 100644
--- a/controller/rest/internalbookmarkcontroller.php
+++ b/controller/rest/internalbookmarkcontroller.php
@@ -105,12 +105,13 @@ public function legacyEditBookmark($id = null, $url = "", $item = array(), $titl
 	 * @param bool $is_public Description
 	 * @param null $record_id
 	 * @param string $description
+	 * @param array $tags
 	 * @return JSONResponse
 	 *
 	 * @NoAdminRequired
 	 */
-	public function editBookmark($id = null, $url = "", $item = array(), $title = "", $is_public = false, $record_id = null, $description = "") {
-		return $this->publicController->editBookmark($id, $url, $item, $title, $is_public, $record_id, $description);
+	public function editBookmark($id = null, $url = "", $item = array(), $title = "", $is_public = false, $record_id = null, $description = "", $tags = []) {
+		return $this->publicController->editBookmark($id, $url, $item, $title, $is_public, $record_id, $description, $tags);
 	}
 
 	/**
diff --git a/css/bookmarks.css b/css/bookmarks.css
index b7f57bf57..0ed33d439 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -237,7 +237,7 @@ button span,
   vertical-align: middle;
   margin-right: 3px;
 }
-.bookmark-detail .close {
+.bookmark-detail > .close {
   position: absolute;
   top: .1cm;
   right: .1cm;
@@ -253,6 +253,22 @@ button span,
   height: 1cm;
   width: 1cm;
 }
+.bookmark-detail ul.tagit li.tagit-choice,
+.bookmark-detail .tag-nav-item {
+  border-radius: .2cm;
+  border: none;
+  background: #ebebeb;
+  display: inline-block;
+  padding: .1cm .4cm;
+  margin: .1cm;
+}
+.bookmark-detail ul.tagit li.tagit-choice:hover,
+.bookmark-detail .tag-nav-item:hover {
+  background: #e0e0e0;
+}
+.bookmark-detail .description {
+  margin-top: .5cm;
+}
 
 .bookmark-detail.editing h1 {
   padding-right: 0;
@@ -263,14 +279,25 @@ button span,
 }
 .bookmark-detail .input-url,
 .bookmark-detail .input-title,
-.bookmark-detail .input-desc {
+.bookmark-detail .input-desc,
+.bookmark-detail ul.tagit {
   width: 100%;
   font-size: inherit;
+  box-sizing: border-box;
 }
 .bookmark-detail .input-url {
   padding-left: 25px;
   background-position: 5px;
 }
+.bookmark-detail ul.tagit li.tagit-choice {
+  padding: .1cm .5cm .1cm .2cm;
+}
+.bookmark-detail ul.tagit li.tagit-new {
+  float: none;
+  display: inline-block;
+  padding: 0;
+  cursor: auto;
+}
 .bookmark-detail .input-desc {
   height: 300px;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index e72c8dee5..d002cf8be 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -534,11 +534,17 @@ var BookmarkDetailView = Marionette.View.extend({
     }
     return this.templateDefault
   },
-  templateDefault: _.template('<div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="close icon-close"></div><div class="description"><%- description %></div>'),
-  templateEditing: _.template('<h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="close icon-close"></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>'),
+  templateDefault: _.template('<div class="close icon-close"></div><div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="tags"></div><div class="description"><%- description %></div>'),
+  templateEditing: _.template('<div class="close icon-close"></div><h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="tags"><input type="text" /></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>'),
   className: "bookmark-detail",
+  regions: {
+    'tags': {
+      el: '.tags'
+    , replaceElement: true
+    }
+  },
   ui: {
-    'close': '.close'
+    'close': '> .close'
   , 'edit': '.edit'
   , 'delete': '.delete'
   },
@@ -552,6 +558,25 @@ var BookmarkDetailView = Marionette.View.extend({
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
   },
+  onRender: function() {
+    if (this.editing) {
+      this.$('.tags input')
+      .val(this.model.get('tags').join(','))
+      .tagit({
+        allowSpaces: true,
+        availableTags: app.tags.pluck('name'),
+        placeholderText: t('bookmarks', 'Enter tags'),
+        onTagRemoved: function() {},
+        onTagFinishRemoved: function() {},
+        onTagClicked: function(){}
+      })
+    }else{
+      var tags = new Tags(this.model.get('tags').map(function(id) {
+        return new Tag({name: id})
+      }))
+      this.showChildView('tags', new TagsNavigationView({collection: tags}))
+    }
+  },
   close: function() {
     Backbone.history.history.back();
     this.triggerMethod('close')
@@ -572,6 +597,7 @@ var BookmarkDetailView = Marionette.View.extend({
 , submit: function() {
     this.model.set('title', this.$('.input-title').val())
     this.model.set('url', this.$('.input-url').val())
+    this.model.set('tags', this.$('.tags input').tagit("assignedTags"))
     this.model.set('description', this.$('.input-desc').val())
     this.model.save()
     this.cancel()

From 8d48732e2b9bdf94c699fd6bca99628679776b30 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 20 Jan 2018 22:33:26 +0100
Subject: [PATCH 035/110] Refactor detail view management

remove coupling to router
wire up card.edit to detail view
---
 js/bookmarks.js | 48 ++++++++++++++++++++++++++----------------------
 1 file changed, 26 insertions(+), 22 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index d002cf8be..5dde44040 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -60,8 +60,6 @@ var Router = Marionette.AppRouter.extend({
         data: {item: {tags: [decodeURIComponent(tag)]}}
       })
     }
-  , showBookmark: function() {
-    }
   , search: function(query) {
       this.app.bookmarks.fetch({
         data: {search: decodeURIComponent(query).split(' ')}
@@ -74,7 +72,6 @@ var Router = Marionette.AppRouter.extend({
   , 'shared': 'showSharedBookmarks'
   , 'tags': 'showTags'
   , 'tag/:tag': 'showTag'
-  , 'bookmark/:bookmark': 'showBookmark'
   , 'search/:query': 'search'
   }
 , initialize: function(options) {
@@ -363,7 +360,9 @@ var ContentView = Marionette.View.extend({
     this.selected = new Bookmarks
     this.listenTo(this.bookmarks, 'select', this.onSelect)
     this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this) // Turn this into a request!
+    this.listenTo(Radio.channel('details'), 'show', this.onShowDetails)
+    this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails)
+    this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails)
   }
 , onRender: function() {
     this.showChildView('mobileNav', new MobileNavView())
@@ -376,18 +375,17 @@ var ContentView = Marionette.View.extend({
 , onUnselect: function(model) {
     this.selected.remove(model)
   }
-, onNavigate: function(path, args) {
-    if ('bookmark/:bookmark' === path) {
-      var that = this
-      var bm = new Bookmark({id: args[0]})
-      var view = new BookmarkDetailView({model: bm})
-      view.on('close', function() {
-        that.detachChildView('bookmarkDetail')
-      }) 
-      bm.fetch({success: function() {
-        that.showChildView('bookmarkDetail', view)
-      }})
-    }
+, onShowDetails: function(model) {
+    var that = this
+    var view = new BookmarkDetailView({model: model})
+    this.showChildView('bookmarkDetail', view)
+  }
+, onEditDetails: function(model) {
+    this.onShowDetails(model)
+    this.getRegion('bookmarkDetail').currentView.setEditing(true)
+  }
+, onCloseDetails: function() {
+    this.detachChildView('bookmarkDetail')
   }
 })
 
@@ -474,6 +472,7 @@ var BookmarkCardView = Marionette.View.extend({
   , "click @ui.checkbox": "select"
   , 'click @ui.actionsToggle': 'toggleActions'
   , 'blur @ui.actionsToggle': 'closeActions'
+  , 'click .action-edit': 'actionEdit'
   , 'click .action-delete': 'actionDelete'
   },
   initialize: function() {
@@ -491,8 +490,8 @@ var BookmarkCardView = Marionette.View.extend({
     this.showChildView('tags', new TagsNavigationView({collection: tags}))
   }
 , open: function(e) {
-    if (e.target !== this.el && e.target !== this.$('h1')[0]) return
-    Backbone.history.navigate('bookmark/'+this.model.get('id'), {trigger: true})
+    if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return
+    Radio.channel('details').trigger('show', this.model)
   }
 , select: function(e) {
     e.stopPropagation()
@@ -509,7 +508,7 @@ var BookmarkCardView = Marionette.View.extend({
     this.$el.removeClass('active')
     this.render()
   }
-, onDdestroy: function() {
+, onDestroy: function() {
     $(window.document).unbind('click', this.onDocumentClick)
   }
 , toggleActions: function(e) {
@@ -524,6 +523,9 @@ var BookmarkCardView = Marionette.View.extend({
 , actionDelete: function() {
     this.model.destroy()
   }
+, actionEdit: function() {
+    Radio.channel('details').trigger('edit', this.model)
+  }
 })
 
 
@@ -555,7 +557,7 @@ var BookmarkDetailView = Marionette.View.extend({
   , 'click .submit': 'submit'
   , 'click .cancel': 'cancel'
   },
-  initialize: function() {
+  initialize: function(opts) {
     this.listenTo(this.model, "change", this.render);
   },
   onRender: function() {
@@ -578,8 +580,7 @@ var BookmarkDetailView = Marionette.View.extend({
     }
   },
   close: function() {
-    Backbone.history.history.back();
-    this.triggerMethod('close')
+    Radio.channel('details').trigger('close')
   },
   setEditing: function(isEditing) {
     if (isEditing) {
@@ -605,6 +606,9 @@ var BookmarkDetailView = Marionette.View.extend({
 , cancel: function() {
     this.setEditing(false)
   }
+, onDestroy: function() {
+    this.close() 
+  }
 })
 
 

From cab8999cc0c70fc5e1ddaaeb9da697f71399aa4c Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 20 Jan 2018 22:46:15 +0100
Subject: [PATCH 036/110] Fix: directly load 'all bookmarks' view at index

redirect '' to 'all'
---
 js/bookmarks.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 5dde44040..545b38b20 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -45,7 +45,12 @@ var App = Marionette.Application.extend({
 
 var Router = Marionette.AppRouter.extend({
   controller: {
-    showAllBookmarks: function() {
+    index: function() {
+      setTimeout(function(){
+        Backbone.history.navigate('all', {trigger: true})
+      }, 1)
+    }
+  , showAllBookmarks: function() {
       this.app.bookmarks.fetch()
     }
   , showFavoriteBookmarks: function() {
@@ -67,7 +72,8 @@ var Router = Marionette.AppRouter.extend({
     }
   }
 , appRoutes: {
-    'all': 'showAllBookmarks'
+    '': 'index'
+  , 'all': 'showAllBookmarks'
   , 'favorites': 'showFavoriteBookmarks'
   , 'shared': 'showSharedBookmarks'
   , 'tags': 'showTags'

From b970d8fb277a9a54c49b866f89ba8b86d6cf2768 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 21 Jan 2018 20:11:26 +0100
Subject: [PATCH 037/110] Implement advanced tag filtering

---
 css/bookmarks.css |  44 +++++++++++++
 js/bookmarks.js   | 157 +++++++++++++++++++++++++++++++++++++++++-----
 2 files changed, 185 insertions(+), 16 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 0ed33d439..1573cca0e 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -302,6 +302,50 @@ button span,
   height: 300px;
 }
 
+.tags-management {
+  float: left;
+  width: 250px;
+}
+@media only screen and (max-width: 768px) {
+  .tags-management {
+    width: auto;
+    float: none;
+    border-bottom: 2px solid #bbb;
+  }
+}
+.tags-management > ul:first-child {
+  border-bottom: 2px solid #ebebeb;
+}
+.tags-management .tag-man-item {
+  overflow: auto;
+  border-bottom: 1px solid #ebebeb;
+  padding: .3cm;
+  cursor: pointer;
+}
+.tags-management .tag-man-item:hover {
+  background: #fcfcfc;
+}
+.tags-management .tag-man-item.selected {
+  background: #f3f3f3;
+}
+.tags-management .tag-man-item > a {
+  padding-left: .2cm;
+}
+.tags-management .tag-man-item .actions {
+  float: right;
+}
+.tags-management .tag-man-item .actions .action {
+  display: inline-block;
+}
+.tags-management .tag-man-item .action button {
+	border: none;
+	background-color: transparent;
+	opacity: .45;
+}
+.tags-management .tag-man-item .action button:hover {
+  opacity: 1;
+}
+
 .settings .import-form {
   display: inline-block;
 }
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 545b38b20..e841838f2 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -50,42 +50,49 @@ var Router = Marionette.AppRouter.extend({
         Backbone.history.navigate('all', {trigger: true})
       }, 1)
     }
-  , showAllBookmarks: function() {
+  , all: function() {
       this.app.bookmarks.fetch()
+      Radio.channel('nav').trigger('navigate', 'all')
     }
-  , showFavoriteBookmarks: function() {
+  , favorites: function() {
+      Radio.channel('nav').trigger('navigate', 'favorites')
     }
-  , showSharedBookmarks: function() {
+  , shared: function() {
       this.app.bookmarks.fetch()
+      Radio.channel('nav').trigger('navigate', 'shared')
     }
-  , showTags: function() {
+  , tags: function(tagString) {
+      var tags = tagString? tagString.split(',').map(decodeURIComponent) : [] 
+      this.app.bookmarks.fetch({
+        data: {item: {tags: tags}}
+      })
+      Radio.channel('nav').trigger('navigate', 'tags', tags)
     }
-  , showTag: function(tag) {
+  , tag: function(tag) {
       this.app.bookmarks.fetch({
         data: {item: {tags: [decodeURIComponent(tag)]}}
       })
+      Radio.channel('nav').trigger('navigate', 'tag', tag)
     }
   , search: function(query) {
       this.app.bookmarks.fetch({
         data: {search: decodeURIComponent(query).split(' ')}
       })
+      Radio.channel('nav').trigger('navigate', 'search', query)
     }
   }
 , appRoutes: {
     '': 'index'
-  , 'all': 'showAllBookmarks'
-  , 'favorites': 'showFavoriteBookmarks'
-  , 'shared': 'showSharedBookmarks'
-  , 'tags': 'showTags'
-  , 'tag/:tag': 'showTag'
+  , 'all': 'all'
+  , 'favorites': 'favorites'
+  , 'shared': 'shared'
+  , 'tags(/*tags)': 'tags'
+  , 'tag/:tag': 'tag'
   , 'search/:query': 'search'
   }
 , initialize: function(options) {
     this.controller.app = options.app
   }
-, onRoute: function(name, path, args) {
-    Radio.channel('nav').trigger('navigate', path, args)
-  }
 })
 
 var AppView = Marionette.View.extend({
@@ -276,9 +283,9 @@ var TagsNavigationTagView = Marionette.View.extend({
     e.stopPropagation() // for when tags are displayed in BookmarkCardView, we don't want that view to get the click, too
     Backbone.history.navigate('tag/' + encodeURIComponent(this.model.get('name')), {trigger: true});
   }
-, onNavigate: function(category, args) {
+, onNavigate: function(category, tag) {
     this.$el.removeClass('active')
-    if (category && category.indexOf('tag/') === 0 && decodeURIComponent(args[0]) === this.model.get('name')) {
+    if (category === 'tag' && decodeURIComponent(tag) === this.model.get('name')) {
       this.$el.addClass('active')
     }
   }
@@ -342,12 +349,16 @@ var SettingsView = Marionette.View.extend({
 })
 
 var ContentView = Marionette.View.extend({
-  template: _.template('<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+  template: _.template('<div id="mobile-nav-slot"></div><div id="tags-management-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
     'mobileNav': {
       el: '#mobile-nav-slot'
     , replaceElement: true
     }
+  , 'tagsManagement': {
+      el: '#tags-management-slot'
+    , replaceElement: true
+    }
   , 'bulkActions': {
       el: '#bulk-actions-slot'
     , replaceElement: true
@@ -366,6 +377,7 @@ var ContentView = Marionette.View.extend({
     this.selected = new Bookmarks
     this.listenTo(this.bookmarks, 'select', this.onSelect)
     this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
     this.listenTo(Radio.channel('details'), 'show', this.onShowDetails)
     this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails)
     this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails)
@@ -375,6 +387,14 @@ var ContentView = Marionette.View.extend({
     this.showChildView('bulkActions', new BulkActionsView({all: this.bookmarks, selected: this.selected}))
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
+, onNavigate: function(route, tags) {
+    if (route.indexOf('tags') !== 0) {
+      this.detachChildView('tagsManagement')
+      return
+    }
+    if (this.getRegion('tagsManagement').hasView()) return
+    this.showChildView('tagsManagement', new TagsManagementView({tags: app.tags, selected: tags})) 
+  }
 , onSelect: function(model) {
     this.selected.add(model)
   }
@@ -453,6 +473,9 @@ var BulkActionsView = Marionette.View.extend({
 
 var BookmarksView = Marionette.CollectionView.extend({
   className: 'bookmarks'
+, regions: {
+
+  }
 , childView: function() {return BookmarkCardView}
 , emptyView: function() {return EmptyBookmarksView}
 })
@@ -618,6 +641,108 @@ var BookmarkDetailView = Marionette.View.extend({
 })
 
 
+
+var TagsManagementView = Marionette.View.extend({
+  template: _.template('<div id="selected-slot"></div><div id="unselected-slot"></div>')
+, className: 'tags-management'
+, regions: {
+    'selected': {
+      el: '#selected-slot'
+    , replaceElement: true
+    }
+  , 'unselected': {
+      el: '#unselected-slot'
+    , replaceElement: true
+    }
+  }
+, initialize: function(options) {
+    var that = this
+    this.tags = options.tags
+    
+    this.unselected = new Tags
+    this.unselected.comparator = 'name'
+    this.unselected.add(this.tags.models)
+    
+    this.selected = new Tags
+    this.selected.comparator = 'name'
+    options.selected.forEach(function(tagName) {
+      var tag = that.unselected.findWhere({name: tagName})
+      if (!tag) return
+
+      that.unselected.remove(tag)
+      that.selected.add(tag)
+    })
+    
+    this.tags.on('add', function(model) {
+      if (~options.selected.indexOf(model.get('name'))) {
+        that.selected.add(model)
+        return
+      }
+      that.unselected.add(model)
+    })
+    console.log(options.selected, this.tags, this.selected, this.unselected)
+
+    this.listenTo(this.tags, 'select', this.onSelect)
+    this.listenTo(this.tags, 'unselect', this.onUnselect)
+
+  }
+, onRender: function() {
+    this.showChildView('selected', new TagsManagementCollectionView({collection: this.selected, selected: true}))
+    this.showChildView('unselected', new TagsManagementCollectionView({collection: this.unselected}))
+  }
+, onSelect: function(model) {
+    this.selected.add(model)
+    this.unselected.remove(model)
+    this.triggerRoute()
+  }
+, onUnselect: function(model) {
+    this.selected.remove(model)
+    this.unselected.add(model)
+    this.triggerRoute()
+  }
+, triggerRoute: function() {
+    Backbone.history.navigate('tags/'+this.selected.pluck('name').map(encodeURIComponent).join(','), {trigger: true})
+  }
+})
+
+var TagsManagementCollectionView = Marionette.CollectionView.extend({
+  tagName: 'ul'
+, initialize: function(opts) {
+    this.selected = opts.selected
+  }
+, childView: function() {return TagsManagementTagView}
+, childViewOptions: function(model, i) {
+    return {
+      selected: this.selected
+    }
+  }
+})
+
+var TagsManagementTagView = Marionette.View.extend({
+  className: 'tag-man-item'
+, tagName: 'li'
+, template: _.template('<input type="checkbox" class="checkbox" name="selected" /><label for="selected" title="Select this"></label><a href="#"><%- name %></a><div class="actions"><ul><li class="action"><button class="edit icon-edit"></button></li><li class="action"><button class="delete icon-delete"></button></li></ul></div>')
+, events: {
+    'click': 'open'
+  }
+, initialize: function(opts) {
+    this.selected = opts.selected
+  }
+, onRender: function() {
+    this.$('.checkbox').prop('checked', this.selected)
+    if (this.selected) {
+      this.$el.addClass('selected')
+    }
+  }
+, open: function(e) {
+    e.preventDefault()
+    e.stopPropagation()
+    if (this.selected) this.model.trigger('unselect', this.model)
+    else this.model.trigger('select', this.model)
+  }
+})
+
+
 var _sync = Backbone.sync
 Backbone.sync = function(method, model, options) {
   _sync(method, model, _.extend({}, options, {

From 28b03190fc26b0ef3c3579863c28159cf5a9fb02 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 21 Jan 2018 22:25:01 +0100
Subject: [PATCH 038/110] Implement tag deletion

add more REST-y routes so that backbone can use its default routes
set up event "pipes" so that bookmark updates trigger reload of tags and vice versa
---
 appinfo/routes.php                         |  2 +
 controller/rest/internaltagscontroller.php |  5 +-
 controller/rest/tagscontroller.php         |  6 +-
 js/bookmarks.js                            | 85 ++++++++++++++++------
 4 files changed, 73 insertions(+), 25 deletions(-)

diff --git a/appinfo/routes.php b/appinfo/routes.php
index 985c28dce..6184ddf09 100644
--- a/appinfo/routes.php
+++ b/appinfo/routes.php
@@ -36,6 +36,8 @@
 	array('name' => 'internal_tags#full_tags', 'url' => '/tag', 'verb' => 'GET'),
 	array('name' => 'internal_tags#rename_tag', 'url' => '/tag', 'verb' => 'POST'),
 	array('name' => 'internal_tags#delete_tag', 'url' => '/tag', 'verb' => 'DELETE'),
+	array('name' => 'internal_tags#rename_tag', 'url' => '/tag/{old_name}', 'verb' => 'POST'),
+	array('name' => 'internal_tags#delete_tag', 'url' => '/tag/{old_name}', 'verb' => 'DELETE'),
 	// Public REST API
 	array('name' => 'bookmark#get_bookmarks', 'url' => '/public/rest/v2/bookmark', 'verb' => 'GET'),
 	array('name' => 'bookmark#new_bookmark', 'url' => '/public/rest/v2/bookmark', 'verb' => 'POST'),
diff --git a/controller/rest/internaltagscontroller.php b/controller/rest/internaltagscontroller.php
index 56663b3d8..42c3451f5 100644
--- a/controller/rest/internaltagscontroller.php
+++ b/controller/rest/internaltagscontroller.php
@@ -28,12 +28,13 @@ public function deleteTag($old_name = "") {
 	/**
 	 * @param string $old_name
 	 * @param string $new_name
+	 * @param string $name
 	 * @return JSONResponse
 	 *
 	 * @NoAdminRequired
 	 */
-	public function renameTag($old_name = "", $new_name = "") {
-		return $this->publicController->renameTag($old_name, $new_name);
+	public function renameTag($old_name = "", $new_name = "", $name = '') {
+		return $this->publicController->renameTag($old_name, $new_name, $name);
 	}
 
 	/**
diff --git a/controller/rest/tagscontroller.php b/controller/rest/tagscontroller.php
index 98b579d10..45d5ca12d 100644
--- a/controller/rest/tagscontroller.php
+++ b/controller/rest/tagscontroller.php
@@ -42,13 +42,17 @@ public function deleteTag($old_name = "") {
 	/**
 	 * @param string $old_name
 	 * @param string $new_name
+	 * @param string $name
 	 * @return JSONResponse
 	 *
 	 * @NoAdminRequired
 	 * @NoCSRFRequired
 	 * @CORS
 	 */
-	public function renameTag($old_name = "", $new_name = "") {
+	public function renameTag($old_name = "", $new_name = "", $name = '') {
+    if ($new_name === '') {
+      $new_name = $name;
+    }
 
 		if ($old_name == "" || $new_name == "") {
 			return new JSONResponse(array(), Http::STATUS_BAD_REQUEST);
diff --git a/js/bookmarks.js b/js/bookmarks.js
index e841838f2..1d34e7611 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -1,13 +1,7 @@
 var Radio = Backbone.Radio
 
 var Bookmark = Backbone.Model.extend({
-  defaults: {
-    /*url: '',
-    title: '',
-    description: '',*/
-    tags: Tags
-  }
-, urlRoot: 'bookmark'
+  urlRoot: 'bookmark'
 })
 
 var Bookmarks = Backbone.Collection.extend({
@@ -16,10 +10,8 @@ var Bookmarks = Backbone.Collection.extend({
 })
 
 var Tag = Backbone.Model.extend({
-  defaults: {
-    name: ''
-  }
-, url: 'tag'
+  idAttribute: 'name'
+, urlRoot: 'tag'
 })
 
 var Tags = Backbone.Collection.extend({
@@ -31,9 +23,18 @@ var Tags = Backbone.Collection.extend({
 var App = Marionette.Application.extend({
   region: '#content'
 , onBeforeStart: function() {
+    var that = this
     this.bookmarks = new Bookmarks
     this.tags = new Tags
-    this.tags.fetch()
+    this.tags.fetch({
+      success: function() {
+        // we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
+        that.listenTo(that.tags, 'sync', that.onTagChanged)
+        that.listenTo(that.tags, 'add', that.onTagChanged)
+        that.listenTo(that.tags, 'remove', that.onTagChanged)
+      }
+    })
+    this.listenTo(this.bookmarks, 'sync', this.onBookmarkTagsChanged)
 
     this.router = new Router({app: this})
   }
@@ -41,6 +42,28 @@ var App = Marionette.Application.extend({
     this.showView(new AppView({bookmarks: this.bookmarks, tags: this.tags}));
     Backbone.history.start();
   }
+, onTagChanged: function(tag) {
+    var that = this
+    if (this.bookmarkChanged) return this.bookmarkChanged = false // set to true by onBookmarkTagsChanged
+    this.tagChanged = true
+
+    // we need to wait 'till the tag change has been acknowledged by the server
+    setTimeout(function() {
+      that.bookmarks
+      .filter(function(bm) {
+        return ~bm.get('tags').indexOf(tag.get('name'))
+      })
+      .forEach(function(bm) {
+        bm.fetch()
+      })
+    }, 100)
+  }
+, onBookmarkTagsChanged: function() {
+    var that = this
+    if (this.tagChanged === true) return this.tagChanged = false
+    this.bokmarkChanged = true
+    that.tags.fetch() // we listen to 'sync', so we can fetch immediately
+  }
 });
 
 var Router = Marionette.AppRouter.extend({
@@ -508,13 +531,14 @@ var BookmarkCardView = Marionette.View.extend({
     this.listenTo(this.model, "change", this.render);
     this.listenTo(this.model, "select", this.onSelect);
     this.listenTo(this.model, "unselect", this.onUnselect);
+    this.listenTo(app.tags, 'sync', this.render)
     
     this.onDocumentClick = this.closeActions.bind(this)
     $(window.document).click(this.onDocumentClick)
   }
 , onRender: function() {
     var tags = new Tags(this.model.get('tags').map(function(id) {
-      return new Tag({name: id})
+      return app.tags.findWhere({name: id})
     }))
     this.showChildView('tags', new TagsNavigationView({collection: tags}))
   }
@@ -588,6 +612,7 @@ var BookmarkDetailView = Marionette.View.extend({
   },
   initialize: function(opts) {
     this.listenTo(this.model, "change", this.render);
+    this.listenTo(app.tags, 'sync', this.render)
   },
   onRender: function() {
     if (this.editing) {
@@ -603,7 +628,7 @@ var BookmarkDetailView = Marionette.View.extend({
       })
     }else{
       var tags = new Tags(this.model.get('tags').map(function(id) {
-        return new Tag({name: id})
+        return app.tags.findWhere({name: id})
       }))
       this.showChildView('tags', new TagsNavigationView({collection: tags}))
     }
@@ -625,12 +650,17 @@ var BookmarkDetailView = Marionette.View.extend({
     this.setEditing(true)
   }
 , submit: function() {
-    this.model.set('title', this.$('.input-title').val())
-    this.model.set('url', this.$('.input-url').val())
-    this.model.set('tags', this.$('.tags input').tagit("assignedTags"))
-    this.model.set('description', this.$('.input-desc').val())
-    this.model.save()
-    this.cancel()
+    var that = this
+    this.model.set({
+      'title': this.$('.input-title').val()
+    , 'url': this.$('.input-url').val()
+    , 'tags': this.$('.tags input').tagit("assignedTags")
+    , 'description': this.$('.input-desc').val()
+    })
+    this.model.save({wait: true})
+    this.model.once('sync', function() {
+      that.cancel()
+    })
   }
 , cancel: function() {
     this.setEditing(false)
@@ -680,7 +710,6 @@ var TagsManagementView = Marionette.View.extend({
       }
       that.unselected.add(model)
     })
-    console.log(options.selected, this.tags, this.selected, this.unselected)
 
     this.listenTo(this.tags, 'select', this.onSelect)
     this.listenTo(this.tags, 'unselect', this.onUnselect)
@@ -724,6 +753,7 @@ var TagsManagementTagView = Marionette.View.extend({
 , template: _.template('<input type="checkbox" class="checkbox" name="selected" /><label for="selected" title="Select this"></label><a href="#"><%- name %></a><div class="actions"><ul><li class="action"><button class="edit icon-edit"></button></li><li class="action"><button class="delete icon-delete"></button></li></ul></div>')
 , events: {
     'click': 'open'
+  , 'click .action .delete': 'actionDelete'
   }
 , initialize: function(opts) {
     this.selected = opts.selected
@@ -736,10 +766,18 @@ var TagsManagementTagView = Marionette.View.extend({
   }
 , open: function(e) {
     e.preventDefault()
-    e.stopPropagation()
+    if (e && e.target !== this.el
+      && e.target !== this.$('.checkbox')[0]
+      && e.target !== this.$('a')[0]
+    ) {
+      return
+    }
     if (this.selected) this.model.trigger('unselect', this.model)
     else this.model.trigger('select', this.model)
   }
+, actionDelete: function() {
+    this.model.destroy()
+  }
 })
 
 
@@ -751,6 +789,9 @@ Backbone.sync = function(method, model, options) {
       if (!(model instanceof Tags)) options.success(json.item || json.data)
       else options.success(json.map(function(name){return {name: name}}))
     }
+  , error: function() {
+      console.log(arguments)
+    }
   }))
 }
 

From e38a12008d78fd8ab0aa669b379ca2a599a1b7c3 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 21 Jan 2018 22:46:43 +0100
Subject: [PATCH 039/110] Remove debug log output

---
 controller/rest/bookmarkcontroller.php | 2 --
 1 file changed, 2 deletions(-)

diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index 704bf10d6..d0c2ca447 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -276,10 +276,8 @@ public function editBookmark($id = null, $url = null, $item = null, $title = nul
 		if (is_array($item) && isset($item['tags']) && is_array($item['tags'])) {
 			$newProps['tags'] = $item['tags'];
 		}elseif (is_array($tags)) {
-		    \OCP\Util::writeLog('bookmarks', var_export($tags, true), \OCP\Util::ERROR);
 			$newProps['tags'] = $tags;
 		}else{
-		    \OCP\Util::writeLog('bookmarks', var_export($tags, true), \OCP\Util::ERROR);
 			$newProps['tags'] = [];
 		}
 		foreach ($newProps as $prop => $value) {

From 41775637f32c246340bdcb03ea1dddf9be41e36c Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 23 Jan 2018 23:25:31 +0100
Subject: [PATCH 040/110] Move tag management and filtering to sidebar

---
 appinfo/routes.php |   1 +
 css/bookmarks.css  |  40 ++++++--
 js/bookmarks.js    | 228 +++++++++++++++++++++++++--------------------
 3 files changed, 162 insertions(+), 107 deletions(-)

diff --git a/appinfo/routes.php b/appinfo/routes.php
index 6184ddf09..7bff7a36b 100644
--- a/appinfo/routes.php
+++ b/appinfo/routes.php
@@ -37,6 +37,7 @@
 	array('name' => 'internal_tags#rename_tag', 'url' => '/tag', 'verb' => 'POST'),
 	array('name' => 'internal_tags#delete_tag', 'url' => '/tag', 'verb' => 'DELETE'),
 	array('name' => 'internal_tags#rename_tag', 'url' => '/tag/{old_name}', 'verb' => 'POST'),
+	array('name' => 'internal_tags#rename_tag', 'url' => '/tag/{old_name}', 'verb' => 'PUT'),
 	array('name' => 'internal_tags#delete_tag', 'url' => '/tag/{old_name}', 'verb' => 'DELETE'),
 	// Public REST API
 	array('name' => 'bookmark#get_bookmarks', 'url' => '/public/rest/v2/bookmark', 'verb' => 'GET'),
diff --git a/css/bookmarks.css b/css/bookmarks.css
index 1573cca0e..939e48576 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -305,6 +305,7 @@ button span,
 .tags-management {
   float: left;
   width: 250px;
+  overflow: visible !important;
 }
 @media only screen and (max-width: 768px) {
   .tags-management {
@@ -313,19 +314,14 @@ button span,
     border-bottom: 2px solid #bbb;
   }
 }
-.tags-management > ul:first-child {
+.tags-management > ul:first-child > li:last-child {
   border-bottom: 2px solid #ebebeb;
 }
 .tags-management .tag-man-item {
-  overflow: auto;
-  border-bottom: 1px solid #ebebeb;
-  padding: .3cm;
+  /*padding: .3cm;*/
   cursor: pointer;
 }
-.tags-management .tag-man-item:hover {
-  background: #fcfcfc;
-}
-.tags-management .tag-man-item.selected {
+.tags-management .tag-man-item.active {
   background: #f3f3f3;
 }
 .tags-management .tag-man-item > a {
@@ -334,17 +330,45 @@ button span,
 .tags-management .tag-man-item .actions {
   float: right;
 }
+
+.tags-management .tag-man-item .actions ul {
+  display: block !important;
+}
 .tags-management .tag-man-item .actions .action {
   display: inline-block;
+  width: auto !important;
 }
 .tags-management .tag-man-item .action button {
 	border: none;
 	background-color: transparent;
 	opacity: .45;
+  padding: 3px 12px;
 }
 .tags-management .tag-man-item .action button:hover {
   opacity: 1;
 }
+.tags-management .tag-man-item input[type="text"] {
+  min-height: .7cm;
+  padding: 0 .1cm;
+  margin: 0;
+  width: 70%;
+}
+/* make checkbox look like an icon */
+.tags-management .tag-man-item .menu-filter-add span:first-child,
+.tags-management .tag-man-item .menu-filter-remove span:first-child {
+  padding: 0 10px;
+}
+
+/* display 'remove from filter' when selected, and 'add to ...' when unselected*/
+.tags-management .tag-man-item.active .menu-filter-add {
+  display: none;
+}
+.tags-management .tag-man-item .menu-filter-remove {
+  display: none;
+}
+.tags-management .tag-man-item.active .menu-filter-remove {
+  display: block;
+}
 
 .settings .import-form {
   display: inline-block;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 1d34e7611..657211b1a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -44,6 +44,7 @@ var App = Marionette.Application.extend({
   }
 , onTagChanged: function(tag) {
     var that = this
+    if (!(tag instanceof Tag)) return // we can also receive 'sync' events from the collection, which we don't want here
     if (this.bookmarkChanged) return this.bookmarkChanged = false // set to true by onBookmarkTagsChanged
     this.tagChanged = true
 
@@ -51,7 +52,9 @@ var App = Marionette.Application.extend({
     setTimeout(function() {
       that.bookmarks
       .filter(function(bm) {
-        return ~bm.get('tags').indexOf(tag.get('name'))
+        return bm.get('tags').some(function(t) {
+          return t === tag.get('name') || t === tag.previous('name')
+        })
       })
       .forEach(function(bm) {
         bm.fetch()
@@ -119,7 +122,7 @@ var Router = Marionette.AppRouter.extend({
 })
 
 var AppView = Marionette.View.extend({
-  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Favorite tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
+  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
 , regions: {
     'addBookmarks':  {
       el: '#add-bookmark-slot'
@@ -146,12 +149,16 @@ var AppView = Marionette.View.extend({
     this.bookmarks = options.bookmarks
     this.tags = options.tags
     this.searchController = new SearchController
+    
+    $(window.document).click(function(e) {
+      Radio.channel('documentClicked').trigger('click', e)
+    })
   }
 , onRender: function() {
     this.showChildView('addBookmarks', new AddBookmarkView());
     this.showChildView('navigation', new NavigationView);
     this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
-    this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
+    this.showChildView('tags', new TagsManagementView({collection: this.tags}))
     this.showChildView('settings', new SettingsView())
   }
 })
@@ -261,17 +268,15 @@ var nav_ids = {
   all: true
 , favorites: true
 , shared: true
-, tags: true
 }
 var NavigationView = Marionette.View.extend({
   className: 'navigation'
 , tagName: 'ul'
-, template: _.template('<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li><li data-id="tags" class="tags"><a href="#"><span class="icon-tag"></span>Tags</a></li>')
+, template: _.template('<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li>')
 , events: {
     'click .all': 'onClick'
   , 'click .favorites': 'onClick'
   , 'click .shared': 'onClick'
-  , 'click .tags': 'onClick'
   }
 , initialize: function() {
     this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
@@ -303,12 +308,11 @@ var TagsNavigationTagView = Marionette.View.extend({
   }
 , open: function(e) {
     e.preventDefault()
-    e.stopPropagation() // for when tags are displayed in BookmarkCardView, we don't want that view to get the click, too
-    Backbone.history.navigate('tag/' + encodeURIComponent(this.model.get('name')), {trigger: true});
+    Backbone.history.navigate('tags/' + encodeURIComponent(this.model.get('name')), {trigger: true});
   }
-, onNavigate: function(category, tag) {
+, onNavigate: function(category, tags) {
     this.$el.removeClass('active')
-    if (category === 'tag' && decodeURIComponent(tag) === this.model.get('name')) {
+    if (category === 'tags' && ~tags.indexOf(this.model.get('name'))) {
       this.$el.addClass('active')
     }
   }
@@ -372,16 +376,12 @@ var SettingsView = Marionette.View.extend({
 })
 
 var ContentView = Marionette.View.extend({
-  template: _.template('<div id="mobile-nav-slot"></div><div id="tags-management-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+  template: _.template('<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
 , regions: {
     'mobileNav': {
       el: '#mobile-nav-slot'
     , replaceElement: true
     }
-  , 'tagsManagement': {
-      el: '#tags-management-slot'
-    , replaceElement: true
-    }
   , 'bulkActions': {
       el: '#bulk-actions-slot'
     , replaceElement: true
@@ -410,14 +410,6 @@ var ContentView = Marionette.View.extend({
     this.showChildView('bulkActions', new BulkActionsView({all: this.bookmarks, selected: this.selected}))
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
-, onNavigate: function(route, tags) {
-    if (route.indexOf('tags') !== 0) {
-      this.detachChildView('tagsManagement')
-      return
-    }
-    if (this.getRegion('tagsManagement').hasView()) return
-    this.showChildView('tagsManagement', new TagsManagementView({tags: app.tags, selected: tags})) 
-  }
 , onSelect: function(model) {
     this.selected.add(model)
   }
@@ -532,9 +524,7 @@ var BookmarkCardView = Marionette.View.extend({
     this.listenTo(this.model, "select", this.onSelect);
     this.listenTo(this.model, "unselect", this.onUnselect);
     this.listenTo(app.tags, 'sync', this.render)
-    
-    this.onDocumentClick = this.closeActions.bind(this)
-    $(window.document).click(this.onDocumentClick)
+    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
   }
 , onRender: function() {
     var tags = new Tags(this.model.get('tags').map(function(id) {
@@ -561,9 +551,6 @@ var BookmarkCardView = Marionette.View.extend({
     this.$el.removeClass('active')
     this.render()
   }
-, onDestroy: function() {
-    $(window.document).unbind('click', this.onDocumentClick)
-  }
 , toggleActions: function(e) {
     this.getUI('actionsMenu').toggleClass('open')
     this.$el.toggleClass('actions-open')
@@ -672,119 +659,160 @@ var BookmarkDetailView = Marionette.View.extend({
 
 
 
-var TagsManagementView = Marionette.View.extend({
-  template: _.template('<div id="selected-slot"></div><div id="unselected-slot"></div>')
+var TagsManagementView = Marionette.CollectionView.extend({
+  childView: function() {return TagsManagementTagView}
+, tagName: 'ul'
 , className: 'tags-management'
-, regions: {
-    'selected': {
-      el: '#selected-slot'
-    , replaceElement: true
-    }
-  , 'unselected': {
-      el: '#unselected-slot'
-    , replaceElement: true
-    }
-  }
 , initialize: function(options) {
     var that = this
-    this.tags = options.tags
     
-    this.unselected = new Tags
-    this.unselected.comparator = 'name'
-    this.unselected.add(this.tags.models)
+    this.collection.comparator = 'name'
     
     this.selected = new Tags
     this.selected.comparator = 'name'
-    options.selected.forEach(function(tagName) {
-      var tag = that.unselected.findWhere({name: tagName})
-      if (!tag) return
-
-      that.unselected.remove(tag)
-      that.selected.add(tag)
-    })
     
-    this.tags.on('add', function(model) {
-      if (~options.selected.indexOf(model.get('name'))) {
-        that.selected.add(model)
-        return
-      }
-      that.unselected.add(model)
+    this.listenTo(this.collection, 'select', this.onSelect)
+    this.listenTo(this.collection, 'unselect', this.onUnselect)
+    this.listenTo(this.collection, 'add', this.onAdd)
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
+  }
+, onNavigate: function(category, tags) {
+    // reset selection (needs slice, since we pull the models out from under the loop otherwise)
+    this.selected.slice().forEach(function(t) {
+      t.trigger('unselect', t, true)
     })
+    if (category !== 'tags') {
+      this.lastRouteTags = [] // for the below hack
+      return
+    }
 
-    this.listenTo(this.tags, 'select', this.onSelect)
-    this.listenTo(this.tags, 'unselect', this.onUnselect)
+    var that = this
+    // select all tags passed by router
+    tags.forEach(function(tagName) {
+      var tag = that.collection.findWhere({name: tagName})
+      if (!tag) return
+
+      tag.trigger('select', tag, true)
+    })
 
+    // hack!
+    // this is for when the route is triggered before the tags are loaded
+    this.lastRouteTags = tags
   }
-, onRender: function() {
-    this.showChildView('selected', new TagsManagementCollectionView({collection: this.selected, selected: true}))
-    this.showChildView('unselected', new TagsManagementCollectionView({collection: this.unselected}))
+, onAdd: function(model) {
+    if (~this.lastRouteTags.indexOf(model.get('name'))) {
+      // wait for the tag view to render, so it can receive the event
+      setTimeout(function() {
+        model.trigger('select', model, true)
+      }, 1)
+      return
+    }
   }
-, onSelect: function(model) {
+, onSelect: function(model, silentRoute) {
     this.selected.add(model)
-    this.unselected.remove(model)
-    this.triggerRoute()
+    if (!silentRoute) this.triggerRoute()
   }
-, onUnselect: function(model) {
+, onUnselect: function(model, silentRoute) {
     this.selected.remove(model)
-    this.unselected.add(model)
-    this.triggerRoute()
+    if (!silentRoute) this.triggerRoute()
   }
 , triggerRoute: function() {
     Backbone.history.navigate('tags/'+this.selected.pluck('name').map(encodeURIComponent).join(','), {trigger: true})
   }
 })
 
-var TagsManagementCollectionView = Marionette.CollectionView.extend({
-  tagName: 'ul'
-, initialize: function(opts) {
-    this.selected = opts.selected
-  }
-, childView: function() {return TagsManagementTagView}
-, childViewOptions: function(model, i) {
-    return {
-      selected: this.selected
-    }
-  }
-})
-
 var TagsManagementTagView = Marionette.View.extend({
   className: 'tag-man-item'
 , tagName: 'li'
-, template: _.template('<input type="checkbox" class="checkbox" name="selected" /><label for="selected" title="Select this"></label><a href="#"><%- name %></a><div class="actions"><ul><li class="action"><button class="edit icon-edit"></button></li><li class="action"><button class="delete icon-delete"></button></li></ul></div>')
+, getTemplate: function() {
+    if (this.editing) {
+      return this.templateEditing
+    }
+    return this.templateDefault
+  }
+, templateDefault: _.template('<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>')
+, templateEditing: _.template('<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>')
+, ui: {
+    'actionsMenu': '.popovermenu'
+  , 'actionsToggle': '.app-navigation-entry-utils-menu-button'
+  }
 , events: {
-    'click': 'open'
-  , 'click .action .delete': 'actionDelete'
+    'click': 'selectSimple'
+  , 'click @ui.actionsToggle': 'toggleActions'
+  , 'click .menu-filter-add': 'actionSelect'
+  , 'click .menu-filter-remove': 'actionUnselect'
+  , 'click .menu-delete': 'actionDelete'
+  , 'click .menu-edit': 'actionEdit'
+  , 'click .action .submit': 'actionSubmit'
+  , 'click .action .cancel': 'actionCancel'
   }
-, initialize: function(opts) {
-    this.selected = opts.selected
+, initialize: function() {
+    this.listenTo(this.model, 'select', this.onSelect)
+    this.listenTo(this.model, 'unselect', this.onUnselect)
+    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions)   
   }
 , onRender: function() {
-    this.$('.checkbox').prop('checked', this.selected)
     if (this.selected) {
-      this.$el.addClass('selected')
+      this.$el.addClass('active')
+    }else{
+      this.$el.removeClass('active')
+    }
+    if (this.editing) {
+      this.$('input').focus()
     }
   }
-, open: function(e) {
+, onSelect: function() {
+    this.selected = true
+    this.render()
+  }
+, onUnselect: function() {
+    this.selected = false
+    this.render()
+  }
+, selectSimple: function(e) {
     e.preventDefault()
-    if (e && e.target !== this.el
-      && e.target !== this.$('.checkbox')[0]
-      && e.target !== this.$('a')[0]
-    ) {
+    if (e && !~[ this.el, this.$('a')[0], this.$('span')[0] ].indexOf(e.target)) {
       return
     }
-    if (this.selected) this.model.trigger('unselect', this.model)
-    else this.model.trigger('select', this.model)
+    if (this.editing) return
+    Backbone.history.navigate('tags/'+encodeURIComponent(this.model.get('name')), {trigger: true})
+  }
+, toggleActions: function() {
+    this.getUI('actionsMenu').toggleClass('open')
+  }
+, closeActions: function(e) {
+    if (this.editing || $.contains(this.getUI('actionsToggle')[0], e.target)) return
+    this.getUI('actionsMenu').removeClass('open')
+  }
+, actionSelect: function(e) {
+    this.model.trigger('select', this.model)
+  }
+, actionUnselect: function(e) {
+    this.model.trigger('unselect', this.model)
   }
 , actionDelete: function() {
     this.model.destroy()
   }
+, actionEdit: function() {
+    this.editing = true
+    this.render()
+  }
+, actionSubmit: function() {
+    this.model.set('name', this.$('input').val())
+    this.model.save()
+    this.actionCancel()
+  }
+, actionCancel: function() {
+    this.editing = false
+    this.render()
+  }
 })
 
 
 var _sync = Backbone.sync
 Backbone.sync = function(method, model, options) {
-  _sync(method, model, _.extend({}, options, {
-    success: function(json) {
+  var overrideOptions = {
+   success: function(json) {
       console.log(json)
       if (!(model instanceof Tags)) options.success(json.item || json.data)
       else options.success(json.map(function(name){return {name: name}}))
@@ -792,7 +820,9 @@ Backbone.sync = function(method, model, options) {
   , error: function() {
       console.log(arguments)
     }
-  }))
+  }
+  if (method === 'update' && model instanceof Tag) overrideOptions.url = model.urlRoot+'/'+model.previous('name') 
+  _sync(method, model, _.extend({}, options, overrideOptions))
 }
 
 // init

From 961484498916c5be6a425bf5fa01f6f32df99801 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 00:50:42 +0100
Subject: [PATCH 041/110] Implement image previews

---
 appinfo/app.php                               |  4 +
 appinfo/application.php                       |  8 +-
 appinfo/database.xml                          |  7 ++
 appinfo/routes.php                            |  1 +
 controller/lib/bookmarks.php                  | 96 ++++++-------------
 controller/rest/bookmarkcontroller.php        | 56 ++++++-----
 .../rest/internalbookmarkcontroller.php       | 64 ++++++++++++-
 css/bookmarks.css                             | 19 +++-
 js/bookmarks.js                               |  3 +-
 9 files changed, 158 insertions(+), 100 deletions(-)

diff --git a/appinfo/app.php b/appinfo/app.php
index 4a06b1faa..fe5dbbf58 100644
--- a/appinfo/app.php
+++ b/appinfo/app.php
@@ -13,6 +13,10 @@
 
 namespace OCA\Bookmarks\AppInfo;
 
+if ((@include_once __DIR__ . '/../vendor/autoload.php')===false) {
+  throw new Exception('Cannot include autoload. Did you run install dependencies using composer?');
+}
+
 $navigationEntry = function () {
 	return [
 		'id' => 'bookmarks',
diff --git a/appinfo/application.php b/appinfo/application.php
index 1253eb8f1..5bc3d91a1 100644
--- a/appinfo/application.php
+++ b/appinfo/application.php
@@ -14,7 +14,9 @@
 namespace OCA\Bookmarks\AppInfo;
 
 use OCA\Bookmarks\Controller\Lib\Bookmarks;
+use OCA\Bookmarks\Controller\Lib\ImageService;
 use \OCP\AppFramework\App;
+use OCP\AppFramework\Utility\ITimeFactory;
 use \OCP\IContainer;
 use \OCA\Bookmarks\Controller\WebViewController;
 use OCA\Bookmarks\Controller\Rest\TagsController;
@@ -70,6 +72,7 @@ public function __construct(array $urlParams = array()) {
 			/** @var IContainer $c */
 			$user = $c->query('ServerContainer')->getUserSession()->getUser();
 			$uid = is_null($user) ? null : $user->getUID();
+			
 			return new InternalBookmarkController(
 				$c->query('AppName'),
 				$c->query('Request'),
@@ -77,7 +80,9 @@ public function __construct(array $urlParams = array()) {
 				$c->query('ServerContainer')->getDatabaseConnection(),
 				$c->query('ServerContainer')->getL10NFactory()->get('bookmarks'),
 				$c->query('ServerContainer')->query(Bookmarks::class),
-				$c->query('ServerContainer')->getUserManager()
+				$c->query('ServerContainer')->getUserManager(),
+				$c->query('ServerContainer')->query(ImageService::class),
+				$c->query('ServerContainer')->query(ITimeFactory::class)
 			);
 		});
 
@@ -117,6 +122,7 @@ public function __construct(array $urlParams = array()) {
 				$c->query('ServerContainer')->getUserManager()
 			);
 		});
+		
 	}
 
 }
diff --git a/appinfo/database.xml b/appinfo/database.xml
index 004cd33e3..860be21d8 100644
--- a/appinfo/database.xml
+++ b/appinfo/database.xml
@@ -73,6 +73,13 @@
 				<unsigned>true</unsigned>
 				<length>4</length>
 			</field>
+			<field>
+				<name>image</name>
+				<type>text</type>
+				<default></default>
+				<notnull>false</notnull>
+				<length>4096</length>
+			</field>
 		</declaration>
 	</table>
 	
diff --git a/appinfo/routes.php b/appinfo/routes.php
index 7bff7a36b..0825cefbc 100644
--- a/appinfo/routes.php
+++ b/appinfo/routes.php
@@ -33,6 +33,7 @@
 	array('name' => 'internal_bookmark#edit_bookmark', 'url' => '/bookmark/{id}', 'verb' => 'PUT'),
 	array('name' => 'internal_bookmark#get_single_bookmark', 'url' => '/bookmark/{id}', 'verb' => 'GET'),
 	array('name' => 'internal_bookmark#delete_bookmark', 'url' => '/bookmark/{id}', 'verb' => 'DELETE'),
+	array('name' => 'internal_bookmark#get_bookmark_image', 'url' => '/bookmark/{id}/image', 'verb' => 'GET'),
 	array('name' => 'internal_tags#full_tags', 'url' => '/tag', 'verb' => 'GET'),
 	array('name' => 'internal_tags#rename_tag', 'url' => '/tag', 'verb' => 'POST'),
 	array('name' => 'internal_tags#delete_tag', 'url' => '/tag', 'verb' => 'DELETE'),
diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index 4c4776bf1..4d517bf4e 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -24,16 +24,15 @@
 
 namespace OCA\Bookmarks\Controller\Lib;
 
-use GuzzleHttp\ClientInterface;
-use GuzzleHttp\Exception\ClientException;
 use OCP\DB\QueryBuilder\IQueryBuilder;
-use OCP\Http\Client\IClientService;
 use OCP\IConfig;
 use OCP\IDBConnection;
 use OCP\IL10N;
 use OCP\ILogger;
 use Symfony\Component\EventDispatcher\EventDispatcherInterface;
 use Symfony\Component\EventDispatcher\GenericEvent;
+use Dusterio\LinkPreview\Client as LinkPreview;
+use Dusterio\LinkPreview\Exceptions\ConnectionErrorException;
 
 class Bookmarks {
 
@@ -46,9 +45,6 @@ class Bookmarks {
 	/** @var IL10N */
 	private $l;
 
-	/** @var IClientService */
-	private $httpClientService;
-
 	/** @var EventDispatcherInterface */
 	private $eventDispatcher;
 
@@ -59,14 +55,12 @@ public function __construct(
 		IDBConnection $db,
 		IConfig $config,
 		IL10N $l,
-		IClientService $httpClientService,
 		EventDispatcherInterface $eventDispatcher,
 		ILogger $logger
 	) {
 		$this->db = $db;
 		$this->config = $config;
 		$this->l = $l;
-		$this->httpClientService = $httpClientService;
 		$this->eventDispatcher = $eventDispatcher;
 		$this->logger = $logger;
 	}
@@ -471,9 +465,10 @@ public function editBookmark($userid, $id, $url, $title, $tags = [], $descriptio
 	 * @param array $tags Simple array of tags to qualify the bookmark (different tags are taken from values)
 	 * @param string $description A longer description about the bookmark
 	 * @param boolean $isPublic True if the bookmark is publishable to not registered users
+	 * @param string $image URL to a visual representation of the bookmarked site
 	 * @return int The id of the bookmark created
 	 */
-	public function addBookmark($userid, $url, $title, $tags = array(), $description = '', $isPublic = false) {
+	public function addBookmark($userid, $url, $title, $tags = array(), $description = '', $isPublic = false, $image = null) {
 		$public = $isPublic ? 1 : 0;
 		$urlWithoutPrefix = trim(substr($url, strpos($url, "://") + 3)); // Removes everything from the url before the "://" pattern (included)
 		if($urlWithoutPrefix === '') {
@@ -512,6 +507,10 @@ public function addBookmark($userid, $url, $title, $tags = array(), $description
 			if (trim($description) != '') { // Do we replace the old description
 				$qb->set('description', $qb->createParameter('description'));
 			}
+			
+			if (isset($image)) { // Do we replace the old description
+				$qb->set('image', $qb->createParameter('image'));
+			}
 
 			$qb
 				->where($qb->expr()->like('url', $qb->createParameter('compareUrl'))) // Find url in the db independantly from its protocol
@@ -522,6 +521,7 @@ public function addBookmark($userid, $url, $title, $tags = array(), $description
 					'compareUrl' => '%' . $this->db->escapeLikeParameter($decodedUrlNoPrefix),
 					'title' => $title,
 					'description' => $description,
+					'image' => $image,
 				]);
 				$qb->execute();
 
@@ -542,7 +542,8 @@ public function addBookmark($userid, $url, $title, $tags = array(), $description
 					'public' => $qb->createParameter('public'),
 					'added' => $qb->createFunction('UNIX_TIMESTAMP()'),
 					'lastmodified' => $qb->createFunction('UNIX_TIMESTAMP()'),
-					'description' => $qb->createParameter('description')
+					'description' => $qb->createParameter('description'),
+					'image' => $qb->createParameter('image'),
 				))
 				->where($qb->expr()->eq('user_id', $qb->createParameter('user_id')));
 			$qb->setParameters(array(
@@ -550,7 +551,8 @@ public function addBookmark($userid, $url, $title, $tags = array(), $description
 				'url' => $decodedUrl,
 				'title' => htmlspecialchars_decode($title), // XXX: Should the title update above also decode it first?
 				'public' => $public,
-				'description' => $description
+				'description' => $description,
+				'image' => $image,
 			));	
 
 			$qb->execute();
@@ -663,69 +665,27 @@ public function importFile($user, $file) {
 	 * @return array Metadata for url;
 	 * @throws \Exception|ClientException
 	 */
-	public function getURLMetadata($url, $tryHarder = false) {
-		$metadata = ['url' => $url];
-		$page = $contentType = '';
-		
+	public function getURLMetadata($url) {
+		$data = ['url' => $url];
+
+		// Use LinkPreview to get the meta data
+		$previewClient = new LinkPreview($url);
+		$previewClient->getParser('general')->setMinimumImageDimension(0,0);
 		try {
-			$client = $this->httpClientService->newClient();
-			$options = [];
-			if($tryHarder) {
-				$curlOptions = [ 'curl' =>
-					[ CURLOPT_HTTPHEADER => ['Expect:'] ]
-				];
-				if(version_compare(ClientInterface::VERSION, '6') === -1) {
-					$options = ['config' => $curlOptions];
-				} else {
-					$options = $curlOptions;
-				}
-			}
-			$request = $client->get($url, $options);
-			$page = $request->getBody();
-			$contentType = $request->getHeader('Content-Type');
-		} catch (ClientException $e) {
-			$errorCode = $e->getCode();
-			if (!($errorCode >= 401 && $errorCode <= 403)) {
-				// whitelist Unauthorized, Forbidden and Paid pages
-				throw $e;
-			}
-		} catch (\GuzzleHttp\Exception\RequestException $e) {
-			if($tryHarder) {
-				throw $e;
-			}
-			return $this->getURLMetadata($url, true);
-		} catch (\Exception $e) {
-			throw $e;
+			$preview = $previewClient->getPreview('general');
+		} catch (\Dusterio\LinkPreview\Exceptions\ConnectionErrorException $e) {
+			return $data;
 		}
 		
-		//Check for encoding of site.
-		//If not UTF-8 convert it.
-		$encoding = array();
-		preg_match('#.+?/.+?;\\s?charset\\s?=\\s?(.+)#i', $contentType, $encoding);
-		if(empty($encoding)) {
-			preg_match('/charset="?(.*?)["|;]/i', $page, $encoding);
+		$data = $preview->toArray();
+		if (!isset($data)) {
+			return ['url' => $url];
 		}
 
-		if (isset($encoding[1])) {
-			$decodeFrom = strtoupper($encoding[1]);
-		} else {
-			$decodeFrom = 'UTF-8';
-		}
-
-		if ($page) {
-
-			if ($decodeFrom != 'UTF-8') {
-				$page = iconv($decodeFrom, "UTF-8", $page);
-			}
+		$data['url'] = (string) $previewClient->getUrl();
+		$data['image'] = $data['cover'];
 
-			preg_match("/<title>(.*)<\/title>/si", $page, $match);
-			
-			if (isset($match[1])) {
-				$metadata['title'] = html_entity_decode($match[1]);
-			}
-		}
-		
-		return $metadata;
+		return $data;
 	}
 
 	/**
diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index d0c2ca447..3e828e750 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -183,31 +183,41 @@ public function getBookmarks(
 	 */
 	public function newBookmark($url = "", $item = array(), $title = "", $is_public = false, $description = "") {
 		$title = trim($title);
-		if ($title === '') {
-			$title = $url;
-			// allow only http(s) and (s)ftp
-			$protocols = '/^(https?|s?ftp)\:\/\//i';
-			try {
-				if (preg_match($protocols, $url)) {
-					$data = $this->bookmarks->getURLMetadata($url);
-					$title = isset($data['title']) ? $data['title'] : $title;
-				} else {
-					// if no allowed protocol is given, evaluate https and https
-					foreach(['https://', 'http://'] as $protocol) {
-						$testUrl = $protocol . $url;
-						$data = $this->bookmarks->getURLMetadata($testUrl);
-						if(isset($data['title'])) {
-							$title = $data['title'];
-							$url   = $testUrl;
-							break;
-						}
+		$image = null;
+
+		// do some meta tag inspection of the link...
+
+		// allow only http(s) and (s)ftp
+		$protocols = '/^(https?|s?ftp)\:\/\//i';
+		try {
+			if (preg_match($protocols, $url)) {
+				$data = $this->bookmarks->getURLMetadata($url);
+			} else {
+				// if no allowed protocol is given, evaluate https and https
+				foreach(['https://', 'http://'] as $protocol) {
+					$testUrl = $protocol . $url;
+					$data = $this->bookmarks->getURLMetadata($testUrl);
+					if(isset($data['title'])) {
+						break;
 					}
 				}
-			} catch (\Exception $e) {
-				// only because the server cannot reach a certain URL it does not
-				// mean the user's browser cannot.
-				\OC::$server->getLogger()->logException($e, ['app' => 'bookmarks']);
 			}
+		} catch (\Exception $e) {
+			// only because the server cannot reach a certain URL it does not
+			// mean the user's browser cannot.
+			\OC::$server->getLogger()->logException($e, ['app' => 'bookmarks']);
+		}
+		if (isset($data['url'])) {
+			$url   = $data['url'];
+		}
+		if ((!isset($title) || trim($title) === '')) {
+			$title =  isset($data['title'])? $data['title'] : $url;
+		}
+		if (isset($data['description']) && (!isset($description) || trim($description) === '')) {
+		  $description = $data['description'];
+		}
+		if (isset($data['image'])) {
+		  $image = $data['image'];
 		}
 
 		// Check if it is a valid URL (after adding http(s) prefix)
@@ -218,7 +228,7 @@ public function newBookmark($url = "", $item = array(), $title = "", $is_public
 
 		$tags = isset($item['tags']) ? $item['tags'] : array();
 
-		$id = $this->bookmarks->addBookmark($this->userId, $url, $title, $tags, $description, $is_public);
+		$id = $this->bookmarks->addBookmark($this->userId, $url, $title, $tags, $description, $is_public, $image);
 		$bm = $this->bookmarks->findUniqueBookmark($id, $this->userId);
 		return new JSONResponse(array('item' => $bm, 'status' => 'success'));
 	}
diff --git a/controller/rest/internalbookmarkcontroller.php b/controller/rest/internalbookmarkcontroller.php
index 2005220a3..6254f783c 100644
--- a/controller/rest/internalbookmarkcontroller.php
+++ b/controller/rest/internalbookmarkcontroller.php
@@ -14,18 +14,45 @@
 use OCP\IL10N;
 use \OCP\IRequest;
 use \OCP\AppFramework\ApiController;
+use \OCP\AppFramework\Http\DataDisplayResponse;
+use \OCP\AppFramework\Http\NotFoundResponse;
 use \OCP\AppFramework\Http\JSONResponse;
 use \OCP\AppFramework\Http;
 use \OC\User\Manager;
 use \OCA\Bookmarks\Controller\Lib\Bookmarks;
+use \OCA\Bookmarks\Controller\Lib\ImageService;
+use DateInterval;
+use DateTime;
+use OCP\AppFramework\Utility\ITimeFactory;
 
 class InternalBookmarkController extends ApiController {
 
+	const IMAGES_CACHE_TTL = 7 * 24 * 60 * 60;
+
 	private $publicController;
+	
+	private $userId;
+	private $libBookmarks;
+	private $imageService;
+	private $timeFactory;
 
-	public function __construct($appName, IRequest $request, $userId, IDBConnection $db, IL10N $l10n, Bookmarks $bookmarks, Manager $userManager) {
+	public function __construct(
+		$appName,
+		IRequest $request,
+		$userId,
+		IDBConnection $db,
+		IL10N $l10n,
+		Bookmarks $bookmarks,
+		Manager $userManager,
+		ImageService $imageService,
+		ITimeFactory $timeFactory
+	) {
 		parent::__construct($appName, $request);
-	  $this->publicController = new BookmarkController($appName, $request, $userId, $db, $l10n, $bookmarks, $userManager);
+		$this->publicController = new BookmarkController($appName, $request, $userId, $db, $l10n, $bookmarks, $userManager);
+		$this->userId = $userId;
+		$this->libBookmarks = $bookmarks;
+		$this->imageService = $imageService;
+		$this->timeFactory = $timeFactory;
 	}
 
 	/**
@@ -161,4 +188,37 @@ public function importBookmark() {
 	public function exportBookmark() {
 		return $this->publicController->exportBookmark();
 	}
+
+	/**
+	 *
+	 * @param int $id The id of the bookmark whose image shoudl be returned
+	 * @return \OCP\AppFramework\Http\Reponse
+	 *
+	 * @NoAdminRequired
+	 * @NoCSRFRequired
+	 */
+	public function getBookmarkImage($id) {
+		$bookmark = $this->libBookmarks->findUniqueBookmark($id, $this->userId);
+		if (!isset($bookmark) || !isset($bookmark['image']) || $bookmark['image'] === '') {	
+			return new NotFoundResponse();
+		}
+
+		$image = $this->imageService->getImage($bookmark['image']);
+		if (!isset($image)) {	
+			return new NotFoundResponse();
+		}
+		
+		$response = new DataDisplayResponse($image['data']);
+		$response->addHeader('Content-Type', $image['contentType']);	
+		
+		$response->cacheFor(self::IMAGES_CACHE_TTL);
+		 
+		$expires = new DateTime();
+		$expires->setTimestamp($this->timeFactory->getTime());
+		$expires->add(new DateInterval('PT' . self::IMAGES_CACHE_TTL . 'S'));
+		$response->addHeader('Expires', $expires->format(DateTime::RFC1123));
+		$response->addHeader('Pragma', 'cache');
+		
+		return $response;
+	}
 }
diff --git a/css/bookmarks.css b/css/bookmarks.css
index 939e48576..12ada10a7 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -124,24 +124,33 @@ button span,
   flex-grow: 1;
   width: 6cm;
   height: 6cm;
+  margin: .4cm;
   padding: .5cm;
-  border: 1px solid #ebebeb;
+  border: 1px solid #ddd;
   overflow: hidden;
-  background: white;
+  background-color: rgb(210, 210, 210);
+  background-size: cover;
 }
 .bookmark-card,
 .bookmark-card * {
   cursor: pointer;
 }
-.bookmark-card:hover {
-  background: #fcfcfc;
-}
 .bookmark-card.active,
 .bookmark-card.active:hover {
   transform: none;
   border: 1px solid #0082c9;
   box-shadow: inset 0 0 10px #0082c9;
 }
+.bookmark-card .panel {
+  position: absolute;
+  top: 0; left: 0; right: 0;
+  padding: .5cm .5cm .1cm .6cm;
+  background: rgba(255, 255, 255, .8);
+  box-shadow: #aaa 0 0 5px;
+}
+.bookmark-card:hover .panel {
+  background: rgba(255, 255, 255, .90); 
+}
 .bookmark-card input[type="checkbox"] {
   display: none;
   position: absolute;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 657211b1a..e8971eb0a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -501,7 +501,7 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<input type="checkbox"/><h1><img src="<%- "//:"+new URL(url).host+"/favicon.ico" %>"/><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div><div class="tags"></div>'),
+  template: _.template('<div class="panel"><input type="checkbox"/><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>'),
   className: "bookmark-card",
   ui: {
     'checkbox': 'input[type="checkbox"]'
@@ -527,6 +527,7 @@ var BookmarkCardView = Marionette.View.extend({
     this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
   }
 , onRender: function() {
+	this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)')
     var tags = new Tags(this.model.get('tags').map(function(id) {
       return app.tags.findWhere({name: id})
     }))

From ec10f2d08522e67cc013d52c53ed25a58415173e Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 01:27:06 +0100
Subject: [PATCH 042/110] UI: Remove paging when fetching bookmarks

---
 js/bookmarks.js | 22 +++++++++-------------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index e8971eb0a..fea0b2cfe 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -77,32 +77,30 @@ var Router = Marionette.AppRouter.extend({
       }, 1)
     }
   , all: function() {
-      this.app.bookmarks.fetch()
+      this.app.bookmarks.fetch({ 
+        data: {page: -1}
+	  })
       Radio.channel('nav').trigger('navigate', 'all')
     }
   , favorites: function() {
       Radio.channel('nav').trigger('navigate', 'favorites')
     }
   , shared: function() {
-      this.app.bookmarks.fetch()
+      this.app.bookmarks.fetch({ 
+        data: {page: -1}
+	  })
       Radio.channel('nav').trigger('navigate', 'shared')
     }
   , tags: function(tagString) {
       var tags = tagString? tagString.split(',').map(decodeURIComponent) : [] 
       this.app.bookmarks.fetch({
-        data: {item: {tags: tags}}
+        data: {item: {tags: tags}, page: -1}
       })
       Radio.channel('nav').trigger('navigate', 'tags', tags)
     }
-  , tag: function(tag) {
-      this.app.bookmarks.fetch({
-        data: {item: {tags: [decodeURIComponent(tag)]}}
-      })
-      Radio.channel('nav').trigger('navigate', 'tag', tag)
-    }
   , search: function(query) {
       this.app.bookmarks.fetch({
-        data: {search: decodeURIComponent(query).split(' ')}
+        data: {search: decodeURIComponent(query).split(' '), page: -1}
       })
       Radio.channel('nav').trigger('navigate', 'search', query)
     }
@@ -113,7 +111,6 @@ var Router = Marionette.AppRouter.extend({
   , 'favorites': 'favorites'
   , 'shared': 'shared'
   , 'tags(/*tags)': 'tags'
-  , 'tag/:tag': 'tag'
   , 'search/:query': 'search'
   }
 , initialize: function(options) {
@@ -238,9 +235,8 @@ var AddBookmarkView = Marionette.View.extend({
     bm.save(null,{
       success: function() {
 				Backbone.history.navigate('all', {trigger: true})
-				app.bookmarks.fetch()
 				that.setPending(false)
-        that.deactivate()
+				that.deactivate()
 			}
     , error: function() {
         that.setPending(false)

From 2535851814867906382df3555bba1f1c64f428c9 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 02:11:15 +0100
Subject: [PATCH 043/110] Some style fixes

- make detail view fixed
- bring back blend mode for bm card background images
- bulk actions: make them sticky
---
 css/bookmarks.css | 47 ++++++++++++++++++++++++++++++++++++-----------
 js/bookmarks.js   |  8 ++++++--
 2 files changed, 42 insertions(+), 13 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 12ada10a7..f7d396743 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -79,15 +79,35 @@
 
 .bulk-actions {
   display: none;
-  position: relative;
+  position: fixed;
+  top: 45px;
+  left: 250px;
+  right: 0;
   border-bottom: 1px solid #ebebeb;
-  padding: 5px .5cm;
+  padding: .3cm .5cm;
   background: #e9f7ff;
+  z-index: 3;
+}
+.bulk-actions + * {
+  transition: margin-top .5s ease;
+}
+.bulk-actions.active {
+  display: block;
+}
+.bulk-actions.active + * {
+  margin-top: 1.5cm;
+}
+@media only screen and (max-width: 768px) {
+  .bulk-actions {
+    position: relative;
+	top: 0; right: 0; bottom: 0; left: 0;
+  }
+  .bulk-actions.active + * {
+    margin-top: 0;
+  }
 }
 .bulk-actions .selection-tools {
-  position: absolute;
-  right: .5cm;
-  top: 5px;
+  float: right;
 }
 .bulk-actions .close {
   display: inline-block;
@@ -117,6 +137,7 @@ button span,
   display: flex;
   flex-wrap: wrap;
   overflow: hidden;
+  padding-right: .6cm;
 }
 .bookmark-card {
   position: relative;
@@ -124,17 +145,21 @@ button span,
   flex-grow: 1;
   width: 6cm;
   height: 6cm;
-  margin: .4cm;
+  margin: .6cm 0 0 .6cm;
   padding: .5cm;
   border: 1px solid #ddd;
   overflow: hidden;
   background-color: rgb(210, 210, 210);
   background-size: cover;
+  background-blend-mode: overlay;
 }
 .bookmark-card,
 .bookmark-card * {
   cursor: pointer;
 }
+.bookmark-card:hover {
+  background-blend-mode: multiply;
+}
 .bookmark-card.active,
 .bookmark-card.active:hover {
   transform: none;
@@ -212,15 +237,15 @@ button span,
 }
 
 .bookmark-detail {
-	position: absolute;
-	top: 0;
+  position: fixed;
+  top: 45px;
   right: 0;
   z-index: 2;
-	width: 500px;
-	height: 100%;
+  width: 500px;
+  height: 100%;
   box-sizing: border-box;
   padding: 1cm;
-	background: white;
+  background: white;
   border-left: 1px solid #ebebeb;
 }
 @media only screen and (max-width: 768px) {
diff --git a/js/bookmarks.js b/js/bookmarks.js
index fea0b2cfe..35ebff83c 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -453,10 +453,14 @@ var BulkActionsView = Marionette.View.extend({
     this.listenTo(this.selected, 'add', this.onExtendSelection)
   }
 , onReduceSelection: function() {
-    if (this.selected.length == 0) this.$el.slideUp()
+    if (this.selected.length == 0) {
+	  this.$el.removeClass('active')
+	}
   }
 , onExtendSelection: function() {
-    if (this.selected.length == 1) this.$el.slideDown()
+    if (this.selected.length == 1) {
+	  this.$el.addClass('active')
+	}
   }
 , delete: function() {
     var that = this

From e262d749602ff7d106de93a6415cd6f963510c7a Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 14:49:36 +0100
Subject: [PATCH 044/110] Add count to tag list

---
 controller/rest/internaltagscontroller.php |  5 +++--
 controller/rest/tagscontroller.php         |  9 +++++++--
 js/bookmarks.js                            | 14 +++++++-------
 3 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/controller/rest/internaltagscontroller.php b/controller/rest/internaltagscontroller.php
index 42c3451f5..a0bef37dc 100644
--- a/controller/rest/internaltagscontroller.php
+++ b/controller/rest/internaltagscontroller.php
@@ -38,10 +38,11 @@ public function renameTag($old_name = "", $new_name = "", $name = '') {
 	}
 
 	/**
+	 * @param bool $count whether to add the count of bookmarks per tag
 	 * @NoAdminRequired
 	 */
-	public function fullTags() {
-		return $this->publicController->fullTags();
+	public function fullTags($count) {
+		return $this->publicController->fullTags($count);
 	}
 
 }
diff --git a/controller/rest/tagscontroller.php b/controller/rest/tagscontroller.php
index 45d5ca12d..d6951720d 100644
--- a/controller/rest/tagscontroller.php
+++ b/controller/rest/tagscontroller.php
@@ -63,11 +63,12 @@ public function renameTag($old_name = "", $new_name = "", $name = '') {
 	}
 
 	/**
+	 * @param bool $count whether to add the count of bookmarks per tag
 	 * @NoAdminRequired
 	 * @NoCSRFRequired
 	 * @CORS
 	 */
-	public function fullTags() {
+	public function fullTags($count) {
 		
 		header("Cache-Control: no-cache, must-revalidate");
 		header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");
@@ -75,7 +76,11 @@ public function fullTags() {
 		$qtags = $this->bookmarks->findTags($this->userId, array(), 0, 400);
 		$tags = array();
 		foreach ($qtags as $tag) {
-			$tags[] = $tag['tag'];
+			if ($count === TRUE) {
+				$tags[] = ['name' => $tag['tag'], 'count' => $tag['nbr']];
+			} else {
+				$tags[] = $tag['tag'];
+			}
 		}
 
 		return new JSONResponse($tags);
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 35ebff83c..6cdae7c2c 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -16,6 +16,7 @@ var Tag = Backbone.Model.extend({
 
 var Tags = Backbone.Collection.extend({
   model: Tag
+, comparator: function(t) {return -t.get('count')}
 , url: 'tag'
 })
 
@@ -27,7 +28,8 @@ var App = Marionette.Application.extend({
     this.bookmarks = new Bookmarks
     this.tags = new Tags
     this.tags.fetch({
-      success: function() {
+	  data: {count: true}
+    , success: function() {
         // we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
         that.listenTo(that.tags, 'sync', that.onTagChanged)
         that.listenTo(that.tags, 'add', that.onTagChanged)
@@ -65,7 +67,7 @@ var App = Marionette.Application.extend({
     var that = this
     if (this.tagChanged === true) return this.tagChanged = false
     this.bokmarkChanged = true
-    that.tags.fetch() // we listen to 'sync', so we can fetch immediately
+    that.tags.fetch({data: {count: true}}) // we listen to 'sync', so we can fetch immediately
   }
 });
 
@@ -666,9 +668,7 @@ var TagsManagementView = Marionette.CollectionView.extend({
 , className: 'tags-management'
 , initialize: function(options) {
     var that = this
-    
-    this.collection.comparator = 'name'
-    
+     
     this.selected = new Tags
     this.selected.comparator = 'name'
     
@@ -731,7 +731,7 @@ var TagsManagementTagView = Marionette.View.extend({
     }
     return this.templateDefault
   }
-, templateDefault: _.template('<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>')
+, templateDefault: _.template('<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>')
 , templateEditing: _.template('<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>')
 , ui: {
     'actionsMenu': '.popovermenu'
@@ -816,7 +816,7 @@ Backbone.sync = function(method, model, options) {
    success: function(json) {
       console.log(json)
       if (!(model instanceof Tags)) options.success(json.item || json.data)
-      else options.success(json.map(function(name){return {name: name}}))
+      else options.success(json)
     }
   , error: function() {
       console.log(arguments)

From 624969450f5d6acde0deaa7b34f01db982eedb93 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 14:54:03 +0100
Subject: [PATCH 045/110] Fix padding of 'tags' headline

---
 css/bookmarks.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index f7d396743..5b42957b0 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -15,7 +15,7 @@
 }
 #app-navigation h3 {
 	padding-top: .7cm;
-	padding-left: 0.1cm;
+	padding-left: 12px;
 	border-top: 1px solid #ededed;
 }
 

From 5c6eb6942661effc9155d667a1c1fd14b9edc84e Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 16:42:24 +0100
Subject: [PATCH 046/110] Use a fork of link-preview

backported to use guzzle 5.3
---
 composer.json                | 5 +++++
 controller/lib/bookmarks.php | 7 ++++---
 2 files changed, 9 insertions(+), 3 deletions(-)
 create mode 100644 composer.json

diff --git a/composer.json b/composer.json
new file mode 100644
index 000000000..aa7fb8f26
--- /dev/null
+++ b/composer.json
@@ -0,0 +1,5 @@
+{
+	"require": {
+		"marcelklehr/link-preview": "^2"
+  }
+}
diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index 4d517bf4e..b0eab5e02 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -31,8 +31,8 @@
 use OCP\ILogger;
 use Symfony\Component\EventDispatcher\EventDispatcherInterface;
 use Symfony\Component\EventDispatcher\GenericEvent;
-use Dusterio\LinkPreview\Client as LinkPreview;
-use Dusterio\LinkPreview\Exceptions\ConnectionErrorException;
+use Marcelklehr\LinkPreview\Client as LinkPreview;
+use Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException;
 
 class Bookmarks {
 
@@ -673,7 +673,8 @@ public function getURLMetadata($url) {
 		$previewClient->getParser('general')->setMinimumImageDimension(0,0);
 		try {
 			$preview = $previewClient->getPreview('general');
-		} catch (\Dusterio\LinkPreview\Exceptions\ConnectionErrorException $e) {
+		} catch (\Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException $e) {
+			\OCP\Util::writeLog('bookmarks', $e, \OCP\Util::WARN);
 			return $data;
 		}
 		

From 68f7ae8157067e8798070f11f9fc8dd370de05f9 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 21:07:32 +0100
Subject: [PATCH 047/110] Reload bookmarks when bookmark is added

---
 js/bookmarks.js | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 6cdae7c2c..dfd80a566 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -236,10 +236,12 @@ var AddBookmarkView = Marionette.View.extend({
     var that = this
     bm.save(null,{
       success: function() {
-				Backbone.history.navigate('all', {trigger: true})
-				that.setPending(false)
-				that.deactivate()
-			}
+	    // needed in order for the route to be revaluated when it's already active
+        Backbone.history.navigate('dummyroute')
+        Backbone.history.navigate('all', {trigger: true})
+        that.setPending(false)
+        that.deactivate()
+      }
     , error: function() {
         that.setPending(false)
         that.getUI('button').removeClass('icon-add')

From 1e54a1666668207f09e6dd7fd7aaec79911e7c40 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 28 Jan 2018 21:55:59 +0100
Subject: [PATCH 048/110] Refactor bulk selection

---
 css/bookmarks.css | 23 +++++++++++++++--------
 js/bookmarks.js   | 16 +++++++++++++---
 2 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 5b42957b0..fb8211adc 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -176,16 +176,15 @@ button span,
 .bookmark-card:hover .panel {
   background: rgba(255, 255, 255, .90); 
 }
-.bookmark-card input[type="checkbox"] {
+.bookmark-card .selectbox {
   display: none;
   position: absolute;
   left: .1cm;
-  top: .3cm;
-  opacity: .7;
-  width: .4cm;
+  top: .5cm;
 }
-.bookmark-card:hover input[type="checkbox"],
-.bookmark-card.active input[type="checkbox"] {
+.selection-active .bookmark-card .selectbox,
+.bookmark-card:hover .selectbox,
+.bookmark-card.active .selectbox {
   display: inline-block;
 }
 .bookmark-card h1 {
@@ -219,6 +218,14 @@ button span,
   top: 24px;
   right: -14px;
 }
+.bookmark-card .actions .action-select,
+.bookmark-card.active .actions .action-unselect {
+  display: block;
+}
+.bookmark-card .actions .action-unselect,
+.bookmark-card.active .actions .action-select {
+  display: none;
+}
 .bookmark-card .tags {
   max-height: 2.5cm;
   overflow: hidden;
@@ -387,9 +394,9 @@ button span,
   margin: 0;
   width: 70%;
 }
+
 /* make checkbox look like an icon */
-.tags-management .tag-man-item .menu-filter-add span:first-child,
-.tags-management .tag-man-item .menu-filter-remove span:first-child {
+.menu-item-checkbox span:first-child {
   padding: 0 10px;
 }
 
diff --git a/js/bookmarks.js b/js/bookmarks.js
index dfd80a566..67dc2664a 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -411,9 +411,15 @@ var ContentView = Marionette.View.extend({
     this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
   }
 , onSelect: function(model) {
-    this.selected.add(model)
+    if (this.selected.length == 0) {
+      this.$el.addClass('selection-active')
+	}
+	this.selected.add(model)
   }
 , onUnselect: function(model) {
+    if (this.selected.length == 1) {
+      this.$el.removeClass('selection-active')
+	}
     this.selected.remove(model)
   }
 , onShowDetails: function(model) {
@@ -505,10 +511,10 @@ var EmptyBookmarksView = Marionette.View.extend({
 })
 
 var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<div class="panel"><input type="checkbox"/><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>'),
+  template: _.template('<div class="panel"><input type="checkbox" class="checkbox"/><label class="selectbox"></label><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="menu-item-checkbox action-select"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Select</span></button></li><li><button class="menu-item-checkbox action-unselect"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Unselect</span></button></li><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>'),
   className: "bookmark-card",
   ui: {
-    'checkbox': 'input[type="checkbox"]'
+    'checkbox': '.selectbox'
   , 'actionsToggle': '.actions .toggle'
   , 'actionsMenu': '.actions .popovermenu'
   },
@@ -522,6 +528,8 @@ var BookmarkCardView = Marionette.View.extend({
   , 'blur @ui.actionsToggle': 'closeActions'
   , 'click .action-edit': 'actionEdit'
   , 'click .action-delete': 'actionDelete'
+  , 'click .action-select': 'select'
+  , 'click .action-unselect': 'select'
   },
   initialize: function() {
     this.listenTo(this.model, "change", this.render);
@@ -536,6 +544,7 @@ var BookmarkCardView = Marionette.View.extend({
       return app.tags.findWhere({name: id})
     }))
     this.showChildView('tags', new TagsNavigationView({collection: tags}))
+    this.$('.checkbox').prop('checked', this.$el.hasClass('active'))
   }
 , open: function(e) {
     if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return
@@ -551,6 +560,7 @@ var BookmarkCardView = Marionette.View.extend({
   }
 , onSelect: function() {
     this.$el.addClass('active')
+    this.render()
   }
 , onUnselect: function() {
     this.$el.removeClass('active')

From b0f98ffd1d091c4c200dc8e116028e8cb01133f6 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Mon, 29 Jan 2018 02:47:42 +0100
Subject: [PATCH 049/110] Fix tag filter

---
 js/bookmarks.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index 67dc2664a..15743ff27 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -96,7 +96,7 @@ var Router = Marionette.AppRouter.extend({
   , tags: function(tagString) {
       var tags = tagString? tagString.split(',').map(decodeURIComponent) : [] 
       this.app.bookmarks.fetch({
-        data: {item: {tags: tags}, page: -1}
+        data: {tags: tags, page: -1}
       })
       Radio.channel('nav').trigger('navigate', 'tags', tags)
     }

From 26197d5266a61dbdcce5be11650368c1b5ac43fc Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Mon, 29 Jan 2018 02:47:55 +0100
Subject: [PATCH 050/110] Polish bookmark-card hover effect

---
 css/bookmarks.css | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index fb8211adc..cbb20ff68 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -151,6 +151,8 @@ button span,
   overflow: hidden;
   background-color: rgb(210, 210, 210);
   background-size: cover;
+  background-position: center;
+  transition: background-color .3s ease;
   background-blend-mode: overlay;
 }
 .bookmark-card,
@@ -158,7 +160,7 @@ button span,
   cursor: pointer;
 }
 .bookmark-card:hover {
-  background-blend-mode: multiply;
+  background-color: rgb(180, 180, 180);
 }
 .bookmark-card.active,
 .bookmark-card.active:hover {

From 805f210433728db9ef1d0d95f8954e398da76e9f Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 31 Jan 2018 17:00:51 +0100
Subject: [PATCH 051/110] Bulk tagging

---
 css/bookmarks.css | 29 ++++++++++++++++++++-------
 js/bookmarks.js   | 51 ++++++++++++++++++++++++++++++++++++++++-------
 2 files changed, 66 insertions(+), 14 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index cbb20ff68..60e39ad6c 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -106,10 +106,21 @@
     margin-top: 0;
   }
 }
+.bulk-actions > button {
+  vertical-align: text-bottom;
+}
+.bulk-actions .tags {
+  display: inline-block;
+  width: 60%;
+  margin: 3px 3px 3px 0;
+}
+.bulk-actions .tagit {
+  background: white;
+}
 .bulk-actions .selection-tools {
   float: right;
 }
-.bulk-actions .close {
+.bulk-actions .selection-tools .close {
   display: inline-block;
   cursor: pointer;
   margin: 3px 3px 3px 0; 
@@ -119,12 +130,12 @@
   cursor: pointer;
   box-sizing: border-box;
 }
-.bulk-actions .close span {
+.bulk-actions .selection-tools .close span {
   display: inline-block;
   vertical-align: text-top;
 }
 button span,
-.bulk-actions .close span {
+.bulk-actions .selection-tools .close span {
   cursor: pointer;
 }
 
@@ -296,6 +307,7 @@ button span,
   height: 1cm;
   width: 1cm;
 }
+.bulk-actions ul.tagit li.tagit-choice,
 .bookmark-detail ul.tagit li.tagit-choice,
 .bookmark-detail .tag-nav-item {
   border-radius: .2cm;
@@ -305,6 +317,7 @@ button span,
   padding: .1cm .4cm;
   margin: .1cm;
 }
+.bulk-actions ul.tagit li.tagit-choice:hover,
 .bookmark-detail ul.tagit li.tagit-choice:hover,
 .bookmark-detail .tag-nav-item:hover {
   background: #e0e0e0;
@@ -323,23 +336,25 @@ button span,
 .bookmark-detail .input-url,
 .bookmark-detail .input-title,
 .bookmark-detail .input-desc,
-.bookmark-detail ul.tagit {
+ul.tagit {
   width: 100%;
   font-size: inherit;
   box-sizing: border-box;
+  padding: 0 !important;
 }
 .bookmark-detail .input-url {
   padding-left: 25px;
   background-position: 5px;
 }
-.bookmark-detail ul.tagit li.tagit-choice {
+ul.tagit li.tagit-choice {
   padding: .1cm .5cm .1cm .2cm;
 }
-.bookmark-detail ul.tagit li.tagit-new {
+ul.tagit li.tagit-new {
   float: none;
   display: inline-block;
-  padding: 0;
+  padding: 0 !important;
   cursor: auto;
+  margin: 0;
 }
 .bookmark-detail .input-desc {
   height: 300px;
diff --git a/js/bookmarks.js b/js/bookmarks.js
index 15743ff27..e50cdaaf6 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -450,11 +450,11 @@ var MobileNavView = Marionette.View.extend({
 
 var BulkActionsView = Marionette.View.extend({
   className: 'bulk-actions'
-, template: _.template('<button class="delete"><span class="icon-delete"></span></button><div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div>')
+, template: _.template('<div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div><button class="delete"><span class="icon-delete"></span><span>Delete</span></button><div class="tags"><input type="text" /></div></div>')
 , events: {
     'click .delete': 'delete'
   , 'click .select-all': 'selectAll'
-  , 'click .close': 'abort'
+  , 'click .selection-tools .close': 'abort'
   }
 , initialize: function(opts) {
     this.all = opts.all
@@ -462,15 +462,32 @@ var BulkActionsView = Marionette.View.extend({
     this.listenTo(this.selected, 'remove', this.onReduceSelection)
     this.listenTo(this.selected, 'add', this.onExtendSelection)
   }
+, onRender: function() {
+    this.rendering = true
+    this.$('.tags input')
+    .val(_.intersection.apply(_, this.selected.pluck('tags')).join(','))
+    .tagit({
+      allowSpaces: true,
+      availableTags: app.tags.pluck('name'),
+      placeholderText: t('bookmarks', 'Enter tags'),
+      onTagRemoved: this.onTagRemoved.bind(this),
+      onTagAdded: this.onTagAdded.bind(this),
+      onTagFinishRemoved: function() {},
+      onTagClicked: function(){}
+    })
+    this.rendering = false
+  }
 , onReduceSelection: function() {
     if (this.selected.length == 0) {
-	  this.$el.removeClass('active')
-	}
+	    this.$el.removeClass('active')
+    }
+    this.render()
   }
 , onExtendSelection: function() {
     if (this.selected.length == 1) {
-	  this.$el.addClass('active')
-	}
+      this.$el.addClass('active')
+    }
+    this.render()
   }
 , delete: function() {
     var that = this
@@ -483,6 +500,27 @@ var BulkActionsView = Marionette.View.extend({
       })
     })
   }
+, onTagAdded: function(e, el) {
+    if (this.rendering) return
+    var tagName = $('.tagit-label', el).text()
+    this.selected.forEach(function(model) {
+      var tags = model.get('tags')
+      model.set('tags', _.union(tags, [tagName]))
+      model.save()
+    }) 
+  }
+, onTagRemoved: function(e, el) {
+    if (this.rendering) return
+    var tagName = $('.tagit-label', el).text()
+    this.selected.forEach(function(model) {
+      var tags = model.get('tags')
+      model.set('tags', _.without(tags, tagName))
+      model.save()
+    }) 
+  }
+, onChildViewSelectionChange: function() {
+    alert('boojah')
+  }
 , selectAll: function() {
     this.all.forEach(function(model) {
       model.trigger('select', model) 
@@ -673,7 +711,6 @@ var BookmarkDetailView = Marionette.View.extend({
 })
 
 
-
 var TagsManagementView = Marionette.CollectionView.extend({
   childView: function() {return TagsManagementTagView}
 , tagName: 'ul'

From 342e760200840df5b5ff703d16d03c21adfec36e Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Feb 2018 21:02:06 +0100
Subject: [PATCH 052/110] Tags API: Make $count optional

---
 controller/rest/tagscontroller.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/controller/rest/tagscontroller.php b/controller/rest/tagscontroller.php
index d6951720d..2a007ad99 100644
--- a/controller/rest/tagscontroller.php
+++ b/controller/rest/tagscontroller.php
@@ -68,7 +68,7 @@ public function renameTag($old_name = "", $new_name = "", $name = '') {
 	 * @NoCSRFRequired
 	 * @CORS
 	 */
-	public function fullTags($count) {
+	public function fullTags($count=FALSE) {
 		
 		header("Cache-Control: no-cache, must-revalidate");
 		header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");

From a5243be29d10f70100091782cda77cca9dbda4da Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Feb 2018 21:44:28 +0100
Subject: [PATCH 053/110] Use fetch for Import if available

fixes #423
---
 js/bookmarks.js | 42 ++++++++++++++++++++++++++++++++++++++----
 1 file changed, 38 insertions(+), 4 deletions(-)

diff --git a/js/bookmarks.js b/js/bookmarks.js
index e50cdaaf6..82b4a3313 100644
--- a/js/bookmarks.js
+++ b/js/bookmarks.js
@@ -345,15 +345,49 @@ var SettingsView = Marionette.View.extend({
     this.getUI('import').click()
   }
 , importSubmit: function(e) {
+    var that = this
     e.preventDefault()
-    this.getUI('iframe').load(this.importResult.bind(this));
-    this.getUI('form').submit();
+    if (typeof(window.fetch) !== 'undefined') {
+      // If we have fetch() do a little hapiness dance and go!
+      var data = new FormData()
+      data.append('bm_import', this.getUI('import')[0].files[0])
+      fetch(this.getUI('form').attr('action'), {
+        method: 'POST'
+      , headers: {
+          requesttoken: oc_requesttoken
+        }
+      , body: data 
+      , mode: 'same-origin'
+      , credentials: 'same-origin'
+      })
+      .then(function(res) {
+        if (!res.ok) {
+          if (res.status === 413) {
+            return {status: 'error', data: ['Selected file is too large']}
+          }
+          return {status: 'error', data: [res.statusText]} 
+        }
+        return res.json()
+      })
+      .then(function(json) {
+        that.importResult(JSON.stringify(json));
+      })
+      .catch(function(e) {
+        that.importResult(JSON.stringify({status: 'error', data: [e.message]}));
+      })
+    } else {
+      // If we don't have fetch() ask grandpa iframe to send it
+      this.getUI('iframe').load(function() {
+        that.importResult(that.getUI('iframe').contents().text());
+      })
+      this.getUI('form').submit();
+    }
     this.getUI('status').text(t('bookmark', 'Uploading...'));
   }
-, importResult: function () {
+, importResult: function (data) {
     var data;
     try {
-      data = $.parseJSON(this.getUI('iframe').contents().text());
+      data = $.parseJSON(data);
     } catch (e) {
       this.getUI('status').text(t('bookmark', 'Import error'));
       return;

From 50df29fe07cc5f48cd205afec3e1715232d980d0 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Feb 2018 21:45:11 +0100
Subject: [PATCH 054/110] Fix tagit styles

---
 css/bookmarks.css | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 60e39ad6c..08fbf4b4b 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -336,7 +336,8 @@ button span,
 .bookmark-detail .input-url,
 .bookmark-detail .input-title,
 .bookmark-detail .input-desc,
-ul.tagit {
+.bookmarks-detail ul.tagit,
+.bulk-actions ul.tagit {
   width: 100%;
   font-size: inherit;
   box-sizing: border-box;
@@ -346,10 +347,12 @@ ul.tagit {
   padding-left: 25px;
   background-position: 5px;
 }
-ul.tagit li.tagit-choice {
+.bookmatks-detail ul.tagit li.tagit-choice,
+.bulk-actions ul.tagit li.tagit-choice {
   padding: .1cm .5cm .1cm .2cm;
 }
-ul.tagit li.tagit-new {
+.bulk-actions ul.tagit li.tagit-new,
+.bookmarks-detail ul.tagit li.tagit-new {
   float: none;
   display: inline-block;
   padding: 0 !important;

From 14f94e12819d51a4e7a45f9afaf5f9902b3669c2 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Feb 2018 22:34:22 +0100
Subject: [PATCH 055/110] Split UI into multiple es6 modules

---
 js/Application.js             |  57 +++
 js/Router.js                  |  57 +++
 js/bookmarks.js               | 917 ----------------------------------
 js/index.js                   |  33 ++
 js/models/Bookmark.js         |   5 +
 js/models/Bookmarks.js        |   6 +
 js/models/Tag.js              |   6 +
 js/models/Tags.js             |   9 +
 js/settings.js                |  63 ---
 js/views/AddBookmark.js       |  75 +++
 js/views/App.js               |  52 ++
 js/views/BookmarkCard.js      |  78 +++
 js/views/BookmarkDetail.js    |  93 ++++
 js/views/Bookmarks.js         |  15 +
 js/views/BulkActions.js       |  87 ++++
 js/views/Content.js           |  70 +++
 js/views/EmptyBookmarks.js    |   9 +
 js/views/MobileNav.js         |  16 +
 js/views/Navigation.js        |  26 +
 js/views/SearchController.js  |  36 ++
 js/views/Settings.js          |  95 ++++
 js/views/TagsManagement.js    |  65 +++
 js/views/TagsManagementTag.js |  91 ++++
 js/views/TagsNavigation.js    |  10 +
 js/views/TagsNavigationTag.js |  26 +
 25 files changed, 1017 insertions(+), 980 deletions(-)
 create mode 100644 js/Application.js
 create mode 100644 js/Router.js
 delete mode 100644 js/bookmarks.js
 create mode 100644 js/index.js
 create mode 100644 js/models/Bookmark.js
 create mode 100644 js/models/Bookmarks.js
 create mode 100644 js/models/Tag.js
 create mode 100644 js/models/Tags.js
 delete mode 100644 js/settings.js
 create mode 100644 js/views/AddBookmark.js
 create mode 100644 js/views/App.js
 create mode 100644 js/views/BookmarkCard.js
 create mode 100644 js/views/BookmarkDetail.js
 create mode 100644 js/views/Bookmarks.js
 create mode 100644 js/views/BulkActions.js
 create mode 100644 js/views/Content.js
 create mode 100644 js/views/EmptyBookmarks.js
 create mode 100644 js/views/MobileNav.js
 create mode 100644 js/views/Navigation.js
 create mode 100644 js/views/SearchController.js
 create mode 100644 js/views/Settings.js
 create mode 100644 js/views/TagsManagement.js
 create mode 100644 js/views/TagsManagementTag.js
 create mode 100644 js/views/TagsNavigation.js
 create mode 100644 js/views/TagsNavigationTag.js

diff --git a/js/Application.js b/js/Application.js
new file mode 100644
index 000000000..dedf6f5ca
--- /dev/null
+++ b/js/Application.js
@@ -0,0 +1,57 @@
+import Backbone from 'backbone'
+import Bookmarks from './models/Bookmarks'
+import Tags from './models/Tagss'
+import Router from './Router'
+import AppView from './views/App'
+
+const Marionette = Backone.Marionette
+
+export default Marionette.Application.extend({
+  region: '#content'
+, onBeforeStart: function() {
+    var that = this
+    this.bookmarks = new Bookmarks
+    this.tags = new Tags
+    this.tags.fetch({
+	  data: {count: true}
+    , success: function() {
+        // we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
+        that.listenTo(that.tags, 'sync', that.onTagChanged)
+        that.listenTo(that.tags, 'add', that.onTagChanged)
+        that.listenTo(that.tags, 'remove', that.onTagChanged)
+      }
+    })
+    this.listenTo(this.bookmarks, 'sync', this.onBookmarkTagsChanged)
+
+    this.router = new Router({app: this})
+  }
+, onStart: function() {
+    this.showView(new AppView({bookmarks: this.bookmarks, tags: this.tags}));
+    Backbone.history.start();
+  }
+, onTagChanged: function(tag) {
+    var that = this
+    if (!(tag instanceof Tag)) return // we can also receive 'sync' events from the collection, which we don't want here
+    if (this.bookmarkChanged) return this.bookmarkChanged = false // set to true by onBookmarkTagsChanged
+    this.tagChanged = true
+
+    // we need to wait 'till the tag change has been acknowledged by the server
+    setTimeout(function() {
+      that.bookmarks
+      .filter(function(bm) {
+        return bm.get('tags').some(function(t) {
+          return t === tag.get('name') || t === tag.previous('name')
+        })
+      })
+      .forEach(function(bm) {
+        bm.fetch()
+      })
+    }, 100)
+  }
+, onBookmarkTagsChanged: function() {
+    var that = this
+    if (this.tagChanged === true) return this.tagChanged = false
+    this.bokmarkChanged = true
+    that.tags.fetch({data: {count: true}}) // we listen to 'sync', so we can fetch immediately
+  }
+});
diff --git a/js/Router.js b/js/Router.js
new file mode 100644
index 000000000..72c76a95d
--- /dev/null
+++ b/js/Router.js
@@ -0,0 +1,57 @@
+import Backbone from 'backbone'
+import Bookmarks from './models/Bookmarks'
+import Tags from './models/Tagss'
+import Router from './Router'
+import AppView from './views/App'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.AppRouter.extend({
+  controller: {
+    index: function() {
+      setTimeout(function(){
+        Backbone.history.navigate('all', {trigger: true})
+      }, 1)
+    }
+  , all: function() {
+      this.app.bookmarks.fetch({ 
+        data: {page: -1}
+	  })
+      Radio.channel('nav').trigger('navigate', 'all')
+    }
+  , favorites: function() {
+      Radio.channel('nav').trigger('navigate', 'favorites')
+    }
+  , shared: function() {
+      this.app.bookmarks.fetch({ 
+        data: {page: -1}
+	  })
+      Radio.channel('nav').trigger('navigate', 'shared')
+    }
+  , tags: function(tagString) {
+      var tags = tagString? tagString.split(',').map(decodeURIComponent) : [] 
+      this.app.bookmarks.fetch({
+        data: {tags: tags, page: -1}
+      })
+      Radio.channel('nav').trigger('navigate', 'tags', tags)
+    }
+  , search: function(query) {
+      this.app.bookmarks.fetch({
+        data: {search: decodeURIComponent(query).split(' '), page: -1}
+      })
+      Radio.channel('nav').trigger('navigate', 'search', query)
+    }
+  }
+, appRoutes: {
+    '': 'index'
+  , 'all': 'all'
+  , 'favorites': 'favorites'
+  , 'shared': 'shared'
+  , 'tags(/*tags)': 'tags'
+  , 'search/:query': 'search'
+  }
+, initialize: function(options) {
+    this.controller.app = options.app
+  }
+})
diff --git a/js/bookmarks.js b/js/bookmarks.js
deleted file mode 100644
index 82b4a3313..000000000
--- a/js/bookmarks.js
+++ /dev/null
@@ -1,917 +0,0 @@
-var Radio = Backbone.Radio
-
-var Bookmark = Backbone.Model.extend({
-  urlRoot: 'bookmark'
-})
-
-var Bookmarks = Backbone.Collection.extend({
-  model: Bookmark
-, url: 'bookmark'
-})
-
-var Tag = Backbone.Model.extend({
-  idAttribute: 'name'
-, urlRoot: 'tag'
-})
-
-var Tags = Backbone.Collection.extend({
-  model: Tag
-, comparator: function(t) {return -t.get('count')}
-, url: 'tag'
-})
-
-
-var App = Marionette.Application.extend({
-  region: '#content'
-, onBeforeStart: function() {
-    var that = this
-    this.bookmarks = new Bookmarks
-    this.tags = new Tags
-    this.tags.fetch({
-	  data: {count: true}
-    , success: function() {
-        // we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
-        that.listenTo(that.tags, 'sync', that.onTagChanged)
-        that.listenTo(that.tags, 'add', that.onTagChanged)
-        that.listenTo(that.tags, 'remove', that.onTagChanged)
-      }
-    })
-    this.listenTo(this.bookmarks, 'sync', this.onBookmarkTagsChanged)
-
-    this.router = new Router({app: this})
-  }
-, onStart: function() {
-    this.showView(new AppView({bookmarks: this.bookmarks, tags: this.tags}));
-    Backbone.history.start();
-  }
-, onTagChanged: function(tag) {
-    var that = this
-    if (!(tag instanceof Tag)) return // we can also receive 'sync' events from the collection, which we don't want here
-    if (this.bookmarkChanged) return this.bookmarkChanged = false // set to true by onBookmarkTagsChanged
-    this.tagChanged = true
-
-    // we need to wait 'till the tag change has been acknowledged by the server
-    setTimeout(function() {
-      that.bookmarks
-      .filter(function(bm) {
-        return bm.get('tags').some(function(t) {
-          return t === tag.get('name') || t === tag.previous('name')
-        })
-      })
-      .forEach(function(bm) {
-        bm.fetch()
-      })
-    }, 100)
-  }
-, onBookmarkTagsChanged: function() {
-    var that = this
-    if (this.tagChanged === true) return this.tagChanged = false
-    this.bokmarkChanged = true
-    that.tags.fetch({data: {count: true}}) // we listen to 'sync', so we can fetch immediately
-  }
-});
-
-var Router = Marionette.AppRouter.extend({
-  controller: {
-    index: function() {
-      setTimeout(function(){
-        Backbone.history.navigate('all', {trigger: true})
-      }, 1)
-    }
-  , all: function() {
-      this.app.bookmarks.fetch({ 
-        data: {page: -1}
-	  })
-      Radio.channel('nav').trigger('navigate', 'all')
-    }
-  , favorites: function() {
-      Radio.channel('nav').trigger('navigate', 'favorites')
-    }
-  , shared: function() {
-      this.app.bookmarks.fetch({ 
-        data: {page: -1}
-	  })
-      Radio.channel('nav').trigger('navigate', 'shared')
-    }
-  , tags: function(tagString) {
-      var tags = tagString? tagString.split(',').map(decodeURIComponent) : [] 
-      this.app.bookmarks.fetch({
-        data: {tags: tags, page: -1}
-      })
-      Radio.channel('nav').trigger('navigate', 'tags', tags)
-    }
-  , search: function(query) {
-      this.app.bookmarks.fetch({
-        data: {search: decodeURIComponent(query).split(' '), page: -1}
-      })
-      Radio.channel('nav').trigger('navigate', 'search', query)
-    }
-  }
-, appRoutes: {
-    '': 'index'
-  , 'all': 'all'
-  , 'favorites': 'favorites'
-  , 'shared': 'shared'
-  , 'tags(/*tags)': 'tags'
-  , 'search/:query': 'search'
-  }
-, initialize: function(options) {
-    this.controller.app = options.app
-  }
-})
-
-var AppView = Marionette.View.extend({
-  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
-, regions: {
-    'addBookmarks':  {
-      el: '#add-bookmark-slot'
-    , replaceElement: true
-    }
-  , 'navigation': {
-      el: '#navigation-slot'
-    , replaceElement: true
-    }
-  , 'content': {
-      el: '#content-slot'
-    , replaceElement: true
-    }
-  , 'tags': {
-      el: '#favorite-tags-slot'
-    , replaceElement: true
-    }
-  , 'settings': {
-      el: '#settings-slot'
-    , replaceElement: true
-    }
-  }
-, initialize: function(options) {
-    this.bookmarks = options.bookmarks
-    this.tags = options.tags
-    this.searchController = new SearchController
-    
-    $(window.document).click(function(e) {
-      Radio.channel('documentClicked').trigger('click', e)
-    })
-  }
-, onRender: function() {
-    this.showChildView('addBookmarks', new AddBookmarkView());
-    this.showChildView('navigation', new NavigationView);
-    this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
-    this.showChildView('tags', new TagsManagementView({collection: this.tags}))
-    this.showChildView('settings', new SettingsView())
-  }
-})
-
-
-var SearchController = Marionette.View.extend({
-  el: '#searchbox'
-, initialize: function() {
-    var that = this
-    // register a dummy search plugin
-    OC.Plugins.register('OCA.Search', { attach: function(search) {
-        search.setFilter('bookmarks', function(query) {
-          that.submit(query)
-        })
-      }
-    });
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
-  }
-, events: {
-    'keydown': 'onKeydown'
-  }
-, onRender: function() {
-    this.$el.show()
-  }
-, onNavigate: function(route, query) {
-    if (route === 'search/:query') this.$el.val(decodeURIComponent(query))
-  }
-, submit: function(query) {
-    if (query !== '') {
-      query = encodeURIComponent(query)
-      Backbone.history.navigate('search/'+query, {trigger: true})
-    }else {
-      Backbone.history.navigate('all', {trigger: true})
-    }
-  }
-})
-
-var AddBookmarkView = Marionette.View.extend({
-  template: _.template('<li class="link"><a href="#"><span>Add Bookmark</span></a></li><li class="form"><input type="text" value="" placeholder="Address..."/><button title="Add" class="icon-add"></button></li>')
-, className: 'add-bookmark'
-, tagName: 'ul'
-, events: {
-    'click @ui.link': 'activate'
-  , 'click @ui.button': 'submit'
-  , 'keydown @ui.input': 'onKeydown'
-  , 'blur @ui.input': 'deactivate'
-  }
-, ui: {
-    'link': '.link a'
-  , 'linkEntry': '.link'
-  , 'formEntry': '.form'
-  , 'input': 'input'
-  , 'button': 'button'
-  }
-, activate: function() {
-    this.getUI('linkEntry').hide()
-    this.getUI('formEntry').show()
-    this.getUI('input').focus()
-  }
-, deactivate: function() {
-    this.getUI('linkEntry').show()
-    this.getUI('formEntry').hide()
-    this.getUI('input').val('')
-  }
-, onKeydown: function(e) {
-    if (e.which != 13) return
-    // Enter
-    this.submit()
-  }
-, submit: function(e) {
-    var $input = this.getUI('input')
-    if (this.pending || $input.val() === '') return
-    var url = $input.val()
-    var bm = new Bookmark({url: url})
-    this.setPending(true)
-    var that = this
-    bm.save(null,{
-      success: function() {
-	    // needed in order for the route to be revaluated when it's already active
-        Backbone.history.navigate('dummyroute')
-        Backbone.history.navigate('all', {trigger: true})
-        that.setPending(false)
-        that.deactivate()
-      }
-    , error: function() {
-        that.setPending(false)
-        that.getUI('button').removeClass('icon-add')
-        that.getUI('button').addClass('icon-error-color')
-      }
-    })
-  }
-, setPending: function(pending) {
-    if (pending) {
-      this.getUI('button').removeClass('icon-add')
-      this.getUI('button').removeClass('icon-error-color')
-      this.getUI('button').addClass('icon-loading-small')
-      this.getUI('button').prop('disabled', true)
-    }else {
-      this.getUI('button').removeClass('icon-error-color')
-      this.getUI('button').addClass('icon-add')
-      this.getUI('button').removeClass('icon-loading-small')
-      this.getUI('button').prop('disabled', false) 
-    }
-    this.pending = pending
-  }
-})
-var nav_ids = {
-  all: true
-, favorites: true
-, shared: true
-}
-var NavigationView = Marionette.View.extend({
-  className: 'navigation'
-, tagName: 'ul'
-, template: _.template('<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li>')
-, events: {
-    'click .all': 'onClick'
-  , 'click .favorites': 'onClick'
-  , 'click .shared': 'onClick'
-  }
-, initialize: function() {
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
-  }
-, onClick: function(e) {
-    e.preventDefault()
-    Backbone.history.navigate(e.target.parentNode.dataset.id, {trigger: true})
-  }
-, onNavigate: function(category) {
-    $('.active', this.$el).removeClass('active')
-    if (category && nav_ids[category]) $('.'+category, this.$el).addClass('active')
-  }
-})
-
-var TagsNavigationView = Marionette.CollectionView.extend({
-  tagName: 'ul'
-, childView: function() {return TagsNavigationTagView}
-})
-
-var TagsNavigationTagView = Marionette.View.extend({
-  className: 'tag-nav-item'
-, tagName: 'li'
-, template: _.template('<a href="#"><%- name %></a>')
-, events: {
-    'click': 'open'
-  }
-, initialize: function() {
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
-  }
-, open: function(e) {
-    e.preventDefault()
-    Backbone.history.navigate('tags/' + encodeURIComponent(this.model.get('name')), {trigger: true});
-  }
-, onNavigate: function(category, tags) {
-    this.$el.removeClass('active')
-    if (category === 'tags' && ~tags.indexOf(this.model.get('name'))) {
-      this.$el.addClass('active')
-    }
-  }
-})
-
-var SettingsView = Marionette.View.extend({
-  className: 'settings'
-, id: 'app-settings'
-, template: _.template('<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade"><span class="icon-upload"></span> Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export"><span class="icon-download"></span> Export</button><div class="import-status"></div></div>')
-, ui: {
-    'content': '#app-settings-content'
-  , 'import': '.import'
-  , 'form': '.import-form'
-  , 'iframe': '.upload'
-  , 'status': '.import-status'
-  }
-, events: {
-    'click .settings-button': 'open'
-  , 'click .import-facade': 'importTrigger'
-  , 'change @ui.import': 'importSubmit'
-  , 'load @ui.iframe': 'importResult'
-  , 'click .export': 'exportTrigger'
-  }
-, open: function(e) {
-    e.preventDefault()
-    this.getUI('content').slideToggle()
-  }
-, importTrigger: function(e) {
-    e.preventDefault()
-    this.getUI('import').click()
-  }
-, importSubmit: function(e) {
-    var that = this
-    e.preventDefault()
-    if (typeof(window.fetch) !== 'undefined') {
-      // If we have fetch() do a little hapiness dance and go!
-      var data = new FormData()
-      data.append('bm_import', this.getUI('import')[0].files[0])
-      fetch(this.getUI('form').attr('action'), {
-        method: 'POST'
-      , headers: {
-          requesttoken: oc_requesttoken
-        }
-      , body: data 
-      , mode: 'same-origin'
-      , credentials: 'same-origin'
-      })
-      .then(function(res) {
-        if (!res.ok) {
-          if (res.status === 413) {
-            return {status: 'error', data: ['Selected file is too large']}
-          }
-          return {status: 'error', data: [res.statusText]} 
-        }
-        return res.json()
-      })
-      .then(function(json) {
-        that.importResult(JSON.stringify(json));
-      })
-      .catch(function(e) {
-        that.importResult(JSON.stringify({status: 'error', data: [e.message]}));
-      })
-    } else {
-      // If we don't have fetch() ask grandpa iframe to send it
-      this.getUI('iframe').load(function() {
-        that.importResult(that.getUI('iframe').contents().text());
-      })
-      this.getUI('form').submit();
-    }
-    this.getUI('status').text(t('bookmark', 'Uploading...'));
-  }
-, importResult: function (data) {
-    var data;
-    try {
-      data = $.parseJSON(data);
-    } catch (e) {
-      this.getUI('status').text(t('bookmark', 'Import error'));
-      return;
-    }
-    if (data.status == 'error') {
-      var list = $("<ul></ul>").addClass('setting_error_list');
-      console.log(data);
-      $.each(data.data, function (index, item) {
-        list.append($("<li></li>").text(item));
-      });
-      this.getUI('status').html(list);
-      return
-    }
-    this.getUI('status').text(t('bookmark', 'Import completed successfully.'));
-    Backbone.history.navigate('all', {trigger: true})
-  }
-, exportTrigger: function() {
-    window.location = 'bookmark/export?requesttoken='+oc_requesttoken
-  }
-})
-
-var ContentView = Marionette.View.extend({
-  template: _.template('<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
-, regions: {
-    'mobileNav': {
-      el: '#mobile-nav-slot'
-    , replaceElement: true
-    }
-  , 'bulkActions': {
-      el: '#bulk-actions-slot'
-    , replaceElement: true
-    }
-  , 'viewBookmarks': {
-      el: '#view-bookmarks-slot'
-    , replaceElement: true
-    }
-  , 'bookmarkDetail': {
-      el: '#bookmark-detail-slot'
-    , replaceElement: true
-    }
-  }
-, initialize: function(options) {
-    this.bookmarks = options.bookmarks
-    this.selected = new Bookmarks
-    this.listenTo(this.bookmarks, 'select', this.onSelect)
-    this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
-    this.listenTo(Radio.channel('details'), 'show', this.onShowDetails)
-    this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails)
-    this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails)
-  }
-, onRender: function() {
-    this.showChildView('mobileNav', new MobileNavView())
-    this.showChildView('bulkActions', new BulkActionsView({all: this.bookmarks, selected: this.selected}))
-    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
-  }
-, onSelect: function(model) {
-    if (this.selected.length == 0) {
-      this.$el.addClass('selection-active')
-	}
-	this.selected.add(model)
-  }
-, onUnselect: function(model) {
-    if (this.selected.length == 1) {
-      this.$el.removeClass('selection-active')
-	}
-    this.selected.remove(model)
-  }
-, onShowDetails: function(model) {
-    var that = this
-    var view = new BookmarkDetailView({model: model})
-    this.showChildView('bookmarkDetail', view)
-  }
-, onEditDetails: function(model) {
-    this.onShowDetails(model)
-    this.getRegion('bookmarkDetail').currentView.setEditing(true)
-  }
-, onCloseDetails: function() {
-    this.detachChildView('bookmarkDetail')
-  }
-})
-
-var MobileNavView = Marionette.View.extend({
-  className: 'mobile-nav'
-, template: _.template('<a href="#" class="icon-menu toggle-menu"></a>')
-, events: {
-    'click .toggle-menu': 'toggleMenu'
-  }
-, toggleMenu: function(e) {
-    e.preventDefault()
-    $('body').toggleClass('mobile-nav-open')
-  }
-})
-
-var BulkActionsView = Marionette.View.extend({
-  className: 'bulk-actions'
-, template: _.template('<div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div><button class="delete"><span class="icon-delete"></span><span>Delete</span></button><div class="tags"><input type="text" /></div></div>')
-, events: {
-    'click .delete': 'delete'
-  , 'click .select-all': 'selectAll'
-  , 'click .selection-tools .close': 'abort'
-  }
-, initialize: function(opts) {
-    this.all = opts.all
-    this.selected = opts.selected
-    this.listenTo(this.selected, 'remove', this.onReduceSelection)
-    this.listenTo(this.selected, 'add', this.onExtendSelection)
-  }
-, onRender: function() {
-    this.rendering = true
-    this.$('.tags input')
-    .val(_.intersection.apply(_, this.selected.pluck('tags')).join(','))
-    .tagit({
-      allowSpaces: true,
-      availableTags: app.tags.pluck('name'),
-      placeholderText: t('bookmarks', 'Enter tags'),
-      onTagRemoved: this.onTagRemoved.bind(this),
-      onTagAdded: this.onTagAdded.bind(this),
-      onTagFinishRemoved: function() {},
-      onTagClicked: function(){}
-    })
-    this.rendering = false
-  }
-, onReduceSelection: function() {
-    if (this.selected.length == 0) {
-	    this.$el.removeClass('active')
-    }
-    this.render()
-  }
-, onExtendSelection: function() {
-    if (this.selected.length == 1) {
-      this.$el.addClass('active')
-    }
-    this.render()
-  }
-, delete: function() {
-    var that = this
-    this.selected.forEach(function(model) {
-      model.trigger('unselect', model)
-      model.destroy({
-        error: function() {
-          Backbone.history.navigate('all', {trigger: true})
-        }
-      })
-    })
-  }
-, onTagAdded: function(e, el) {
-    if (this.rendering) return
-    var tagName = $('.tagit-label', el).text()
-    this.selected.forEach(function(model) {
-      var tags = model.get('tags')
-      model.set('tags', _.union(tags, [tagName]))
-      model.save()
-    }) 
-  }
-, onTagRemoved: function(e, el) {
-    if (this.rendering) return
-    var tagName = $('.tagit-label', el).text()
-    this.selected.forEach(function(model) {
-      var tags = model.get('tags')
-      model.set('tags', _.without(tags, tagName))
-      model.save()
-    }) 
-  }
-, onChildViewSelectionChange: function() {
-    alert('boojah')
-  }
-, selectAll: function() {
-    this.all.forEach(function(model) {
-      model.trigger('select', model) 
-    })
-  }
-, abort: function() {
-    this.selected.models.slice().forEach(function(model) {
-      model.trigger('unselect', model)
-    })
-  }
-})
-
-
-var BookmarksView = Marionette.CollectionView.extend({
-  className: 'bookmarks'
-, regions: {
-
-  }
-, childView: function() {return BookmarkCardView}
-, emptyView: function() {return EmptyBookmarksView}
-})
-
-var EmptyBookmarksView = Marionette.View.extend({
-  template: _.template('<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>')
-, className: 'bookmarks-empty'
-})
-
-var BookmarkCardView = Marionette.View.extend({
-  template: _.template('<div class="panel"><input type="checkbox" class="checkbox"/><label class="selectbox"></label><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="menu-item-checkbox action-select"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Select</span></button></li><li><button class="menu-item-checkbox action-unselect"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Unselect</span></button></li><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>'),
-  className: "bookmark-card",
-  ui: {
-    'checkbox': '.selectbox'
-  , 'actionsToggle': '.actions .toggle'
-  , 'actionsMenu': '.actions .popovermenu'
-  },
-  regions: {
-    'tags': '.tags'
-  },
-  events: {
-    "click": "open"
-  , "click @ui.checkbox": "select"
-  , 'click @ui.actionsToggle': 'toggleActions'
-  , 'blur @ui.actionsToggle': 'closeActions'
-  , 'click .action-edit': 'actionEdit'
-  , 'click .action-delete': 'actionDelete'
-  , 'click .action-select': 'select'
-  , 'click .action-unselect': 'select'
-  },
-  initialize: function() {
-    this.listenTo(this.model, "change", this.render);
-    this.listenTo(this.model, "select", this.onSelect);
-    this.listenTo(this.model, "unselect", this.onUnselect);
-    this.listenTo(app.tags, 'sync', this.render)
-    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
-  }
-, onRender: function() {
-	this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)')
-    var tags = new Tags(this.model.get('tags').map(function(id) {
-      return app.tags.findWhere({name: id})
-    }))
-    this.showChildView('tags', new TagsNavigationView({collection: tags}))
-    this.$('.checkbox').prop('checked', this.$el.hasClass('active'))
-  }
-, open: function(e) {
-    if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return
-    Radio.channel('details').trigger('show', this.model)
-  }
-, select: function(e) {
-    e.stopPropagation()
-    if (this.$el.hasClass('active')) {
-      this.model.trigger('unselect', this.model)
-    }else{
-      this.model.trigger('select', this.model)
-    }
-  }
-, onSelect: function() {
-    this.$el.addClass('active')
-    this.render()
-  }
-, onUnselect: function() {
-    this.$el.removeClass('active')
-    this.render()
-  }
-, toggleActions: function(e) {
-    this.getUI('actionsMenu').toggleClass('open')
-    this.$el.toggleClass('actions-open')
-  }
-, closeActions: function(e) {
-    if (e.target === this.getUI('actionsToggle')[0]) return
-    this.getUI('actionsMenu').removeClass('open')
-    this.$el.removeClass('actions-open')
-  }
-, actionDelete: function() {
-    this.model.destroy()
-  }
-, actionEdit: function() {
-    Radio.channel('details').trigger('edit', this.model)
-  }
-})
-
-
-var BookmarkDetailView = Marionette.View.extend({
-  getTemplate: function() {
-    if (this.editing) {
-      return this.templateEditing
-    }
-    return this.templateDefault
-  },
-  templateDefault: _.template('<div class="close icon-close"></div><div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="tags"></div><div class="description"><%- description %></div>'),
-  templateEditing: _.template('<div class="close icon-close"></div><h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="tags"><input type="text" /></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>'),
-  className: "bookmark-detail",
-  regions: {
-    'tags': {
-      el: '.tags'
-    , replaceElement: true
-    }
-  },
-  ui: {
-    'close': '> .close'
-  , 'edit': '.edit'
-  , 'delete': '.delete'
-  },
-  events: {
-    'click @ui.close': 'close'
-  , 'click @ui.edit': 'edit'
-  , 'click @ui.delete': 'delete'
-  , 'click .submit': 'submit'
-  , 'click .cancel': 'cancel'
-  },
-  initialize: function(opts) {
-    this.listenTo(this.model, "change", this.render);
-    this.listenTo(app.tags, 'sync', this.render)
-  },
-  onRender: function() {
-    if (this.editing) {
-      this.$('.tags input')
-      .val(this.model.get('tags').join(','))
-      .tagit({
-        allowSpaces: true,
-        availableTags: app.tags.pluck('name'),
-        placeholderText: t('bookmarks', 'Enter tags'),
-        onTagRemoved: function() {},
-        onTagFinishRemoved: function() {},
-        onTagClicked: function(){}
-      })
-    }else{
-      var tags = new Tags(this.model.get('tags').map(function(id) {
-        return app.tags.findWhere({name: id})
-      }))
-      this.showChildView('tags', new TagsNavigationView({collection: tags}))
-    }
-  },
-  close: function() {
-    Radio.channel('details').trigger('close')
-  },
-  setEditing: function(isEditing) {
-    if (isEditing) {
-      this.editing = true
-      this.$el.addClass('editing')
-    }else{
-      this.editing = false
-      this.$el.removeClass('editing')
-    }
-    this.render()
-  },
-  edit: function() {
-    this.setEditing(true)
-  }
-, submit: function() {
-    var that = this
-    this.model.set({
-      'title': this.$('.input-title').val()
-    , 'url': this.$('.input-url').val()
-    , 'tags': this.$('.tags input').tagit("assignedTags")
-    , 'description': this.$('.input-desc').val()
-    })
-    this.model.save({wait: true})
-    this.model.once('sync', function() {
-      that.cancel()
-    })
-  }
-, cancel: function() {
-    this.setEditing(false)
-  }
-, onDestroy: function() {
-    this.close() 
-  }
-})
-
-
-var TagsManagementView = Marionette.CollectionView.extend({
-  childView: function() {return TagsManagementTagView}
-, tagName: 'ul'
-, className: 'tags-management'
-, initialize: function(options) {
-    var that = this
-     
-    this.selected = new Tags
-    this.selected.comparator = 'name'
-    
-    this.listenTo(this.collection, 'select', this.onSelect)
-    this.listenTo(this.collection, 'unselect', this.onUnselect)
-    this.listenTo(this.collection, 'add', this.onAdd)
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
-  }
-, onNavigate: function(category, tags) {
-    // reset selection (needs slice, since we pull the models out from under the loop otherwise)
-    this.selected.slice().forEach(function(t) {
-      t.trigger('unselect', t, true)
-    })
-    if (category !== 'tags') {
-      this.lastRouteTags = [] // for the below hack
-      return
-    }
-
-    var that = this
-    // select all tags passed by router
-    tags.forEach(function(tagName) {
-      var tag = that.collection.findWhere({name: tagName})
-      if (!tag) return
-
-      tag.trigger('select', tag, true)
-    })
-
-    // hack!
-    // this is for when the route is triggered before the tags are loaded
-    this.lastRouteTags = tags
-  }
-, onAdd: function(model) {
-    if (~this.lastRouteTags.indexOf(model.get('name'))) {
-      // wait for the tag view to render, so it can receive the event
-      setTimeout(function() {
-        model.trigger('select', model, true)
-      }, 1)
-      return
-    }
-  }
-, onSelect: function(model, silentRoute) {
-    this.selected.add(model)
-    if (!silentRoute) this.triggerRoute()
-  }
-, onUnselect: function(model, silentRoute) {
-    this.selected.remove(model)
-    if (!silentRoute) this.triggerRoute()
-  }
-, triggerRoute: function() {
-    Backbone.history.navigate('tags/'+this.selected.pluck('name').map(encodeURIComponent).join(','), {trigger: true})
-  }
-})
-
-var TagsManagementTagView = Marionette.View.extend({
-  className: 'tag-man-item'
-, tagName: 'li'
-, getTemplate: function() {
-    if (this.editing) {
-      return this.templateEditing
-    }
-    return this.templateDefault
-  }
-, templateDefault: _.template('<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>')
-, templateEditing: _.template('<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>')
-, ui: {
-    'actionsMenu': '.popovermenu'
-  , 'actionsToggle': '.app-navigation-entry-utils-menu-button'
-  }
-, events: {
-    'click': 'selectSimple'
-  , 'click @ui.actionsToggle': 'toggleActions'
-  , 'click .menu-filter-add': 'actionSelect'
-  , 'click .menu-filter-remove': 'actionUnselect'
-  , 'click .menu-delete': 'actionDelete'
-  , 'click .menu-edit': 'actionEdit'
-  , 'click .action .submit': 'actionSubmit'
-  , 'click .action .cancel': 'actionCancel'
-  }
-, initialize: function() {
-    this.listenTo(this.model, 'select', this.onSelect)
-    this.listenTo(this.model, 'unselect', this.onUnselect)
-    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions)   
-  }
-, onRender: function() {
-    if (this.selected) {
-      this.$el.addClass('active')
-    }else{
-      this.$el.removeClass('active')
-    }
-    if (this.editing) {
-      this.$('input').focus()
-    }
-  }
-, onSelect: function() {
-    this.selected = true
-    this.render()
-  }
-, onUnselect: function() {
-    this.selected = false
-    this.render()
-  }
-, selectSimple: function(e) {
-    e.preventDefault()
-    if (e && !~[ this.el, this.$('a')[0], this.$('span')[0] ].indexOf(e.target)) {
-      return
-    }
-    if (this.editing) return
-    Backbone.history.navigate('tags/'+encodeURIComponent(this.model.get('name')), {trigger: true})
-  }
-, toggleActions: function() {
-    this.getUI('actionsMenu').toggleClass('open')
-  }
-, closeActions: function(e) {
-    if (this.editing || $.contains(this.getUI('actionsToggle')[0], e.target)) return
-    this.getUI('actionsMenu').removeClass('open')
-  }
-, actionSelect: function(e) {
-    this.model.trigger('select', this.model)
-  }
-, actionUnselect: function(e) {
-    this.model.trigger('unselect', this.model)
-  }
-, actionDelete: function() {
-    this.model.destroy()
-  }
-, actionEdit: function() {
-    this.editing = true
-    this.render()
-  }
-, actionSubmit: function() {
-    this.model.set('name', this.$('input').val())
-    this.model.save()
-    this.actionCancel()
-  }
-, actionCancel: function() {
-    this.editing = false
-    this.render()
-  }
-})
-
-
-var _sync = Backbone.sync
-Backbone.sync = function(method, model, options) {
-  var overrideOptions = {
-   success: function(json) {
-      console.log(json)
-      if (!(model instanceof Tags)) options.success(json.item || json.data)
-      else options.success(json)
-    }
-  , error: function() {
-      console.log(arguments)
-    }
-  }
-  if (method === 'update' && model instanceof Tag) overrideOptions.url = model.urlRoot+'/'+model.previous('name') 
-  _sync(method, model, _.extend({}, options, overrideOptions))
-}
-
-// init
-
-var app = new App()
-$(function() {
-  app.start()
-})
diff --git a/js/index.js b/js/index.js
new file mode 100644
index 000000000..78c5396c3
--- /dev/null
+++ b/js/index.js
@@ -0,0 +1,33 @@
+import Backbone from 'backbone'
+import Marionette from 'backbone-marionette'
+import Tag from './models/Tag'
+import Tags from './models/Tags'
+import App from './Application'
+
+var _sync = Backbone.sync
+Backbone.sync = function(method, model, options) {
+  var overrideOptions = {
+   success: function(json) {
+      console.log(json)
+      if (!(model instanceof Tags)) {
+        options.success(json.item || json.data)
+      } else {
+        options.success(json)
+      }
+    }
+  , error: function() {
+      console.log(arguments)
+    }
+  }
+  if (method === 'update' && model instanceof Tag) {
+    overrideOptions.url = model.urlRoot+'/'+model.previous('name') 
+  }
+  _sync(method, model, _.extend({}, options, overrideOptions))
+}
+
+// init
+
+var app = new App()
+$(function() {
+  app.start()
+})
diff --git a/js/models/Bookmark.js b/js/models/Bookmark.js
new file mode 100644
index 000000000..05568aa46
--- /dev/null
+++ b/js/models/Bookmark.js
@@ -0,0 +1,5 @@
+import Backbone from 'backbone'
+
+export default Backbone.Model.extend({
+  urlRoot: 'bookmark'
+})
diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
new file mode 100644
index 000000000..5751de44c
--- /dev/null
+++ b/js/models/Bookmarks.js
@@ -0,0 +1,6 @@
+import Backbone from 'backbone'
+
+export default Backbone.Collection.extend({
+  model: Bookmark
+, url: 'bookmark'
+})
diff --git a/js/models/Tag.js b/js/models/Tag.js
new file mode 100644
index 000000000..844af4826
--- /dev/null
+++ b/js/models/Tag.js
@@ -0,0 +1,6 @@
+import Backbone from 'backbone'
+
+export default Backbone.Model.extend({
+  idAttribute: 'name'
+, urlRoot: 'tag'
+})
diff --git a/js/models/Tags.js b/js/models/Tags.js
new file mode 100644
index 000000000..3d88edc0b
--- /dev/null
+++ b/js/models/Tags.js
@@ -0,0 +1,9 @@
+import Backbone from 'backbone'
+
+var Tags = Backbone.Collection.extend({
+  model: Tag
+, comparator: function(t) {return -t.get('count')}
+, url: 'tag'
+})
+
+export default Tags
diff --git a/js/settings.js b/js/settings.js
deleted file mode 100644
index 226c84fe5..000000000
--- a/js/settings.js
+++ /dev/null
@@ -1,63 +0,0 @@
-function attachSettingEvent(event) {
-	event.preventDefault();
-	fileUpload($(this).closest('form'), $('#upload'));
-}
-
-function exportBm() {
-	window.location = $(this).attr('href');
-}
-
-function fileUpload(form, resultDiv) {
-
-	var uploadEventHandler = function () {
-		var data = {};
-		try {
-			data = $.parseJSON(iframe.contents().text());
-		} catch (e) {
-		}
-		if (!data) {
-			resultDiv.text(t('bookmark', 'Import error'));
-			return;
-		}
-		if (data.status == 'error') {
-			var list = $("<ul></ul>").addClass('setting_error_list');
-			console.log(data);
-			$.each(data.data, function (index, item) {
-				list.append($("<li></li>").text(item));
-			});
-			resultDiv.html(list);
-		} else {
-			resultDiv.text(t('bookmark', 'Import completed successfully.'));
-			getBookmarks();
-		}
-	};
-
-	// Create the iframe...
-	var iframe;
-	if ($('#upload_iframe').length === 1)
-		iframe = $('#upload_iframe');
-	else {
-		iframe = $('<iframe></iframe>').attr({
-			id: 'upload_iframe',
-			name: 'upload_iframe',
-			width: '0',
-			height: '0',
-			border: '0',
-			style: 'display:none'
-		}).bind('load', uploadEventHandler);
-		form.append(iframe);
-	}
-
-	// Set properties of form...
-	form.attr({
-		target: 'upload_iframe',
-		method: 'post',
-		enctype: 'multipart/form-data',
-		encoding: 'multipart/form-data'
-	});
-
-	// Submit the form...
-	form.submit();
-
-	resultDiv.text(t('bookmark', 'Uploading...'));
-}
\ No newline at end of file
diff --git a/js/views/AddBookmark.js b/js/views/AddBookmark.js
new file mode 100644
index 000000000..ebe5294c1
--- /dev/null
+++ b/js/views/AddBookmark.js
@@ -0,0 +1,75 @@
+import Backbone from 'backbone'
+import Bookmark from '../models/Bookmark'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  template: _.template('<li class="link"><a href="#"><span>Add Bookmark</span></a></li><li class="form"><input type="text" value="" placeholder="Address..."/><button title="Add" class="icon-add"></button></li>')
+, className: 'add-bookmark'
+, tagName: 'ul'
+, events: {
+    'click @ui.link': 'activate'
+  , 'click @ui.button': 'submit'
+  , 'keydown @ui.input': 'onKeydown'
+  , 'blur @ui.input': 'deactivate'
+  }
+, ui: {
+    'link': '.link a'
+  , 'linkEntry': '.link'
+  , 'formEntry': '.form'
+  , 'input': 'input'
+  , 'button': 'button'
+  }
+, activate: function() {
+    this.getUI('linkEntry').hide()
+    this.getUI('formEntry').show()
+    this.getUI('input').focus()
+  }
+, deactivate: function() {
+    this.getUI('linkEntry').show()
+    this.getUI('formEntry').hide()
+    this.getUI('input').val('')
+  }
+, onKeydown: function(e) {
+    if (e.which != 13) return
+    // Enter
+    this.submit()
+  }
+, submit: function(e) {
+    var $input = this.getUI('input')
+    if (this.pending || $input.val() === '') return
+    var url = $input.val()
+    var bm = new Bookmark({url: url})
+    this.setPending(true)
+    var that = this
+    bm.save(null,{
+      success: function() {
+	    // needed in order for the route to be revaluated when it's already active
+        Backbone.history.navigate('dummyroute')
+        Backbone.history.navigate('all', {trigger: true})
+        that.setPending(false)
+        that.deactivate()
+      }
+    , error: function() {
+        that.setPending(false)
+        that.getUI('button').removeClass('icon-add')
+        that.getUI('button').addClass('icon-error-color')
+      }
+    })
+  }
+, setPending: function(pending) {
+    if (pending) {
+      this.getUI('button').removeClass('icon-add')
+      this.getUI('button').removeClass('icon-error-color')
+      this.getUI('button').addClass('icon-loading-small')
+      this.getUI('button').prop('disabled', true)
+    }else {
+      this.getUI('button').removeClass('icon-error-color')
+      this.getUI('button').addClass('icon-add')
+      this.getUI('button').removeClass('icon-loading-small')
+      this.getUI('button').prop('disabled', false) 
+    }
+    this.pending = pending
+  }
+})
diff --git a/js/views/App.js b/js/views/App.js
new file mode 100644
index 000000000..14f49ec65
--- /dev/null
+++ b/js/views/App.js
@@ -0,0 +1,52 @@
+import Backbone from 'backbone'
+import SearchController from './views/SearchController'
+import AddBookmarkView from './views/AddBookmark'
+import NavigationView from './views/Navigation'
+import TagsManagementView from './views/TagsManagement'
+import ContentView from './views/Content'
+import SettingsView from './views/Settings'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
+, regions: {
+    'addBookmarks':  {
+      el: '#add-bookmark-slot'
+    , replaceElement: true
+    }
+  , 'navigation': {
+      el: '#navigation-slot'
+    , replaceElement: true
+    }
+  , 'content': {
+      el: '#content-slot'
+    , replaceElement: true
+    }
+  , 'tags': {
+      el: '#favorite-tags-slot'
+    , replaceElement: true
+    }
+  , 'settings': {
+      el: '#settings-slot'
+    , replaceElement: true
+    }
+  }
+, initialize: function(options) {
+    this.bookmarks = options.bookmarks
+    this.tags = options.tags
+    this.searchController = new SearchController
+    
+    $(window.document).click(function(e) {
+      Radio.channel('documentClicked').trigger('click', e)
+    })
+  }
+, onRender: function() {
+    this.showChildView('addBookmarks', new AddBookmarkView());
+    this.showChildView('navigation', new NavigationView);
+    this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
+    this.showChildView('tags', new TagsManagementView({collection: this.tags}))
+    this.showChildView('settings', new SettingsView())
+  }
+})
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
new file mode 100644
index 000000000..59fba8502
--- /dev/null
+++ b/js/views/BookmarkCard.js
@@ -0,0 +1,78 @@
+import Backbone from 'backbone'
+import TagsNavigationView from './TagsNavigation'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  template: _.template('<div class="panel"><input type="checkbox" class="checkbox"/><label class="selectbox"></label><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="menu-item-checkbox action-select"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Select</span></button></li><li><button class="menu-item-checkbox action-unselect"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Unselect</span></button></li><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>'),
+  className: "bookmark-card",
+  ui: {
+    'checkbox': '.selectbox'
+  , 'actionsToggle': '.actions .toggle'
+  , 'actionsMenu': '.actions .popovermenu'
+  },
+  regions: {
+    'tags': '.tags'
+  },
+  events: {
+    "click": "open"
+  , "click @ui.checkbox": "select"
+  , 'click @ui.actionsToggle': 'toggleActions'
+  , 'blur @ui.actionsToggle': 'closeActions'
+  , 'click .action-edit': 'actionEdit'
+  , 'click .action-delete': 'actionDelete'
+  , 'click .action-select': 'select'
+  , 'click .action-unselect': 'select'
+  },
+  initialize: function() {
+    this.listenTo(this.model, "change", this.render);
+    this.listenTo(this.model, "select", this.onSelect);
+    this.listenTo(this.model, "unselect", this.onUnselect);
+    this.listenTo(app.tags, 'sync', this.render)
+    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
+  }
+, onRender: function() {
+	this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)')
+    var tags = new Tags(this.model.get('tags').map(function(id) {
+      return app.tags.findWhere({name: id})
+    }))
+    this.showChildView('tags', new TagsNavigationView({collection: tags}))
+    this.$('.checkbox').prop('checked', this.$el.hasClass('active'))
+  }
+, open: function(e) {
+    if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return
+    Radio.channel('details').trigger('show', this.model)
+  }
+, select: function(e) {
+    e.stopPropagation()
+    if (this.$el.hasClass('active')) {
+      this.model.trigger('unselect', this.model)
+    }else{
+      this.model.trigger('select', this.model)
+    }
+  }
+, onSelect: function() {
+    this.$el.addClass('active')
+    this.render()
+  }
+, onUnselect: function() {
+    this.$el.removeClass('active')
+    this.render()
+  }
+, toggleActions: function(e) {
+    this.getUI('actionsMenu').toggleClass('open')
+    this.$el.toggleClass('actions-open')
+  }
+, closeActions: function(e) {
+    if (e.target === this.getUI('actionsToggle')[0]) return
+    this.getUI('actionsMenu').removeClass('open')
+    this.$el.removeClass('actions-open')
+  }
+, actionDelete: function() {
+    this.model.destroy()
+  }
+, actionEdit: function() {
+    Radio.channel('details').trigger('edit', this.model)
+  }
+})
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
new file mode 100644
index 000000000..857983129
--- /dev/null
+++ b/js/views/BookmarkDetail.js
@@ -0,0 +1,93 @@
+import Backbone from 'backbone'
+import TagsNavigationView from './TagsNavigation'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  getTemplate: function() {
+    if (this.editing) {
+      return this.templateEditing
+    }
+    return this.templateDefault
+  },
+  templateDefault: _.template('<div class="close icon-close"></div><div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="tags"></div><div class="description"><%- description %></div>'),
+  templateEditing: _.template('<div class="close icon-close"></div><h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="tags"><input type="text" /></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>'),
+  className: "bookmark-detail",
+  regions: {
+    'tags': {
+      el: '.tags'
+    , replaceElement: true
+    }
+  },
+  ui: {
+    'close': '> .close'
+  , 'edit': '.edit'
+  , 'delete': '.delete'
+  },
+  events: {
+    'click @ui.close': 'close'
+  , 'click @ui.edit': 'edit'
+  , 'click @ui.delete': 'delete'
+  , 'click .submit': 'submit'
+  , 'click .cancel': 'cancel'
+  },
+  initialize: function(opts) {
+    this.listenTo(this.model, "change", this.render);
+    this.listenTo(app.tags, 'sync', this.render)
+  },
+  onRender: function() {
+    if (this.editing) {
+      this.$('.tags input')
+      .val(this.model.get('tags').join(','))
+      .tagit({
+        allowSpaces: true,
+        availableTags: app.tags.pluck('name'),
+        placeholderText: t('bookmarks', 'Enter tags'),
+        onTagRemoved: function() {},
+        onTagFinishRemoved: function() {},
+        onTagClicked: function(){}
+      })
+    }else{
+      var tags = new Tags(this.model.get('tags').map(function(id) {
+        return app.tags.findWhere({name: id})
+      }))
+      this.showChildView('tags', new TagsNavigationView({collection: tags}))
+    }
+  },
+  close: function() {
+    Radio.channel('details').trigger('close')
+  },
+  setEditing: function(isEditing) {
+    if (isEditing) {
+      this.editing = true
+      this.$el.addClass('editing')
+    }else{
+      this.editing = false
+      this.$el.removeClass('editing')
+    }
+    this.render()
+  },
+  edit: function() {
+    this.setEditing(true)
+  }
+, submit: function() {
+    var that = this
+    this.model.set({
+      'title': this.$('.input-title').val()
+    , 'url': this.$('.input-url').val()
+    , 'tags': this.$('.tags input').tagit("assignedTags")
+    , 'description': this.$('.input-desc').val()
+    })
+    this.model.save({wait: true})
+    this.model.once('sync', function() {
+      that.cancel()
+    })
+  }
+, cancel: function() {
+    this.setEditing(false)
+  }
+, onDestroy: function() {
+    this.close() 
+  }
+})
diff --git a/js/views/Bookmarks.js b/js/views/Bookmarks.js
new file mode 100644
index 000000000..6d1833429
--- /dev/null
+++ b/js/views/Bookmarks.js
@@ -0,0 +1,15 @@
+import Backbone from 'backbone'
+import BookmarkCardView from './BookmarkCard'
+import EmptyBookmarksView from './EmptyBookmarks'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.CollectionView.extend({
+  className: 'bookmarks'
+, regions: {
+
+  }
+, childView: function() {return BookmarkCardView}
+, emptyView: function() {return EmptyBookmarksView}
+})
diff --git a/js/views/BulkActions.js b/js/views/BulkActions.js
new file mode 100644
index 000000000..c30380604
--- /dev/null
+++ b/js/views/BulkActions.js
@@ -0,0 +1,87 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  className: 'bulk-actions'
+, template: _.template('<div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div><button class="delete"><span class="icon-delete"></span><span>Delete</span></button><div class="tags"><input type="text" /></div></div>')
+, events: {
+    'click .delete': 'delete'
+  , 'click .select-all': 'selectAll'
+  , 'click .selection-tools .close': 'abort'
+  }
+, initialize: function(opts) {
+    this.all = opts.all
+    this.selected = opts.selected
+    this.listenTo(this.selected, 'remove', this.onReduceSelection)
+    this.listenTo(this.selected, 'add', this.onExtendSelection)
+  }
+, onRender: function() {
+    // hack to ignore events caused by tagit setup -- we should really get something else...
+	this.rendering = true
+    this.$('.tags input')
+    .val(_.intersection.apply(_, this.selected.pluck('tags')).join(','))
+    .tagit({
+      allowSpaces: true,
+      availableTags: app.tags.pluck('name'),
+      placeholderText: t('bookmarks', 'Enter tags'),
+      onTagRemoved: this.onTagRemoved.bind(this),
+      onTagAdded: this.onTagAdded.bind(this),
+      onTagFinishRemoved: function() {},
+      onTagClicked: function(){}
+    })
+    this.rendering = false
+  }
+, onReduceSelection: function() {
+    if (this.selected.length == 0) {
+	    this.$el.removeClass('active')
+    }
+    this.render()
+  }
+, onExtendSelection: function() {
+    if (this.selected.length == 1) {
+      this.$el.addClass('active')
+    }
+    this.render()
+  }
+, delete: function() {
+    var that = this
+    this.selected.forEach(function(model) {
+      model.trigger('unselect', model)
+      model.destroy({
+        error: function() {
+          Backbone.history.navigate('all', {trigger: true})
+        }
+      })
+    })
+  }
+, onTagAdded: function(e, el) {
+    if (this.rendering) return
+    var tagName = $('.tagit-label', el).text()
+    this.selected.forEach(function(model) {
+      var tags = model.get('tags')
+      model.set('tags', _.union(tags, [tagName]))
+      model.save()
+    }) 
+  }
+, onTagRemoved: function(e, el) {
+    if (this.rendering) return
+    var tagName = $('.tagit-label', el).text()
+    this.selected.forEach(function(model) {
+      var tags = model.get('tags')
+      model.set('tags', _.without(tags, tagName))
+      model.save()
+    }) 
+  }
+, selectAll: function() {
+    this.all.forEach(function(model) {
+      model.trigger('select', model) 
+    })
+  }
+, abort: function() {
+    this.selected.models.slice().forEach(function(model) {
+      model.trigger('unselect', model)
+    })
+  }
+})
diff --git a/js/views/Content.js b/js/views/Content.js
new file mode 100644
index 000000000..f93528fae
--- /dev/null
+++ b/js/views/Content.js
@@ -0,0 +1,70 @@
+import Backbone from 'backbone'
+import Bookmarks from '../models/Bookmarks'
+import MobileNavView from './views/MobileNav'
+import BulkActionsView from './views/BulkActions'
+import BookmarksView from './views/Bookmarks'
+import BookmarkDetailView from './views/BookmarkDetail'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  template: _.template('<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+, regions: {
+    'mobileNav': {
+      el: '#mobile-nav-slot'
+    , replaceElement: true
+    }
+  , 'bulkActions': {
+      el: '#bulk-actions-slot'
+    , replaceElement: true
+    }
+  , 'viewBookmarks': {
+      el: '#view-bookmarks-slot'
+    , replaceElement: true
+    }
+  , 'bookmarkDetail': {
+      el: '#bookmark-detail-slot'
+    , replaceElement: true
+    }
+  }
+, initialize: function(options) {
+    this.bookmarks = options.bookmarks
+    this.selected = new Bookmarks
+    this.listenTo(this.bookmarks, 'select', this.onSelect)
+    this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
+    this.listenTo(Radio.channel('details'), 'show', this.onShowDetails)
+    this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails)
+    this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails)
+  }
+, onRender: function() {
+    this.showChildView('mobileNav', new MobileNavView())
+    this.showChildView('bulkActions', new BulkActionsView({all: this.bookmarks, selected: this.selected}))
+    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
+  }
+, onSelect: function(model) {
+    if (this.selected.length == 0) {
+      this.$el.addClass('selection-active')
+	}
+	this.selected.add(model)
+  }
+, onUnselect: function(model) {
+    if (this.selected.length == 1) {
+      this.$el.removeClass('selection-active')
+	}
+    this.selected.remove(model)
+  }
+, onShowDetails: function(model) {
+    var that = this
+    var view = new BookmarkDetailView({model: model})
+    this.showChildView('bookmarkDetail', view)
+  }
+, onEditDetails: function(model) {
+    this.onShowDetails(model)
+    this.getRegion('bookmarkDetail').currentView.setEditing(true)
+  }
+, onCloseDetails: function() {
+    this.detachChildView('bookmarkDetail')
+  }
+})
diff --git a/js/views/EmptyBookmarks.js b/js/views/EmptyBookmarks.js
new file mode 100644
index 000000000..162c76698
--- /dev/null
+++ b/js/views/EmptyBookmarks.js
@@ -0,0 +1,9 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  template: _.template('<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>')
+, className: 'bookmarks-empty'
+})
diff --git a/js/views/MobileNav.js b/js/views/MobileNav.js
new file mode 100644
index 000000000..1bc796fce
--- /dev/null
+++ b/js/views/MobileNav.js
@@ -0,0 +1,16 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  className: 'mobile-nav'
+, template: _.template('<a href="#" class="icon-menu toggle-menu"></a>')
+, events: {
+    'click .toggle-menu': 'toggleMenu'
+  }
+, toggleMenu: function(e) {
+    e.preventDefault()
+    $('body').toggleClass('mobile-nav-open')
+  }
+})
diff --git a/js/views/Navigation.js b/js/views/Navigation.js
new file mode 100644
index 000000000..51e074adb
--- /dev/null
+++ b/js/views/Navigation.js
@@ -0,0 +1,26 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  className: 'navigation'
+, tagName: 'ul'
+, template: _.template('<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li>')
+, events: {
+    'click .all': 'onClick'
+  , 'click .favorites': 'onClick'
+  , 'click .shared': 'onClick'
+  }
+, initialize: function() {
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
+  }
+, onClick: function(e) {
+    e.preventDefault()
+    Backbone.history.navigate(e.target.parentNode.dataset.id, {trigger: true})
+  }
+, onNavigate: function(category) {
+    $('.active', this.$el).removeClass('active')
+    if (category && this.$('[data-id='+category+']').length) this.$('[data-id='+category+']').addClass('active')
+  }
+})
diff --git a/js/views/SearchController.js b/js/views/SearchController.js
new file mode 100644
index 000000000..934054d56
--- /dev/null
+++ b/js/views/SearchController.js
@@ -0,0 +1,36 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  el: '#searchbox'
+, initialize: function() {
+    var that = this
+    // register a dummy search plugin
+    OC.Plugins.register('OCA.Search', { attach: function(search) {
+        search.setFilter('bookmarks', function(query) {
+          that.submit(query)
+        })
+      }
+    });
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
+  }
+, events: {
+    'keydown': 'onKeydown'
+  }
+, onRender: function() {
+    this.$el.show()
+  }
+, onNavigate: function(route, query) {
+    if (route === 'search/:query') this.$el.val(decodeURIComponent(query))
+  }
+, submit: function(query) {
+    if (query !== '') {
+      query = encodeURIComponent(query)
+      Backbone.history.navigate('search/'+query, {trigger: true})
+    }else {
+      Backbone.history.navigate('all', {trigger: true})
+    }
+  }
+})
diff --git a/js/views/Settings.js b/js/views/Settings.js
new file mode 100644
index 000000000..c50374e91
--- /dev/null
+++ b/js/views/Settings.js
@@ -0,0 +1,95 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  className: 'settings'
+, id: 'app-settings'
+, template: _.template('<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade"><span class="icon-upload"></span> Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export"><span class="icon-download"></span> Export</button><div class="import-status"></div></div>')
+, ui: {
+    'content': '#app-settings-content'
+  , 'import': '.import'
+  , 'form': '.import-form'
+  , 'iframe': '.upload'
+  , 'status': '.import-status'
+  }
+, events: {
+    'click .settings-button': 'open'
+  , 'click .import-facade': 'importTrigger'
+  , 'change @ui.import': 'importSubmit'
+  , 'load @ui.iframe': 'importResult'
+  , 'click .export': 'exportTrigger'
+  }
+, open: function(e) {
+    e.preventDefault()
+    this.getUI('content').slideToggle()
+  }
+, importTrigger: function(e) {
+    e.preventDefault()
+    this.getUI('import').click()
+  }
+, importSubmit: function(e) {
+    var that = this
+    e.preventDefault()
+    if (typeof(window.fetch) !== 'undefined') {
+      // If we have fetch() do a little hapiness dance and go!
+      var data = new FormData()
+      data.append('bm_import', this.getUI('import')[0].files[0])
+      fetch(this.getUI('form').attr('action'), {
+        method: 'POST'
+      , headers: {
+          requesttoken: oc_requesttoken
+        }
+      , body: data 
+      , mode: 'same-origin'
+      , credentials: 'same-origin'
+      })
+      .then(function(res) {
+        if (!res.ok) {
+          if (res.status === 413) {
+            return {status: 'error', data: ['Selected file is too large']}
+          }
+          return {status: 'error', data: [res.statusText]} 
+        }
+        return res.json()
+      })
+      .then(function(json) {
+        that.importResult(JSON.stringify(json));
+      })
+      .catch(function(e) {
+        that.importResult(JSON.stringify({status: 'error', data: [e.message]}));
+      })
+    } else {
+      // If we don't have fetch() ask grandpa iframe to send it
+      this.getUI('iframe').load(function() {
+        that.importResult(that.getUI('iframe').contents().text());
+      })
+      this.getUI('form').submit();
+    }
+    this.getUI('status').text(t('bookmark', 'Uploading...'));
+  }
+, importResult: function (data) {
+    var data;
+    try {
+      data = $.parseJSON(data);
+    } catch (e) {
+      this.getUI('status').text(t('bookmark', 'Import error'));
+      return;
+    }
+    if (data.status == 'error') {
+      var list = $("<ul></ul>").addClass('setting_error_list');
+      console.log(data);
+      $.each(data.data, function (index, item) {
+        list.append($("<li></li>").text(item));
+      });
+      this.getUI('status').html(list);
+      return
+    }
+    this.getUI('status').text(t('bookmark', 'Import completed successfully.'));
+    Backbone.history.navigate('all', {trigger: true})
+  }
+, exportTrigger: function() {
+    window.location = 'bookmark/export?requesttoken='+oc_requesttoken
+  }
+})
diff --git a/js/views/TagsManagement.js b/js/views/TagsManagement.js
new file mode 100644
index 000000000..0b38f8eef
--- /dev/null
+++ b/js/views/TagsManagement.js
@@ -0,0 +1,65 @@
+import Backbone from 'backbone'
+import TagView from './TagsManagementTag'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.CollectionView.extend({
+  childView: TagView
+, tagName: 'ul'
+, className: 'tags-management'
+, initialize: function(options) {
+    var that = this
+     
+    this.selected = new Tags
+    this.selected.comparator = 'name'
+    
+    this.listenTo(this.collection, 'select', this.onSelect)
+    this.listenTo(this.collection, 'unselect', this.onUnselect)
+    this.listenTo(this.collection, 'add', this.onAdd)
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
+  }
+, onNavigate: function(category, tags) {
+    // reset selection (needs slice, since we pull the models out from under the loop otherwise)
+    this.selected.slice().forEach(function(t) {
+      t.trigger('unselect', t, true)
+    })
+    if (category !== 'tags') {
+      this.lastRouteTags = [] // for the below hack
+      return
+    }
+
+    var that = this
+    // select all tags passed by router
+    tags.forEach(function(tagName) {
+      var tag = that.collection.findWhere({name: tagName})
+      if (!tag) return
+
+      tag.trigger('select', tag, true)
+    })
+
+    // hack!
+    // this is for when the route is triggered before the tags are loaded
+    this.lastRouteTags = tags
+  }
+, onAdd: function(model) {
+    if (~this.lastRouteTags.indexOf(model.get('name'))) {
+      // wait for the tag view to render, so it can receive the event
+      setTimeout(function() {
+        model.trigger('select', model, true)
+      }, 1)
+      return
+    }
+  }
+, onSelect: function(model, silentRoute) {
+    this.selected.add(model)
+    if (!silentRoute) this.triggerRoute()
+  }
+, onUnselect: function(model, silentRoute) {
+    this.selected.remove(model)
+    if (!silentRoute) this.triggerRoute()
+  }
+, triggerRoute: function() {
+    Backbone.history.navigate('tags/'+this.selected.pluck('name').map(encodeURIComponent).join(','), {trigger: true})
+  }
+})
diff --git a/js/views/TagsManagementTag.js b/js/views/TagsManagementTag.js
new file mode 100644
index 000000000..b04e2fe9a
--- /dev/null
+++ b/js/views/TagsManagementTag.js
@@ -0,0 +1,91 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  className: 'tag-man-item'
+, tagName: 'li'
+, getTemplate: function() {
+    if (this.editing) {
+      return this.templateEditing
+    }
+    return this.templateDefault
+  }
+, templateDefault: _.template('<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>')
+, templateEditing: _.template('<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>')
+, ui: {
+    'actionsMenu': '.popovermenu'
+  , 'actionsToggle': '.app-navigation-entry-utils-menu-button'
+  }
+, events: {
+    'click': 'selectSimple'
+  , 'click @ui.actionsToggle': 'toggleActions'
+  , 'click .menu-filter-add': 'actionSelect'
+  , 'click .menu-filter-remove': 'actionUnselect'
+  , 'click .menu-delete': 'actionDelete'
+  , 'click .menu-edit': 'actionEdit'
+  , 'click .action .submit': 'actionSubmit'
+  , 'click .action .cancel': 'actionCancel'
+  }
+, initialize: function() {
+    this.listenTo(this.model, 'select', this.onSelect)
+    this.listenTo(this.model, 'unselect', this.onUnselect)
+    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions)   
+  }
+, onRender: function() {
+    if (this.selected) {
+      this.$el.addClass('active')
+    }else{
+      this.$el.removeClass('active')
+    }
+    if (this.editing) {
+      this.$('input').focus()
+    }
+  }
+, onSelect: function() {
+    this.selected = true
+    this.render()
+  }
+, onUnselect: function() {
+    this.selected = false
+    this.render()
+  }
+, selectSimple: function(e) {
+    e.preventDefault()
+    if (e && !~[ this.el, this.$('a')[0], this.$('span')[0] ].indexOf(e.target)) {
+      return
+    }
+    if (this.editing) return
+    Backbone.history.navigate('tags/'+encodeURIComponent(this.model.get('name')), {trigger: true})
+  }
+, toggleActions: function() {
+    this.getUI('actionsMenu').toggleClass('open')
+  }
+, closeActions: function(e) {
+    if (this.editing || $.contains(this.getUI('actionsToggle')[0], e.target)) return
+    this.getUI('actionsMenu').removeClass('open')
+  }
+, actionSelect: function(e) {
+    this.model.trigger('select', this.model)
+  }
+, actionUnselect: function(e) {
+    this.model.trigger('unselect', this.model)
+  }
+, actionDelete: function() {
+    this.model.destroy()
+  }
+, actionEdit: function() {
+    this.editing = true
+    this.render()
+  }
+, actionSubmit: function() {
+    this.model.set('name', this.$('input').val())
+    this.model.save()
+    this.actionCancel()
+  }
+, actionCancel: function() {
+    this.editing = false
+    this.render()
+  }
+})
diff --git a/js/views/TagsNavigation.js b/js/views/TagsNavigation.js
new file mode 100644
index 000000000..3a39d1c90
--- /dev/null
+++ b/js/views/TagsNavigation.js
@@ -0,0 +1,10 @@
+import Backbone from 'backbone'
+import TagView from '../views/TagsNavigationTag'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.CollectionView.extend({
+  tagName: 'ul'
+, childView: TagView
+})
diff --git a/js/views/TagsNavigationTag.js b/js/views/TagsNavigationTag.js
new file mode 100644
index 000000000..417ef8dd1
--- /dev/null
+++ b/js/views/TagsNavigationTag.js
@@ -0,0 +1,26 @@
+import Backbone from 'backbone'
+
+const Marionette = Backone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  className: 'tag-nav-item'
+, tagName: 'li'
+, template: _.template('<a href="#"><%- name %></a>')
+, events: {
+    'click': 'open'
+  }
+, initialize: function() {
+    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
+  }
+, open: function(e) {
+    e.preventDefault()
+    Backbone.history.navigate('tags/' + encodeURIComponent(this.model.get('name')), {trigger: true});
+  }
+, onNavigate: function(category, tags) {
+    this.$el.removeClass('active')
+    if (category === 'tags' && ~tags.indexOf(this.model.get('name'))) {
+      this.$el.addClass('active')
+    }
+  }
+})

From b9b056fed638a431c45e2485ad502369c5d5ecc5 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Feb 2018 23:35:38 +0100
Subject: [PATCH 056/110] Introduce webpack bundling

+ move templates into separate files
---
 js/3rdparty/backbone.js                     | 1920 -------------------
 js/3rdparty/backbone.marionette.min.js      |   13 -
 js/3rdparty/backbone.marionette.min.js.map  |    1 -
 js/3rdparty/backbone.radio.js               |  350 ----
 js/3rdparty/backbone.radio.js.map           |    1 -
 js/3rdparty/js_tpl.js                       |   33 -
 js/Application.js                           |    2 +-
 js/Router.js                                |    2 +-
 js/index.js                                 |    3 +-
 js/templates/AddBookmark.html               |    1 +
 js/templates/App.html                       |    1 +
 js/templates/BookmarkCard.html              |    1 +
 js/templates/BookmarkDetail_default.html    |    1 +
 js/templates/BookmarkDetail_editing.html    |    1 +
 js/templates/BulkActions.html               |    1 +
 js/templates/Content.html                   |    1 +
 js/templates/EmptyBookmarks.html            |    1 +
 js/templates/MobileNav.html                 |    1 +
 js/templates/Navigation.html                |    1 +
 js/templates/Settings.html                  |    1 +
 js/templates/TagsManagementTag_default.html |    1 +
 js/templates/TagsManagementTag_editing.html |    1 +
 js/templates/TagsNavigationTag.html         |    1 +
 js/views/AddBookmark.js                     |    4 +-
 js/views/App.js                             |   16 +-
 js/views/BookmarkCard.js                    |    4 +-
 js/views/BookmarkDetail.js                  |    7 +-
 js/views/BulkActions.js                     |    4 +-
 js/views/Content.js                         |   12 +-
 js/views/EmptyBookmarks.js                  |    4 +-
 js/views/MobileNav.js                       |    4 +-
 js/views/Navigation.js                      |    4 +-
 js/views/Settings.js                        |    4 +-
 js/views/TagsManagementTag.js               |    7 +-
 js/views/TagsNavigationTag.js               |    4 +-
 package.json                                |   26 +
 webpack.config.js                           |   22 +
 37 files changed, 116 insertions(+), 2345 deletions(-)
 delete mode 100644 js/3rdparty/backbone.js
 delete mode 100644 js/3rdparty/backbone.marionette.min.js
 delete mode 100644 js/3rdparty/backbone.marionette.min.js.map
 delete mode 100644 js/3rdparty/backbone.radio.js
 delete mode 100644 js/3rdparty/backbone.radio.js.map
 delete mode 100644 js/3rdparty/js_tpl.js
 create mode 100644 js/templates/AddBookmark.html
 create mode 100644 js/templates/App.html
 create mode 100644 js/templates/BookmarkCard.html
 create mode 100644 js/templates/BookmarkDetail_default.html
 create mode 100644 js/templates/BookmarkDetail_editing.html
 create mode 100644 js/templates/BulkActions.html
 create mode 100644 js/templates/Content.html
 create mode 100644 js/templates/EmptyBookmarks.html
 create mode 100644 js/templates/MobileNav.html
 create mode 100644 js/templates/Navigation.html
 create mode 100644 js/templates/Settings.html
 create mode 100644 js/templates/TagsManagementTag_default.html
 create mode 100644 js/templates/TagsManagementTag_editing.html
 create mode 100644 js/templates/TagsNavigationTag.html
 create mode 100644 package.json
 create mode 100644 webpack.config.js

diff --git a/js/3rdparty/backbone.js b/js/3rdparty/backbone.js
deleted file mode 100644
index 55ccb22bd..000000000
--- a/js/3rdparty/backbone.js
+++ /dev/null
@@ -1,1920 +0,0 @@
-//     Backbone.js 1.3.3
-
-//     (c) 2010-2016 Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
-//     Backbone may be freely distributed under the MIT license.
-//     For all details and documentation:
-//     http://backbonejs.org
-
-(function(factory) {
-
-  // Establish the root object, `window` (`self`) in the browser, or `global` on the server.
-  // We use `self` instead of `window` for `WebWorker` support.
-  var root = (typeof self == 'object' && self.self === self && self) ||
-            (typeof global == 'object' && global.global === global && global);
-
-  // Set up Backbone appropriately for the environment. Start with AMD.
-  if (typeof define === 'function' && define.amd) {
-    define(['underscore', 'jquery', 'exports'], function(_, $, exports) {
-      // Export global even in AMD case in case this script is loaded with
-      // others that may still expect a global Backbone.
-      root.Backbone = factory(root, exports, _, $);
-    });
-
-  // Next for Node.js or CommonJS. jQuery may not be needed as a module.
-  } else if (typeof exports !== 'undefined') {
-    var _ = require('underscore'), $;
-    try { $ = require('jquery'); } catch (e) {}
-    factory(root, exports, _, $);
-
-  // Finally, as a browser global.
-  } else {
-    root.Backbone = factory(root, {}, root._, (root.jQuery || root.Zepto || root.ender || root.$));
-  }
-
-})(function(root, Backbone, _, $) {
-
-  // Initial Setup
-  // -------------
-
-  // Save the previous value of the `Backbone` variable, so that it can be
-  // restored later on, if `noConflict` is used.
-  var previousBackbone = root.Backbone;
-
-  // Create a local reference to a common array method we'll want to use later.
-  var slice = Array.prototype.slice;
-
-  // Current version of the library. Keep in sync with `package.json`.
-  Backbone.VERSION = '1.3.3';
-
-  // For Backbone's purposes, jQuery, Zepto, Ender, or My Library (kidding) owns
-  // the `$` variable.
-  Backbone.$ = $;
-
-  // Runs Backbone.js in *noConflict* mode, returning the `Backbone` variable
-  // to its previous owner. Returns a reference to this Backbone object.
-  Backbone.noConflict = function() {
-    root.Backbone = previousBackbone;
-    return this;
-  };
-
-  // Turn on `emulateHTTP` to support legacy HTTP servers. Setting this option
-  // will fake `"PATCH"`, `"PUT"` and `"DELETE"` requests via the `_method` parameter and
-  // set a `X-Http-Method-Override` header.
-  Backbone.emulateHTTP = false;
-
-  // Turn on `emulateJSON` to support legacy servers that can't deal with direct
-  // `application/json` requests ... this will encode the body as
-  // `application/x-www-form-urlencoded` instead and will send the model in a
-  // form param named `model`.
-  Backbone.emulateJSON = false;
-
-  // Proxy Backbone class methods to Underscore functions, wrapping the model's
-  // `attributes` object or collection's `models` array behind the scenes.
-  //
-  // collection.filter(function(model) { return model.get('age') > 10 });
-  // collection.each(this.addView);
-  //
-  // `Function#apply` can be slow so we use the method's arg count, if we know it.
-  var addMethod = function(length, method, attribute) {
-    switch (length) {
-      case 1: return function() {
-        return _[method](this[attribute]);
-      };
-      case 2: return function(value) {
-        return _[method](this[attribute], value);
-      };
-      case 3: return function(iteratee, context) {
-        return _[method](this[attribute], cb(iteratee, this), context);
-      };
-      case 4: return function(iteratee, defaultVal, context) {
-        return _[method](this[attribute], cb(iteratee, this), defaultVal, context);
-      };
-      default: return function() {
-        var args = slice.call(arguments);
-        args.unshift(this[attribute]);
-        return _[method].apply(_, args);
-      };
-    }
-  };
-  var addUnderscoreMethods = function(Class, methods, attribute) {
-    _.each(methods, function(length, method) {
-      if (_[method]) Class.prototype[method] = addMethod(length, method, attribute);
-    });
-  };
-
-  // Support `collection.sortBy('attr')` and `collection.findWhere({id: 1})`.
-  var cb = function(iteratee, instance) {
-    if (_.isFunction(iteratee)) return iteratee;
-    if (_.isObject(iteratee) && !instance._isModel(iteratee)) return modelMatcher(iteratee);
-    if (_.isString(iteratee)) return function(model) { return model.get(iteratee); };
-    return iteratee;
-  };
-  var modelMatcher = function(attrs) {
-    var matcher = _.matches(attrs);
-    return function(model) {
-      return matcher(model.attributes);
-    };
-  };
-
-  // Backbone.Events
-  // ---------------
-
-  // A module that can be mixed in to *any object* in order to provide it with
-  // a custom event channel. You may bind a callback to an event with `on` or
-  // remove with `off`; `trigger`-ing an event fires all callbacks in
-  // succession.
-  //
-  //     var object = {};
-  //     _.extend(object, Backbone.Events);
-  //     object.on('expand', function(){ alert('expanded'); });
-  //     object.trigger('expand');
-  //
-  var Events = Backbone.Events = {};
-
-  // Regular expression used to split event strings.
-  var eventSplitter = /\s+/;
-
-  // Iterates over the standard `event, callback` (as well as the fancy multiple
-  // space-separated events `"change blur", callback` and jQuery-style event
-  // maps `{event: callback}`).
-  var eventsApi = function(iteratee, events, name, callback, opts) {
-    var i = 0, names;
-    if (name && typeof name === 'object') {
-      // Handle event maps.
-      if (callback !== void 0 && 'context' in opts && opts.context === void 0) opts.context = callback;
-      for (names = _.keys(name); i < names.length ; i++) {
-        events = eventsApi(iteratee, events, names[i], name[names[i]], opts);
-      }
-    } else if (name && eventSplitter.test(name)) {
-      // Handle space-separated event names by delegating them individually.
-      for (names = name.split(eventSplitter); i < names.length; i++) {
-        events = iteratee(events, names[i], callback, opts);
-      }
-    } else {
-      // Finally, standard events.
-      events = iteratee(events, name, callback, opts);
-    }
-    return events;
-  };
-
-  // Bind an event to a `callback` function. Passing `"all"` will bind
-  // the callback to all events fired.
-  Events.on = function(name, callback, context) {
-    return internalOn(this, name, callback, context);
-  };
-
-  // Guard the `listening` argument from the public API.
-  var internalOn = function(obj, name, callback, context, listening) {
-    obj._events = eventsApi(onApi, obj._events || {}, name, callback, {
-      context: context,
-      ctx: obj,
-      listening: listening
-    });
-
-    if (listening) {
-      var listeners = obj._listeners || (obj._listeners = {});
-      listeners[listening.id] = listening;
-    }
-
-    return obj;
-  };
-
-  // Inversion-of-control versions of `on`. Tell *this* object to listen to
-  // an event in another object... keeping track of what it's listening to
-  // for easier unbinding later.
-  Events.listenTo = function(obj, name, callback) {
-    if (!obj) return this;
-    var id = obj._listenId || (obj._listenId = _.uniqueId('l'));
-    var listeningTo = this._listeningTo || (this._listeningTo = {});
-    var listening = listeningTo[id];
-
-    // This object is not listening to any other events on `obj` yet.
-    // Setup the necessary references to track the listening callbacks.
-    if (!listening) {
-      var thisId = this._listenId || (this._listenId = _.uniqueId('l'));
-      listening = listeningTo[id] = {obj: obj, objId: id, id: thisId, listeningTo: listeningTo, count: 0};
-    }
-
-    // Bind callbacks on obj, and keep track of them on listening.
-    internalOn(obj, name, callback, this, listening);
-    return this;
-  };
-
-  // The reducing API that adds a callback to the `events` object.
-  var onApi = function(events, name, callback, options) {
-    if (callback) {
-      var handlers = events[name] || (events[name] = []);
-      var context = options.context, ctx = options.ctx, listening = options.listening;
-      if (listening) listening.count++;
-
-      handlers.push({callback: callback, context: context, ctx: context || ctx, listening: listening});
-    }
-    return events;
-  };
-
-  // Remove one or many callbacks. If `context` is null, removes all
-  // callbacks with that function. If `callback` is null, removes all
-  // callbacks for the event. If `name` is null, removes all bound
-  // callbacks for all events.
-  Events.off = function(name, callback, context) {
-    if (!this._events) return this;
-    this._events = eventsApi(offApi, this._events, name, callback, {
-      context: context,
-      listeners: this._listeners
-    });
-    return this;
-  };
-
-  // Tell this object to stop listening to either specific events ... or
-  // to every object it's currently listening to.
-  Events.stopListening = function(obj, name, callback) {
-    var listeningTo = this._listeningTo;
-    if (!listeningTo) return this;
-
-    var ids = obj ? [obj._listenId] : _.keys(listeningTo);
-
-    for (var i = 0; i < ids.length; i++) {
-      var listening = listeningTo[ids[i]];
-
-      // If listening doesn't exist, this object is not currently
-      // listening to obj. Break out early.
-      if (!listening) break;
-
-      listening.obj.off(name, callback, this);
-    }
-
-    return this;
-  };
-
-  // The reducing API that removes a callback from the `events` object.
-  var offApi = function(events, name, callback, options) {
-    if (!events) return;
-
-    var i = 0, listening;
-    var context = options.context, listeners = options.listeners;
-
-    // Delete all events listeners and "drop" events.
-    if (!name && !callback && !context) {
-      var ids = _.keys(listeners);
-      for (; i < ids.length; i++) {
-        listening = listeners[ids[i]];
-        delete listeners[listening.id];
-        delete listening.listeningTo[listening.objId];
-      }
-      return;
-    }
-
-    var names = name ? [name] : _.keys(events);
-    for (; i < names.length; i++) {
-      name = names[i];
-      var handlers = events[name];
-
-      // Bail out if there are no events stored.
-      if (!handlers) break;
-
-      // Replace events if there are any remaining.  Otherwise, clean up.
-      var remaining = [];
-      for (var j = 0; j < handlers.length; j++) {
-        var handler = handlers[j];
-        if (
-          callback && callback !== handler.callback &&
-            callback !== handler.callback._callback ||
-              context && context !== handler.context
-        ) {
-          remaining.push(handler);
-        } else {
-          listening = handler.listening;
-          if (listening && --listening.count === 0) {
-            delete listeners[listening.id];
-            delete listening.listeningTo[listening.objId];
-          }
-        }
-      }
-
-      // Update tail event if the list has any events.  Otherwise, clean up.
-      if (remaining.length) {
-        events[name] = remaining;
-      } else {
-        delete events[name];
-      }
-    }
-    return events;
-  };
-
-  // Bind an event to only be triggered a single time. After the first time
-  // the callback is invoked, its listener will be removed. If multiple events
-  // are passed in using the space-separated syntax, the handler will fire
-  // once for each event, not once for a combination of all events.
-  Events.once = function(name, callback, context) {
-    // Map the event into a `{event: once}` object.
-    var events = eventsApi(onceMap, {}, name, callback, _.bind(this.off, this));
-    if (typeof name === 'string' && context == null) callback = void 0;
-    return this.on(events, callback, context);
-  };
-
-  // Inversion-of-control versions of `once`.
-  Events.listenToOnce = function(obj, name, callback) {
-    // Map the event into a `{event: once}` object.
-    var events = eventsApi(onceMap, {}, name, callback, _.bind(this.stopListening, this, obj));
-    return this.listenTo(obj, events);
-  };
-
-  // Reduces the event callbacks into a map of `{event: onceWrapper}`.
-  // `offer` unbinds the `onceWrapper` after it has been called.
-  var onceMap = function(map, name, callback, offer) {
-    if (callback) {
-      var once = map[name] = _.once(function() {
-        offer(name, once);
-        callback.apply(this, arguments);
-      });
-      once._callback = callback;
-    }
-    return map;
-  };
-
-  // Trigger one or many events, firing all bound callbacks. Callbacks are
-  // passed the same arguments as `trigger` is, apart from the event name
-  // (unless you're listening on `"all"`, which will cause your callback to
-  // receive the true name of the event as the first argument).
-  Events.trigger = function(name) {
-    if (!this._events) return this;
-
-    var length = Math.max(0, arguments.length - 1);
-    var args = Array(length);
-    for (var i = 0; i < length; i++) args[i] = arguments[i + 1];
-
-    eventsApi(triggerApi, this._events, name, void 0, args);
-    return this;
-  };
-
-  // Handles triggering the appropriate event callbacks.
-  var triggerApi = function(objEvents, name, callback, args) {
-    if (objEvents) {
-      var events = objEvents[name];
-      var allEvents = objEvents.all;
-      if (events && allEvents) allEvents = allEvents.slice();
-      if (events) triggerEvents(events, args);
-      if (allEvents) triggerEvents(allEvents, [name].concat(args));
-    }
-    return objEvents;
-  };
-
-  // A difficult-to-believe, but optimized internal dispatch function for
-  // triggering events. Tries to keep the usual cases speedy (most internal
-  // Backbone events have 3 arguments).
-  var triggerEvents = function(events, args) {
-    var ev, i = -1, l = events.length, a1 = args[0], a2 = args[1], a3 = args[2];
-    switch (args.length) {
-      case 0: while (++i < l) (ev = events[i]).callback.call(ev.ctx); return;
-      case 1: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1); return;
-      case 2: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2); return;
-      case 3: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2, a3); return;
-      default: while (++i < l) (ev = events[i]).callback.apply(ev.ctx, args); return;
-    }
-  };
-
-  // Aliases for backwards compatibility.
-  Events.bind   = Events.on;
-  Events.unbind = Events.off;
-
-  // Allow the `Backbone` object to serve as a global event bus, for folks who
-  // want global "pubsub" in a convenient place.
-  _.extend(Backbone, Events);
-
-  // Backbone.Model
-  // --------------
-
-  // Backbone **Models** are the basic data object in the framework --
-  // frequently representing a row in a table in a database on your server.
-  // A discrete chunk of data and a bunch of useful, related methods for
-  // performing computations and transformations on that data.
-
-  // Create a new model with the specified attributes. A client id (`cid`)
-  // is automatically generated and assigned for you.
-  var Model = Backbone.Model = function(attributes, options) {
-    var attrs = attributes || {};
-    options || (options = {});
-    this.cid = _.uniqueId(this.cidPrefix);
-    this.attributes = {};
-    if (options.collection) this.collection = options.collection;
-    if (options.parse) attrs = this.parse(attrs, options) || {};
-    var defaults = _.result(this, 'defaults');
-    attrs = _.defaults(_.extend({}, defaults, attrs), defaults);
-    this.set(attrs, options);
-    this.changed = {};
-    this.initialize.apply(this, arguments);
-  };
-
-  // Attach all inheritable methods to the Model prototype.
-  _.extend(Model.prototype, Events, {
-
-    // A hash of attributes whose current and previous value differ.
-    changed: null,
-
-    // The value returned during the last failed validation.
-    validationError: null,
-
-    // The default name for the JSON `id` attribute is `"id"`. MongoDB and
-    // CouchDB users may want to set this to `"_id"`.
-    idAttribute: 'id',
-
-    // The prefix is used to create the client id which is used to identify models locally.
-    // You may want to override this if you're experiencing name clashes with model ids.
-    cidPrefix: 'c',
-
-    // Initialize is an empty function by default. Override it with your own
-    // initialization logic.
-    initialize: function(){},
-
-    // Return a copy of the model's `attributes` object.
-    toJSON: function(options) {
-      return _.clone(this.attributes);
-    },
-
-    // Proxy `Backbone.sync` by default -- but override this if you need
-    // custom syncing semantics for *this* particular model.
-    sync: function() {
-      return Backbone.sync.apply(this, arguments);
-    },
-
-    // Get the value of an attribute.
-    get: function(attr) {
-      return this.attributes[attr];
-    },
-
-    // Get the HTML-escaped value of an attribute.
-    escape: function(attr) {
-      return _.escape(this.get(attr));
-    },
-
-    // Returns `true` if the attribute contains a value that is not null
-    // or undefined.
-    has: function(attr) {
-      return this.get(attr) != null;
-    },
-
-    // Special-cased proxy to underscore's `_.matches` method.
-    matches: function(attrs) {
-      return !!_.iteratee(attrs, this)(this.attributes);
-    },
-
-    // Set a hash of model attributes on the object, firing `"change"`. This is
-    // the core primitive operation of a model, updating the data and notifying
-    // anyone who needs to know about the change in state. The heart of the beast.
-    set: function(key, val, options) {
-      if (key == null) return this;
-
-      // Handle both `"key", value` and `{key: value}` -style arguments.
-      var attrs;
-      if (typeof key === 'object') {
-        attrs = key;
-        options = val;
-      } else {
-        (attrs = {})[key] = val;
-      }
-
-      options || (options = {});
-
-      // Run validation.
-      if (!this._validate(attrs, options)) return false;
-
-      // Extract attributes and options.
-      var unset      = options.unset;
-      var silent     = options.silent;
-      var changes    = [];
-      var changing   = this._changing;
-      this._changing = true;
-
-      if (!changing) {
-        this._previousAttributes = _.clone(this.attributes);
-        this.changed = {};
-      }
-
-      var current = this.attributes;
-      var changed = this.changed;
-      var prev    = this._previousAttributes;
-
-      // For each `set` attribute, update or delete the current value.
-      for (var attr in attrs) {
-        val = attrs[attr];
-        if (!_.isEqual(current[attr], val)) changes.push(attr);
-        if (!_.isEqual(prev[attr], val)) {
-          changed[attr] = val;
-        } else {
-          delete changed[attr];
-        }
-        unset ? delete current[attr] : current[attr] = val;
-      }
-
-      // Update the `id`.
-      if (this.idAttribute in attrs) this.id = this.get(this.idAttribute);
-
-      // Trigger all relevant attribute changes.
-      if (!silent) {
-        if (changes.length) this._pending = options;
-        for (var i = 0; i < changes.length; i++) {
-          this.trigger('change:' + changes[i], this, current[changes[i]], options);
-        }
-      }
-
-      // You might be wondering why there's a `while` loop here. Changes can
-      // be recursively nested within `"change"` events.
-      if (changing) return this;
-      if (!silent) {
-        while (this._pending) {
-          options = this._pending;
-          this._pending = false;
-          this.trigger('change', this, options);
-        }
-      }
-      this._pending = false;
-      this._changing = false;
-      return this;
-    },
-
-    // Remove an attribute from the model, firing `"change"`. `unset` is a noop
-    // if the attribute doesn't exist.
-    unset: function(attr, options) {
-      return this.set(attr, void 0, _.extend({}, options, {unset: true}));
-    },
-
-    // Clear all attributes on the model, firing `"change"`.
-    clear: function(options) {
-      var attrs = {};
-      for (var key in this.attributes) attrs[key] = void 0;
-      return this.set(attrs, _.extend({}, options, {unset: true}));
-    },
-
-    // Determine if the model has changed since the last `"change"` event.
-    // If you specify an attribute name, determine if that attribute has changed.
-    hasChanged: function(attr) {
-      if (attr == null) return !_.isEmpty(this.changed);
-      return _.has(this.changed, attr);
-    },
-
-    // Return an object containing all the attributes that have changed, or
-    // false if there are no changed attributes. Useful for determining what
-    // parts of a view need to be updated and/or what attributes need to be
-    // persisted to the server. Unset attributes will be set to undefined.
-    // You can also pass an attributes object to diff against the model,
-    // determining if there *would be* a change.
-    changedAttributes: function(diff) {
-      if (!diff) return this.hasChanged() ? _.clone(this.changed) : false;
-      var old = this._changing ? this._previousAttributes : this.attributes;
-      var changed = {};
-      for (var attr in diff) {
-        var val = diff[attr];
-        if (_.isEqual(old[attr], val)) continue;
-        changed[attr] = val;
-      }
-      return _.size(changed) ? changed : false;
-    },
-
-    // Get the previous value of an attribute, recorded at the time the last
-    // `"change"` event was fired.
-    previous: function(attr) {
-      if (attr == null || !this._previousAttributes) return null;
-      return this._previousAttributes[attr];
-    },
-
-    // Get all of the attributes of the model at the time of the previous
-    // `"change"` event.
-    previousAttributes: function() {
-      return _.clone(this._previousAttributes);
-    },
-
-    // Fetch the model from the server, merging the response with the model's
-    // local attributes. Any changed attributes will trigger a "change" event.
-    fetch: function(options) {
-      options = _.extend({parse: true}, options);
-      var model = this;
-      var success = options.success;
-      options.success = function(resp) {
-        var serverAttrs = options.parse ? model.parse(resp, options) : resp;
-        if (!model.set(serverAttrs, options)) return false;
-        if (success) success.call(options.context, model, resp, options);
-        model.trigger('sync', model, resp, options);
-      };
-      wrapError(this, options);
-      return this.sync('read', this, options);
-    },
-
-    // Set a hash of model attributes, and sync the model to the server.
-    // If the server returns an attributes hash that differs, the model's
-    // state will be `set` again.
-    save: function(key, val, options) {
-      // Handle both `"key", value` and `{key: value}` -style arguments.
-      var attrs;
-      if (key == null || typeof key === 'object') {
-        attrs = key;
-        options = val;
-      } else {
-        (attrs = {})[key] = val;
-      }
-
-      options = _.extend({validate: true, parse: true}, options);
-      var wait = options.wait;
-
-      // If we're not waiting and attributes exist, save acts as
-      // `set(attr).save(null, opts)` with validation. Otherwise, check if
-      // the model will be valid when the attributes, if any, are set.
-      if (attrs && !wait) {
-        if (!this.set(attrs, options)) return false;
-      } else if (!this._validate(attrs, options)) {
-        return false;
-      }
-
-      // After a successful server-side save, the client is (optionally)
-      // updated with the server-side state.
-      var model = this;
-      var success = options.success;
-      var attributes = this.attributes;
-      options.success = function(resp) {
-        // Ensure attributes are restored during synchronous saves.
-        model.attributes = attributes;
-        var serverAttrs = options.parse ? model.parse(resp, options) : resp;
-        if (wait) serverAttrs = _.extend({}, attrs, serverAttrs);
-        if (serverAttrs && !model.set(serverAttrs, options)) return false;
-        if (success) success.call(options.context, model, resp, options);
-        model.trigger('sync', model, resp, options);
-      };
-      wrapError(this, options);
-
-      // Set temporary attributes if `{wait: true}` to properly find new ids.
-      if (attrs && wait) this.attributes = _.extend({}, attributes, attrs);
-
-      var method = this.isNew() ? 'create' : (options.patch ? 'patch' : 'update');
-      if (method === 'patch' && !options.attrs) options.attrs = attrs;
-      var xhr = this.sync(method, this, options);
-
-      // Restore attributes.
-      this.attributes = attributes;
-
-      return xhr;
-    },
-
-    // Destroy this model on the server if it was already persisted.
-    // Optimistically removes the model from its collection, if it has one.
-    // If `wait: true` is passed, waits for the server to respond before removal.
-    destroy: function(options) {
-      options = options ? _.clone(options) : {};
-      var model = this;
-      var success = options.success;
-      var wait = options.wait;
-
-      var destroy = function() {
-        model.stopListening();
-        model.trigger('destroy', model, model.collection, options);
-      };
-
-      options.success = function(resp) {
-        if (wait) destroy();
-        if (success) success.call(options.context, model, resp, options);
-        if (!model.isNew()) model.trigger('sync', model, resp, options);
-      };
-
-      var xhr = false;
-      if (this.isNew()) {
-        _.defer(options.success);
-      } else {
-        wrapError(this, options);
-        xhr = this.sync('delete', this, options);
-      }
-      if (!wait) destroy();
-      return xhr;
-    },
-
-    // Default URL for the model's representation on the server -- if you're
-    // using Backbone's restful methods, override this to change the endpoint
-    // that will be called.
-    url: function() {
-      var base =
-        _.result(this, 'urlRoot') ||
-        _.result(this.collection, 'url') ||
-        urlError();
-      if (this.isNew()) return base;
-      var id = this.get(this.idAttribute);
-      return base.replace(/[^\/]$/, '$&/') + encodeURIComponent(id);
-    },
-
-    // **parse** converts a response into the hash of attributes to be `set` on
-    // the model. The default implementation is just to pass the response along.
-    parse: function(resp, options) {
-      return resp;
-    },
-
-    // Create a new model with identical attributes to this one.
-    clone: function() {
-      return new this.constructor(this.attributes);
-    },
-
-    // A model is new if it has never been saved to the server, and lacks an id.
-    isNew: function() {
-      return !this.has(this.idAttribute);
-    },
-
-    // Check if the model is currently in a valid state.
-    isValid: function(options) {
-      return this._validate({}, _.extend({}, options, {validate: true}));
-    },
-
-    // Run validation against the next complete set of model attributes,
-    // returning `true` if all is well. Otherwise, fire an `"invalid"` event.
-    _validate: function(attrs, options) {
-      if (!options.validate || !this.validate) return true;
-      attrs = _.extend({}, this.attributes, attrs);
-      var error = this.validationError = this.validate(attrs, options) || null;
-      if (!error) return true;
-      this.trigger('invalid', this, error, _.extend(options, {validationError: error}));
-      return false;
-    }
-
-  });
-
-  // Underscore methods that we want to implement on the Model, mapped to the
-  // number of arguments they take.
-  var modelMethods = {keys: 1, values: 1, pairs: 1, invert: 1, pick: 0,
-      omit: 0, chain: 1, isEmpty: 1};
-
-  // Mix in each Underscore method as a proxy to `Model#attributes`.
-  addUnderscoreMethods(Model, modelMethods, 'attributes');
-
-  // Backbone.Collection
-  // -------------------
-
-  // If models tend to represent a single row of data, a Backbone Collection is
-  // more analogous to a table full of data ... or a small slice or page of that
-  // table, or a collection of rows that belong together for a particular reason
-  // -- all of the messages in this particular folder, all of the documents
-  // belonging to this particular author, and so on. Collections maintain
-  // indexes of their models, both in order, and for lookup by `id`.
-
-  // Create a new **Collection**, perhaps to contain a specific type of `model`.
-  // If a `comparator` is specified, the Collection will maintain
-  // its models in sort order, as they're added and removed.
-  var Collection = Backbone.Collection = function(models, options) {
-    options || (options = {});
-    if (options.model) this.model = options.model;
-    if (options.comparator !== void 0) this.comparator = options.comparator;
-    this._reset();
-    this.initialize.apply(this, arguments);
-    if (models) this.reset(models, _.extend({silent: true}, options));
-  };
-
-  // Default options for `Collection#set`.
-  var setOptions = {add: true, remove: true, merge: true};
-  var addOptions = {add: true, remove: false};
-
-  // Splices `insert` into `array` at index `at`.
-  var splice = function(array, insert, at) {
-    at = Math.min(Math.max(at, 0), array.length);
-    var tail = Array(array.length - at);
-    var length = insert.length;
-    var i;
-    for (i = 0; i < tail.length; i++) tail[i] = array[i + at];
-    for (i = 0; i < length; i++) array[i + at] = insert[i];
-    for (i = 0; i < tail.length; i++) array[i + length + at] = tail[i];
-  };
-
-  // Define the Collection's inheritable methods.
-  _.extend(Collection.prototype, Events, {
-
-    // The default model for a collection is just a **Backbone.Model**.
-    // This should be overridden in most cases.
-    model: Model,
-
-    // Initialize is an empty function by default. Override it with your own
-    // initialization logic.
-    initialize: function(){},
-
-    // The JSON representation of a Collection is an array of the
-    // models' attributes.
-    toJSON: function(options) {
-      return this.map(function(model) { return model.toJSON(options); });
-    },
-
-    // Proxy `Backbone.sync` by default.
-    sync: function() {
-      return Backbone.sync.apply(this, arguments);
-    },
-
-    // Add a model, or list of models to the set. `models` may be Backbone
-    // Models or raw JavaScript objects to be converted to Models, or any
-    // combination of the two.
-    add: function(models, options) {
-      return this.set(models, _.extend({merge: false}, options, addOptions));
-    },
-
-    // Remove a model, or a list of models from the set.
-    remove: function(models, options) {
-      options = _.extend({}, options);
-      var singular = !_.isArray(models);
-      models = singular ? [models] : models.slice();
-      var removed = this._removeModels(models, options);
-      if (!options.silent && removed.length) {
-        options.changes = {added: [], merged: [], removed: removed};
-        this.trigger('update', this, options);
-      }
-      return singular ? removed[0] : removed;
-    },
-
-    // Update a collection by `set`-ing a new list of models, adding new ones,
-    // removing models that are no longer present, and merging models that
-    // already exist in the collection, as necessary. Similar to **Model#set**,
-    // the core operation for updating the data contained by the collection.
-    set: function(models, options) {
-      if (models == null) return;
-
-      options = _.extend({}, setOptions, options);
-      if (options.parse && !this._isModel(models)) {
-        models = this.parse(models, options) || [];
-      }
-
-      var singular = !_.isArray(models);
-      models = singular ? [models] : models.slice();
-
-      var at = options.at;
-      if (at != null) at = +at;
-      if (at > this.length) at = this.length;
-      if (at < 0) at += this.length + 1;
-
-      var set = [];
-      var toAdd = [];
-      var toMerge = [];
-      var toRemove = [];
-      var modelMap = {};
-
-      var add = options.add;
-      var merge = options.merge;
-      var remove = options.remove;
-
-      var sort = false;
-      var sortable = this.comparator && at == null && options.sort !== false;
-      var sortAttr = _.isString(this.comparator) ? this.comparator : null;
-
-      // Turn bare objects into model references, and prevent invalid models
-      // from being added.
-      var model, i;
-      for (i = 0; i < models.length; i++) {
-        model = models[i];
-
-        // If a duplicate is found, prevent it from being added and
-        // optionally merge it into the existing model.
-        var existing = this.get(model);
-        if (existing) {
-          if (merge && model !== existing) {
-            var attrs = this._isModel(model) ? model.attributes : model;
-            if (options.parse) attrs = existing.parse(attrs, options);
-            existing.set(attrs, options);
-            toMerge.push(existing);
-            if (sortable && !sort) sort = existing.hasChanged(sortAttr);
-          }
-          if (!modelMap[existing.cid]) {
-            modelMap[existing.cid] = true;
-            set.push(existing);
-          }
-          models[i] = existing;
-
-        // If this is a new, valid model, push it to the `toAdd` list.
-        } else if (add) {
-          model = models[i] = this._prepareModel(model, options);
-          if (model) {
-            toAdd.push(model);
-            this._addReference(model, options);
-            modelMap[model.cid] = true;
-            set.push(model);
-          }
-        }
-      }
-
-      // Remove stale models.
-      if (remove) {
-        for (i = 0; i < this.length; i++) {
-          model = this.models[i];
-          if (!modelMap[model.cid]) toRemove.push(model);
-        }
-        if (toRemove.length) this._removeModels(toRemove, options);
-      }
-
-      // See if sorting is needed, update `length` and splice in new models.
-      var orderChanged = false;
-      var replace = !sortable && add && remove;
-      if (set.length && replace) {
-        orderChanged = this.length !== set.length || _.some(this.models, function(m, index) {
-          return m !== set[index];
-        });
-        this.models.length = 0;
-        splice(this.models, set, 0);
-        this.length = this.models.length;
-      } else if (toAdd.length) {
-        if (sortable) sort = true;
-        splice(this.models, toAdd, at == null ? this.length : at);
-        this.length = this.models.length;
-      }
-
-      // Silently sort the collection if appropriate.
-      if (sort) this.sort({silent: true});
-
-      // Unless silenced, it's time to fire all appropriate add/sort/update events.
-      if (!options.silent) {
-        for (i = 0; i < toAdd.length; i++) {
-          if (at != null) options.index = at + i;
-          model = toAdd[i];
-          model.trigger('add', model, this, options);
-        }
-        if (sort || orderChanged) this.trigger('sort', this, options);
-        if (toAdd.length || toRemove.length || toMerge.length) {
-          options.changes = {
-            added: toAdd,
-            removed: toRemove,
-            merged: toMerge
-          };
-          this.trigger('update', this, options);
-        }
-      }
-
-      // Return the added (or merged) model (or models).
-      return singular ? models[0] : models;
-    },
-
-    // When you have more items than you want to add or remove individually,
-    // you can reset the entire set with a new list of models, without firing
-    // any granular `add` or `remove` events. Fires `reset` when finished.
-    // Useful for bulk operations and optimizations.
-    reset: function(models, options) {
-      options = options ? _.clone(options) : {};
-      for (var i = 0; i < this.models.length; i++) {
-        this._removeReference(this.models[i], options);
-      }
-      options.previousModels = this.models;
-      this._reset();
-      models = this.add(models, _.extend({silent: true}, options));
-      if (!options.silent) this.trigger('reset', this, options);
-      return models;
-    },
-
-    // Add a model to the end of the collection.
-    push: function(model, options) {
-      return this.add(model, _.extend({at: this.length}, options));
-    },
-
-    // Remove a model from the end of the collection.
-    pop: function(options) {
-      var model = this.at(this.length - 1);
-      return this.remove(model, options);
-    },
-
-    // Add a model to the beginning of the collection.
-    unshift: function(model, options) {
-      return this.add(model, _.extend({at: 0}, options));
-    },
-
-    // Remove a model from the beginning of the collection.
-    shift: function(options) {
-      var model = this.at(0);
-      return this.remove(model, options);
-    },
-
-    // Slice out a sub-array of models from the collection.
-    slice: function() {
-      return slice.apply(this.models, arguments);
-    },
-
-    // Get a model from the set by id, cid, model object with id or cid
-    // properties, or an attributes object that is transformed through modelId.
-    get: function(obj) {
-      if (obj == null) return void 0;
-      return this._byId[obj] ||
-        this._byId[this.modelId(obj.attributes || obj)] ||
-        obj.cid && this._byId[obj.cid];
-    },
-
-    // Returns `true` if the model is in the collection.
-    has: function(obj) {
-      return this.get(obj) != null;
-    },
-
-    // Get the model at the given index.
-    at: function(index) {
-      if (index < 0) index += this.length;
-      return this.models[index];
-    },
-
-    // Return models with matching attributes. Useful for simple cases of
-    // `filter`.
-    where: function(attrs, first) {
-      return this[first ? 'find' : 'filter'](attrs);
-    },
-
-    // Return the first model with matching attributes. Useful for simple cases
-    // of `find`.
-    findWhere: function(attrs) {
-      return this.where(attrs, true);
-    },
-
-    // Force the collection to re-sort itself. You don't need to call this under
-    // normal circumstances, as the set will maintain sort order as each item
-    // is added.
-    sort: function(options) {
-      var comparator = this.comparator;
-      if (!comparator) throw new Error('Cannot sort a set without a comparator');
-      options || (options = {});
-
-      var length = comparator.length;
-      if (_.isFunction(comparator)) comparator = _.bind(comparator, this);
-
-      // Run sort based on type of `comparator`.
-      if (length === 1 || _.isString(comparator)) {
-        this.models = this.sortBy(comparator);
-      } else {
-        this.models.sort(comparator);
-      }
-      if (!options.silent) this.trigger('sort', this, options);
-      return this;
-    },
-
-    // Pluck an attribute from each model in the collection.
-    pluck: function(attr) {
-      return this.map(attr + '');
-    },
-
-    // Fetch the default set of models for this collection, resetting the
-    // collection when they arrive. If `reset: true` is passed, the response
-    // data will be passed through the `reset` method instead of `set`.
-    fetch: function(options) {
-      options = _.extend({parse: true}, options);
-      var success = options.success;
-      var collection = this;
-      options.success = function(resp) {
-        var method = options.reset ? 'reset' : 'set';
-        collection[method](resp, options);
-        if (success) success.call(options.context, collection, resp, options);
-        collection.trigger('sync', collection, resp, options);
-      };
-      wrapError(this, options);
-      return this.sync('read', this, options);
-    },
-
-    // Create a new instance of a model in this collection. Add the model to the
-    // collection immediately, unless `wait: true` is passed, in which case we
-    // wait for the server to agree.
-    create: function(model, options) {
-      options = options ? _.clone(options) : {};
-      var wait = options.wait;
-      model = this._prepareModel(model, options);
-      if (!model) return false;
-      if (!wait) this.add(model, options);
-      var collection = this;
-      var success = options.success;
-      options.success = function(m, resp, callbackOpts) {
-        if (wait) collection.add(m, callbackOpts);
-        if (success) success.call(callbackOpts.context, m, resp, callbackOpts);
-      };
-      model.save(null, options);
-      return model;
-    },
-
-    // **parse** converts a response into a list of models to be added to the
-    // collection. The default implementation is just to pass it through.
-    parse: function(resp, options) {
-      return resp;
-    },
-
-    // Create a new collection with an identical list of models as this one.
-    clone: function() {
-      return new this.constructor(this.models, {
-        model: this.model,
-        comparator: this.comparator
-      });
-    },
-
-    // Define how to uniquely identify models in the collection.
-    modelId: function(attrs) {
-      return attrs[this.model.prototype.idAttribute || 'id'];
-    },
-
-    // Private method to reset all internal state. Called when the collection
-    // is first initialized or reset.
-    _reset: function() {
-      this.length = 0;
-      this.models = [];
-      this._byId  = {};
-    },
-
-    // Prepare a hash of attributes (or other model) to be added to this
-    // collection.
-    _prepareModel: function(attrs, options) {
-      if (this._isModel(attrs)) {
-        if (!attrs.collection) attrs.collection = this;
-        return attrs;
-      }
-      options = options ? _.clone(options) : {};
-      options.collection = this;
-      var model = new this.model(attrs, options);
-      if (!model.validationError) return model;
-      this.trigger('invalid', this, model.validationError, options);
-      return false;
-    },
-
-    // Internal method called by both remove and set.
-    _removeModels: function(models, options) {
-      var removed = [];
-      for (var i = 0; i < models.length; i++) {
-        var model = this.get(models[i]);
-        if (!model) continue;
-
-        var index = this.indexOf(model);
-        this.models.splice(index, 1);
-        this.length--;
-
-        // Remove references before triggering 'remove' event to prevent an
-        // infinite loop. #3693
-        delete this._byId[model.cid];
-        var id = this.modelId(model.attributes);
-        if (id != null) delete this._byId[id];
-
-        if (!options.silent) {
-          options.index = index;
-          model.trigger('remove', model, this, options);
-        }
-
-        removed.push(model);
-        this._removeReference(model, options);
-      }
-      return removed;
-    },
-
-    // Method for checking whether an object should be considered a model for
-    // the purposes of adding to the collection.
-    _isModel: function(model) {
-      return model instanceof Model;
-    },
-
-    // Internal method to create a model's ties to a collection.
-    _addReference: function(model, options) {
-      this._byId[model.cid] = model;
-      var id = this.modelId(model.attributes);
-      if (id != null) this._byId[id] = model;
-      model.on('all', this._onModelEvent, this);
-    },
-
-    // Internal method to sever a model's ties to a collection.
-    _removeReference: function(model, options) {
-      delete this._byId[model.cid];
-      var id = this.modelId(model.attributes);
-      if (id != null) delete this._byId[id];
-      if (this === model.collection) delete model.collection;
-      model.off('all', this._onModelEvent, this);
-    },
-
-    // Internal method called every time a model in the set fires an event.
-    // Sets need to update their indexes when models change ids. All other
-    // events simply proxy through. "add" and "remove" events that originate
-    // in other collections are ignored.
-    _onModelEvent: function(event, model, collection, options) {
-      if (model) {
-        if ((event === 'add' || event === 'remove') && collection !== this) return;
-        if (event === 'destroy') this.remove(model, options);
-        if (event === 'change') {
-          var prevId = this.modelId(model.previousAttributes());
-          var id = this.modelId(model.attributes);
-          if (prevId !== id) {
-            if (prevId != null) delete this._byId[prevId];
-            if (id != null) this._byId[id] = model;
-          }
-        }
-      }
-      this.trigger.apply(this, arguments);
-    }
-
-  });
-
-  // Underscore methods that we want to implement on the Collection.
-  // 90% of the core usefulness of Backbone Collections is actually implemented
-  // right here:
-  var collectionMethods = {forEach: 3, each: 3, map: 3, collect: 3, reduce: 0,
-      foldl: 0, inject: 0, reduceRight: 0, foldr: 0, find: 3, detect: 3, filter: 3,
-      select: 3, reject: 3, every: 3, all: 3, some: 3, any: 3, include: 3, includes: 3,
-      contains: 3, invoke: 0, max: 3, min: 3, toArray: 1, size: 1, first: 3,
-      head: 3, take: 3, initial: 3, rest: 3, tail: 3, drop: 3, last: 3,
-      without: 0, difference: 0, indexOf: 3, shuffle: 1, lastIndexOf: 3,
-      isEmpty: 1, chain: 1, sample: 3, partition: 3, groupBy: 3, countBy: 3,
-      sortBy: 3, indexBy: 3, findIndex: 3, findLastIndex: 3};
-
-  // Mix in each Underscore method as a proxy to `Collection#models`.
-  addUnderscoreMethods(Collection, collectionMethods, 'models');
-
-  // Backbone.View
-  // -------------
-
-  // Backbone Views are almost more convention than they are actual code. A View
-  // is simply a JavaScript object that represents a logical chunk of UI in the
-  // DOM. This might be a single item, an entire list, a sidebar or panel, or
-  // even the surrounding frame which wraps your whole app. Defining a chunk of
-  // UI as a **View** allows you to define your DOM events declaratively, without
-  // having to worry about render order ... and makes it easy for the view to
-  // react to specific changes in the state of your models.
-
-  // Creating a Backbone.View creates its initial element outside of the DOM,
-  // if an existing element is not provided...
-  var View = Backbone.View = function(options) {
-    this.cid = _.uniqueId('view');
-    _.extend(this, _.pick(options, viewOptions));
-    this._ensureElement();
-    this.initialize.apply(this, arguments);
-  };
-
-  // Cached regex to split keys for `delegate`.
-  var delegateEventSplitter = /^(\S+)\s*(.*)$/;
-
-  // List of view options to be set as properties.
-  var viewOptions = ['model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName', 'events'];
-
-  // Set up all inheritable **Backbone.View** properties and methods.
-  _.extend(View.prototype, Events, {
-
-    // The default `tagName` of a View's element is `"div"`.
-    tagName: 'div',
-
-    // jQuery delegate for element lookup, scoped to DOM elements within the
-    // current view. This should be preferred to global lookups where possible.
-    $: function(selector) {
-      return this.$el.find(selector);
-    },
-
-    // Initialize is an empty function by default. Override it with your own
-    // initialization logic.
-    initialize: function(){},
-
-    // **render** is the core function that your view should override, in order
-    // to populate its element (`this.el`), with the appropriate HTML. The
-    // convention is for **render** to always return `this`.
-    render: function() {
-      return this;
-    },
-
-    // Remove this view by taking the element out of the DOM, and removing any
-    // applicable Backbone.Events listeners.
-    remove: function() {
-      this._removeElement();
-      this.stopListening();
-      return this;
-    },
-
-    // Remove this view's element from the document and all event listeners
-    // attached to it. Exposed for subclasses using an alternative DOM
-    // manipulation API.
-    _removeElement: function() {
-      this.$el.remove();
-    },
-
-    // Change the view's element (`this.el` property) and re-delegate the
-    // view's events on the new element.
-    setElement: function(element) {
-      this.undelegateEvents();
-      this._setElement(element);
-      this.delegateEvents();
-      return this;
-    },
-
-    // Creates the `this.el` and `this.$el` references for this view using the
-    // given `el`. `el` can be a CSS selector or an HTML string, a jQuery
-    // context or an element. Subclasses can override this to utilize an
-    // alternative DOM manipulation API and are only required to set the
-    // `this.el` property.
-    _setElement: function(el) {
-      this.$el = el instanceof Backbone.$ ? el : Backbone.$(el);
-      this.el = this.$el[0];
-    },
-
-    // Set callbacks, where `this.events` is a hash of
-    //
-    // *{"event selector": "callback"}*
-    //
-    //     {
-    //       'mousedown .title':  'edit',
-    //       'click .button':     'save',
-    //       'click .open':       function(e) { ... }
-    //     }
-    //
-    // pairs. Callbacks will be bound to the view, with `this` set properly.
-    // Uses event delegation for efficiency.
-    // Omitting the selector binds the event to `this.el`.
-    delegateEvents: function(events) {
-      events || (events = _.result(this, 'events'));
-      if (!events) return this;
-      this.undelegateEvents();
-      for (var key in events) {
-        var method = events[key];
-        if (!_.isFunction(method)) method = this[method];
-        if (!method) continue;
-        var match = key.match(delegateEventSplitter);
-        this.delegate(match[1], match[2], _.bind(method, this));
-      }
-      return this;
-    },
-
-    // Add a single event listener to the view's element (or a child element
-    // using `selector`). This only works for delegate-able events: not `focus`,
-    // `blur`, and not `change`, `submit`, and `reset` in Internet Explorer.
-    delegate: function(eventName, selector, listener) {
-      this.$el.on(eventName + '.delegateEvents' + this.cid, selector, listener);
-      return this;
-    },
-
-    // Clears all callbacks previously bound to the view by `delegateEvents`.
-    // You usually don't need to use this, but may wish to if you have multiple
-    // Backbone views attached to the same DOM element.
-    undelegateEvents: function() {
-      if (this.$el) this.$el.off('.delegateEvents' + this.cid);
-      return this;
-    },
-
-    // A finer-grained `undelegateEvents` for removing a single delegated event.
-    // `selector` and `listener` are both optional.
-    undelegate: function(eventName, selector, listener) {
-      this.$el.off(eventName + '.delegateEvents' + this.cid, selector, listener);
-      return this;
-    },
-
-    // Produces a DOM element to be assigned to your view. Exposed for
-    // subclasses using an alternative DOM manipulation API.
-    _createElement: function(tagName) {
-      return document.createElement(tagName);
-    },
-
-    // Ensure that the View has a DOM element to render into.
-    // If `this.el` is a string, pass it through `$()`, take the first
-    // matching element, and re-assign it to `el`. Otherwise, create
-    // an element from the `id`, `className` and `tagName` properties.
-    _ensureElement: function() {
-      if (!this.el) {
-        var attrs = _.extend({}, _.result(this, 'attributes'));
-        if (this.id) attrs.id = _.result(this, 'id');
-        if (this.className) attrs['class'] = _.result(this, 'className');
-        this.setElement(this._createElement(_.result(this, 'tagName')));
-        this._setAttributes(attrs);
-      } else {
-        this.setElement(_.result(this, 'el'));
-      }
-    },
-
-    // Set attributes from a hash on this view's element.  Exposed for
-    // subclasses using an alternative DOM manipulation API.
-    _setAttributes: function(attributes) {
-      this.$el.attr(attributes);
-    }
-
-  });
-
-  // Backbone.sync
-  // -------------
-
-  // Override this function to change the manner in which Backbone persists
-  // models to the server. You will be passed the type of request, and the
-  // model in question. By default, makes a RESTful Ajax request
-  // to the model's `url()`. Some possible customizations could be:
-  //
-  // * Use `setTimeout` to batch rapid-fire updates into a single request.
-  // * Send up the models as XML instead of JSON.
-  // * Persist models via WebSockets instead of Ajax.
-  //
-  // Turn on `Backbone.emulateHTTP` in order to send `PUT` and `DELETE` requests
-  // as `POST`, with a `_method` parameter containing the true HTTP method,
-  // as well as all requests with the body as `application/x-www-form-urlencoded`
-  // instead of `application/json` with the model in a param named `model`.
-  // Useful when interfacing with server-side languages like **PHP** that make
-  // it difficult to read the body of `PUT` requests.
-  Backbone.sync = function(method, model, options) {
-    var type = methodMap[method];
-
-    // Default options, unless specified.
-    _.defaults(options || (options = {}), {
-      emulateHTTP: Backbone.emulateHTTP,
-      emulateJSON: Backbone.emulateJSON
-    });
-
-    // Default JSON-request options.
-    var params = {type: type, dataType: 'json'};
-
-    // Ensure that we have a URL.
-    if (!options.url) {
-      params.url = _.result(model, 'url') || urlError();
-    }
-
-    // Ensure that we have the appropriate request data.
-    if (options.data == null && model && (method === 'create' || method === 'update' || method === 'patch')) {
-      params.contentType = 'application/json';
-      params.data = JSON.stringify(options.attrs || model.toJSON(options));
-    }
-
-    // For older servers, emulate JSON by encoding the request into an HTML-form.
-    if (options.emulateJSON) {
-      params.contentType = 'application/x-www-form-urlencoded';
-      params.data = params.data ? {model: params.data} : {};
-    }
-
-    // For older servers, emulate HTTP by mimicking the HTTP method with `_method`
-    // And an `X-HTTP-Method-Override` header.
-    if (options.emulateHTTP && (type === 'PUT' || type === 'DELETE' || type === 'PATCH')) {
-      params.type = 'POST';
-      if (options.emulateJSON) params.data._method = type;
-      var beforeSend = options.beforeSend;
-      options.beforeSend = function(xhr) {
-        xhr.setRequestHeader('X-HTTP-Method-Override', type);
-        if (beforeSend) return beforeSend.apply(this, arguments);
-      };
-    }
-
-    // Don't process data on a non-GET request.
-    if (params.type !== 'GET' && !options.emulateJSON) {
-      params.processData = false;
-    }
-
-    // Pass along `textStatus` and `errorThrown` from jQuery.
-    var error = options.error;
-    options.error = function(xhr, textStatus, errorThrown) {
-      options.textStatus = textStatus;
-      options.errorThrown = errorThrown;
-      if (error) error.call(options.context, xhr, textStatus, errorThrown);
-    };
-
-    // Make the request, allowing the user to override any Ajax options.
-    var xhr = options.xhr = Backbone.ajax(_.extend(params, options));
-    model.trigger('request', model, xhr, options);
-    return xhr;
-  };
-
-  // Map from CRUD to HTTP for our default `Backbone.sync` implementation.
-  var methodMap = {
-    'create': 'POST',
-    'update': 'PUT',
-    'patch': 'PATCH',
-    'delete': 'DELETE',
-    'read': 'GET'
-  };
-
-  // Set the default implementation of `Backbone.ajax` to proxy through to `$`.
-  // Override this if you'd like to use a different library.
-  Backbone.ajax = function() {
-    return Backbone.$.ajax.apply(Backbone.$, arguments);
-  };
-
-  // Backbone.Router
-  // ---------------
-
-  // Routers map faux-URLs to actions, and fire events when routes are
-  // matched. Creating a new one sets its `routes` hash, if not set statically.
-  var Router = Backbone.Router = function(options) {
-    options || (options = {});
-    if (options.routes) this.routes = options.routes;
-    this._bindRoutes();
-    this.initialize.apply(this, arguments);
-  };
-
-  // Cached regular expressions for matching named param parts and splatted
-  // parts of route strings.
-  var optionalParam = /\((.*?)\)/g;
-  var namedParam    = /(\(\?)?:\w+/g;
-  var splatParam    = /\*\w+/g;
-  var escapeRegExp  = /[\-{}\[\]+?.,\\\^$|#\s]/g;
-
-  // Set up all inheritable **Backbone.Router** properties and methods.
-  _.extend(Router.prototype, Events, {
-
-    // Initialize is an empty function by default. Override it with your own
-    // initialization logic.
-    initialize: function(){},
-
-    // Manually bind a single named route to a callback. For example:
-    //
-    //     this.route('search/:query/p:num', 'search', function(query, num) {
-    //       ...
-    //     });
-    //
-    route: function(route, name, callback) {
-      if (!_.isRegExp(route)) route = this._routeToRegExp(route);
-      if (_.isFunction(name)) {
-        callback = name;
-        name = '';
-      }
-      if (!callback) callback = this[name];
-      var router = this;
-      Backbone.history.route(route, function(fragment) {
-        var args = router._extractParameters(route, fragment);
-        if (router.execute(callback, args, name) !== false) {
-          router.trigger.apply(router, ['route:' + name].concat(args));
-          router.trigger('route', name, args);
-          Backbone.history.trigger('route', router, name, args);
-        }
-      });
-      return this;
-    },
-
-    // Execute a route handler with the provided parameters.  This is an
-    // excellent place to do pre-route setup or post-route cleanup.
-    execute: function(callback, args, name) {
-      if (callback) callback.apply(this, args);
-    },
-
-    // Simple proxy to `Backbone.history` to save a fragment into the history.
-    navigate: function(fragment, options) {
-      Backbone.history.navigate(fragment, options);
-      return this;
-    },
-
-    // Bind all defined routes to `Backbone.history`. We have to reverse the
-    // order of the routes here to support behavior where the most general
-    // routes can be defined at the bottom of the route map.
-    _bindRoutes: function() {
-      if (!this.routes) return;
-      this.routes = _.result(this, 'routes');
-      var route, routes = _.keys(this.routes);
-      while ((route = routes.pop()) != null) {
-        this.route(route, this.routes[route]);
-      }
-    },
-
-    // Convert a route string into a regular expression, suitable for matching
-    // against the current location hash.
-    _routeToRegExp: function(route) {
-      route = route.replace(escapeRegExp, '\\$&')
-                   .replace(optionalParam, '(?:$1)?')
-                   .replace(namedParam, function(match, optional) {
-                     return optional ? match : '([^/?]+)';
-                   })
-                   .replace(splatParam, '([^?]*?)');
-      return new RegExp('^' + route + '(?:\\?([\\s\\S]*))?$');
-    },
-
-    // Given a route, and a URL fragment that it matches, return the array of
-    // extracted decoded parameters. Empty or unmatched parameters will be
-    // treated as `null` to normalize cross-browser behavior.
-    _extractParameters: function(route, fragment) {
-      var params = route.exec(fragment).slice(1);
-      return _.map(params, function(param, i) {
-        // Don't decode the search params.
-        if (i === params.length - 1) return param || null;
-        return param ? decodeURIComponent(param) : null;
-      });
-    }
-
-  });
-
-  // Backbone.History
-  // ----------------
-
-  // Handles cross-browser history management, based on either
-  // [pushState](http://diveintohtml5.info/history.html) and real URLs, or
-  // [onhashchange](https://developer.mozilla.org/en-US/docs/DOM/window.onhashchange)
-  // and URL fragments. If the browser supports neither (old IE, natch),
-  // falls back to polling.
-  var History = Backbone.History = function() {
-    this.handlers = [];
-    this.checkUrl = _.bind(this.checkUrl, this);
-
-    // Ensure that `History` can be used outside of the browser.
-    if (typeof window !== 'undefined') {
-      this.location = window.location;
-      this.history = window.history;
-    }
-  };
-
-  // Cached regex for stripping a leading hash/slash and trailing space.
-  var routeStripper = /^[#\/]|\s+$/g;
-
-  // Cached regex for stripping leading and trailing slashes.
-  var rootStripper = /^\/+|\/+$/g;
-
-  // Cached regex for stripping urls of hash.
-  var pathStripper = /#.*$/;
-
-  // Has the history handling already been started?
-  History.started = false;
-
-  // Set up all inheritable **Backbone.History** properties and methods.
-  _.extend(History.prototype, Events, {
-
-    // The default interval to poll for hash changes, if necessary, is
-    // twenty times a second.
-    interval: 50,
-
-    // Are we at the app root?
-    atRoot: function() {
-      var path = this.location.pathname.replace(/[^\/]$/, '$&/');
-      return path === this.root && !this.getSearch();
-    },
-
-    // Does the pathname match the root?
-    matchRoot: function() {
-      var path = this.decodeFragment(this.location.pathname);
-      var rootPath = path.slice(0, this.root.length - 1) + '/';
-      return rootPath === this.root;
-    },
-
-    // Unicode characters in `location.pathname` are percent encoded so they're
-    // decoded for comparison. `%25` should not be decoded since it may be part
-    // of an encoded parameter.
-    decodeFragment: function(fragment) {
-      return decodeURI(fragment.replace(/%25/g, '%2525'));
-    },
-
-    // In IE6, the hash fragment and search params are incorrect if the
-    // fragment contains `?`.
-    getSearch: function() {
-      var match = this.location.href.replace(/#.*/, '').match(/\?.+/);
-      return match ? match[0] : '';
-    },
-
-    // Gets the true hash value. Cannot use location.hash directly due to bug
-    // in Firefox where location.hash will always be decoded.
-    getHash: function(window) {
-      var match = (window || this).location.href.match(/#(.*)$/);
-      return match ? match[1] : '';
-    },
-
-    // Get the pathname and search params, without the root.
-    getPath: function() {
-      var path = this.decodeFragment(
-        this.location.pathname + this.getSearch()
-      ).slice(this.root.length - 1);
-      return path.charAt(0) === '/' ? path.slice(1) : path;
-    },
-
-    // Get the cross-browser normalized URL fragment from the path or hash.
-    getFragment: function(fragment) {
-      if (fragment == null) {
-        if (this._usePushState || !this._wantsHashChange) {
-          fragment = this.getPath();
-        } else {
-          fragment = this.getHash();
-        }
-      }
-      return fragment.replace(routeStripper, '');
-    },
-
-    // Start the hash change handling, returning `true` if the current URL matches
-    // an existing route, and `false` otherwise.
-    start: function(options) {
-      if (History.started) throw new Error('Backbone.history has already been started');
-      History.started = true;
-
-      // Figure out the initial configuration. Do we need an iframe?
-      // Is pushState desired ... is it available?
-      this.options          = _.extend({root: '/'}, this.options, options);
-      this.root             = this.options.root;
-      this._wantsHashChange = this.options.hashChange !== false;
-      this._hasHashChange   = 'onhashchange' in window && (document.documentMode === void 0 || document.documentMode > 7);
-      this._useHashChange   = this._wantsHashChange && this._hasHashChange;
-      this._wantsPushState  = !!this.options.pushState;
-      this._hasPushState    = !!(this.history && this.history.pushState);
-      this._usePushState    = this._wantsPushState && this._hasPushState;
-      this.fragment         = this.getFragment();
-
-      // Normalize root to always include a leading and trailing slash.
-      this.root = ('/' + this.root + '/').replace(rootStripper, '/');
-
-      // Transition from hashChange to pushState or vice versa if both are
-      // requested.
-      if (this._wantsHashChange && this._wantsPushState) {
-
-        // If we've started off with a route from a `pushState`-enabled
-        // browser, but we're currently in a browser that doesn't support it...
-        if (!this._hasPushState && !this.atRoot()) {
-          var rootPath = this.root.slice(0, -1) || '/';
-          this.location.replace(rootPath + '#' + this.getPath());
-          // Return immediately as browser will do redirect to new url
-          return true;
-
-        // Or if we've started out with a hash-based route, but we're currently
-        // in a browser where it could be `pushState`-based instead...
-        } else if (this._hasPushState && this.atRoot()) {
-          this.navigate(this.getHash(), {replace: true});
-        }
-
-      }
-
-      // Proxy an iframe to handle location events if the browser doesn't
-      // support the `hashchange` event, HTML5 history, or the user wants
-      // `hashChange` but not `pushState`.
-      if (!this._hasHashChange && this._wantsHashChange && !this._usePushState) {
-        this.iframe = document.createElement('iframe');
-        this.iframe.src = 'javascript:0';
-        this.iframe.style.display = 'none';
-        this.iframe.tabIndex = -1;
-        var body = document.body;
-        // Using `appendChild` will throw on IE < 9 if the document is not ready.
-        var iWindow = body.insertBefore(this.iframe, body.firstChild).contentWindow;
-        iWindow.document.open();
-        iWindow.document.close();
-        iWindow.location.hash = '#' + this.fragment;
-      }
-
-      // Add a cross-platform `addEventListener` shim for older browsers.
-      var addEventListener = window.addEventListener || function(eventName, listener) {
-        return attachEvent('on' + eventName, listener);
-      };
-
-      // Depending on whether we're using pushState or hashes, and whether
-      // 'onhashchange' is supported, determine how we check the URL state.
-      if (this._usePushState) {
-        addEventListener('popstate', this.checkUrl, false);
-      } else if (this._useHashChange && !this.iframe) {
-        addEventListener('hashchange', this.checkUrl, false);
-      } else if (this._wantsHashChange) {
-        this._checkUrlInterval = setInterval(this.checkUrl, this.interval);
-      }
-
-      if (!this.options.silent) return this.loadUrl();
-    },
-
-    // Disable Backbone.history, perhaps temporarily. Not useful in a real app,
-    // but possibly useful for unit testing Routers.
-    stop: function() {
-      // Add a cross-platform `removeEventListener` shim for older browsers.
-      var removeEventListener = window.removeEventListener || function(eventName, listener) {
-        return detachEvent('on' + eventName, listener);
-      };
-
-      // Remove window listeners.
-      if (this._usePushState) {
-        removeEventListener('popstate', this.checkUrl, false);
-      } else if (this._useHashChange && !this.iframe) {
-        removeEventListener('hashchange', this.checkUrl, false);
-      }
-
-      // Clean up the iframe if necessary.
-      if (this.iframe) {
-        document.body.removeChild(this.iframe);
-        this.iframe = null;
-      }
-
-      // Some environments will throw when clearing an undefined interval.
-      if (this._checkUrlInterval) clearInterval(this._checkUrlInterval);
-      History.started = false;
-    },
-
-    // Add a route to be tested when the fragment changes. Routes added later
-    // may override previous routes.
-    route: function(route, callback) {
-      this.handlers.unshift({route: route, callback: callback});
-    },
-
-    // Checks the current URL to see if it has changed, and if it has,
-    // calls `loadUrl`, normalizing across the hidden iframe.
-    checkUrl: function(e) {
-      var current = this.getFragment();
-
-      // If the user pressed the back button, the iframe's hash will have
-      // changed and we should use that for comparison.
-      if (current === this.fragment && this.iframe) {
-        current = this.getHash(this.iframe.contentWindow);
-      }
-
-      if (current === this.fragment) return false;
-      if (this.iframe) this.navigate(current);
-      this.loadUrl();
-    },
-
-    // Attempt to load the current URL fragment. If a route succeeds with a
-    // match, returns `true`. If no defined routes matches the fragment,
-    // returns `false`.
-    loadUrl: function(fragment) {
-      // If the root doesn't match, no routes can match either.
-      if (!this.matchRoot()) return false;
-      fragment = this.fragment = this.getFragment(fragment);
-      return _.some(this.handlers, function(handler) {
-        if (handler.route.test(fragment)) {
-          handler.callback(fragment);
-          return true;
-        }
-      });
-    },
-
-    // Save a fragment into the hash history, or replace the URL state if the
-    // 'replace' option is passed. You are responsible for properly URL-encoding
-    // the fragment in advance.
-    //
-    // The options object can contain `trigger: true` if you wish to have the
-    // route callback be fired (not usually desirable), or `replace: true`, if
-    // you wish to modify the current URL without adding an entry to the history.
-    navigate: function(fragment, options) {
-      if (!History.started) return false;
-      if (!options || options === true) options = {trigger: !!options};
-
-      // Normalize the fragment.
-      fragment = this.getFragment(fragment || '');
-
-      // Don't include a trailing slash on the root.
-      var rootPath = this.root;
-      if (fragment === '' || fragment.charAt(0) === '?') {
-        rootPath = rootPath.slice(0, -1) || '/';
-      }
-      var url = rootPath + fragment;
-
-      // Strip the hash and decode for matching.
-      fragment = this.decodeFragment(fragment.replace(pathStripper, ''));
-
-      if (this.fragment === fragment) return;
-      this.fragment = fragment;
-
-      // If pushState is available, we use it to set the fragment as a real URL.
-      if (this._usePushState) {
-        this.history[options.replace ? 'replaceState' : 'pushState']({}, document.title, url);
-
-      // If hash changes haven't been explicitly disabled, update the hash
-      // fragment to store history.
-      } else if (this._wantsHashChange) {
-        this._updateHash(this.location, fragment, options.replace);
-        if (this.iframe && fragment !== this.getHash(this.iframe.contentWindow)) {
-          var iWindow = this.iframe.contentWindow;
-
-          // Opening and closing the iframe tricks IE7 and earlier to push a
-          // history entry on hash-tag change.  When replace is true, we don't
-          // want this.
-          if (!options.replace) {
-            iWindow.document.open();
-            iWindow.document.close();
-          }
-
-          this._updateHash(iWindow.location, fragment, options.replace);
-        }
-
-      // If you've told us that you explicitly don't want fallback hashchange-
-      // based history, then `navigate` becomes a page refresh.
-      } else {
-        return this.location.assign(url);
-      }
-      if (options.trigger) return this.loadUrl(fragment);
-    },
-
-    // Update the hash location, either replacing the current entry, or adding
-    // a new one to the browser history.
-    _updateHash: function(location, fragment, replace) {
-      if (replace) {
-        var href = location.href.replace(/(javascript:|#).*$/, '');
-        location.replace(href + '#' + fragment);
-      } else {
-        // Some browsers require that `hash` contains a leading #.
-        location.hash = '#' + fragment;
-      }
-    }
-
-  });
-
-  // Create the default Backbone.history.
-  Backbone.history = new History;
-
-  // Helpers
-  // -------
-
-  // Helper function to correctly set up the prototype chain for subclasses.
-  // Similar to `goog.inherits`, but uses a hash of prototype properties and
-  // class properties to be extended.
-  var extend = function(protoProps, staticProps) {
-    var parent = this;
-    var child;
-
-    // The constructor function for the new subclass is either defined by you
-    // (the "constructor" property in your `extend` definition), or defaulted
-    // by us to simply call the parent constructor.
-    if (protoProps && _.has(protoProps, 'constructor')) {
-      child = protoProps.constructor;
-    } else {
-      child = function(){ return parent.apply(this, arguments); };
-    }
-
-    // Add static properties to the constructor function, if supplied.
-    _.extend(child, parent, staticProps);
-
-    // Set the prototype chain to inherit from `parent`, without calling
-    // `parent`'s constructor function and add the prototype properties.
-    child.prototype = _.create(parent.prototype, protoProps);
-    child.prototype.constructor = child;
-
-    // Set a convenience property in case the parent's prototype is needed
-    // later.
-    child.__super__ = parent.prototype;
-
-    return child;
-  };
-
-  // Set up inheritance for the model, collection, router, view and history.
-  Model.extend = Collection.extend = Router.extend = View.extend = History.extend = extend;
-
-  // Throw an error when a URL is needed, and none is supplied.
-  var urlError = function() {
-    throw new Error('A "url" property or function must be specified');
-  };
-
-  // Wrap an optional error callback with a fallback error event.
-  var wrapError = function(model, options) {
-    var error = options.error;
-    options.error = function(resp) {
-      if (error) error.call(options.context, model, resp, options);
-      model.trigger('error', model, resp, options);
-    };
-  };
-
-  return Backbone;
-});
diff --git a/js/3rdparty/backbone.marionette.min.js b/js/3rdparty/backbone.marionette.min.js
deleted file mode 100644
index 7067c3bfe..000000000
--- a/js/3rdparty/backbone.marionette.min.js
+++ /dev/null
@@ -1,13 +0,0 @@
-/**
-* @license
-* MarionetteJS (Backbone.Marionette)
-* ----------------------------------
-* v3.4.3
-*
-* Copyright (c)2017 Derick Bailey, Muted Solutions, LLC.
-* Distributed under MIT license
-*
-* http://marionettejs.com
-*/
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("backbone"),require("underscore"),require("backbone.radio")):"function"==typeof define&&define.amd?define(["backbone","underscore","backbone.radio"],t):e.Marionette=t(e.Backbone,e._,e.Backbone.Radio)}(this,function(e,t,i){"use strict";function n(e,t,i){return i.toUpperCase()}function s(e){for(var i=arguments.length,n=Array(i>1?i-1:0),s=1;s<i;s++)n[s-1]=arguments[s];var r=W(e),o=H.call(this,r),h=void 0;return t.isFunction(o)&&(h=o.apply(this,n)),this.trigger.apply(this,arguments),h}function r(e){for(var i=arguments.length,n=Array(i>1?i-1:0),r=1;r<i;r++)n[r-1]=arguments[r];return t.isFunction(e.triggerMethod)?e.triggerMethod.apply(e,n):s.apply(e,n)}function o(e,i,n){e._getImmediateChildren&&t.each(e._getImmediateChildren(),function(e){n(e)&&r(e,i,e)})}function h(e){return!e._isAttached}function d(e){return!!h(e)&&(e._isAttached=!0,!0)}function l(e){return e._isAttached}function a(e){return!!l(e)&&(e._isAttached=!1,!0)}function c(e){e._isAttached&&e._isRendered&&r(e,"dom:refresh",e)}function u(e){e._isAttached&&e._isRendered&&r(e,"dom:remove",e)}function f(){o(this,"before:attach",h)}function _(){o(this,"attach",d),c(this)}function p(){o(this,"before:detach",l),u(this)}function g(){o(this,"detach",a)}function v(){u(this)}function m(){c(this)}function w(e){e._areViewEventsMonitored||!1===e.monitorViewEvents||(e._areViewEventsMonitored=!0,e.on({"before:attach":f,attach:_,"before:detach":p,detach:g,"before:render":v,render:m}))}function y(e,i,n,s,r){var o=s.split(/\s+/);t.each(o,function(t){var s=e[t];if(!s)throw new Z('Method "'+t+'" was configured as an event handler, but does not exist.');e[r](i,n,s)})}function V(e,i,n,s){if(i&&n){if(!t.isObject(n))throw new Z({message:"Bindings must be an object.",url:"marionette.functions.html#marionettebindevents"});t.each(n,function(n,r){t.isString(n)?y(e,i,r,n,s):e[s](i,r,n)})}}function C(e,t){return V(this,e,t,"listenTo"),this}function E(e,t){return V(this,e,t,"stopListening"),this}function b(e,i,n,s){if(i&&n){if(!t.isObject(n))throw new Z({message:"Bindings must be an object.",url:"marionette.functions.html#marionettebindrequests"});var r=q.call(e,n);i[s](r,e)}}function M(e,t){return b(this,e,t,"reply"),this}function R(e,t){return b(this,e,t,"stopReplying"),this}function B(e,i){return e.behaviorClass?e.behaviorClass:t.isFunction(e)?e:t.isFunction(Pe.Behaviors.behaviorsLookup)?Pe.Behaviors.behaviorsLookup(e,i)[i]:Pe.Behaviors.behaviorsLookup[i]}function x(e,i){return t.chain(i).map(function(i,n){var s=B(i,n),r=new s(i===s?{}:i,e),o=x(e,t.result(r,"behaviors"));return[r].concat(o)}).flatten().value()}function D(e,i){return""+e+t.uniqueId(".evt")+" "+i}function A(e){return!!oe[e]}function O(e,i){t.isString(i)&&(i={event:i});var n=i.event,s=!!i.preventDefault;A("triggersPreventDefault")&&(s=!1!==i.preventDefault);var r=!!i.stopPropagation;return A("triggersStopPropagation")&&(r=!1!==i.stopPropagation),function(t){s&&t.preventDefault(),r&&t.stopPropagation(),e.triggerMethod(n,e,t)}}function I(t){return t instanceof e.$?t:e.$(t)}function $(e){return this.prototype.Dom=t.extend({},this.prototype.Dom,e),this}function T(e){e._isRendered||(e.supportsRenderLifecycle||r(e,"before:render",e),e.render(),e.supportsRenderLifecycle||(e._isRendered=!0,r(e,"render",e)))}function U(e){if(e.destroy)e.destroy();else{e.supportsDestroyLifecycle||r(e,"before:destroy",e);var t=e._isAttached&&!e._shouldDisableEvents;t&&r(e,"before:detach",e),e.remove(),t&&(e._isAttached=!1,r(e,"detach",e)),e._isDestroyed=!0,e.supportsDestroyLifecycle||r(e,"destroy",e)}}function S(e,i){var n=t.extend({},i);if(t.isString(e))return t.extend(n,{el:e}),F(n);if(t.isFunction(e))return t.extend(n,{regionClass:e}),F(n);if(t.isObject(e))return e.selector&&k("The selector option on a Region definition object is deprecated. Use el to pass a selector string"),t.extend(n,{el:e.selector},e),F(n);throw new Z({message:"Improper region configuration type.",url:"marionette.region.html#region-configuration-types"})}function F(e){return new(0,e.regionClass)(t.omit(e,"regionClass"))}function L(e,t){return t.model&&t.model.get(e)}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t,i=i&&i.hasOwnProperty("default")?i.default:i;var P=function(e){return function(t){for(var i=arguments.length,n=Array(i>1?i-1:0),s=1;s<i;s++)n[s-1]=arguments[s];return e.apply(t,n)}},z=e.Model.extend,k=function e(i,n){t.isObject(i)&&(i=i.prev+" is going to be removed in the future. Please use "+i.next+" instead."+(i.url?" See: "+i.url:"")),Pe.DEV_MODE&&(void 0!==n&&n||e._cache[i]||(e._warn("Deprecation warning: "+i),e._cache[i]=!0))};k._console="undefined"!=typeof console?console:{},k._warn=function(){return(k._console.warn||k._console.log||t.noop).apply(k._console,arguments)},k._cache={};var j=function(e){return document.documentElement.contains(e&&e.parentNode)},N=function(e,i){var n=this;e&&t.each(i,function(t){var i=e[t];void 0!==i&&(n[t]=i)})},H=function(e){if(e)return this.options&&void 0!==this.options[e]?this.options[e]:this[e]},q=function(e){var i=this;return t.reduce(e,function(e,n,s){return t.isFunction(n)||(n=i[n]),n&&(e[s]=n),e},{})},K=/(^|:)(\w)/gi,W=t.memoize(function(e){return"on"+e.replace(K,n)}),Y=["description","fileName","lineNumber","name","message","number"],Z=z.call(Error,{urlRoot:"http://marionettejs.com/docs/v3.4.3/",constructor:function(e,i){t.isObject(e)?e=(i=e).message:i||(i={});var n=Error.call(this,e);t.extend(this,t.pick(n,Y),t.pick(i,Y)),this.captureStackTrace(),i.url&&(this.url=this.urlRoot+i.url)},captureStackTrace:function(){Error.captureStackTrace&&Error.captureStackTrace(this,Z)},toString:function(){return this.name+": "+this.message+(this.url?" See: "+this.url:"")}});Z.extend=z;var G={normalizeMethods:q,_setOptions:function(e){this.options=t.extend({},t.result(this,"options"),e)},mergeOptions:N,getOption:H,bindEvents:C,unbindEvents:E},J={_initRadio:function(){var e=t.result(this,"channelName");if(e){if(!i)throw new Z({name:"BackboneRadioMissing",message:'The dependency "backbone.radio" is missing.'});var n=this._channel=i.channel(e),s=t.result(this,"radioEvents");this.bindEvents(n,s);var r=t.result(this,"radioRequests");this.bindRequests(n,r),this.on("destroy",this._destroyRadio)}},_destroyRadio:function(){this._channel.stopReplying(null,null,this)},getChannel:function(){return this._channel},bindEvents:C,unbindEvents:E,bindRequests:M,unbindRequests:R},Q=["channelName","radioEvents","radioRequests"],X=function(e){this.hasOwnProperty("options")||this._setOptions(e),this.mergeOptions(e,Q),this._setCid(),this._initRadio(),this.initialize.apply(this,arguments)};X.extend=z,t.extend(X.prototype,e.Events,G,J,{cidPrefix:"mno",_isDestroyed:!1,isDestroyed:function(){return this._isDestroyed},initialize:function(){},_setCid:function(){this.cid||(this.cid=t.uniqueId(this.cidPrefix))},destroy:function(){if(this._isDestroyed)return this;for(var e=arguments.length,t=Array(e),i=0;i<e;i++)t[i]=arguments[i];return this.triggerMethod.apply(this,["before:destroy",this].concat(t)),this._isDestroyed=!0,this.triggerMethod.apply(this,["destroy",this].concat(t)),this.stopListening(),this},triggerMethod:s});var ee=function(e){this.templateId=e};t.extend(ee,{templateCaches:{},get:function(e,t){var i=this.templateCaches[e];return i||(i=new ee(e),this.templateCaches[e]=i),i.load(t)},clear:function(){for(var e=void 0,t=arguments.length,i=Array(t),n=0;n<t;n++)i[n]=arguments[n];var s=i.length;if(s>0)for(e=0;e<s;e++)delete this.templateCaches[i[e]];else this.templateCaches={}}}),t.extend(ee.prototype,{load:function(e){if(this.compiledTemplate)return this.compiledTemplate;var t=this.loadTemplate(this.templateId,e);return this.compiledTemplate=this.compileTemplate(t,e),this.compiledTemplate},loadTemplate:function(t,i){var n=e.$(t);if(!n.length)throw new Z({name:"NoTemplateError",message:'Could not find template: "'+t+'"'});return n.html()},compileTemplate:function(e,i){return t.template(e,i)}});var te=t.invokeMap||t.invoke,ie={_initBehaviors:function(){this._behaviors=this._getBehaviors()},_getBehaviors:function(){var e=t.result(this,"behaviors");return t.isObject(e)?x(this,e):{}},_getBehaviorTriggers:function(){var e=te(this._behaviors,"getTriggers");return t.reduce(e,function(e,i){return t.extend(e,i)},{})},_getBehaviorEvents:function(){var e=te(this._behaviors,"getEvents");return t.reduce(e,function(e,i){return t.extend(e,i)},{})},_proxyBehaviorViewProperties:function(){te(this._behaviors,"proxyViewProperties")},_delegateBehaviorEntityEvents:function(){te(this._behaviors,"delegateEntityEvents")},_undelegateBehaviorEntityEvents:function(){te(this._behaviors,"undelegateEntityEvents")},_destroyBehaviors:function(){for(var e=arguments.length,t=Array(e),i=0;i<e;i++)t[i]=arguments[i];te.apply(void 0,[this._behaviors,"destroy"].concat(t))},_removeBehavior:function(e){this._isDestroyed||(this._behaviors=t.without(this._behaviors,e))},_bindBehaviorUIElements:function(){te(this._behaviors,"bindUIElements")},_unbindBehaviorUIElements:function(){te(this._behaviors,"unbindUIElements")},_triggerEventOnBehaviors:function(){for(var e=this._behaviors,t=0,i=e&&e.length;t<i;t++)s.apply(e[t],arguments)}},ne={_delegateEntityEvents:function(e,i){this._undelegateEntityEvents(e,i);var n=t.result(this,"modelEvents");C.call(this,e,n);var s=t.result(this,"collectionEvents");C.call(this,i,s)},_undelegateEntityEvents:function(e,i){var n=t.result(this,"modelEvents");E.call(this,e,n);var s=t.result(this,"collectionEvents");E.call(this,i,s)}},se=/^(\S+)\s*(.*)$/,re=function(e){var t=e.match(se);return D(t[1],t[2])},oe={childViewEventPrefix:!0,triggersStopPropagation:!0,triggersPreventDefault:!0},he={_getViewTriggers:function(e,i){return t.reduce(i,function(t,i,n){return n=re(n),t[n]=O(e,i),t},{})}},de=function(e,i){return t.reduce(e,function(e,t,n){return e[le(n,i)]=t,e},{})},le=function(e,t){return e.replace(/@ui\.[a-zA-Z-_$0-9]*/g,function(e){return t[e.slice(4)]})},ae=function e(i,n,s){return t.each(i,function(r,o){t.isString(r)?i[o]=le(r,n):t.isObject(r)&&t.isArray(s)&&(t.extend(r,e(t.pick(r,s),n)),t.each(s,function(e){var i=r[e];t.isString(i)&&(r[e]=le(i,n))}))}),i},ce={normalizeUIKeys:function(e){var t=this._getUIBindings();return de(e,t)},normalizeUIString:function(e){var t=this._getUIBindings();return le(e,t)},normalizeUIValues:function(e,t){var i=this._getUIBindings();return ae(e,i,t)},_getUIBindings:function(){var e=t.result(this,"_uiBindings"),i=t.result(this,"ui");return e||i},_bindUIElements:function(){var e=this;if(this.ui){this._uiBindings||(this._uiBindings=this.ui);var i=t.result(this,"_uiBindings");this._ui={},t.each(i,function(t,i){e._ui[i]=e.$(t)}),this.ui=this._ui}},_unbindUIElements:function(){var e=this;this.ui&&this._uiBindings&&(t.each(this.ui,function(t,i){delete e.ui[i]}),this.ui=this._uiBindings,delete this._uiBindings,delete this._ui)},_getUI:function(e){return this._ui[e]}},ue={createBuffer:function(){return document.createDocumentFragment()},getEl:function(e){return I(e)},findEl:function(e,t){return(arguments.length>2&&void 0!==arguments[2]?arguments[2]:I(e)).find(t)},hasEl:function(e,t){return e.contains(t&&t.parentNode)},detachEl:function(e){(arguments.length>1&&void 0!==arguments[1]?arguments[1]:I(e)).detach()},replaceEl:function(e,t){if(e!==t){var i=t.parentNode;i&&i.replaceChild(e,t)}},swapEl:function(e,t){if(e!==t){var i=e.parentNode,n=t.parentNode;if(i&&n){var s=e.nextSibling,r=t.nextSibling;i.insertBefore(t,s),n.insertBefore(e,r)}}},setContents:function(e,t){(arguments.length>2&&void 0!==arguments[2]?arguments[2]:I(e)).html(t)},appendContents:function(e,t){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},n=i._$el,s=void 0===n?I(e):n,r=i._$contents,o=void 0===r?I(t):r;s.append(o)},hasContents:function(e){return e.hasChildNodes()},detachContents:function(e){(arguments.length>1&&void 0!==arguments[1]?arguments[1]:I(e)).contents().detach()}},fe={Dom:ue,supportsRenderLifecycle:!0,supportsDestroyLifecycle:!0,_isDestroyed:!1,isDestroyed:function(){return!!this._isDestroyed},_isRendered:!1,isRendered:function(){return!!this._isRendered},_isAttached:!1,isAttached:function(){return!!this._isAttached},delegateEvents:function(i){this._proxyBehaviorViewProperties(),this._buildEventProxies();var n=this._getEvents(i);void 0===i&&(this.events=n);var s=t.extend({},this._getBehaviorEvents(),n,this._getBehaviorTriggers(),this.getTriggers());return e.View.prototype.delegateEvents.call(this,s),this},_getEvents:function(e){var i=e||this.events;return t.isFunction(i)?this.normalizeUIKeys(i.call(this)):this.normalizeUIKeys(i)},getTriggers:function(){if(this.triggers){var e=this.normalizeUIKeys(t.result(this,"triggers"));return this._getViewTriggers(this,e)}},delegateEntityEvents:function(){return this._delegateEntityEvents(this.model,this.collection),this._delegateBehaviorEntityEvents(),this},undelegateEntityEvents:function(){return this._undelegateEntityEvents(this.model,this.collection),this._undelegateBehaviorEntityEvents(),this},destroy:function(){if(this._isDestroyed)return this;for(var e=this._isAttached&&!this._shouldDisableEvents,t=arguments.length,i=Array(t),n=0;n<t;n++)i[n]=arguments[n];return this.triggerMethod.apply(this,["before:destroy",this].concat(i)),e&&this.triggerMethod("before:detach",this),this.unbindUIElements(),this._removeElement(),e&&(this._isAttached=!1,this.triggerMethod("detach",this)),this._removeChildren(),this._isDestroyed=!0,this._isRendered=!1,this._destroyBehaviors.apply(this,i),this.triggerMethod.apply(this,["destroy",this].concat(i)),this.stopListening(),this},_removeElement:function(){this.$el.off().removeData(),this.Dom.detachEl(this.el,this.$el)},bindUIElements:function(){return this._bindUIElements(),this._bindBehaviorUIElements(),this},unbindUIElements:function(){return this._unbindUIElements(),this._unbindBehaviorUIElements(),this},getUI:function(e){return this._getUI(e)},childViewEventPrefix:function(){return!!A("childViewEventPrefix")&&"childview"},triggerMethod:function(){var e=s.apply(this,arguments);return this._triggerEventOnBehaviors.apply(this,arguments),e},_buildEventProxies:function(){this._childViewEvents=t.result(this,"childViewEvents"),this._childViewTriggers=t.result(this,"childViewTriggers")},_proxyChildViewEvents:function(e){this.listenTo(e,"all",this._childViewEventHandler)},_childViewEventHandler:function(e){for(var i=this.normalizeMethods(this._childViewEvents),n=arguments.length,s=Array(n>1?n-1:0),r=1;r<n;r++)s[r-1]=arguments[r];void 0!==i&&t.isFunction(i[e])&&i[e].apply(this,s);var o=this._childViewTriggers;o&&t.isString(o[e])&&this.triggerMethod.apply(this,[o[e]].concat(s));var h=t.result(this,"childViewEventPrefix");if(!1!==h){var d=h+":"+e;this.triggerMethod.apply(this,[d].concat(s))}}};t.extend(fe,ie,G,ne,he,ce);var _e=["allowMissingEl","parentEl","replaceElement"],pe=X.extend({Dom:ue,cidPrefix:"mnr",replaceElement:!1,_isReplaced:!1,_isSwappingView:!1,constructor:function(t){if(this._setOptions(t),this.mergeOptions(t,_e),this._initEl=this.el=this.getOption("el"),this.el=this.el instanceof e.$?this.el[0]:this.el,!this.el)throw new Z({name:"NoElError",message:'An "el" must be specified for a region.'});this.$el=this.getEl(this.el),X.call(this,t)},show:function(e,t){if(this._ensureElement(t))return(e=this._getView(e,t))===this.currentView?this:(this._isSwappingView=!!this.currentView,this.triggerMethod("before:show",this,e,t),e._isAttached||this.empty(t),this._setupChildView(e),this.currentView=e,T(e),this._attachView(e,t),this.triggerMethod("show",this,e,t),this._isSwappingView=!1,this)},_setupChildView:function(e){w(e),this._proxyChildViewEvents(e),e.on("destroy",this._empty,this)},_proxyChildViewEvents:function(e){var t=this._parentView;t&&t._proxyChildViewEvents(e)},_shouldDisableMonitoring:function(){return this._parentView&&!1===this._parentView.monitorViewEvents},_attachView:function(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=!e._isAttached&&j(this.el)&&!this._shouldDisableMonitoring(),s=void 0===i.replaceElement?!!t.result(this,"replaceElement"):!!i.replaceElement;n&&r(e,"before:attach",e),s?this._replaceEl(e):this.attachHtml(e),n&&(e._isAttached=!0,r(e,"attach",e))},_ensureElement:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(t.isObject(this.el)||(this.$el=this.getEl(this.el),this.el=this.$el[0],this.$el=this.Dom.getEl(this.el)),!this.$el||0===this.$el.length){if(void 0===e.allowMissingEl?!!t.result(this,"allowMissingEl"):!!e.allowMissingEl)return!1;throw new Z('An "el" must exist in DOM for this region '+this.cid)}return!0},_getView:function(t){if(!t)throw new Z({name:"ViewNotValid",message:"The view passed is undefined and therefore invalid. You must pass a view instance to show."});if(t._isDestroyed)throw new Z({name:"ViewDestroyedError",message:'View (cid: "'+t.cid+'") has already been destroyed and cannot be used.'});if(t instanceof e.View)return t;var i=this._getViewOptions(t);return new ye(i)},_getViewOptions:function(e){if(t.isFunction(e))return{template:e};if(t.isObject(e))return e;return{template:function(){return e}}},getEl:function(e){var i=t.result(this,"parentEl");return i&&t.isString(e)?this.Dom.findEl(i,e):this.Dom.getEl(e)},_replaceEl:function(e){this._restoreEl(),e.on("before:destroy",this._restoreEl,this),this.Dom.replaceEl(e.el,this.el),this._isReplaced=!0},_restoreEl:function(){if(this._isReplaced){var e=this.currentView;e&&(this._detachView(e),this._isReplaced=!1)}},isReplaced:function(){return!!this._isReplaced},isSwappingView:function(){return!!this._isSwappingView},attachHtml:function(e){this.Dom.appendContents(this.el,e.el,{_$el:this.$el,_$contents:e.$el})},empty:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{allowMissingEl:!0},t=this.currentView;if(!t)return this._ensureElement(e)&&this.detachHtml(),this;var i=!e.preventDestroy;return i||k("The preventDestroy option is deprecated. Use Region#detachView"),this._empty(t,i),this},_empty:function(e,t){e.off("destroy",this._empty,this),this.triggerMethod("before:empty",this,e),this._restoreEl(),delete this.currentView,e._isDestroyed||(t?this.removeView(e):this._detachView(e),this._stopChildViewEvents(e)),this.triggerMethod("empty",this,e)},_stopChildViewEvents:function(e){this._parentView&&this._parentView.stopListening(e)},destroyView:function(e){return e._isDestroyed?e:(e._shouldDisableEvents=this._shouldDisableMonitoring(),U(e),e)},removeView:function(e){this.destroyView(e)},detachView:function(){var e=this.currentView;if(e)return this._empty(e),e},_detachView:function(e){var t=e._isAttached&&!this._shouldDisableMonitoring(),i=this._isReplaced;t&&r(e,"before:detach",e),i?this.Dom.replaceEl(this.el,e.el):this.detachHtml(),t&&(e._isAttached=!1,r(e,"detach",e))},detachHtml:function(){this.Dom.detachContents(this.el,this.$el)},hasView:function(){return!!this.currentView},reset:function(e){return this.empty(e),this.$el&&(this.el=this._initEl),delete this.$el,this},destroy:function(e){return this._isDestroyed?this:(this.reset(e),this._name&&this._parentView._removeReferences(this._name),delete this._parentView,delete this._name,X.prototype.destroy.apply(this,arguments))}},{setDomApi:$}),ge=function(e,t){return e instanceof pe?e:S(e,t)},ve={regionClass:pe,_initRegions:function(){this.regions=this.regions||{},this._regions={},this.addRegions(t.result(this,"regions"))},_reInitRegions:function(){te(this._regions,"reset")},addRegion:function(e,t){var i={};return i[e]=t,this.addRegions(i)[e]},addRegions:function(e){if(!t.isEmpty(e))return e=this.normalizeUIValues(e,["selector","el"]),this.regions=t.extend({},this.regions,e),this._addRegions(e)},_addRegions:function(e){var i=this,n={regionClass:this.regionClass,parentEl:t.partial(t.result,this,"el")};return t.reduce(e,function(e,t,s){return e[s]=ge(t,n),i._addRegion(e[s],s),e},{})},_addRegion:function(e,t){this.triggerMethod("before:add:region",this,t,e),e._parentView=this,e._name=t,this._regions[t]=e,this.triggerMethod("add:region",this,t,e)},removeRegion:function(e){var t=this._regions[e];return this._removeRegion(t,e),t},removeRegions:function(){var e=this._getRegions();return t.each(this._regions,t.bind(this._removeRegion,this)),e},_removeRegion:function(e,t){this.triggerMethod("before:remove:region",this,t,e),e.destroy(),this.triggerMethod("remove:region",this,t,e)},_removeReferences:function(e){delete this.regions[e],delete this._regions[e]},emptyRegions:function(){var e=this.getRegions();return te(e,"empty"),e},hasRegion:function(e){return!!this.getRegion(e)},getRegion:function(e){return this._isRendered||this.render(),this._regions[e]},_getRegions:function(){return t.clone(this._regions)},getRegions:function(){return this._isRendered||this.render(),this._getRegions()},showChildView:function(e,t){for(var i=this.getRegion(e),n=arguments.length,s=Array(n>2?n-2:0),r=2;r<n;r++)s[r-2]=arguments[r];return i.show.apply(i,[t].concat(s))},detachChildView:function(e){return this.getRegion(e).detachView()},getChildView:function(e){return this.getRegion(e).currentView}},me={render:function(e,i){if(!e)throw new Z({name:"TemplateNotFoundError",message:"Cannot render the template since its false, null or undefined."});return(t.isFunction(e)?e:ee.get(e))(i)}},we=["behaviors","childViewEventPrefix","childViewEvents","childViewTriggers","collectionEvents","events","modelEvents","regionClass","regions","template","templateContext","triggers","ui"],ye=e.View.extend({constructor:function(i){this.render=t.bind(this.render,this),this._setOptions(i),this.mergeOptions(i,we),w(this),this._initBehaviors(),this._initRegions();var n=Array.prototype.slice.call(arguments);n[0]=this.options,e.View.prototype.constructor.apply(this,n),this.delegateEntityEvents(),this._triggerEventOnBehaviors("initialize",this)},serializeData:function(){return this.model||this.collection?this.model?this.serializeModel():{items:this.serializeCollection()}:{}},serializeModel:function(){return this.model?t.clone(this.model.attributes):{}},serializeCollection:function(){return this.collection?this.collection.map(function(e){return t.clone(e.attributes)}):{}},setElement:function(){var t=!!this.el;return e.View.prototype.setElement.apply(this,arguments),t&&(this._isRendered=this.Dom.hasContents(this.el),this._isAttached=j(this.el)),this._isRendered&&this.bindUIElements(),this},render:function(){return this._isDestroyed?this:(this.triggerMethod("before:render",this),this._isRendered&&this._reInitRegions(),this._renderTemplate(),this.bindUIElements(),this._isRendered=!0,this.triggerMethod("render",this),this)},_renderTemplate:function(){var e=this.getTemplate();if(!1!==e){var t=this.mixinTemplateContext(this.serializeData()),i=this._renderHtml(e,t);this.attachElContent(i)}else k("template:false is deprecated.  Use _.noop.")},_renderHtml:function(e,t){return me.render(e,t,this)},getTemplate:function(){return this.template},mixinTemplateContext:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=t.result(this,"templateContext");return t.extend(e,i)},attachElContent:function(e){return this.Dom.setContents(this.el,e,this.$el),this},_removeChildren:function(){this.removeRegions()},_getImmediateChildren:function(){return t.chain(this._getRegions()).map("currentView").compact().value()}},{setRenderer:function(e){return this.prototype._renderHtml=e,this},setDomApi:$});t.extend(ye.prototype,fe,ve);var Ve=["forEach","each","map","find","detect","filter","select","reject","every","all","some","any","include","contains","invoke","toArray","first","initial","rest","last","without","isEmpty","pluck","reduce","partition"],Ce=function(e,i){t.each(Ve,function(n){e[n]=function(){var e=t.result(this,i),s=Array.prototype.slice.call(arguments);return t[n].apply(t,[e].concat(s))}})},Ee=function(e){this._views={},this._indexByModel={},this._indexByCustom={},this._updateLength(),t.each(e,t.bind(this.add,this))};Ce(Ee.prototype,"_getViews"),t.extend(Ee.prototype,{_getViews:function(){return t.values(this._views)},add:function(e,t){return this._add(e,t)._updateLength()},_add:function(e,t){var i=e.cid;return this._views[i]=e,e.model&&(this._indexByModel[e.model.cid]=i),t&&(this._indexByCustom[t]=i),this},findByModel:function(e){return this.findByModelCid(e.cid)},findByModelCid:function(e){var t=this._indexByModel[e];return this.findByCid(t)},findByCustom:function(e){var t=this._indexByCustom[e];return this.findByCid(t)},findByIndex:function(e){return t.values(this._views)[e]},findByCid:function(e){return this._views[e]},remove:function(e){return this._remove(e)._updateLength()},_remove:function(e){var i=e.cid;return e.model&&delete this._indexByModel[e.model.cid],t.some(this._indexByCustom,t.bind(function(e,t){if(e===i)return delete this._indexByCustom[t],!0},this)),delete this._views[i],this},_updateLength:function(){return this.length=t.size(this._views),this}});var be=["behaviors","childView","childViewEventPrefix","childViewEvents","childViewOptions","childViewTriggers","collectionEvents","events","filter","emptyView","emptyViewOptions","modelEvents","reorderOnSort","sort","triggers","ui","viewComparator"],Me=e.View.extend({sort:!0,constructor:function(i){this.render=t.bind(this.render,this),this._setOptions(i),this.mergeOptions(i,be),w(this),this._initBehaviors(),this.once("render",this._initialEvents),this._initChildViewStorage(),this._bufferedChildren=[];var n=Array.prototype.slice.call(arguments);n[0]=this.options,e.View.prototype.constructor.apply(this,n),this.delegateEntityEvents(),this._triggerEventOnBehaviors("initialize",this)},_startBuffering:function(){this._isBuffering=!0},_endBuffering:function(){var e=this._isAttached&&!1!==this.monitorViewEvents?this._getImmediateChildren():[];this._isBuffering=!1,t.each(e,function(e){r(e,"before:attach",e)}),this.attachBuffer(this,this._createBuffer()),t.each(e,function(e){e._isAttached=!0,r(e,"attach",e)}),this._bufferedChildren=[]},_getImmediateChildren:function(){return t.values(this.children._views)},_initialEvents:function(){this.collection&&(this.listenTo(this.collection,"add",this._onCollectionAdd),this.listenTo(this.collection,"update",this._onCollectionUpdate),this.listenTo(this.collection,"reset",this.render),this.sort&&this.listenTo(this.collection,"sort",this._sortViews))},_onCollectionAdd:function(e,i,n){var s=void 0!==n.at&&(n.index||i.indexOf(e));(this.filter||!1===s)&&(s=t.indexOf(this._filteredSortedModels(s),e)),this._shouldAddChild(e,s)&&(this._destroyEmptyView(),this._addChild(e,s))},_onCollectionUpdate:function(e,t){var i=t.changes;this._removeChildModels(i.removed)},_removeChildModels:function(e){var t=this._getRemovedViews(e);t.length&&(this.children._updateLength(),this._updateIndices(t,!1),this.isEmpty()&&this._showEmptyView())},_getRemovedViews:function(e){var i=this;return t.reduce(e,function(e,t){var n=t&&i.children.findByModel(t);return!n||n._isDestroyed?e:(i._removeChildView(n),e.push(n),e)},[])},_removeChildView:function(e){this.triggerMethod("before:remove:child",this,e),this.children._remove(e),e._shouldDisableEvents=!1===this.monitorViewEvents,U(e),this.stopListening(e),this.triggerMethod("remove:child",this,e)},setElement:function(){var t=!!this.el;return e.View.prototype.setElement.apply(this,arguments),t&&(this._isAttached=j(this.el)),this},render:function(){return this._isDestroyed?this:(this.triggerMethod("before:render",this),this._renderChildren(),this._isRendered=!0,this.triggerMethod("render",this),this)},setFilter:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).preventRender,i=this._isRendered&&!this._isDestroyed,n=this.filter!==e;if(i&&n&&!t){var s=this._filteredSortedModels();this.filter=e;var r=this._filteredSortedModels();this._applyModelDeltas(r,s)}else this.filter=e;return this},removeFilter:function(e){return this.setFilter(null,e)},_applyModelDeltas:function(e,i){var n=this,s={};t.each(e,function(e,t){!n.children.findByModel(e)&&n._onCollectionAdd(e,n.collection,{at:t}),s[e.cid]=!0});var r=t.filter(i,function(e){return!s[e.cid]&&n.children.findByModel(e)});this._removeChildModels(r)},reorder:function(){var e=this,i=this.children,n=this._filteredSortedModels();if(!n.length&&this._showingEmptyView)return this;if(t.some(n,function(e){return!i.findByModel(e)}))this.render();else{var s=[],r=t.reduce(this.children._views,function(e,i){var r=t.indexOf(n,i.model);return-1===r?(s.push(i.model),e):(i._index=r,e[r]=i.el,e)},new Array(n.length));this.triggerMethod("before:reorder",this);var o=this.Dom.createBuffer();t.each(r,function(t){e.Dom.appendContents(o,t)}),this._appendReorderedChildren(o),this._removeChildModels(s),this.triggerMethod("reorder",this)}return this},resortView:function(){return this.reorderOnSort?this.reorder():this._renderChildren(),this},_sortViews:function(){var e=this,i=this._filteredSortedModels();t.find(i,function(t,i){var n=e.children.findByModel(t);return!n||n._index!==i})&&this.resortView()},_emptyViewIndex:-1,_appendReorderedChildren:function(e){this.Dom.appendContents(this.el,e,{_$el:this.$el})},_renderChildren:function(){this._isRendered&&(this._destroyEmptyView(),this._destroyChildren());var e=this._filteredSortedModels();this.isEmpty({processedModels:e})?this._showEmptyView():(this.triggerMethod("before:render:children",this),this._startBuffering(),this._showCollection(e),this._endBuffering(),this.triggerMethod("render:children",this))},_createView:function(e,t){var i=this._getChildView(e),n=this._getChildViewOptions(e,t);return this.buildChildView(e,i,n)},_setupChildView:function(e,t){w(e),this._proxyChildViewEvents(e),this.sort&&(e._index=t)},_showCollection:function(e){t.each(e,t.bind(this._addChild,this)),this.children._updateLength()},_filteredSortedModels:function(e){if(!this.collection||!this.collection.length)return[];var t=this.getViewComparator(),i=this.collection.models;if(e=Math.min(Math.max(e,0),i.length-1),t){var n=void 0;e&&(n=i[e],i=i.slice(0,e).concat(i.slice(e+1))),i=this._sortModelsBy(i,t),n&&i.splice(e,0,n)}return i=this._filterModels(i)},getViewComparator:function(){return this.viewComparator},_filterModels:function(e){var i=this;return this.filter&&(e=t.filter(e,function(e,t){return i._shouldAddChild(e,t)})),e},_sortModelsBy:function(e,i){return"string"==typeof i?t.sortBy(e,function(e){return e.get(i)}):1===i.length?t.sortBy(e,t.bind(i,this)):t.clone(e).sort(t.bind(i,this))},_showEmptyView:function(){var i=this._getEmptyView();if(i&&!this._showingEmptyView){this._showingEmptyView=!0;var n=new e.Model,s=this.emptyViewOptions||this.childViewOptions;t.isFunction(s)&&(s=s.call(this,n,this._emptyViewIndex));var r=this.buildChildView(n,i,s);this.triggerMethod("before:render:empty",this,r),this.addChildView(r,0),this.triggerMethod("render:empty",this,r)}},_destroyEmptyView:function(){this._showingEmptyView&&(this.triggerMethod("before:remove:empty",this),this._destroyChildren(),delete this._showingEmptyView,this.triggerMethod("remove:empty",this))},_getEmptyView:function(){var e=this.emptyView;if(e)return this._getView(e)},_getChildView:function(e){var t=this.childView;if(!t)throw new Z({name:"NoChildViewError",message:'A "childView" must be specified'});if(!(t=this._getView(t,e)))throw new Z({name:"InvalidChildViewError",message:'"childView" must be a view class or a function that returns a view class'});return t},_getView:function(i,n){return i.prototype instanceof e.View||i===e.View?i:t.isFunction(i)?i.call(this,n):void 0},_addChild:function(e,t){var i=this._createView(e,t);return this.addChildView(i,t),i},_getChildViewOptions:function(e,i){return t.isFunction(this.childViewOptions)?this.childViewOptions(e,i):this.childViewOptions},addChildView:function(e,t){return this.triggerMethod("before:add:child",this,e),this._setupChildView(e,t),this._isBuffering?this.children._add(e):(this._updateIndices(e,!0),this.children.add(e)),T(e),this._attachView(e,t),this.triggerMethod("add:child",this,e),e},_updateIndices:function(e,i){if(this.sort)if(i){var n=t.isArray(e)?t.max(e,"_index"):e;t.isObject(n)&&t.each(this.children._views,function(e){e._index>=n._index&&(e._index+=1)})}else t.each(t.sortBy(this.children._views,"_index"),function(e,t){e._index=t})},_attachView:function(e,t){var i=!e._isAttached&&!this._isBuffering&&this._isAttached&&!1!==this.monitorViewEvents;i&&r(e,"before:attach",e),this.attachHtml(this,e,t),i&&(e._isAttached=!0,r(e,"attach",e))},buildChildView:function(e,i,n){return new i(t.extend({model:e},n))},removeChildView:function(e){return!e||e._isDestroyed?e:(this._removeChildView(e),this.children._updateLength(),this._updateIndices(e,!1),e)},isEmpty:function(e){var i=void 0;return t.result(e,"processedModels")?i=e.processedModels:(i=this.collection?this.collection.models:[],i=this._filterModels(i)),0===i.length},attachBuffer:function(e,t){this.Dom.appendContents(e.el,t,{_$el:e.$el})},_createBuffer:function(){var e=this,i=this.Dom.createBuffer();return t.each(this._bufferedChildren,function(t){e.Dom.appendContents(i,t.el,{_$contents:t.$el})}),i},attachHtml:function(e,t,i){e._isBuffering?e._bufferedChildren.splice(i,0,t):e._insertBefore(t,i)||e._insertAfter(t)},_insertBefore:function(e,i){var n=void 0;return this.sort&&i<this.children.length-1&&(n=t.find(this.children._views,function(e){return e._index===i+1})),!!n&&(this.beforeEl(n.el,e.el),!0)},beforeEl:function(e,t){this.$(e).before(t)},_insertAfter:function(e){this.Dom.appendContents(this.el,e.el,{_$el:this.$el,_$contents:e.$el})},_initChildViewStorage:function(){this.children=new Ee},_removeChildren:function(){this._destroyChildren()},_destroyChildren:function(e){this.children.length&&(this.triggerMethod("before:destroy:children",this),t.each(this.children._views,t.bind(this._removeChildView,this)),this.children._updateLength(),this.triggerMethod("destroy:children",this))},_shouldAddChild:function(e,i){var n=this.filter;return!t.isFunction(n)||n.call(this,e,i,this.collection)}},{setDomApi:$});t.extend(Me.prototype,fe);var Re=function(){this._init()};Ce(Re.prototype,"_views"),t.extend(Re.prototype,{_init:function(){this._views=[],this._viewsByCid={},this._indexByModel={},this._updateLength()},_add:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this._views.length,i=e.cid;this._viewsByCid[i]=e,e.model&&(this._indexByModel[e.model.cid]=i),this._views.splice(t,0,e),this._updateLength()},_sort:function(e){return"string"==typeof e?(e=t.partial(L,e),this._sortBy(e)):1===e.length?this._sortBy(e):this._views.sort(e)},_sortBy:function(e){var i=t.sortBy(this._views,e);return this._set(i),i},_set:function(e){this._views.length=0,this._views.push.apply(this._views,e.slice(0)),this._updateLength()},_swap:function(e,t){var i=this.findIndexByView(e),n=this.findIndexByView(t);if(-1!==i&&-1!==n){var s=this._views[i];this._views[i]=this._views[n],this._views[n]=s}},findByModel:function(e){return this.findByModelCid(e.cid)},findByModelCid:function(e){var t=this._indexByModel[e];return this.findByCid(t)},findByIndex:function(e){return this._views[e]},findIndexByView:function(e){return this._views.indexOf(e)},findByCid:function(e){return this._viewsByCid[e]},hasView:function(e){return!!this.findByCid(e.cid)},_remove:function(e){if(this._viewsByCid[e.cid]){e.model&&delete this._indexByModel[e.model.cid],delete this._viewsByCid[e.cid];var t=this.findIndexByView(e);this._views.splice(t,1),this._updateLength()}},_updateLength:function(){this.length=this._views.length}});var Be=["behaviors","childView","childViewEventPrefix","childViewEvents","childViewOptions","childViewTriggers","collectionEvents","emptyView","emptyViewOptions","events","modelEvents","sortWithCollection","triggers","ui","viewComparator","viewFilter"],xe=e.View.extend({sortWithCollection:!0,constructor:function(t){this._setOptions(t),this.mergeOptions(t,Be),w(this),this.once("render",this._initialEvents),this._initChildViewStorage(),this._initBehaviors();var i=Array.prototype.slice.call(arguments);i[0]=this.options,e.View.prototype.constructor.apply(this,i),this.getEmptyRegion(),this.delegateEntityEvents(),this._triggerEventOnBehaviors("initialize",this)},_initChildViewStorage:function(){this.children=new Re},getEmptyRegion:function(){return this._emptyRegion&&!this._emptyRegion.isDestroyed()?this._emptyRegion:(this._emptyRegion=new pe({el:this.el,replaceElement:!1}),this._emptyRegion._parentView=this,this._emptyRegion)},_initialEvents:function(){this.listenTo(this.collection,{sort:this._onCollectionSort,reset:this._onCollectionReset,update:this._onCollectionUpdate})},_onCollectionSort:function(){var e=this;this.sortWithCollection&&!1!==this.viewComparator&&this.collection.length===this.children.length&&(this.collection.some(function(t){return!e.children.findByModel(t)})||this.sort())},_onCollectionReset:function(){this.render()},_onCollectionUpdate:function(e,t){var i=t.changes,n=i.removed.length&&this._removeChildModels(i.removed);this._addedViews=i.added.length&&this._addChildModels(i.added),this._detachChildren(n),this._showChildren(),this._removeChildViews(n)},_removeChildModels:function(e){return t.map(e,t.bind(this._removeChildModel,this))},_removeChildModel:function(e){var t=this.children.findByModel(e);return this._removeChild(t),t},_removeChild:function(e){this.triggerMethod("before:remove:child",this,e),this.children._remove(e),this.triggerMethod("remove:child",this,e)},_addChildModels:function(e){return t.map(e,t.bind(this._addChildModel,this))},_addChildModel:function(e){var t=this._createChildView(e);return this._addChild(t),t},_createChildView:function(e){var t=this._getChildView(e),i=this._getChildViewOptions(e);return this.buildChildView(e,t,i)},_addChild:function(e,t){this.triggerMethod("before:add:child",this,e),this._setupChildView(e),this.children._add(e,t),this.triggerMethod("add:child",this,e)},_getChildView:function(e){var t=this.childView;if(!t)throw new Z({name:"NoChildViewError",message:'A "childView" must be specified'});if(!(t=this._getView(t,e)))throw new Z({name:"InvalidChildViewError",message:'"childView" must be a view class or a function that returns a view class'});return t},_getView:function(i,n){return i.prototype instanceof e.View||i===e.View?i:t.isFunction(i)?i.call(this,n):void 0},_getChildViewOptions:function(e){return t.isFunction(this.childViewOptions)?this.childViewOptions(e):this.childViewOptions},buildChildView:function(e,i,n){return new i(t.extend({model:e},n))},_setupChildView:function(e){w(e),e.on("destroy",this.removeChildView,this),this._proxyChildViewEvents(e)},_getImmediateChildren:function(){return this.children._views},setElement:function(){var t=!!this.el;return e.View.prototype.setElement.apply(this,arguments),t&&(this._isAttached=j(this.el)),this},render:function(){return this._isDestroyed?this:(this.triggerMethod("before:render",this),this._destroyChildren(),this.children._init(),this.collection&&this._addChildModels(this.collection.models),this._showChildren(),this._isRendered=!0,this.triggerMethod("render",this),this)},sort:function(){return this._isDestroyed?this:this.children.length?(this._showChildren(),this):this},_showChildren:function(){this.isEmpty()?this._showEmptyView():(this._sortChildren(),this.filter())},isEmpty:function(e){return e||!this.children.length},_showEmptyView:function(){var e=this._getEmptyView();if(e){var t=this._getEmptyViewOptions();this.getEmptyRegion().show(new e(t))}},_getEmptyView:function(){var e=this.emptyView;if(e)return this._getView(e)},_destroyEmptyView:function(){var e=this.getEmptyRegion();e.hasView()&&e.empty()},_getEmptyViewOptions:function(){var e=this.emptyViewOptions||this.childViewOptions;return t.isFunction(e)?e.call(this):e},_sortChildren:function(){if(!1!==this.viewComparator){this.triggerMethod("before:sort",this);var e=this.getComparator();t.isFunction(e)&&(e=e.bind(this)),this.children._sort(e),this.triggerMethod("sort",this)}},setComparator:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).preventRender,i=this.viewComparator!==e&&!t;return this.viewComparator=e,i&&this.sort(),this},removeComparator:function(e){return this.setComparator(null,e)},getComparator:function(){return this.viewComparator||this._viewComparator},_viewComparator:function(e){if(this.collection)return this.collection.indexOf(e.model)},filter:function(){if(this._isDestroyed)return this;if(!this.children.length)return this;var e=this._filterChildren();return this._renderChildren(e),this},_isAddedAtEnd:function(e,t,i){var n=this.children._views.length-i.length+t;return e===this.children._views[n]},_filterChildren:function(){var e=this._getFilter(),i=this._addedViews;if(delete this._addedViews,!e)return i&&t.every(i,t.bind(this._isAddedAtEnd,this))?i:this.children._views;this.triggerMethod("before:filter",this);var n=t.partition(this.children._views,t.bind(e,this));return this._detachChildren(n[1]),this.triggerMethod("filter",this),n[0]},_getFilter:function(){var e=this.getFilter();if(!e)return!1;if(t.isFunction(e))return e;if(t.isObject(e)){var i=t.matches(e);return function(e){return i(e.model&&e.model.attributes)}}if(t.isString(e))return function(t){return t.model&&t.model.get(e)};throw new Z({name:"InvalidViewFilterError",message:'"viewFilter" must be a function, predicate object literal, a string indicating a model attribute, or falsy'})},getFilter:function(){return this.viewFilter},setFilter:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).preventRender,i=this.viewFilter!==e&&!t;return this.viewFilter=e,i&&this.filter(),this},removeFilter:function(e){return this.setFilter(null,e)},_detachChildren:function(e){t.each(e,t.bind(this._detachChildView,this))},_detachChildView:function(e){var t=e._isAttached&&!1!==this.monitorViewEvents;t&&r(e,"before:detach",e),this.detachHtml(e),t&&(e._isAttached=!1,r(e,"detach",e))},detachHtml:function(e){this.Dom.detachEl(e.el,e.$el)},_renderChildren:function(e){if(this.isEmpty(!e.length))this._showEmptyView();else{this._destroyEmptyView(),this.triggerMethod("before:render:children",this,e);var t=this._getBuffer(e);this._attachChildren(t,e),this.triggerMethod("render:children",this,e)}},_attachChildren:function(e,i){i=this._isAttached&&!1!==this.monitorViewEvents?i:[],t.each(i,function(e){e._isAttached||r(e,"before:attach",e)}),this.attachHtml(e),t.each(i,function(e){e._isAttached||(e._isAttached=!0,r(e,"attach",e))})},_getBuffer:function(e){var i=this,n=this.Dom.createBuffer();return t.each(e,function(e){T(e),i.Dom.appendContents(n,e.el,{_$contents:e.$el})}),n},attachHtml:function(e){this.Dom.appendContents(this.el,e,{_$el:this.$el})},swapChildViews:function(e,t){if(!this.children.hasView(e)||!this.children.hasView(t))throw new Z({name:"ChildSwapError",message:"Both views must be children of the collection view"});return this.children._swap(e,t),this.Dom.swapEl(e.el,t.el),this.Dom.hasEl(this.el,e.el)!==this.Dom.hasEl(this.el,t.el)&&this.filter(),this},addChildView:function(e,t){return!e||e._isDestroyed?e:(this._addChild(e,t),this._addedViews=[e],this._showChildren(),e)},detachChildView:function(e){return this.removeChildView(e,{shouldDetach:!0}),e},removeChildView:function(e,t){return e?(this._removeChildView(e,t),this._removeChild(e),this.isEmpty()&&this._showEmptyView(),e):e},_removeChildViews:function(e){t.each(e,t.bind(this._removeChildView,this))},_removeChildView:function(e){var t=(arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}).shouldDetach;e.off("destroy",this.removeChildView,this),t?this._detachChildView(e):this._destroyChildView(e),this.stopListening(e)},_destroyChildView:function(e){e._isDestroyed||(e._shouldDisableEvents=!1===this.monitorViewEvents,U(e))},_removeChildren:function(){this._destroyChildren(),this.getEmptyRegion().destroy(),delete this._addedViews},_destroyChildren:function(){this.children&&this.children.length&&(this.triggerMethod("before:destroy:children",this),!1===this.monitorViewEvents&&this.Dom.detachContents(this.el,this.$el),t.each(this.children._views,t.bind(this._removeChildView,this)),this.triggerMethod("destroy:children",this))}},{setDomApi:$});t.extend(xe.prototype,fe);var De=["childViewContainer","template","templateContext"],Ae=Me.extend({constructor:function(e){k("CompositeView is deprecated. Convert to View at your earliest convenience"),this.mergeOptions(e,De),Me.prototype.constructor.apply(this,arguments)},_initialEvents:function(){this.collection&&(this.listenTo(this.collection,"add",this._onCollectionAdd),this.listenTo(this.collection,"update",this._onCollectionUpdate),this.listenTo(this.collection,"reset",this.renderChildren),this.sort&&this.listenTo(this.collection,"sort",this._sortViews))},_getChildView:function(e){var t=this.childView;if(!t)return this.constructor;if(!(t=this._getView(t,e)))throw new Z({name:"InvalidChildViewError",message:'"childView" must be a view class or a function that returns a view class'});return t},serializeData:function(){return this.serializeModel()},render:function(){return this._isDestroyed?this:(this._isRendering=!0,this.resetChildViewContainer(),this.triggerMethod("before:render",this),this._renderTemplate(),this.bindUIElements(),this.renderChildren(),this._isRendering=!1,this._isRendered=!0,this.triggerMethod("render",this),this)},renderChildren:function(){(this._isRendered||this._isRendering)&&Me.prototype._renderChildren.call(this)},attachBuffer:function(e,t){var i=this.getChildViewContainer(e);this.Dom.appendContents(i[0],t,{_$el:i})},_insertAfter:function(e){var t=this.getChildViewContainer(this,e);this.Dom.appendContents(t[0],e.el,{_$el:t,_$contents:e.$el})},_appendReorderedChildren:function(e){var t=this.getChildViewContainer(this);this.Dom.appendContents(t[0],e,{_$el:t})},getChildViewContainer:function(e,i){if(e.$childViewContainer)return e.$childViewContainer;var n=void 0;if(e.childViewContainer){var s=t.result(e,"childViewContainer");if((n="@"===s.charAt(0)&&e.ui?e.ui[s.substr(4)]:this.$(s)).length<=0)throw new Z({name:"ChildViewContainerMissingError",message:'The specified "childViewContainer" was not found: '+e.childViewContainer})}else n=e.$el;return e.$childViewContainer=n,n},resetChildViewContainer:function(){this.$childViewContainer&&(this.$childViewContainer=void 0)}}),Oe=t.pick(ye.prototype,"serializeModel","getTemplate","_renderTemplate","_renderHtml","mixinTemplateContext","attachElContent");t.extend(Ae.prototype,Oe);var Ie=["collectionEvents","events","modelEvents","triggers","ui"],$e=X.extend({cidPrefix:"mnb",constructor:function(e,i){this.view=i,this.defaults&&k("Behavior defaults are deprecated. For similar functionality set options on the Behavior class."),this.defaults=t.clone(t.result(this,"defaults",{})),this._setOptions(t.extend({},this.defaults,e)),this.mergeOptions(this.options,Ie),this.ui=t.extend({},t.result(this,"ui"),t.result(i,"ui")),X.apply(this,arguments)},$:function(){return this.view.$.apply(this.view,arguments)},destroy:function(){return this.stopListening(),this.view._removeBehavior(this),this},proxyViewProperties:function(){return this.$el=this.view.$el,this.el=this.view.el,this},bindUIElements:function(){return this._bindUIElements(),this},unbindUIElements:function(){return this._unbindUIElements(),this},getUI:function(e){return this._getUI(e)},delegateEntityEvents:function(){return this._delegateEntityEvents(this.view.model,this.view.collection),this},undelegateEntityEvents:function(){return this._undelegateEntityEvents(this.view.model,this.view.collection),this},getEvents:function(){var e=this,i=this.normalizeUIKeys(t.result(this,"events"));return t.reduce(i,function(i,n,s){if(t.isFunction(n)||(n=e[n]),n)return s=re(s),i[s]=t.bind(n,e),i},{})},getTriggers:function(){if(this.triggers){var e=this.normalizeUIKeys(t.result(this,"triggers"));return this._getViewTriggers(this.view,e)}}});t.extend($e.prototype,ne,he,ce);var Te=["region","regionClass"],Ue=X.extend({cidPrefix:"mna",constructor:function(e){this._setOptions(e),this.mergeOptions(e,Te),this._initRegion(),X.prototype.constructor.apply(this,arguments)},regionClass:pe,_initRegion:function(){var e=this.region;if(e){var t={regionClass:this.regionClass};this._region=ge(e,t)}},getRegion:function(){return this._region},showView:function(e){for(var t=this.getRegion(),i=arguments.length,n=Array(i>1?i-1:0),s=1;s<i;s++)n[s-1]=arguments[s];return t.show.apply(t,[e].concat(n))},getView:function(){return this.getRegion().currentView},start:function(e){return this.triggerMethod("before:start",this,e),this.triggerMethod("start",this,e),this}}),Se=["appRoutes","controller"],Fe=e.Router.extend({constructor:function(t){this._setOptions(t),this.mergeOptions(t,Se),e.Router.apply(this,arguments);var i=this.appRoutes,n=this._getController();this.processAppRoutes(n,i),this.on("route",this._processOnRoute,this)},appRoute:function(e,t){var i=this._getController();return this._addAppRoute(i,e,t),this},_processOnRoute:function(e,i){if(t.isFunction(this.onRoute)){var n=t.invert(this.appRoutes)[e];this.onRoute(e,n,i)}},processAppRoutes:function(e,i){var n=this;if(!i)return this;var s=t.keys(i).reverse();return t.each(s,function(t){n._addAppRoute(e,t,i[t])}),this},_getController:function(){return this.controller},_addAppRoute:function(e,i,n){var s=e[n];if(!s)throw new Z('Method "'+n+'" was not found on the controller');this.route(i,n,t.bind(s,e))},triggerMethod:s});t.extend(Fe.prototype,G);var Le=e.Marionette,Pe=e.Marionette={};return Pe.noConflict=function(){return e.Marionette=Le,this},Pe.bindEvents=P(C),Pe.unbindEvents=P(E),Pe.bindRequests=P(M),Pe.unbindRequests=P(R),Pe.mergeOptions=P(N),Pe.getOption=P(H),Pe.normalizeMethods=P(q),Pe.extend=z,Pe.isNodeAttached=j,Pe.deprecate=k,Pe.triggerMethod=P(s),Pe.triggerMethodOn=r,Pe.isEnabled=A,Pe.setEnabled=function(e,t){return oe[e]=t},Pe.monitorViewEvents=w,Pe.Behaviors={},Pe.Behaviors.behaviorsLookup=function(){throw new Z({message:"You must define where your behaviors are stored.",url:"marionette.behaviors.md#behaviorslookup"})},Pe.Application=Ue,Pe.AppRouter=Fe,Pe.Renderer=me,Pe.TemplateCache=ee,Pe.View=ye,Pe.CollectionView=Me,Pe.NextCollectionView=xe,Pe.CompositeView=Ae,Pe.Behavior=$e,Pe.Region=pe,Pe.Error=Z,Pe.Object=X,Pe.DEV_MODE=!1,Pe.FEATURES=oe,Pe.VERSION="3.4.3",Pe.DomApi=ue,Pe.setDomApi=function(e){Me.setDomApi(e),Ae.setDomApi(e),xe.setDomApi(e),pe.setDomApi(e),ye.setDomApi(e)},Pe}),this&&this.Marionette&&(this.Mn=this.Marionette);
-//# sourceMappingURL=backbone.marionette.min.js.map
\ No newline at end of file
diff --git a/js/3rdparty/backbone.marionette.min.js.map b/js/3rdparty/backbone.marionette.min.js.map
deleted file mode 100644
index ca964b24d..000000000
--- a/js/3rdparty/backbone.marionette.min.js.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"sources":["src/common/trigger-method.js","src/common/monitor-view-events.js","src/common/bind-events.js","src/common/bind-requests.js","src/mixins/behaviors.js","src/utils/get-unique-event-name.js","src/config/features.js","src/mixins/triggers.js","src/config/dom.js","src/common/view.js","src/common/build-region.js","src/next-child-view-container.js","src/utils/proxy.js","src/utils/extend.js","src/utils/deprecate.js","src/common/is-node-attached.js","src/common/merge-options.js","src/common/get-option.js","src/common/normalize-methods.js","src/error.js","src/utils/set-options.js","src/mixins/common.js","src/mixins/radio.js","src/object.js","src/template-cache.js","src/utils/invoke.js","src/mixins/delegate-entity-events.js","src/mixins/ui.js","src/mixins/view.js","src/region.js","src/mixins/regions.js","src/config/renderer.js","src/view.js","src/utils/emulate-collection.js","src/child-view-container.js","src/collection-view.js","src/next-collection-view.js","src/composite-view.js","src/behavior.js","src/application.js","src/app-router.js","src/backbone.marionette.js","src/config/behaviors-lookup.js"],"names":["getEventName","match","prefix","eventName","toUpperCase","triggerMethod","event","args","Array","_len","_key","arguments","methodName","getOnMethodName","method","getOption","call","this","result","_","isFunction","apply","trigger","triggerMethodOn","context","_len2","_key2","triggerMethodChildren","view","shouldTrigger","_getImmediateChildren","each","child","shouldTriggerAttach","_isAttached","shouldAttach","shouldTriggerDetach","shouldDetach","triggerDOMRefresh","_isRendered","triggerDOMRemove","handleBeforeAttach","handleAttach","handleBeforeDetach","handleDetach","handleBeforeRender","handleRender","monitorViewEvents","_areViewEventsMonitored","on","bindFromStrings","target","entity","evt","methods","actionName","methodNames","split","MarionetteError","iterateEvents","bindings","isObject","isString","bindEvents","unbindEvents","iterateReplies","channel","normalizedRadioRequests","normalizeMethods","bindRequests","unbindRequests","getBehaviorClass","options","key","behaviorClass","Marionette","Behaviors","behaviorsLookup","parseBehaviors","behaviors","chain","map","BehaviorClass","behavior","nestedBehaviors","concat","flatten","value","uniqueName","selector","uniqueId","isEnabled","name","FEATURES","buildViewTrigger","triggerDef","shouldPreventDefault","preventDefault","shouldStopPropagation","stopPropagation","getEl","el","Backbone","$","setDomApi","mixin","prototype","Dom","extend","renderView","supportsRenderLifecycle","render","destroyView","destroy","supportsDestroyLifecycle","_shouldDisableEvents","remove","_isDestroyed","buildRegionFromDefinition","definition","defaults","opts","buildRegionFromObject","regionClass","RegionClass","omit","stringComparator","comparator","model","get","proxy","Model","deprecate","message","test","prev","next","url","DEV_MODE","undefined","_cache","_warn","_console","console","warn","log","noop","isNodeAttached","document","documentElement","contains","parentNode","mergeOptions","keys","option","optionName","hash","reduce","normalizedHash","_this","splitter","memoize","replace","errorProps","Error","error","pick","captureStackTrace","urlRoot","CommonMixin","RadioMixin","channelName","Radio","_channel","radioEvents","radioRequests","_destroyRadio","stopReplying","ClassOptions","MarionetteObject","hasOwnProperty","_setOptions","_setCid","_initRadio","initialize","Events","cid","cidPrefix","stopListening","TemplateCache","templateId","cachedTemplate","templateCaches","load","i","length","compiledTemplate","template","loadTemplate","compileTemplate","$template","html","rawTemplate","_invoke","invokeMap","invoke","BehaviorsMixin","_behaviors","_getBehaviors","triggers","memo","_triggers","events","_events","without","DelegateEntityEventsMixin","collection","_undelegateEntityEvents","modelEvents","collectionEvents","delegateEventSplitter","getUniqueEventName","TriggersMixin","normalizeUIKeys","ui","val","normalizeUIString","uiString","r","slice","normalizeUIValues","properties","isArray","property","propertyVal","UIMixin","uiBindings","_getUIBindings","_uiBindings","_ui","$el","_this2","DomApi","createDocumentFragment","find","childEl","detach","newEl","oldEl","parent","replaceChild","el1","el2","parent1","parent2","next1","nextSibling","next2","insertBefore","contents","_$el","_ref$_$el","_$contents","_ref$_$contents","append","hasChildNodes","ViewMixin","eventsArg","_proxyBehaviorViewProperties","_buildEventProxies","viewEvents","_getEvents","combinedEvents","_getBehaviorEvents","_getBehaviorTriggers","getTriggers","View","delegateEvents","_getViewTriggers","_delegateEntityEvents","_delegateBehaviorEntityEvents","_undelegateBehaviorEntityEvents","unbindUIElements","_removeElement","_removeChildren","_destroyBehaviors","off","removeData","detachEl","_bindUIElements","_bindBehaviorUIElements","_unbindUIElements","_unbindBehaviorUIElements","_getUI","ret","_triggerEventOnBehaviors","_childViewEvents","_childViewTriggers","listenTo","_childViewEventHandler","childViewEvents","childViewTriggers","childEventName","Region","_initEl","_ensureElement","_getView","currentView","_isSwappingView","empty","_setupChildView","_attachView","_proxyChildViewEvents","_empty","parentView","_parentView","_shouldDisableMonitoring","shouldReplaceEl","replaceElement","_replaceEl","attachHtml","allowMissingEl","viewOptions","_getViewOptions","findEl","_restoreEl","replaceEl","_isReplaced","_detachView","appendContents","detachHtml","shouldDestroy","preventDestroy","removeView","_stopChildViewEvents","shouldRestoreEl","detachContents","reset","_name","_removeReferences","buildRegion","RegionsMixin","regions","_regions","addRegions","isEmpty","_addRegions","regionDefinitions","partial","_addRegion","region","_removeRegion","_getRegions","bind","getRegions","getRegion","clone","show","detachView","Renderer","data","_initBehaviors","_initRegions","constructor","delegateEntityEvents","serializeModel","serializeCollection","attributes","hasEl","setElement","hasContents","bindUIElements","_reInitRegions","_renderTemplate","getTemplate","mixinTemplateContext","serializeData","_renderHtml","attachElContent","templateContext","setContents","removeRegions","compact","renderer","emulateCollection","object","listProperty","list","Container","views","_views","_indexByModel","_indexByCustom","_updateLength","add","values","customIndex","_add","viewCid","findByModelCid","modelCid","findByCid","index","_remove","some","size","CollectionView","once","_initialEvents","_initChildViewStorage","_bufferedChildren","_isBuffering","triggerOnChildren","attachBuffer","_createBuffer","children","_onCollectionAdd","_onCollectionUpdate","sort","_sortViews","at","indexOf","filter","_filteredSortedModels","_shouldAddChild","_destroyEmptyView","_addChild","changes","_removeChildModels","removed","models","removedViews","_getRemovedViews","_updateIndices","_showEmptyView","removingViews","findByModel","_removeChildView","push","_renderChildren","preventRender","canBeRendered","filterChanged","previousModels","_applyModelDeltas","setFilter","currentIds","removeModels","prevModel","_showingEmptyView","filteredOutModels","elsToReorder","viewEls","_index","elBuffer","createBuffer","_appendReorderedChildren","reorderOnSort","reorder","item","_this4","resortView","_destroyChildren","processedModels","_startBuffering","_showCollection","_endBuffering","ChildView","_getChildView","childViewOptions","_getChildViewOptions","buildChildView","addedAt","viewComparator","getViewComparator","Math","min","max","addedModel","_sortModelsBy","splice","_filterModels","_this5","sortBy","EmptyView","_getEmptyView","emptyViewOptions","_emptyViewIndex","addChildView","emptyView","childView","_createView","increment","laterView","ChildViewClass","collectionView","buffer","b","_insertBefore","_insertAfter","beforeEl","siblings","before","ChildViewContainer","_init","_viewsByCid","_sortBy","sortedViews","_set","view1","view2","view1Index","findIndexByView","view2Index","swapView","getEmptyRegion","_emptyRegion","isDestroyed","_onCollectionSort","_onCollectionReset","sortWithCollection","_addedViews","added","_addChildModels","_detachChildren","_showChildren","_removeChildViews","_removeChildModel","_removeChild","_addChildModel","_createChildView","removeChildView","_sortChildren","allViewsFiltered","_getEmptyViewOptions","emptyRegion","hasView","getComparator","_sort","shouldSort","setComparator","_viewComparator","filteredViews","_filterChildren","addedView","addedViews","viewIndex","viewFilter","_getFilter","every","_isAddedAtEnd","partition","getFilter","matcher","matches","shouldRender","detachingViews","_detachChildView","els","_getBuffer","_attachChildren","_swap","swapEl","_destroyChildView","CompositeView","renderChildren","_isRendering","resetChildViewContainer","compositeView","$container","getChildViewContainer","containerView","$childViewContainer","container","childViewContainer","charAt","substr","MixinFromView","Behavior","_removeBehavior","behaviorEvents","behaviorHandler","behaviorTriggers","Application","_initRegion","_region","AppRouter","Router","appRoutes","controller","_getController","processAppRoutes","_processOnRoute","route","_addAppRoute","routeName","routeArgs","onRoute","routePath","invert","routeNames","reverse","previousMarionette","noConflict","setEnabled","state","NextCollectionView","Object","VERSION"],"mappings":"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","file":"backbone.marionette.min.js","sourcesContent":["// Trigger Method\n// --------------\n\nimport _ from 'underscore';\nimport getOption from './get-option';\n\n// split the event name on the \":\"\nconst splitter = /(^|:)(\\w)/gi;\n\n// take the event section (\"section1:section2:section3\")\n// and turn it in to uppercase name onSection1Section2Section3\nfunction getEventName(match, prefix, eventName) {\n  return eventName.toUpperCase();\n}\n\nconst getOnMethodName = _.memoize(function(event) {\n  return 'on' + event.replace(splitter, getEventName);\n});\n\n// Trigger an event and/or a corresponding method name. Examples:\n//\n// `this.triggerMethod(\"foo\")` will trigger the \"foo\" event and\n// call the \"onFoo\" method.\n//\n// `this.triggerMethod(\"foo:bar\")` will trigger the \"foo:bar\" event and\n// call the \"onFooBar\" method.\nexport function triggerMethod(event, ...args) {\n  // get the method name from the event name\n  const methodName = getOnMethodName(event);\n  const method = getOption.call(this, methodName);\n  let result;\n\n  // call the onMethodName if it exists\n  if (_.isFunction(method)) {\n    // pass all args, except the event name\n    result = method.apply(this, args);\n  }\n\n  // trigger the event\n  this.trigger.apply(this, arguments);\n\n  return result;\n}\n\n// triggerMethodOn invokes triggerMethod on a specific context\n//\n// e.g. `Marionette.triggerMethodOn(view, 'show')`\n// will trigger a \"show\" event or invoke onShow the view.\nexport function triggerMethodOn(context, ...args) {\n  if (_.isFunction(context.triggerMethod)) {\n    return context.triggerMethod.apply(context, args);\n  }\n\n  return triggerMethod.apply(context, args);\n}\n","// DOM Refresh\n// -----------\n\nimport _ from 'underscore';\nimport { triggerMethodOn } from './trigger-method';\n\n// Trigger method on children unless a pure Backbone.View\nfunction triggerMethodChildren(view, event, shouldTrigger) {\n  if (!view._getImmediateChildren) { return; }\n  _.each(view._getImmediateChildren(), child => {\n    if (!shouldTrigger(child)) { return; }\n    triggerMethodOn(child, event, child);\n  });\n}\n\nfunction shouldTriggerAttach(view) {\n  return !view._isAttached;\n}\n\nfunction shouldAttach(view) {\n  if (!shouldTriggerAttach(view)) { return false; }\n  view._isAttached = true;\n  return true;\n}\n\nfunction shouldTriggerDetach(view) {\n  return view._isAttached;\n}\n\nfunction shouldDetach(view) {\n  if (!shouldTriggerDetach(view)) { return false; }\n  view._isAttached = false;\n  return true;\n}\n\nfunction triggerDOMRefresh(view) {\n  if (view._isAttached && view._isRendered) {\n    triggerMethodOn(view, 'dom:refresh', view);\n  }\n}\n\nfunction triggerDOMRemove(view) {\n  if (view._isAttached && view._isRendered) {\n    triggerMethodOn(view, 'dom:remove', view);\n  }\n}\n\nfunction handleBeforeAttach() {\n  triggerMethodChildren(this, 'before:attach', shouldTriggerAttach);\n}\n\nfunction handleAttach() {\n  triggerMethodChildren(this, 'attach', shouldAttach);\n  triggerDOMRefresh(this);\n}\n\nfunction handleBeforeDetach() {\n  triggerMethodChildren(this, 'before:detach', shouldTriggerDetach);\n  triggerDOMRemove(this);\n}\n\nfunction handleDetach() {\n  triggerMethodChildren(this, 'detach', shouldDetach);\n}\n\nfunction handleBeforeRender() {\n  triggerDOMRemove(this);\n}\n\nfunction handleRender() {\n  triggerDOMRefresh(this);\n}\n\n// Monitor a view's state, propagating attach/detach events to children and firing dom:refresh\n// whenever a rendered view is attached or an attached view is rendered.\nfunction monitorViewEvents(view) {\n  if (view._areViewEventsMonitored || view.monitorViewEvents === false) { return; }\n\n  view._areViewEventsMonitored = true;\n\n  view.on({\n    'before:attach': handleBeforeAttach,\n    'attach': handleAttach,\n    'before:detach': handleBeforeDetach,\n    'detach': handleDetach,\n    'before:render': handleBeforeRender,\n    'render': handleRender\n  });\n}\n\nexport default monitorViewEvents;\n","// Bind Entity Events & Unbind Entity Events\n// -----------------------------------------\n//\n// These methods are used to bind/unbind a backbone \"entity\" (e.g. collection/model)\n// to methods on a target object.\n//\n// The first parameter, `target`, must have the Backbone.Events module mixed in.\n//\n// The second parameter is the `entity` (Backbone.Model, Backbone.Collection or\n// any object that has Backbone.Events mixed in) to bind the events from.\n//\n// The third parameter is a hash of { \"event:name\": \"eventHandler\" }\n// configuration. Multiple handlers can be separated by a space. A\n// function can be supplied instead of a string handler name.\n\nimport _ from 'underscore';\nimport MarionetteError from '../error';\n\n// Bind/unbind the event to handlers specified as a string of\n// handler names on the target object\nfunction bindFromStrings(target, entity, evt, methods, actionName) {\n  const methodNames = methods.split(/\\s+/);\n\n  _.each(methodNames, function(methodName) {\n    const method = target[methodName];\n    if (!method) {\n      throw new MarionetteError(`Method \"${methodName}\" was configured as an event handler, but does not exist.`);\n    }\n\n    target[actionName](entity, evt, method);\n  });\n}\n\n// generic looping function\nfunction iterateEvents(target, entity, bindings, actionName) {\n  if (!entity || !bindings) { return; }\n\n  // type-check bindings\n  if (!_.isObject(bindings)) {\n    throw new MarionetteError({\n      message: 'Bindings must be an object.',\n      url: 'marionette.functions.html#marionettebindevents'\n    });\n  }\n\n  // iterate the bindings and bind/unbind them\n  _.each(bindings, function(method, evt) {\n\n    // allow for a list of method names as a string\n    if (_.isString(method)) {\n      bindFromStrings(target, entity, evt, method, actionName);\n      return;\n    }\n\n    target[actionName](entity, evt, method);\n  });\n}\n\nfunction bindEvents(entity, bindings) {\n  iterateEvents(this, entity, bindings, 'listenTo');\n  return this;\n}\n\nfunction unbindEvents(entity, bindings) {\n  iterateEvents(this, entity, bindings, 'stopListening');\n  return this;\n}\n\n// Export Public API\nexport {\n  bindEvents,\n  unbindEvents\n};\n","// Bind/Unbind Radio Requests\n// -----------------------------------------\n//\n// These methods are used to bind/unbind a backbone.radio request\n// to methods on a target object.\n//\n// The first parameter, `target`, will set the context of the reply method\n//\n// The second parameter is the `Radio.channel` to bind the reply to.\n//\n// The third parameter is a hash of { \"request:name\": \"replyHandler\" }\n// configuration. A function can be supplied instead of a string handler name.\n\nimport _ from 'underscore';\nimport normalizeMethods from './normalize-methods';\nimport MarionetteError from '../error';\n\nfunction iterateReplies(target, channel, bindings, actionName) {\n  if (!channel || !bindings) { return; }\n\n  // type-check bindings\n  if (!_.isObject(bindings)) {\n    throw new MarionetteError({\n      message: 'Bindings must be an object.',\n      url: 'marionette.functions.html#marionettebindrequests'\n    });\n  }\n\n  const normalizedRadioRequests = normalizeMethods.call(target, bindings);\n\n  channel[actionName](normalizedRadioRequests, target);\n}\n\nfunction bindRequests(channel, bindings) {\n  iterateReplies(this, channel, bindings, 'reply');\n  return this;\n}\n\nfunction unbindRequests(channel, bindings) {\n  iterateReplies(this, channel, bindings, 'stopReplying');\n  return this;\n}\n\nexport {\n  bindRequests,\n  unbindRequests\n};\n","import _ from 'underscore';\nimport _invoke from '../utils/invoke';\nimport { triggerMethod } from '../common/trigger-method';\nimport Marionette from '../backbone.marionette';\n\n// MixinOptions\n// - behaviors\n\n// Takes care of getting the behavior class\n// given options and a key.\n// If a user passes in options.behaviorClass\n// default to using that.\n// If a user passes in a Behavior Class directly, use that\n// Otherwise delegate the lookup to the users `behaviorsLookup` implementation.\nfunction getBehaviorClass(options, key) {\n  if (options.behaviorClass) {\n    return options.behaviorClass;\n    //treat functions as a Behavior constructor\n  } else if (_.isFunction(options)) {\n    return options;\n  }\n\n  // behaviorsLookup can be either a flat object or a method\n  if (_.isFunction(Marionette.Behaviors.behaviorsLookup)) {\n    return Marionette.Behaviors.behaviorsLookup(options, key)[key];\n  }\n\n  return Marionette.Behaviors.behaviorsLookup[key];\n}\n\n// Iterate over the behaviors object, for each behavior\n// instantiate it and get its grouped behaviors.\n// This accepts a list of behaviors in either an object or array form\nfunction parseBehaviors(view, behaviors) {\n  return _.chain(behaviors).map(function(options, key) {\n    const BehaviorClass = getBehaviorClass(options, key);\n    //if we're passed a class directly instead of an object\n    const _options = options === BehaviorClass ? {} : options;\n    const behavior = new BehaviorClass(_options, view);\n    const nestedBehaviors = parseBehaviors(view, _.result(behavior, 'behaviors'));\n\n    return [behavior].concat(nestedBehaviors);\n  }).flatten().value();\n}\n\nexport default {\n  _initBehaviors() {\n    this._behaviors = this._getBehaviors();\n  },\n\n  _getBehaviors() {\n    const behaviors = _.result(this, 'behaviors');\n\n    // Behaviors defined on a view can be a flat object literal\n    // or it can be a function that returns an object.\n    return _.isObject(behaviors) ? parseBehaviors(this, behaviors) : {};\n  },\n\n  _getBehaviorTriggers() {\n    const triggers = _invoke(this._behaviors, 'getTriggers');\n    return _.reduce(triggers, function(memo, _triggers) {\n      return _.extend(memo, _triggers);\n    }, {});\n  },\n\n  _getBehaviorEvents() {\n    const events = _invoke(this._behaviors, 'getEvents');\n    return _.reduce(events, function(memo, _events) {\n      return _.extend(memo, _events);\n    }, {});\n  },\n\n  // proxy behavior $el to the view's $el.\n  _proxyBehaviorViewProperties() {\n    _invoke(this._behaviors, 'proxyViewProperties');\n  },\n\n  // delegate modelEvents and collectionEvents\n  _delegateBehaviorEntityEvents() {\n    _invoke(this._behaviors, 'delegateEntityEvents');\n  },\n\n  // undelegate modelEvents and collectionEvents\n  _undelegateBehaviorEntityEvents() {\n    _invoke(this._behaviors, 'undelegateEntityEvents');\n  },\n\n  _destroyBehaviors(...args) {\n    // Call destroy on each behavior after\n    // destroying the view.\n    // This unbinds event listeners\n    // that behaviors have registered for.\n    _invoke(this._behaviors, 'destroy', ...args);\n  },\n\n  // Remove a behavior\n  _removeBehavior(behavior) {\n    // Don't worry about the clean up if the view is destroyed\n    if (this._isDestroyed) { return; }\n    this._behaviors = _.without(this._behaviors, behavior);\n  },\n\n  _bindBehaviorUIElements() {\n    _invoke(this._behaviors, 'bindUIElements');\n  },\n\n  _unbindBehaviorUIElements() {\n    _invoke(this._behaviors, 'unbindUIElements');\n  },\n\n  _triggerEventOnBehaviors() {\n    const behaviors = this._behaviors;\n    // Use good ol' for as this is a very hot function\n    for (let i = 0, length = behaviors && behaviors.length; i < length; i++) {\n      triggerMethod.apply(behaviors[i], arguments);\n    }\n  }\n};\n","import _ from 'underscore';\n\n// Borrow event splitter from Backbone\nconst delegateEventSplitter = /^(\\S+)\\s*(.*)$/;\n\nfunction uniqueName(eventName, selector) {\n  return `${ eventName }${ _.uniqueId('.evt') } ${ selector }`;\n}\n\n// Set event name to be namespaced using a unique index\n// to generate a non colliding event namespace\n// http://api.jquery.com/event.namespace/\nconst getUniqueEventName = function(eventName) {\n  const match = eventName.match(delegateEventSplitter);\n  return uniqueName(match[1], match[2]);\n};\n\nexport default getUniqueEventName;\n","// Add Feature flags here\n// e.g. 'class' => false\nconst FEATURES = {\n  childViewEventPrefix: true,\n  triggersStopPropagation: true,\n  triggersPreventDefault: true\n};\n\nfunction isEnabled(name) {\n  return !!FEATURES[name];\n}\n\nfunction setEnabled(name, state) {\n  return FEATURES[name] = state;\n}\n\nexport {\n  FEATURES,\n  setEnabled,\n  isEnabled\n};\n","import _ from 'underscore';\nimport getUniqueEventName from '../utils/get-unique-event-name';\nimport { isEnabled } from '../config/features';\n\n// Internal method to create an event handler for a given `triggerDef` like\n// 'click:foo'\nfunction buildViewTrigger(view, triggerDef) {\n  if (_.isString(triggerDef)) {\n    triggerDef = {event: triggerDef};\n  }\n\n  const eventName = triggerDef.event;\n\n  let shouldPreventDefault = !!triggerDef.preventDefault;\n\n  if (isEnabled('triggersPreventDefault')) {\n    shouldPreventDefault = triggerDef.preventDefault !== false;\n  }\n\n  let shouldStopPropagation = !!triggerDef.stopPropagation;\n\n  if (isEnabled('triggersStopPropagation')) {\n    shouldStopPropagation = triggerDef.stopPropagation !== false;\n  }\n\n  return function(event) {\n    if (shouldPreventDefault) {\n      event.preventDefault();\n    }\n\n    if (shouldStopPropagation) {\n      event.stopPropagation();\n    }\n\n    view.triggerMethod(eventName, view, event);\n  };\n}\n\nexport default {\n\n  // Configure `triggers` to forward DOM events to view\n  // events. `triggers: {\"click .foo\": \"do:foo\"}`\n  _getViewTriggers(view, triggers) {\n    // Configure the triggers, prevent default\n    // action and stop propagation of DOM events\n    return _.reduce(triggers, (events, value, key) => {\n      key = getUniqueEventName(key);\n      events[key] = buildViewTrigger(view, value);\n      return events;\n    }, {});\n  }\n\n};\n","// DomApi\n//  ---------\nimport _ from 'underscore';\nimport Backbone from 'backbone';\n\n// Performant method for returning the jQuery instance\nfunction getEl(el) {\n  return el instanceof Backbone.$ ? el : Backbone.$(el);\n}\n\n// Static setter\nexport function setDomApi(mixin) {\n  this.prototype.Dom = _.extend({}, this.prototype.Dom, mixin);\n  return this;\n}\n\nexport default {\n\n  // Returns a new HTML DOM node instance\n  createBuffer() {\n    return document.createDocumentFragment();\n  },\n\n  // Lookup the `selector` string\n  // Selector may also be a DOM element\n  // Returns an array-like object of nodes\n  getEl(selector) {\n    return getEl(selector);\n  },\n\n  // Finds the `selector` string with the el\n  // Returns an array-like object of nodes\n  findEl(el, selector, _$el = getEl(el)) {\n    return _$el.find(selector);\n  },\n\n  // Returns true if the el contains the node childEl\n  hasEl(el, childEl) {\n    return el.contains(childEl && childEl.parentNode);\n  },\n\n  // Detach `el` from the DOM without removing listeners\n  detachEl(el, _$el = getEl(el)) {\n    _$el.detach();\n  },\n\n  // Remove `oldEl` from the DOM and put `newEl` in its place\n  replaceEl(newEl, oldEl) {\n    if (newEl === oldEl) {\n      return;\n    }\n\n    const parent = oldEl.parentNode;\n\n    if (!parent) {\n      return;\n    }\n\n    parent.replaceChild(newEl, oldEl);\n  },\n\n  // Swaps the location of `el1` and `el2` in the DOM\n  swapEl(el1, el2) {\n    if (el1 === el2) {\n      return;\n    }\n\n    const parent1 = el1.parentNode;\n    const parent2 = el2.parentNode;\n\n    if (!parent1 || !parent2) {\n      return;\n    }\n\n    const next1 = el1.nextSibling;\n    const next2 = el2.nextSibling;\n\n    parent1.insertBefore(el2, next1);\n    parent2.insertBefore(el1, next2);\n  },\n\n  // Replace the contents of `el` with the HTML string of `html`\n  setContents(el, html, _$el = getEl(el)) {\n    _$el.html(html);\n  },\n\n  // Takes the DOM node `el` and appends the DOM node `contents`\n  // to the end of the element's contents.\n  appendContents(el, contents, {_$el = getEl(el), _$contents = getEl(contents)} = {}) {\n    _$el.append(_$contents);\n  },\n\n  // Does the el have child nodes\n  hasContents(el) {\n    return el.hasChildNodes();\n  },\n\n  // Remove the inner contents of `el` from the DOM while leaving\n  // `el` itself in the DOM.\n  detachContents(el, _$el = getEl(el)) {\n    _$el.contents().detach();\n  }\n};\n","import { triggerMethodOn } from '../common/trigger-method';\n\nexport function renderView(view) {\n  if (view._isRendered) {\n    return;\n  }\n\n  if (!view.supportsRenderLifecycle) {\n    triggerMethodOn(view, 'before:render', view);\n  }\n\n  view.render();\n\n  if (!view.supportsRenderLifecycle) {\n    view._isRendered = true;\n    triggerMethodOn(view, 'render', view);\n  }\n}\n\nexport function destroyView(view) {\n  if (view.destroy) {\n    view.destroy();\n    return;\n  }\n\n  if (!view.supportsDestroyLifecycle) {\n    triggerMethodOn(view, 'before:destroy', view);\n  }\n\n  const shouldTriggerDetach = view._isAttached && !view._shouldDisableEvents;\n\n  if (shouldTriggerDetach) {\n    triggerMethodOn(view, 'before:detach', view);\n  }\n\n  view.remove();\n\n  if (shouldTriggerDetach) {\n    view._isAttached = false;\n    triggerMethodOn(view, 'detach', view);\n  }\n\n  view._isDestroyed = true;\n\n  if (!view.supportsDestroyLifecycle) {\n    triggerMethodOn(view, 'destroy', view);\n  }\n}\n","import _ from 'underscore';\nimport deprecate from '../utils/deprecate';\nimport MarionetteError from '../error';\nimport Region from '../region';\n\n// return the region instance from the definition\nexport default function(definition, defaults) {\n  if (definition instanceof Region) {\n    return definition;\n  }\n\n  return buildRegionFromDefinition(definition, defaults);\n}\n\nfunction buildRegionFromDefinition(definition, defaults) {\n  const opts = _.extend({}, defaults);\n\n  if (_.isString(definition)) {\n    _.extend(opts, { el: definition });\n\n    return buildRegionFromObject(opts);\n  }\n\n  if (_.isFunction(definition)) {\n    _.extend(opts, { regionClass: definition });\n\n    return buildRegionFromObject(opts);\n  }\n\n  if (_.isObject(definition)) {\n    if (definition.selector) {\n      deprecate('The selector option on a Region definition object is deprecated. Use el to pass a selector string');\n    }\n\n    _.extend(opts, { el: definition.selector }, definition);\n\n    return buildRegionFromObject(opts);\n  }\n\n  throw new MarionetteError({\n    message: 'Improper region configuration type.',\n    url: 'marionette.region.html#region-configuration-types'\n  });\n}\n\nfunction buildRegionFromObject(definition) {\n  const RegionClass = definition.regionClass\n\n  const options = _.omit(definition, 'regionClass');\n\n  return new RegionClass(options);\n}\n","import _ from 'underscore';\nimport emulateCollection from './utils/emulate-collection';\n\n// Provide a container to store, retrieve and\n// shut down child views.\nconst Container = function() {\n  this._init();\n};\n\nemulateCollection(Container.prototype, '_views');\n\nfunction stringComparator(comparator, view) {\n  return view.model && view.model.get(comparator);\n}\n\n// Container Methods\n// -----------------\n\n_.extend(Container.prototype, {\n\n  // Initializes an empty container\n  _init() {\n    this._views = [];\n    this._viewsByCid = {};\n    this._indexByModel = {};\n    this._updateLength();\n  },\n\n  // Add a view to this container. Stores the view\n  // by `cid` and makes it searchable by the model\n  // cid (and model itself). Additionally it stores\n  // the view by index in the _views array\n  _add(view, index = this._views.length) {\n    const viewCid = view.cid;\n\n    // store the view\n    this._viewsByCid[viewCid] = view;\n\n    // index it by model\n    if (view.model) {\n      this._indexByModel[view.model.cid] = viewCid;\n    }\n\n    // add to end by default\n    this._views.splice(index, 0, view);\n\n    this._updateLength();\n  },\n\n  // Sort (mutate) and return the array of the child views.\n  _sort(comparator) {\n    if (typeof comparator === 'string') {\n      comparator = _.partial(stringComparator, comparator);\n      return this._sortBy(comparator);\n    }\n\n    if (comparator.length === 1) {\n      return this._sortBy(comparator);\n    }\n\n    return this._views.sort(comparator);\n  },\n\n  // Makes `_.sortBy` mutate the array to match `this._views.sort`\n  _sortBy(comparator) {\n    const sortedViews = _.sortBy(this._views, comparator);\n\n    this._set(sortedViews);\n\n    return sortedViews;\n  },\n\n  // Replace array contents without overwriting the reference.\n  _set(views) {\n    this._views.length = 0;\n\n    this._views.push.apply(this._views, views.slice(0));\n\n    this._updateLength();\n  },\n\n  // Swap views by index\n  _swap(view1, view2) {\n    const view1Index = this.findIndexByView(view1);\n    const view2Index = this.findIndexByView(view2);\n\n    if (view1Index === -1 || view2Index === -1) {\n      return;\n    }\n\n    const swapView = this._views[view1Index];\n    this._views[view1Index] = this._views[view2Index];\n    this._views[view2Index] = swapView;\n  },\n\n  // Find a view by the model that was attached to it.\n  // Uses the model's `cid` to find it.\n  findByModel(model) {\n    return this.findByModelCid(model.cid);\n  },\n\n  // Find a view by the `cid` of the model that was attached to it.\n  // Uses the model's `cid` to find the view `cid` and\n  // retrieve the view using it.\n  findByModelCid(modelCid) {\n    const viewCid = this._indexByModel[modelCid];\n    return this.findByCid(viewCid);\n  },\n\n  // Find a view by index.\n  findByIndex(index) {\n    return this._views[index];\n  },\n\n  // Find the index of a view instance\n  findIndexByView(view) {\n    return this._views.indexOf(view);\n  },\n\n  // Retrieve a view by its `cid` directly\n  findByCid(cid) {\n    return this._viewsByCid[cid];\n  },\n\n  hasView(view) {\n    return !!this.findByCid(view.cid);\n  },\n\n  // Remove a view and clean up index references.\n  _remove(view) {\n    if (!this._viewsByCid[view.cid]) {\n      return;\n    }\n\n    // delete model index\n    if (view.model) {\n      delete this._indexByModel[view.model.cid];\n    }\n\n    // remove the view from the container\n    delete this._viewsByCid[view.cid];\n\n    const index = this.findIndexByView(view);\n    this._views.splice(index, 1);\n\n    this._updateLength();\n  },\n\n  // Update the `.length` attribute on this container\n  _updateLength() {\n    this.length = this._views.length;\n  }\n});\n\nexport default Container;\n","//Internal utility for creating context style global utils\nconst proxy = function(method) {\n  return function(context, ...args) {\n    return method.apply(context, args);\n  };\n};\n\nexport default proxy;\n","// Marionette.extend\n// -----------------\n\nimport Backbone from 'backbone';\n\n// Borrow the Backbone `extend` method so we can use it as needed\nconst extend = Backbone.Model.extend;\n\nexport default extend;\n","/* global console */\n\nimport _ from 'underscore';\n\nimport Marionette from '../backbone.marionette';\n\nconst deprecate = function(message, test) {\n  if (_.isObject(message)) {\n    message = (\n      message.prev + ' is going to be removed in the future. ' +\n      'Please use ' + message.next + ' instead.' +\n      (message.url ? ' See: ' + message.url : '')\n    );\n  }\n\n  if (!Marionette.DEV_MODE) {\n    return;\n  }\n\n  if ((test === undefined || !test) && !deprecate._cache[message]) {\n    deprecate._warn('Deprecation warning: ' + message);\n    deprecate._cache[message] = true;\n  }\n};\n\n/* istanbul ignore next: can't clear console */\ndeprecate._console = typeof console !== 'undefined' ? console : {};\ndeprecate._warn = function() {\n  const warn = deprecate._console.warn || deprecate._console.log || _.noop;\n  return warn.apply(deprecate._console, arguments);\n};\ndeprecate._cache = {};\n\nexport default deprecate;\n","// Marionette.isNodeAttached\n// -------------------------\n\n// Determine if `el` is a child of the document\nconst isNodeAttached = function(el) {\n  return document.documentElement.contains(el && el.parentNode);\n};\n\nexport default isNodeAttached;\n","import _ from 'underscore';\n\n// Merge `keys` from `options` onto `this`\nconst mergeOptions = function(options, keys) {\n  if (!options) { return; }\n\n  _.each(keys, (key) => {\n    const option = options[key];\n    if (option !== undefined) {\n      this[key] = option;\n    }\n  });\n};\n\nexport default mergeOptions;\n","// Marionette.getOption\n// --------------------\n\n// Retrieve an object, function or other value from the\n// object or its `options`, with `options` taking precedence.\nconst getOption = function(optionName) {\n  if (!optionName) { return; }\n  if (this.options && (this.options[optionName] !== undefined)) {\n    return this.options[optionName];\n  } else {\n    return this[optionName];\n  }\n};\n\nexport default getOption;\n","import _ from 'underscore';\n\n// Marionette.normalizeMethods\n// ----------------------\n\n// Pass in a mapping of events => functions or function names\n// and return a mapping of events => functions\nconst normalizeMethods = function(hash) {\n  return _.reduce(hash, (normalizedHash, method, name) => {\n    if (!_.isFunction(method)) {\n      method = this[method];\n    }\n    if (method) {\n      normalizedHash[name] = method;\n    }\n    return normalizedHash;\n  }, {});\n};\n\nexport default normalizeMethods;\n","// Error\n// -----\n\nimport _ from 'underscore';\nimport extend from './utils/extend';\nimport {version} from '../package.json';\n\nconst errorProps = ['description', 'fileName', 'lineNumber', 'name', 'message', 'number'];\n\nconst MarionetteError = extend.call(Error, {\n  urlRoot: `http://marionettejs.com/docs/v${version}/`,\n\n  constructor(message, options) {\n    if (_.isObject(message)) {\n      options = message;\n      message = options.message;\n    } else if (!options) {\n      options = {};\n    }\n\n    const error = Error.call(this, message);\n    _.extend(this, _.pick(error, errorProps), _.pick(options, errorProps));\n\n    this.captureStackTrace();\n\n    if (options.url) {\n      this.url = this.urlRoot + options.url;\n    }\n  },\n\n  captureStackTrace() {\n    if (Error.captureStackTrace) {\n      Error.captureStackTrace(this, MarionetteError);\n    }\n  },\n\n  toString() {\n    return this.name + ': ' + this.message + (this.url ? ' See: ' + this.url : '');\n  }\n});\n\nMarionetteError.extend = extend;\n\nexport default MarionetteError;\n","import _ from 'underscore';\n\n// Internal utility for setting options consistently across Mn\nconst setOptions = function(options) {\n  this.options = _.extend({}, _.result(this, 'options'), options);\n};\n\nexport default setOptions;\n","import _setOptions from '../utils/set-options';\nimport getOption from '../common/get-option';\nimport mergeOptions from '../common/merge-options';\nimport normalizeMethods from '../common/normalize-methods';\nimport {\n  bindEvents,\n  unbindEvents\n} from '../common/bind-events';\n\nexport default {\n\n  // Imports the \"normalizeMethods\" to transform hashes of\n  // events=>function references/names to a hash of events=>function references\n  normalizeMethods,\n\n  _setOptions,\n\n  // A handy way to merge passed-in options onto the instance\n  mergeOptions,\n\n  // Enable getting options from this or this.options by name.\n  getOption,\n\n  // Enable binding view's events from another entity.\n  bindEvents,\n\n  // Enable unbinding view's events from another entity.\n  unbindEvents\n};\n","import _ from 'underscore';\nimport Radio from 'backbone.radio';\n\nimport {\n  bindRequests,\n  unbindRequests\n} from '../common/bind-requests';\n\nimport {\n  bindEvents,\n  unbindEvents\n} from '../common/bind-events';\n\nimport MarionetteError from '../error';\n\n// MixinOptions\n// - channelName\n// - radioEvents\n// - radioRequests\n\nexport default {\n\n  _initRadio() {\n    const channelName = _.result(this, 'channelName');\n\n    if (!channelName) {\n      return;\n    }\n\n    /* istanbul ignore next */\n    if (!Radio) {\n      throw new MarionetteError({\n        name: 'BackboneRadioMissing',\n        message: 'The dependency \"backbone.radio\" is missing.'\n      });\n    }\n\n    const channel = this._channel = Radio.channel(channelName);\n\n    const radioEvents = _.result(this, 'radioEvents');\n    this.bindEvents(channel, radioEvents);\n\n    const radioRequests = _.result(this, 'radioRequests');\n    this.bindRequests(channel, radioRequests);\n\n    this.on('destroy', this._destroyRadio);\n  },\n\n  _destroyRadio() {\n    this._channel.stopReplying(null, null, this);\n  },\n\n  getChannel() {\n    return this._channel;\n  },\n\n  // Proxy `bindEvents`\n  bindEvents: bindEvents,\n\n  // Proxy `unbindEvents`\n  unbindEvents: unbindEvents,\n\n  // Proxy `bindRequests`\n  bindRequests: bindRequests,\n\n  // Proxy `unbindRequests`\n  unbindRequests: unbindRequests\n\n};\n","// Object\n// ------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport extend from './utils/extend';\nimport { triggerMethod } from './common/trigger-method';\nimport CommonMixin from './mixins/common';\nimport RadioMixin from './mixins/radio';\n\nconst ClassOptions = [\n  'channelName',\n  'radioEvents',\n  'radioRequests'\n];\n\n// A Base Class that other Classes should descend from.\n// Object borrows many conventions and utilities from Backbone.\nconst MarionetteObject = function(options) {\n  if (!this.hasOwnProperty('options')) {\n    this._setOptions(options);\n  }\n  this.mergeOptions(options, ClassOptions);\n  this._setCid();\n  this._initRadio();\n  this.initialize.apply(this, arguments);\n};\n\nMarionetteObject.extend = extend;\n\n// Object Methods\n// --------------\n\n// Ensure it can trigger events with Backbone.Events\n_.extend(MarionetteObject.prototype, Backbone.Events, CommonMixin, RadioMixin, {\n  cidPrefix: 'mno',\n\n  // for parity with Marionette.AbstractView lifecyle\n  _isDestroyed: false,\n\n  isDestroyed() {\n    return this._isDestroyed;\n  },\n\n  //this is a noop method intended to be overridden by classes that extend from this base\n  initialize() {},\n\n  _setCid() {\n    if (this.cid) { return; }\n    this.cid = _.uniqueId(this.cidPrefix);\n  },\n\n  destroy(...args) {\n    if (this._isDestroyed) { return this; }\n\n    this.triggerMethod('before:destroy', this, ...args);\n\n    this._isDestroyed = true;\n    this.triggerMethod('destroy', this, ...args);\n    this.stopListening();\n\n    return this;\n  },\n\n  triggerMethod\n});\n\nexport default MarionetteObject;\n","// Template Cache\n// --------------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport MarionetteError from './error';\n\n// Manage templates stored in `<script>` blocks,\n// caching them for faster access.\nconst TemplateCache = function(templateId) {\n  this.templateId = templateId;\n};\n\n// TemplateCache object-level methods. Manage the template\n// caches from these method calls instead of creating\n// your own TemplateCache instances\n_.extend(TemplateCache, {\n\n  templateCaches: {},\n\n  // Get the specified template by id. Either\n  // retrieves the cached version, or loads it\n  // from the DOM.\n  get(templateId, options) {\n    let cachedTemplate = this.templateCaches[templateId];\n\n    if (!cachedTemplate) {\n      cachedTemplate = new TemplateCache(templateId);\n      this.templateCaches[templateId] = cachedTemplate;\n    }\n\n    return cachedTemplate.load(options);\n  },\n\n  // Clear templates from the cache. If no arguments\n  // are specified, clears all templates:\n  // `clear()`\n  //\n  // If arguments are specified, clears each of the\n  // specified templates from the cache:\n  // `clear(\"#t1\", \"#t2\", \"...\")`\n  clear(...args) {\n    let i;\n    const length = args.length;\n\n    if (length > 0) {\n      for (i = 0; i < length; i++) {\n        delete this.templateCaches[args[i]];\n      }\n    } else {\n      this.templateCaches = {};\n    }\n  }\n});\n\n// TemplateCache instance methods, allowing each\n// template cache object to manage its own state\n// and know whether or not it has been loaded\n_.extend(TemplateCache.prototype, {\n\n  // Internal method to load the template\n  load(options) {\n    // Guard clause to prevent loading this template more than once\n    if (this.compiledTemplate) {\n      return this.compiledTemplate;\n    }\n\n    // Load the template and compile it\n    const template = this.loadTemplate(this.templateId, options);\n    this.compiledTemplate = this.compileTemplate(template, options);\n\n    return this.compiledTemplate;\n  },\n\n  // Load a template from the DOM, by default. Override\n  // this method to provide your own template retrieval\n  // For asynchronous loading with AMD/RequireJS, consider\n  // using a template-loader plugin as described here:\n  // https://github.com/marionettejs/backbone.marionette/wiki/Using-marionette-with-requirejs\n  loadTemplate(templateId, options) {\n    const $template = Backbone.$(templateId);\n\n    if (!$template.length) {\n      throw new MarionetteError({\n        name: 'NoTemplateError',\n        message: `Could not find template: \"${templateId}\"`\n      });\n    }\n    return $template.html();\n  },\n\n  // Pre-compile the template before caching it. Override\n  // this method if you do not need to pre-compile a template\n  // (JST / RequireJS for example) or if you want to change\n  // the template engine used (Handebars, etc).\n  compileTemplate(rawTemplate, options) {\n    return _.template(rawTemplate, options);\n  }\n});\n\nexport default TemplateCache;\n","// Implementation of the invoke method (http://underscorejs.org/#invoke) with support for\n// lodash v3, v4, and underscore.js\nimport _ from 'underscore';\n\nexport default _.invokeMap || _.invoke;\n","import _ from 'underscore';\n\nimport {\n  bindEvents,\n  unbindEvents\n} from '../common/bind-events';\n\n// MixinOptions\n// - collectionEvents\n// - modelEvents\n\nexport default {\n  // Handle `modelEvents`, and `collectionEvents` configuration\n  _delegateEntityEvents(model, collection) {\n    this._undelegateEntityEvents(model, collection);\n\n    const modelEvents = _.result(this, 'modelEvents');\n    bindEvents.call(this, model, modelEvents);\n\n    const collectionEvents = _.result(this, 'collectionEvents');\n    bindEvents.call(this, collection, collectionEvents);\n  },\n\n  _undelegateEntityEvents(model, collection) {\n    const modelEvents = _.result(this, 'modelEvents');\n    unbindEvents.call(this, model, modelEvents);\n\n    const collectionEvents = _.result(this, 'collectionEvents');\n    unbindEvents.call(this, collection, collectionEvents);\n  }\n};\n","import _ from 'underscore';\n// allows for the use of the @ui. syntax within\n// a given key for triggers and events\n// swaps the @ui with the associated selector.\n// Returns a new, non-mutated, parsed events hash.\nconst normalizeUIKeys = function(hash, ui) {\n  return _.reduce(hash, (memo, val, key) => {\n    const normalizedKey = normalizeUIString(key, ui);\n    memo[normalizedKey] = val;\n    return memo;\n  }, {});\n};\n\n// utility method for parsing @ui. syntax strings\n// into associated selector\nconst normalizeUIString = function(uiString, ui) {\n  return uiString.replace(/@ui\\.[a-zA-Z-_$0-9]*/g, (r) => {\n    return ui[r.slice(4)];\n  });\n};\n\n// allows for the use of the @ui. syntax within\n// a given value for regions\n// swaps the @ui with the associated selector\nconst normalizeUIValues = function(hash, ui, properties) {\n  _.each(hash, (val, key) => {\n    if (_.isString(val)) {\n      hash[key] = normalizeUIString(val, ui);\n    } else if (_.isObject(val) && _.isArray(properties)) {\n      _.extend(val, normalizeUIValues(_.pick(val, properties), ui));\n      /* Value is an object, and we got an array of embedded property names to normalize. */\n      _.each(properties, (property) => {\n        const propertyVal = val[property];\n        if (_.isString(propertyVal)) {\n          val[property] = normalizeUIString(propertyVal, ui);\n        }\n      });\n    }\n  });\n  return hash;\n};\n\nexport default {\n\n  // normalize the keys of passed hash with the views `ui` selectors.\n  // `{\"@ui.foo\": \"bar\"}`\n  normalizeUIKeys(hash) {\n    const uiBindings = this._getUIBindings();\n    return normalizeUIKeys(hash, uiBindings);\n  },\n\n  // normalize the passed string with the views `ui` selectors.\n  // `\"@ui.bar\"`\n  normalizeUIString(uiString) {\n    const uiBindings = this._getUIBindings();\n    return normalizeUIString(uiString, uiBindings);\n  },\n\n  // normalize the values of passed hash with the views `ui` selectors.\n  // `{foo: \"@ui.bar\"}`\n  normalizeUIValues(hash, properties) {\n    const uiBindings = this._getUIBindings();\n    return normalizeUIValues(hash, uiBindings, properties);\n  },\n\n  _getUIBindings() {\n    const uiBindings = _.result(this, '_uiBindings');\n    const ui = _.result(this, 'ui');\n    return uiBindings || ui;\n  },\n\n  // This method binds the elements specified in the \"ui\" hash inside the view's code with\n  // the associated jQuery selectors.\n  _bindUIElements() {\n    if (!this.ui) { return; }\n\n    // store the ui hash in _uiBindings so they can be reset later\n    // and so re-rendering the view will be able to find the bindings\n    if (!this._uiBindings) {\n      this._uiBindings = this.ui;\n    }\n\n    // get the bindings result, as a function or otherwise\n    const bindings = _.result(this, '_uiBindings');\n\n    // empty the ui so we don't have anything to start with\n    this._ui = {};\n\n    // bind each of the selectors\n    _.each(bindings, (selector, key) => {\n      this._ui[key] = this.$(selector);\n    });\n\n    this.ui = this._ui;\n  },\n\n  _unbindUIElements() {\n    if (!this.ui || !this._uiBindings) { return; }\n\n    // delete all of the existing ui bindings\n    _.each(this.ui, ($el, name) => {\n      delete this.ui[name];\n    });\n\n    // reset the ui element to the original bindings configuration\n    this.ui = this._uiBindings;\n    delete this._uiBindings;\n    delete this._ui;\n  },\n\n  _getUI(name) {\n    return this._ui[name];\n  }\n};\n","// ViewMixin\n//  ---------\n\nimport Backbone from 'backbone';\nimport _ from 'underscore';\nimport { triggerMethod } from '../common/trigger-method';\nimport BehaviorsMixin from './behaviors';\nimport CommonMixin from './common';\nimport DelegateEntityEventsMixin from './delegate-entity-events';\nimport TriggersMixin from './triggers';\nimport UIMixin from './ui';\nimport { isEnabled } from '../config/features';\nimport DomApi from '../config/dom';\n\n// MixinOptions\n// - behaviors\n// - childViewEventPrefix\n// - childViewEvents\n// - childViewTriggers\n// - collectionEvents\n// - modelEvents\n// - triggers\n// - ui\n\n\nconst ViewMixin = {\n  Dom: DomApi,\n\n  supportsRenderLifecycle: true,\n  supportsDestroyLifecycle: true,\n\n  _isDestroyed: false,\n\n  isDestroyed() {\n    return !!this._isDestroyed;\n  },\n\n  _isRendered: false,\n\n  isRendered() {\n    return !!this._isRendered;\n  },\n\n  _isAttached: false,\n\n  isAttached() {\n    return !!this._isAttached;\n  },\n\n  // Overriding Backbone.View's `delegateEvents` to handle\n  // `events` and `triggers`\n  delegateEvents(eventsArg) {\n\n    this._proxyBehaviorViewProperties();\n    this._buildEventProxies();\n\n    const viewEvents = this._getEvents(eventsArg);\n\n    if (typeof eventsArg === 'undefined') {\n      this.events = viewEvents;\n    }\n\n    const combinedEvents = _.extend({},\n      this._getBehaviorEvents(),\n      viewEvents,\n      this._getBehaviorTriggers(),\n      this.getTriggers()\n    );\n\n    Backbone.View.prototype.delegateEvents.call(this, combinedEvents);\n\n    return this;\n  },\n\n  _getEvents(eventsArg) {\n    const events = eventsArg || this.events;\n\n    if (_.isFunction(events)) {\n      return this.normalizeUIKeys(events.call(this));\n    }\n\n    return this.normalizeUIKeys(events);\n  },\n\n  // Configure `triggers` to forward DOM events to view\n  // events. `triggers: {\"click .foo\": \"do:foo\"}`\n  getTriggers() {\n    if (!this.triggers) { return; }\n\n    // Allow `triggers` to be configured as a function\n    const triggers = this.normalizeUIKeys(_.result(this, 'triggers'));\n\n    // Configure the triggers, prevent default\n    // action and stop propagation of DOM events\n    return this._getViewTriggers(this, triggers);\n  },\n\n  // Handle `modelEvents`, and `collectionEvents` configuration\n  delegateEntityEvents() {\n    this._delegateEntityEvents(this.model, this.collection);\n\n    // bind each behaviors model and collection events\n    this._delegateBehaviorEntityEvents();\n\n    return this;\n  },\n\n  // Handle unbinding `modelEvents`, and `collectionEvents` configuration\n  undelegateEntityEvents() {\n    this._undelegateEntityEvents(this.model, this.collection);\n\n    // unbind each behaviors model and collection events\n    this._undelegateBehaviorEntityEvents();\n\n    return this;\n  },\n\n  // Handle destroying the view and its children.\n  destroy(...args) {\n    if (this._isDestroyed) { return this; }\n    const shouldTriggerDetach = this._isAttached && !this._shouldDisableEvents;\n\n    this.triggerMethod('before:destroy', this, ...args);\n    if (shouldTriggerDetach) {\n      this.triggerMethod('before:detach', this);\n    }\n\n    // unbind UI elements\n    this.unbindUIElements();\n\n    // remove the view from the DOM\n    this._removeElement();\n\n    if (shouldTriggerDetach) {\n      this._isAttached = false;\n      this.triggerMethod('detach', this);\n    }\n\n    // remove children after the remove to prevent extra paints\n    this._removeChildren();\n\n    this._isDestroyed = true;\n    this._isRendered = false;\n\n    // Destroy behaviors after _isDestroyed flag\n    this._destroyBehaviors(...args);\n\n    this.triggerMethod('destroy', this, ...args);\n\n    this.stopListening();\n\n    return this;\n  },\n\n  // Equates to this.$el.remove\n  _removeElement() {\n    this.$el.off().removeData();\n    this.Dom.detachEl(this.el, this.$el);\n  },\n\n  bindUIElements() {\n    this._bindUIElements();\n    this._bindBehaviorUIElements();\n\n    return this;\n  },\n\n  // This method unbinds the elements specified in the \"ui\" hash\n  unbindUIElements() {\n    this._unbindUIElements();\n    this._unbindBehaviorUIElements();\n\n    return this;\n  },\n\n  getUI(name) {\n    return this._getUI(name);\n  },\n\n  // used as the prefix for child view events\n  // that are forwarded through the layoutview\n  childViewEventPrefix() {\n    return isEnabled('childViewEventPrefix') ? 'childview' : false;\n  },\n\n  // import the `triggerMethod` to trigger events with corresponding\n  // methods if the method exists\n  triggerMethod() {\n    const ret = triggerMethod.apply(this, arguments);\n\n    this._triggerEventOnBehaviors.apply(this, arguments);\n\n    return ret;\n  },\n\n  // Cache `childViewEvents` and `childViewTriggers`\n  _buildEventProxies() {\n    this._childViewEvents = _.result(this, 'childViewEvents');\n    this._childViewTriggers = _.result(this, 'childViewTriggers');\n  },\n\n  _proxyChildViewEvents(view) {\n    this.listenTo(view, 'all', this._childViewEventHandler);\n  },\n\n  _childViewEventHandler(eventName, ...args) {\n    const childViewEvents = this.normalizeMethods(this._childViewEvents);\n\n    // call collectionView childViewEvent if defined\n    if (typeof childViewEvents !== 'undefined' && _.isFunction(childViewEvents[eventName])) {\n      childViewEvents[eventName].apply(this, args);\n    }\n\n    // use the parent view's proxyEvent handlers\n    const childViewTriggers = this._childViewTriggers;\n\n    // Call the event with the proxy name on the parent layout\n    if (childViewTriggers && _.isString(childViewTriggers[eventName])) {\n      this.triggerMethod(childViewTriggers[eventName], ...args);\n    }\n\n    const prefix = _.result(this, 'childViewEventPrefix');\n\n    if (prefix !== false) {\n      const childEventName = prefix + ':' + eventName;\n\n      this.triggerMethod(childEventName, ...args);\n    }\n  }\n};\n\n_.extend(ViewMixin, BehaviorsMixin, CommonMixin, DelegateEntityEventsMixin, TriggersMixin, UIMixin);\n\nexport default ViewMixin;\n","// Region\n// ------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport deprecate from './utils/deprecate';\nimport { renderView, destroyView } from './common/view';\nimport monitorViewEvents from './common/monitor-view-events';\nimport isNodeAttached from './common/is-node-attached';\nimport { triggerMethodOn } from './common/trigger-method';\nimport MarionetteObject from './object';\nimport MarionetteError from './error';\nimport View from './view';\nimport DomApi, { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'allowMissingEl',\n  'parentEl',\n  'replaceElement'\n];\n\nconst Region = MarionetteObject.extend({\n  Dom: DomApi,\n\n  cidPrefix: 'mnr',\n  replaceElement: false,\n  _isReplaced: false,\n  _isSwappingView: false,\n\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    // getOption necessary because options.el may be passed as undefined\n    this._initEl = this.el = this.getOption('el');\n\n    // Handle when this.el is passed in as a $ wrapped element.\n    this.el = this.el instanceof Backbone.$ ? this.el[0] : this.el;\n\n    if (!this.el) {\n      throw new MarionetteError({\n        name: 'NoElError',\n        message: 'An \"el\" must be specified for a region.'\n      });\n    }\n\n    this.$el = this.getEl(this.el);\n    MarionetteObject.call(this, options);\n  },\n\n  // Displays a backbone view instance inside of the region. Handles calling the `render`\n  // method for you. Reads content directly from the `el` attribute. The `preventDestroy`\n  // option can be used to prevent a view from the old view being destroyed on show.\n  show(view, options) {\n    if (!this._ensureElement(options)) {\n      return;\n    }\n\n    view = this._getView(view, options);\n\n    if (view === this.currentView) { return this; }\n\n    this._isSwappingView = !!this.currentView;\n\n    this.triggerMethod('before:show', this, view, options);\n\n    // Assume an attached view is already in the region for pre-existing DOM\n    if (!view._isAttached) {\n      this.empty(options);\n    }\n\n    this._setupChildView(view);\n\n    this.currentView = view;\n\n    renderView(view);\n\n    this._attachView(view, options);\n\n    this.triggerMethod('show', this, view, options);\n\n    this._isSwappingView = false;\n\n    return this;\n  },\n\n  _setupChildView(view) {\n    monitorViewEvents(view);\n\n    this._proxyChildViewEvents(view);\n\n    // We need to listen for if a view is destroyed in a way other than through the region.\n    // If this happens we need to remove the reference to the currentView since once a view\n    // has been destroyed we can not reuse it.\n    view.on('destroy', this._empty, this);\n  },\n\n  _proxyChildViewEvents(view) {\n    const parentView = this._parentView;\n\n    if (!parentView) { return; }\n\n    parentView._proxyChildViewEvents(view);\n  },\n\n  // If the regions parent view is not monitoring its attach/detach events\n  _shouldDisableMonitoring() {\n    return this._parentView && this._parentView.monitorViewEvents === false;\n  },\n\n  _attachView(view, options = {}) {\n    const shouldTriggerAttach = !view._isAttached && isNodeAttached(this.el) && !this._shouldDisableMonitoring();\n    const shouldReplaceEl = typeof options.replaceElement === 'undefined' ? !!_.result(this, 'replaceElement') : !!options.replaceElement;\n\n    if (shouldTriggerAttach) {\n      triggerMethodOn(view, 'before:attach', view);\n    }\n\n    if (shouldReplaceEl) {\n      this._replaceEl(view);\n    } else {\n      this.attachHtml(view);\n    }\n\n    if (shouldTriggerAttach) {\n      view._isAttached = true;\n      triggerMethodOn(view, 'attach', view);\n    }\n  },\n\n  _ensureElement(options = {}) {\n    if (!_.isObject(this.el)) {\n      this.$el = this.getEl(this.el);\n      this.el = this.$el[0];\n      // Make sure the $el contains only the el\n      this.$el = this.Dom.getEl(this.el);\n    }\n\n    if (!this.$el || this.$el.length === 0) {\n      const allowMissingEl = typeof options.allowMissingEl === 'undefined' ? !!_.result(this, 'allowMissingEl') : !!options.allowMissingEl;\n\n      if (allowMissingEl) {\n        return false;\n      } else {\n        throw new MarionetteError(`An \"el\" must exist in DOM for this region ${this.cid}`);\n      }\n    }\n    return true;\n  },\n\n  _getView(view) {\n    if (!view) {\n      throw new MarionetteError({\n        name: 'ViewNotValid',\n        message: 'The view passed is undefined and therefore invalid. You must pass a view instance to show.'\n      });\n    }\n\n    if (view._isDestroyed) {\n      throw new MarionetteError({\n        name: 'ViewDestroyedError',\n        message: `View (cid: \"${view.cid}\") has already been destroyed and cannot be used.`\n      });\n    }\n\n    if (view instanceof Backbone.View) {\n      return view;\n    }\n\n    const viewOptions = this._getViewOptions(view);\n\n    return new View(viewOptions);\n  },\n\n  // This allows for a template or a static string to be\n  // used as a template\n  _getViewOptions(viewOptions) {\n    if (_.isFunction(viewOptions)) {\n      return { template: viewOptions };\n    }\n\n    if (_.isObject(viewOptions)) {\n      return viewOptions;\n    }\n\n    const template = function() { return viewOptions; };\n\n    return { template };\n  },\n\n  // Override this method to change how the region finds the DOM element that it manages. Return\n  // a jQuery selector object scoped to a provided parent el or the document if none exists.\n  getEl(el) {\n    const context = _.result(this, 'parentEl');\n\n    if (context && _.isString(el)) {\n      return this.Dom.findEl(context, el);\n    }\n\n    return this.Dom.getEl(el);\n  },\n\n  _replaceEl(view) {\n    // always restore the el to ensure the regions el is present before replacing\n    this._restoreEl();\n\n    view.on('before:destroy', this._restoreEl, this);\n\n    this.Dom.replaceEl(view.el, this.el);\n\n    this._isReplaced = true;\n  },\n\n  // Restore the region's element in the DOM.\n  _restoreEl() {\n    // There is nothing to replace\n    if (!this._isReplaced) {\n      return;\n    }\n\n    const view = this.currentView;\n\n    if (!view) {\n      return;\n    }\n\n    this._detachView(view);\n\n    this._isReplaced = false;\n  },\n\n  // Check to see if the region's el was replaced.\n  isReplaced() {\n    return !!this._isReplaced;\n  },\n\n  // Check to see if a view is being swapped by another\n  isSwappingView() {\n    return !!this._isSwappingView;\n  },\n\n  // Override this method to change how the new view is appended to the `$el` that the\n  // region is managing\n  attachHtml(view) {\n    this.Dom.appendContents(this.el, view.el, {_$el: this.$el, _$contents: view.$el});\n  },\n\n  // Destroy the current view, if there is one. If there is no current view, it does\n  // nothing and returns immediately.\n  empty(options = { allowMissingEl: true }) {\n    const view = this.currentView;\n\n    // If there is no view in the region we should only detach current html\n    if (!view) {\n      if (this._ensureElement(options)) {\n        this.detachHtml();\n      }\n      return this;\n    }\n\n    const shouldDestroy = !options.preventDestroy;\n\n    if (!shouldDestroy) {\n      deprecate('The preventDestroy option is deprecated. Use Region#detachView');\n    }\n\n    this._empty(view, shouldDestroy);\n    return this;\n  },\n\n  _empty(view, shouldDestroy) {\n    view.off('destroy', this._empty, this);\n    this.triggerMethod('before:empty', this, view);\n\n    this._restoreEl();\n\n    delete this.currentView;\n\n    if (!view._isDestroyed) {\n      if (shouldDestroy) {\n        this.removeView(view);\n      } else {\n        this._detachView(view);\n      }\n      this._stopChildViewEvents(view);\n    }\n\n    this.triggerMethod('empty', this, view);\n  },\n\n  _stopChildViewEvents(view) {\n    const parentView = this._parentView;\n\n    if (!parentView) { return; }\n\n    this._parentView.stopListening(view);\n  },\n\n  destroyView(view) {\n    if (view._isDestroyed) {\n      return view;\n    }\n\n    view._shouldDisableEvents = this._shouldDisableMonitoring();\n    destroyView(view);\n    return view;\n  },\n\n  removeView(view) {\n    this.destroyView(view);\n  },\n\n  // Empties the Region without destroying the view\n  // Returns the detached view\n  detachView() {\n    const view = this.currentView;\n\n    if (!view) {\n      return;\n    }\n\n    this._empty(view);\n\n    return view;\n  },\n\n  _detachView(view) {\n    const shouldTriggerDetach = view._isAttached && !this._shouldDisableMonitoring();;\n    const shouldRestoreEl = this._isReplaced;\n    if (shouldTriggerDetach) {\n      triggerMethodOn(view, 'before:detach', view);\n    }\n\n    if (shouldRestoreEl) {\n      this.Dom.replaceEl(this.el, view.el);\n    } else {\n      this.detachHtml();\n    }\n\n    if (shouldTriggerDetach) {\n      view._isAttached = false;\n      triggerMethodOn(view, 'detach', view);\n    }\n  },\n\n  // Override this method to change how the region detaches current content\n  detachHtml() {\n    this.Dom.detachContents(this.el, this.$el);\n  },\n\n  // Checks whether a view is currently present within the region. Returns `true` if there is\n  // and `false` if no view is present.\n  hasView() {\n    return !!this.currentView;\n  },\n\n  // Reset the region by destroying any existing view and clearing out the cached `$el`.\n  // The next time a view is shown via this region, the region will re-query the DOM for\n  // the region's `el`.\n  reset(options) {\n    this.empty(options);\n\n    if (this.$el) {\n      this.el = this._initEl;\n    }\n\n    delete this.$el;\n    return this;\n  },\n\n  destroy(options) {\n    if (this._isDestroyed) { return this; }\n\n    this.reset(options);\n\n    if (this._name) {\n      this._parentView._removeReferences(this._name);\n    }\n    delete this._parentView;\n    delete this._name;\n\n    return MarionetteObject.prototype.destroy.apply(this, arguments);\n  }\n}, {\n  setDomApi\n});\n\nexport default Region;\n","import _ from 'underscore';\nimport _invoke from '../utils/invoke';\nimport buildRegion from '../common/build-region';\nimport Region from '../region';\n\n// MixinOptions\n// - regions\n// - regionClass\n\nexport default {\n  regionClass: Region,\n\n  // Internal method to initialize the regions that have been defined in a\n  // `regions` attribute on this View.\n  _initRegions() {\n\n    // init regions hash\n    this.regions = this.regions || {};\n    this._regions = {};\n\n    this.addRegions(_.result(this, 'regions'));\n  },\n\n  // Internal method to re-initialize all of the regions by updating\n  // the `el` that they point to\n  _reInitRegions() {\n    _invoke(this._regions, 'reset');\n  },\n\n  // Add a single region, by name, to the View\n  addRegion(name, definition) {\n    const regions = {};\n    regions[name] = definition;\n    return this.addRegions(regions)[name];\n  },\n\n  // Add multiple regions as a {name: definition, name2: def2} object literal\n  addRegions(regions) {\n    // If there's nothing to add, stop here.\n    if (_.isEmpty(regions)) {\n      return;\n    }\n\n    // Normalize region selectors hash to allow\n    // a user to use the @ui. syntax.\n    regions = this.normalizeUIValues(regions, ['selector', 'el']);\n\n    // Add the regions definitions to the regions property\n    this.regions = _.extend({}, this.regions, regions);\n\n    return this._addRegions(regions);\n  },\n\n  // internal method to build and add regions\n  _addRegions(regionDefinitions) {\n    const defaults = {\n      regionClass: this.regionClass,\n      parentEl: _.partial(_.result, this, 'el')\n    };\n\n    return _.reduce(regionDefinitions, (regions, definition, name) => {\n      regions[name] = buildRegion(definition, defaults);\n      this._addRegion(regions[name], name);\n      return regions;\n    }, {});\n  },\n\n  _addRegion(region, name) {\n    this.triggerMethod('before:add:region', this, name, region);\n\n    region._parentView = this;\n    region._name = name;\n\n    this._regions[name] = region;\n\n    this.triggerMethod('add:region', this, name, region);\n  },\n\n  // Remove a single region from the View, by name\n  removeRegion(name) {\n    const region = this._regions[name];\n\n    this._removeRegion(region, name);\n\n    return region;\n  },\n\n  // Remove all regions from the View\n  removeRegions() {\n    const regions = this._getRegions();\n\n    _.each(this._regions, _.bind(this._removeRegion, this));\n\n    return regions;\n  },\n\n  _removeRegion(region, name) {\n    this.triggerMethod('before:remove:region', this, name, region);\n\n    region.destroy();\n\n    this.triggerMethod('remove:region', this, name, region);\n  },\n\n  // Called in a region's destroy\n  _removeReferences(name) {\n    delete this.regions[name];\n    delete this._regions[name];\n  },\n\n  // Empty all regions in the region manager, but\n  // leave them attached\n  emptyRegions() {\n    const regions = this.getRegions();\n    _invoke(regions, 'empty');\n    return regions;\n  },\n\n  // Checks to see if view contains region\n  // Accepts the region name\n  // hasRegion('main')\n  hasRegion(name) {\n    return !!this.getRegion(name);\n  },\n\n  // Provides access to regions\n  // Accepts the region name\n  // getRegion('main')\n  getRegion(name) {\n    if (!this._isRendered) {\n      this.render();\n    }\n    return this._regions[name];\n  },\n\n  // Get all regions\n  _getRegions() {\n    return _.clone(this._regions);\n  },\n\n  getRegions() {\n    if (!this._isRendered) {\n      this.render();\n    }\n    return this._getRegions();\n  },\n\n  showChildView(name, view, ...args) {\n    const region = this.getRegion(name);\n    return region.show(view, ...args);\n  },\n\n  detachChildView(name) {\n    return this.getRegion(name).detachView();\n  },\n\n  getChildView(name) {\n    return this.getRegion(name).currentView;\n  }\n\n};\n","// Renderer\n// --------\n\nimport _ from 'underscore';\nimport MarionetteError from '../error';\nimport TemplateCache from '../template-cache';\n\n// Render a template with data by passing in the template\n// selector and the data to render.\nconst Renderer = {\n\n  // Render a template with data. The `template` parameter is\n  // passed to the `TemplateCache` object to retrieve the\n  // template function. Override this method to provide your own\n  // custom rendering and template handling for all of Marionette.\n  render(template, data) {\n    if (!template) {\n      throw new MarionetteError({\n        name: 'TemplateNotFoundError',\n        message: 'Cannot render the template since its false, null or undefined.'\n      });\n    }\n\n    const templateFunc = _.isFunction(template) ? template : TemplateCache.get(template);\n\n    return templateFunc(data);\n  }\n};\n\nexport default Renderer;\n","// View\n// ---------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport deprecate from './utils/deprecate';\nimport isNodeAttached from './common/is-node-attached';\nimport monitorViewEvents from './common/monitor-view-events';\nimport ViewMixin from './mixins/view';\nimport RegionsMixin from './mixins/regions';\nimport Renderer from './config/renderer';\nimport { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'behaviors',\n  'childViewEventPrefix',\n  'childViewEvents',\n  'childViewTriggers',\n  'collectionEvents',\n  'events',\n  'modelEvents',\n  'regionClass',\n  'regions',\n  'template',\n  'templateContext',\n  'triggers',\n  'ui'\n];\n\n// The standard view. Includes view events, automatic rendering\n// of Underscore templates, nested views, and more.\nconst View = Backbone.View.extend({\n\n  constructor(options) {\n    this.render = _.bind(this.render, this);\n\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    monitorViewEvents(this);\n\n    this._initBehaviors();\n    this._initRegions();\n\n    const args = Array.prototype.slice.call(arguments);\n    args[0] = this.options;\n    Backbone.View.prototype.constructor.apply(this, args);\n\n    this.delegateEntityEvents();\n\n    this._triggerEventOnBehaviors('initialize', this);\n  },\n\n  // Serialize the view's model *or* collection, if\n  // it exists, for the template\n  serializeData() {\n    if (!this.model && !this.collection) {\n      return {};\n    }\n\n    // If we have a model, we serialize that\n    if (this.model) {\n      return this.serializeModel();\n    }\n\n    // Otherwise, we serialize the collection,\n    // making it available under the `items` property\n    return {\n      items: this.serializeCollection()\n    };\n  },\n\n  // Prepares the special `model` property of a view\n  // for being displayed in the template. By default\n  // we simply clone the attributes. Override this if\n  // you need a custom transformation for your view's model\n  serializeModel() {\n    if (!this.model) { return {}; }\n    return _.clone(this.model.attributes);\n  },\n\n  // Serialize a collection by cloning each of\n  // its model's attributes\n  serializeCollection() {\n    if (!this.collection) { return {}; }\n    return this.collection.map(function(model) { return _.clone(model.attributes); });\n  },\n\n  // Overriding Backbone.View's `setElement` to handle\n  // if an el was previously defined. If so, the view might be\n  // rendered or attached on setElement.\n  setElement() {\n    const hasEl = !!this.el;\n\n    Backbone.View.prototype.setElement.apply(this, arguments);\n\n    if (hasEl) {\n      this._isRendered = this.Dom.hasContents(this.el);\n      this._isAttached = isNodeAttached(this.el);\n    }\n\n    if (this._isRendered) {\n      this.bindUIElements();\n    }\n\n    return this;\n  },\n\n  // Render the view, defaulting to underscore.js templates.\n  // You can override this in your view definition to provide\n  // a very specific rendering for your view. In general, though,\n  // you should override the `Marionette.Renderer` object to\n  // change how Marionette renders views.\n  // Subsequent renders after the first will re-render all nested\n  // views.\n  render() {\n    if (this._isDestroyed) { return this; }\n\n    this.triggerMethod('before:render', this);\n\n    // If this is not the first render call, then we need to\n    // re-initialize the `el` for each region\n    if (this._isRendered) {\n      this._reInitRegions();\n    }\n\n    this._renderTemplate();\n    this.bindUIElements();\n\n    this._isRendered = true;\n    this.triggerMethod('render', this);\n\n    return this;\n  },\n\n  // Internal method to render the template with the serialized data\n  // and template context via the `Marionette.Renderer` object.\n  _renderTemplate() {\n    const template = this.getTemplate();\n\n    // Allow template-less views\n    if (template === false) {\n      deprecate('template:false is deprecated.  Use _.noop.');\n      return;\n    }\n\n    // Add in entity data and template context\n    const data = this.mixinTemplateContext(this.serializeData());\n\n    // Render and add to el\n    const html = this._renderHtml(template, data);\n    this.attachElContent(html);\n  },\n\n  // Renders the data into the template\n  _renderHtml(template, data) {\n    return Renderer.render(template, data, this);\n  },\n\n  // Get the template for this view\n  // instance. You can set a `template` attribute in the view\n  // definition or pass a `template: \"whatever\"` parameter in\n  // to the constructor options.\n  getTemplate() {\n    return this.template;\n  },\n\n  // Mix in template context methods. Looks for a\n  // `templateContext` attribute, which can either be an\n  // object literal, or a function that returns an object\n  // literal. All methods and attributes from this object\n  // are copies to the object passed in.\n  mixinTemplateContext(target = {}) {\n    const templateContext = _.result(this, 'templateContext');\n    return _.extend(target, templateContext);\n  },\n\n  // Attaches the content of a given view.\n  // This method can be overridden to optimize rendering,\n  // or to render in a non standard way.\n  //\n  // For example, using `innerHTML` instead of `$el.html`\n  //\n  // ```js\n  // attachElContent(html) {\n  //   this.el.innerHTML = html;\n  //   return this;\n  // }\n  // ```\n  attachElContent(html) {\n    this.Dom.setContents(this.el, html, this.$el);\n\n    return this;\n  },\n\n  // called by ViewMixin destroy\n  _removeChildren() {\n    this.removeRegions();\n  },\n\n  _getImmediateChildren() {\n    return _.chain(this._getRegions())\n      .map('currentView')\n      .compact()\n      .value();\n  }\n}, {\n  // Sets the renderer for the Marionette.View class\n  setRenderer(renderer) {\n    this.prototype._renderHtml = renderer;\n    return this;\n  },\n\n  setDomApi\n});\n\n_.extend(View.prototype, ViewMixin, RegionsMixin);\n\nexport default View;\n","// Mix in methods from Underscore, for iteration, and other\n// collection related features.\n// Borrowing this code from Backbone.Collection:\n// https://github.com/jashkenas/backbone/blob/1.1.2/backbone.js#L962\n\nimport _ from 'underscore';\n\nconst methods = ['forEach', 'each', 'map', 'find', 'detect', 'filter',\n                'select', 'reject', 'every', 'all', 'some', 'any', 'include',\n                'contains', 'invoke', 'toArray', 'first', 'initial', 'rest',\n                'last', 'without', 'isEmpty', 'pluck', 'reduce', 'partition'];\n\nconst emulateCollection = function(object, listProperty) {\n  _.each(methods, function(method) {\n    object[method] = function() {\n      const list = _.result(this, listProperty);\n      const args = Array.prototype.slice.call(arguments);\n      return _[method].apply(_, [list].concat(args));\n    };\n  });\n};\n\nexport default emulateCollection;\n","import _ from 'underscore';\nimport emulateCollection from './utils/emulate-collection';\n\n// Provide a container to store, retrieve and\n// shut down child views.\nconst Container = function(views) {\n  this._views = {};\n  this._indexByModel = {};\n  this._indexByCustom = {};\n  this._updateLength();\n\n  _.each(views, _.bind(this.add, this));\n};\n\nemulateCollection(Container.prototype, '_getViews');\n\n// Container Methods\n// -----------------\n\n_.extend(Container.prototype, {\n\n  _getViews() {\n    return _.values(this._views);\n  },\n\n  // Add a view to this container. Stores the view\n  // by `cid` and makes it searchable by the model\n  // cid (and model itself). Optionally specify\n  // a custom key to store an retrieve the view.\n  add(view, customIndex) {\n    return this._add(view, customIndex)._updateLength();\n  },\n\n  // To be used when avoiding call _updateLength\n  // When you are done adding all your new views\n  // call _updateLength\n  _add(view, customIndex) {\n    const viewCid = view.cid;\n\n    // store the view\n    this._views[viewCid] = view;\n\n    // index it by model\n    if (view.model) {\n      this._indexByModel[view.model.cid] = viewCid;\n    }\n\n    // index by custom\n    if (customIndex) {\n      this._indexByCustom[customIndex] = viewCid;\n    }\n\n    return this;\n  },\n\n  // Find a view by the model that was attached to\n  // it. Uses the model's `cid` to find it.\n  findByModel(model) {\n    return this.findByModelCid(model.cid);\n  },\n\n  // Find a view by the `cid` of the model that was attached to\n  // it. Uses the model's `cid` to find the view `cid` and\n  // retrieve the view using it.\n  findByModelCid(modelCid) {\n    const viewCid = this._indexByModel[modelCid];\n    return this.findByCid(viewCid);\n  },\n\n  // Find a view by a custom indexer.\n  findByCustom(index) {\n    const viewCid = this._indexByCustom[index];\n    return this.findByCid(viewCid);\n  },\n\n  // Find by index. This is not guaranteed to be a\n  // stable index.\n  findByIndex(index) {\n    return _.values(this._views)[index];\n  },\n\n  // retrieve a view by its `cid` directly\n  findByCid(cid) {\n    return this._views[cid];\n  },\n\n  // Remove a view\n  remove(view) {\n    return this._remove(view)._updateLength();\n  },\n\n  // To be used when avoiding call _updateLength\n  // When you are done adding all your new views\n  // call _updateLength\n  _remove(view) {\n    const viewCid = view.cid;\n\n    // delete model index\n    if (view.model) {\n      delete this._indexByModel[view.model.cid];\n    }\n\n    // delete custom index\n    _.some(this._indexByCustom, _.bind(function(cid, key) {\n      if (cid === viewCid) {\n        delete this._indexByCustom[key];\n        return true;\n      }\n    }, this));\n\n    // remove the view from the container\n    delete this._views[viewCid];\n\n    return this;\n  },\n\n  // Update the `.length` attribute on this container\n  _updateLength() {\n    this.length = _.size(this._views);\n\n    return this;\n  }\n});\n\nexport default Container;\n","// Collection View\n// ---------------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport { renderView, destroyView } from './common/view';\nimport isNodeAttached from './common/is-node-attached';\nimport monitorViewEvents from './common/monitor-view-events';\nimport { triggerMethodOn } from './common/trigger-method';\nimport ChildViewContainer from './child-view-container';\nimport MarionetteError from './error';\nimport ViewMixin from './mixins/view';\nimport { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'behaviors',\n  'childView',\n  'childViewEventPrefix',\n  'childViewEvents',\n  'childViewOptions',\n  'childViewTriggers',\n  'collectionEvents',\n  'events',\n  'filter',\n  'emptyView',\n  'emptyViewOptions',\n  'modelEvents',\n  'reorderOnSort',\n  'sort',\n  'triggers',\n  'ui',\n  'viewComparator'\n];\n\n// A view that iterates over a Backbone.Collection\n// and renders an individual child view for each model.\nconst CollectionView = Backbone.View.extend({\n\n  // flag for maintaining the sorted order of the collection\n  sort: true,\n\n  // constructor\n  // option to pass `{sort: false}` to prevent the `CollectionView` from\n  // maintaining the sorted order of the collection.\n  // This will fallback onto appending childView's to the end.\n  //\n  // option to pass `{viewComparator: compFunction()}` to allow the `CollectionView`\n  // to use a custom sort order for the collection.\n  constructor(options) {\n    this.render = _.bind(this.render, this);\n\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    monitorViewEvents(this);\n\n    this._initBehaviors();\n    this.once('render', this._initialEvents);\n    this._initChildViewStorage();\n    this._bufferedChildren = [];\n\n    const args = Array.prototype.slice.call(arguments);\n    args[0] = this.options;\n    Backbone.View.prototype.constructor.apply(this, args);\n\n    this.delegateEntityEvents();\n\n    this._triggerEventOnBehaviors('initialize', this);\n  },\n\n  // Instead of inserting elements one by one into the page, it's much more performant to insert\n  // elements into a document fragment and then insert that document fragment into the page\n  _startBuffering() {\n    this._isBuffering = true;\n  },\n\n  _endBuffering() {\n    const shouldTriggerAttach = this._isAttached && this.monitorViewEvents !== false;\n    const triggerOnChildren = shouldTriggerAttach ? this._getImmediateChildren() : [];\n\n    this._isBuffering = false;\n\n    _.each(triggerOnChildren, child => {\n      triggerMethodOn(child, 'before:attach', child);\n    });\n\n    this.attachBuffer(this, this._createBuffer());\n\n    _.each(triggerOnChildren, child => {\n      child._isAttached = true;\n      triggerMethodOn(child, 'attach', child);\n    });\n\n    this._bufferedChildren = [];\n  },\n\n  _getImmediateChildren() {\n    return _.values(this.children._views);\n  },\n\n  // Configured the initial events that the collection view binds to.\n  _initialEvents() {\n    if (this.collection) {\n      this.listenTo(this.collection, 'add', this._onCollectionAdd);\n      this.listenTo(this.collection, 'update', this._onCollectionUpdate);\n      this.listenTo(this.collection, 'reset', this.render);\n\n      if (this.sort) {\n        this.listenTo(this.collection, 'sort', this._sortViews);\n      }\n    }\n  },\n\n  // Handle a child added to the collection\n  _onCollectionAdd(child, collection, opts) {\n    // `index` is present when adding with `at` since BB 1.2; indexOf fallback for < 1.2\n    let index = opts.at !== undefined && (opts.index || collection.indexOf(child));\n\n    // When filtered or when there is no initial index, calculate index.\n    if (this.filter || index === false) {\n      index = _.indexOf(this._filteredSortedModels(index), child);\n    }\n\n    if (this._shouldAddChild(child, index)) {\n      this._destroyEmptyView();\n      this._addChild(child, index)\n    }\n  },\n\n  // Handle collection update model removals\n  _onCollectionUpdate(collection, options) {\n    const changes = options.changes;\n    this._removeChildModels(changes.removed);\n  },\n\n  // Remove the child views and destroy them.\n  // This function also updates the indices of later views\n  // in the collection in order to keep the children in sync with the collection.\n  // \"models\" is an array of models and the corresponding views\n  // will be removed and destroyed from the CollectionView\n  _removeChildModels(models) {\n    // Used to determine where to update the remaining\n    // sibling view indices after these views are removed.\n    const removedViews = this._getRemovedViews(models);\n\n    if (!removedViews.length) {\n      return;\n    }\n\n    this.children._updateLength();\n\n    // decrement the index of views after this one\n    this._updateIndices(removedViews, false);\n\n    if (this.isEmpty()) {\n      this._showEmptyView();\n    }\n  },\n\n  // Returns the views that will be used for re-indexing\n  // through CollectionView#_updateIndices.\n  _getRemovedViews(models) {\n\n    // Returning a view means something was removed.\n    return _.reduce(models, (removingViews, model) => {\n      const view = model && this.children.findByModel(model);\n\n      if (!view || view._isDestroyed) {\n        return removingViews;\n      }\n\n      this._removeChildView(view);\n\n      removingViews.push(view);\n\n      return removingViews;\n    }, []);\n  },\n\n  _removeChildView(view) {\n    this.triggerMethod('before:remove:child', this, view);\n\n    this.children._remove(view);\n    view._shouldDisableEvents = this.monitorViewEvents === false;\n    destroyView(view);\n\n    this.stopListening(view);\n    this.triggerMethod('remove:child', this, view);\n  },\n\n  // Overriding Backbone.View's `setElement` to handle\n  // if an el was previously defined. If so, the view might be\n  // attached on setElement.\n  setElement() {\n    const hasEl = !!this.el;\n\n    Backbone.View.prototype.setElement.apply(this, arguments);\n\n    if (hasEl) {\n      this._isAttached = isNodeAttached(this.el);\n    }\n\n    return this;\n  },\n\n  // Render children views. Override this method to provide your own implementation of a\n  // render function for the collection view.\n  render() {\n    if (this._isDestroyed) { return this; }\n    this.triggerMethod('before:render', this);\n    this._renderChildren();\n    this._isRendered = true;\n    this.triggerMethod('render', this);\n    return this;\n  },\n\n  // An efficient rendering used for filtering. Instead of modifying the whole DOM for the\n  // collection view, we are only adding or removing the related childrenViews.\n  setFilter(filter, {preventRender} = {}) {\n    const canBeRendered = this._isRendered && !this._isDestroyed;\n    const filterChanged = this.filter !== filter;\n    const shouldRender = canBeRendered && filterChanged && !preventRender;\n\n    if (shouldRender) {\n      const previousModels = this._filteredSortedModels();\n      this.filter = filter;\n      const models = this._filteredSortedModels();\n      this._applyModelDeltas(models, previousModels);\n    } else {\n      this.filter = filter;\n    }\n\n    return this;\n  },\n\n  // `removeFilter` is actually an alias for removing filters.\n  removeFilter(options) {\n    return this.setFilter(null, options);\n  },\n\n  // Calculate and apply difference by cid between `models` and `previousModels`.\n  _applyModelDeltas(models, previousModels) {\n    const currentIds = {};\n    _.each(models, (model, index) => {\n      const addedChildNotExists = !this.children.findByModel(model);\n      if (addedChildNotExists) {\n        this._onCollectionAdd(model, this.collection, {at: index});\n      }\n      currentIds[model.cid] = true;\n    });\n\n    const removeModels = _.filter(previousModels, (prevModel) => {\n      return !currentIds[prevModel.cid] && this.children.findByModel(prevModel);\n    });\n\n    this._removeChildModels(removeModels);\n  },\n\n  // Reorder DOM after sorting. When your element's rendering do not use their index,\n  // you can pass reorderOnSort: true to only reorder the DOM after a sort instead of\n  // rendering all the collectionView.\n  reorder() {\n    const children = this.children;\n    const models = this._filteredSortedModels();\n\n    if (!models.length && this._showingEmptyView) { return this; }\n\n    const anyModelsAdded = _.some(models, function(model) {\n      return !children.findByModel(model);\n    });\n\n    // If there are any new models added due to filtering we need to add child views,\n    // so render as normal.\n    if (anyModelsAdded) {\n      this.render();\n    } else {\n\n      const filteredOutModels = [];\n\n      // Get the DOM nodes in the same order as the models and\n      // find the model that were children before but aren't in this new order.\n      const elsToReorder = _.reduce(this.children._views, function(viewEls, view) {\n        const index = _.indexOf(models, view.model);\n\n        if (index === -1) {\n          filteredOutModels.push(view.model);\n          return viewEls;\n        }\n\n        view._index = index;\n\n        viewEls[index] = view.el;\n\n        return viewEls;\n      }, new Array(models.length));\n\n      this.triggerMethod('before:reorder', this);\n\n      const elBuffer = this.Dom.createBuffer();\n\n      _.each(elsToReorder, (el) => {\n        this.Dom.appendContents(elBuffer, el);\n      });\n\n      // Since append moves elements that are already in the DOM, appending the elements\n      // will effectively reorder them.\n      this._appendReorderedChildren(elBuffer);\n\n      // remove any views that have been filtered out\n      this._removeChildModels(filteredOutModels);\n\n      this.triggerMethod('reorder', this);\n    }\n    return this;\n  },\n\n  // Render view after sorting. Override this method to change how the view renders\n  // after a `sort` on the collection.\n  resortView() {\n    if (this.reorderOnSort) {\n      this.reorder();\n    } else {\n      this._renderChildren();\n    }\n    return this;\n  },\n\n  // Internal method. This checks for any changes in the order of the collection.\n  // If the index of any view doesn't match, it will render.\n  _sortViews() {\n    const models = this._filteredSortedModels();\n\n    // check for any changes in sort order of views\n    const orderChanged = _.find(models, (item, index) => {\n      const view = this.children.findByModel(item);\n      return !view || view._index !== index;\n    });\n\n    if (orderChanged) {\n      this.resortView();\n    }\n  },\n\n  // Internal reference to what index a `emptyView` is.\n  _emptyViewIndex: -1,\n\n  // Internal method. Separated so that CompositeView can append to the childViewContainer\n  // if necessary\n  _appendReorderedChildren(children) {\n    this.Dom.appendContents(this.el, children, {_$el: this.$el});\n  },\n\n  // Internal method. Separated so that CompositeView can have more control over events\n  // being triggered, around the rendering process\n  _renderChildren() {\n    if (this._isRendered) {\n      this._destroyEmptyView();\n      this._destroyChildren();\n    }\n\n    const models = this._filteredSortedModels();\n    if (this.isEmpty({processedModels: models})) {\n      this._showEmptyView();\n    } else {\n      this.triggerMethod('before:render:children', this);\n      this._startBuffering();\n      this._showCollection(models);\n      this._endBuffering();\n      this.triggerMethod('render:children', this);\n    }\n  },\n\n  _createView(model, index) {\n    const ChildView = this._getChildView(model);\n    const childViewOptions = this._getChildViewOptions(model, index);\n    const view = this.buildChildView(model, ChildView, childViewOptions);\n    return view;\n  },\n\n  _setupChildView(view, index) {\n    monitorViewEvents(view);\n\n    // set up the child view event forwarding\n    this._proxyChildViewEvents(view);\n\n    if (this.sort) {\n      view._index = index;\n    }\n  },\n\n  // Internal method to loop through collection and show each child view.\n  _showCollection(models) {\n    _.each(models, _.bind(this._addChild, this));\n    this.children._updateLength();\n  },\n\n  // Allow the collection to be sorted by a custom view comparator\n  _filteredSortedModels(addedAt) {\n    if (!this.collection || !this.collection.length) { return []; }\n\n    const viewComparator = this.getViewComparator();\n    let models = this.collection.models;\n    addedAt = Math.min(Math.max(addedAt, 0), models.length - 1);\n\n    if (viewComparator) {\n      let addedModel;\n      // Preserve `at` location, even for a sorted view\n      if (addedAt) {\n        addedModel = models[addedAt];\n        models = models.slice(0, addedAt).concat(models.slice(addedAt + 1));\n      }\n      models = this._sortModelsBy(models, viewComparator);\n      if (addedModel) {\n        models.splice(addedAt, 0, addedModel);\n      }\n    }\n\n    // Filter after sorting in case the filter uses the index\n    models = this._filterModels(models);\n\n    return models;\n  },\n\n  getViewComparator() {\n    return this.viewComparator;\n  },\n\n  // Filter an array of models, if a filter exists\n  _filterModels(models) {\n    if (this.filter) {\n      models = _.filter(models, (model, index) => {\n        return this._shouldAddChild(model, index);\n      });\n    }\n    return models;\n  },\n\n  _sortModelsBy(models, comparator) {\n    if (typeof comparator === 'string') {\n      return _.sortBy(models, (model) => {\n        return model.get(comparator);\n      });\n    } else if (comparator.length === 1) {\n      return _.sortBy(models, _.bind(comparator, this));\n    } else {\n      return _.clone(models).sort(_.bind(comparator, this));\n    }\n  },\n\n  // Internal method to show an empty view in place of a collection of child views,\n  // when the collection is empty\n  _showEmptyView() {\n    const EmptyView = this._getEmptyView();\n\n    if (EmptyView && !this._showingEmptyView) {\n      this._showingEmptyView = true;\n\n      const model = new Backbone.Model();\n      let emptyViewOptions =\n        this.emptyViewOptions || this.childViewOptions;\n      if (_.isFunction(emptyViewOptions)) {\n        emptyViewOptions = emptyViewOptions.call(this, model, this._emptyViewIndex);\n      }\n\n      const view = this.buildChildView(model, EmptyView, emptyViewOptions);\n\n      this.triggerMethod('before:render:empty', this, view);\n      this.addChildView(view, 0);\n      this.triggerMethod('render:empty', this, view);\n    }\n  },\n\n  // Internal method to destroy an existing emptyView instance if one exists. Called when\n  // a collection view has been rendered empty, and then a child is added to the collection.\n  _destroyEmptyView() {\n    if (this._showingEmptyView) {\n      this.triggerMethod('before:remove:empty', this);\n\n      this._destroyChildren();\n      delete this._showingEmptyView;\n\n      this.triggerMethod('remove:empty', this);\n    }\n  },\n\n  // Retrieve the empty view class\n  _getEmptyView() {\n    const emptyView = this.emptyView;\n\n    if (!emptyView) { return; }\n\n    return this._getView(emptyView);\n  },\n\n  // Retrieve the `childView` class\n  // The `childView` property can be either a view class or a function that\n  // returns a view class. If it is a function, it will receive the model that\n  // will be passed to the view instance (created from the returned view class)\n  _getChildView(child) {\n    let childView = this.childView;\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'NoChildViewError',\n        message: 'A \"childView\" must be specified'\n      });\n    }\n\n    childView = this._getView(childView, child);\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'InvalidChildViewError',\n        message: '\"childView\" must be a view class or a function that returns a view class'\n      });\n    }\n\n    return childView;\n  },\n\n  // First check if the `view` is a view class (the common case)\n  // Then check if it's a function (which we assume that returns a view class)\n  _getView(view, child) {\n    if (view.prototype instanceof Backbone.View || view === Backbone.View) {\n      return view;\n    } else if (_.isFunction(view)) {\n      return view.call(this, child);\n    }\n  },\n\n  // Internal method for building and adding a child view\n  _addChild(child, index) {\n    const view = this._createView(child, index);\n    this.addChildView(view, index);\n\n    return view;\n  },\n\n  _getChildViewOptions(child, index) {\n    if (_.isFunction(this.childViewOptions)) {\n      return this.childViewOptions(child, index);\n    }\n\n    return this.childViewOptions;\n  },\n\n  // Render the child's view and add it to the HTML for the collection view at a given index.\n  // This will also update the indices of later views in the collection in order to keep the\n  // children in sync with the collection.\n  addChildView(view, index) {\n    this.triggerMethod('before:add:child', this, view);\n    this._setupChildView(view, index);\n\n    // Store the child view itself so we can properly remove and/or destroy it later\n    if (this._isBuffering) {\n      // Add to children, but don't update children's length.\n      this.children._add(view);\n    } else {\n      // increment indices of views after this one\n      this._updateIndices(view, true);\n      this.children.add(view);\n    }\n\n    renderView(view);\n\n    this._attachView(view, index);\n\n    this.triggerMethod('add:child', this, view);\n\n    return view;\n  },\n\n  // Internal method. This decrements or increments the indices of views after the added/removed\n  // view to keep in sync with the collection.\n  _updateIndices(views, increment) {\n    if (!this.sort) {\n      return;\n    }\n\n    if (!increment) {\n      _.each(_.sortBy(this.children._views, '_index'), (view, index) => {\n        view._index = index;\n      });\n\n      return;\n    }\n\n    const view = _.isArray(views) ? _.max(views, '_index') : views;\n\n    if (_.isObject(view)) {\n      // update the indexes of views after this one\n      _.each(this.children._views, (laterView) => {\n        if (laterView._index >= view._index) {\n          laterView._index += 1;\n        }\n      });\n    }\n  },\n\n  _attachView(view, index) {\n    // Only trigger attach if already attached and not buffering,\n    // otherwise _endBuffering() or Region#show() handles this.\n    const shouldTriggerAttach = !view._isAttached && !this._isBuffering && this._isAttached && this.monitorViewEvents !== false;\n\n    if (shouldTriggerAttach) {\n      triggerMethodOn(view, 'before:attach', view);\n    }\n\n    this.attachHtml(this, view, index);\n\n    if (shouldTriggerAttach) {\n      view._isAttached = true;\n      triggerMethodOn(view, 'attach', view);\n    }\n  },\n\n  // Build a `childView` for a model in the collection.\n  buildChildView(child, ChildViewClass, childViewOptions) {\n    const options = _.extend({model: child}, childViewOptions);\n    return new ChildViewClass(options);\n  },\n\n  // Remove the child view and destroy it. This function also updates the indices of later views\n  // in the collection in order to keep the children in sync with the collection.\n  removeChildView(view) {\n    if (!view || view._isDestroyed) {\n      return view;\n    }\n\n    this._removeChildView(view);\n    this.children._updateLength();\n    // decrement the index of views after this one\n    this._updateIndices(view, false);\n    return view;\n  },\n\n  // check if the collection is empty or optionally whether an array of pre-processed models is empty\n  isEmpty(options) {\n    let models;\n    if (_.result(options, 'processedModels')) {\n      models = options.processedModels;\n    } else {\n      models = this.collection ? this.collection.models : [];\n      models = this._filterModels(models);\n    }\n    return models.length === 0;\n  },\n\n  // You might need to override this if you've overridden attachHtml\n  attachBuffer(collectionView, buffer) {\n    this.Dom.appendContents(collectionView.el, buffer, {_$el: collectionView.$el});\n  },\n\n  // Create a fragment buffer from the currently buffered children\n  _createBuffer() {\n    const elBuffer = this.Dom.createBuffer();\n    _.each(this._bufferedChildren, (b) => {\n      this.Dom.appendContents(elBuffer, b.el, {_$contents: b.$el});\n    });\n    return elBuffer;\n  },\n\n  // Append the HTML to the collection's `el`. Override this method to do something other\n  // than `.append`.\n  attachHtml(collectionView, childView, index) {\n    if (collectionView._isBuffering) {\n      // buffering happens on reset events and initial renders\n      // in order to reduce the number of inserts into the\n      // document, which are expensive.\n      collectionView._bufferedChildren.splice(index, 0, childView);\n    } else {\n      // If we've already rendered the main collection, append\n      // the new child into the correct order if we need to. Otherwise\n      // append to the end.\n      if (!collectionView._insertBefore(childView, index)) {\n        collectionView._insertAfter(childView);\n      }\n    }\n  },\n\n  // Internal method. Check whether we need to insert the view into the correct position.\n  _insertBefore(childView, index) {\n    let currentView;\n    const findPosition = this.sort && (index < this.children.length - 1);\n    if (findPosition) {\n      // Find the view after this one\n      currentView = _.find(this.children._views, (view) => {\n        return view._index === index + 1;\n      });\n    }\n\n    if (currentView) {\n      this.beforeEl(currentView.el, childView.el);\n      return true;\n    }\n\n    return false;\n  },\n\n  // Override to handle DOM inserting differently\n  beforeEl(el, siblings) {\n    this.$(el).before(siblings);\n  },\n\n  // Internal method. Append a view to the end of the $el\n  _insertAfter(childView) {\n    this.Dom.appendContents(this.el, childView.el, {_$el: this.$el, _$contents: childView.$el});\n  },\n\n  // Internal method to set up the `children` object for storing all of the child views\n  _initChildViewStorage() {\n    this.children = new ChildViewContainer();\n  },\n\n  // called by ViewMixin destroy\n  _removeChildren() {\n    this._destroyChildren();\n  },\n\n  // Destroy the child views that this collection view is holding on to, if any\n  _destroyChildren(options) {\n    if (!this.children.length) {\n      return;\n    }\n\n    this.triggerMethod('before:destroy:children', this);\n    _.each(this.children._views, _.bind(this._removeChildView, this));\n    this.children._updateLength();\n    this.triggerMethod('destroy:children', this);\n  },\n\n  // Return true if the given child should be shown. Return false otherwise.\n  // The filter will be passed (child, index, collection), where\n  //  'child' is the given model\n  //  'index' is the index of that model in the collection\n  //  'collection' is the collection referenced by this CollectionView\n  _shouldAddChild(child, index) {\n    const filter = this.filter;\n    return !_.isFunction(filter) || filter.call(this, child, index, this.collection);\n  }\n}, {\n  setDomApi\n});\n\n_.extend(CollectionView.prototype, ViewMixin);\n\nexport default CollectionView;\n","// Next Collection View\n// ---------------\n\nimport _ from 'underscore';\nimport Backbone from 'backbone';\nimport { renderView, destroyView } from './common/view';\nimport isNodeAttached from './common/is-node-attached';\nimport monitorViewEvents from './common/monitor-view-events';\nimport { triggerMethodOn } from './common/trigger-method';\nimport ChildViewContainer from './next-child-view-container';\nimport MarionetteError from './error';\nimport Region from './region';\nimport ViewMixin from './mixins/view';\nimport { setDomApi } from './config/dom';\n\nconst ClassOptions = [\n  'behaviors',\n  'childView',\n  'childViewEventPrefix',\n  'childViewEvents',\n  'childViewOptions',\n  'childViewTriggers',\n  'collectionEvents',\n  'emptyView',\n  'emptyViewOptions',\n  'events',\n  'modelEvents',\n  'sortWithCollection',\n  'triggers',\n  'ui',\n  'viewComparator',\n  'viewFilter'\n];\n\n// A view that iterates over a Backbone.Collection\n// and renders an individual child view for each model.\nconst CollectionView = Backbone.View.extend({\n  // flag for maintaining the sorted order of the collection\n  sortWithCollection: true,\n\n  // constructor\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    monitorViewEvents(this);\n\n    this.once('render', this._initialEvents);\n\n    // This children container isn't really used by a render, but it provides\n    // the ability to check `this.children.length` prior to rendering\n    // It also allows for cases where only addChildView is used\n    this._initChildViewStorage();\n    this._initBehaviors();\n\n    const args = Array.prototype.slice.call(arguments);\n    args[0] = this.options;\n    Backbone.View.prototype.constructor.apply(this, args);\n\n    // Init empty region\n    this.getEmptyRegion();\n\n    this.delegateEntityEvents();\n\n    this._triggerEventOnBehaviors('initialize', this);\n  },\n\n  // Internal method to set up the `children` object for storing all of the child views\n  _initChildViewStorage() {\n    this.children = new ChildViewContainer();\n  },\n\n  // Create an region to show the emptyView\n  getEmptyRegion() {\n    if (this._emptyRegion && !this._emptyRegion.isDestroyed()) {\n      return this._emptyRegion;\n    }\n\n    this._emptyRegion = new Region({ el: this.el, replaceElement: false });\n\n    this._emptyRegion._parentView = this;\n\n    return this._emptyRegion;\n  },\n\n  // Configured the initial events that the collection view binds to.\n  _initialEvents() {\n    this.listenTo(this.collection, {\n      'sort': this._onCollectionSort,\n      'reset': this._onCollectionReset,\n      'update': this._onCollectionUpdate\n    });\n  },\n\n  // Internal method. This checks for any changes in the order of the collection.\n  // If the index of any view doesn't match, it will re-sort.\n  _onCollectionSort() {\n    if (!this.sortWithCollection || this.viewComparator === false) {\n      return;\n    }\n\n    // If the data is changing we will handle the sort later\n    if (this.collection.length !== this.children.length) {\n      return;\n    }\n\n    // Additional check if the data is changing\n    const hasAddedModel = this.collection.some(model => {\n      return !this.children.findByModel(model);\n    });\n\n    if (hasAddedModel) {\n      return;\n    }\n\n    // If the only thing happening here is sorting, sort.\n    this.sort();\n  },\n\n  _onCollectionReset() {\n    this.render();\n  },\n\n  // Handle collection update model additions and  removals\n  _onCollectionUpdate(collection, options) {\n    const changes = options.changes;\n\n    // Remove first since it'll be a shorter array lookup.\n    const removedViews = changes.removed.length && this._removeChildModels(changes.removed);\n\n    this._addedViews = changes.added.length && this._addChildModels(changes.added);\n\n    this._detachChildren(removedViews);\n\n    this._showChildren();\n\n    // Destroy removed child views after all of the render is complete\n    this._removeChildViews(removedViews);\n  },\n\n  _removeChildModels(models) {\n    return _.map(models, _.bind(this._removeChildModel, this));\n  },\n\n  _removeChildModel(model) {\n    const view = this.children.findByModel(model);\n\n    this._removeChild(view);\n\n    return view;\n  },\n\n  _removeChild(view) {\n    this.triggerMethod('before:remove:child', this, view);\n\n    this.children._remove(view);\n\n    this.triggerMethod('remove:child', this, view);\n  },\n\n  // Added views are returned for consistency with _removeChildModels\n  _addChildModels(models) {\n    return _.map(models, _.bind(this._addChildModel, this));\n  },\n\n  _addChildModel(model) {\n    const view = this._createChildView(model);\n\n    this._addChild(view);\n\n    return view;\n  },\n\n  _createChildView(model) {\n    const ChildView = this._getChildView(model);\n    const childViewOptions = this._getChildViewOptions(model);\n    const view = this.buildChildView(model, ChildView, childViewOptions);\n\n    return view;\n  },\n\n  _addChild(view, index) {\n    this.triggerMethod('before:add:child', this, view);\n\n    this._setupChildView(view);\n    this.children._add(view, index);\n\n    this.triggerMethod('add:child', this, view);\n  },\n\n  // Retrieve the `childView` class\n  // The `childView` property can be either a view class or a function that\n  // returns a view class. If it is a function, it will receive the model that\n  // will be passed to the view instance (created from the returned view class)\n  _getChildView(child) {\n    let childView = this.childView;\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'NoChildViewError',\n        message: 'A \"childView\" must be specified'\n      });\n    }\n\n    childView = this._getView(childView, child);\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'InvalidChildViewError',\n        message: '\"childView\" must be a view class or a function that returns a view class'\n      });\n    }\n\n    return childView;\n  },\n\n  // First check if the `view` is a view class (the common case)\n  // Then check if it's a function (which we assume that returns a view class)\n  _getView(view, child) {\n    if (view.prototype instanceof Backbone.View || view === Backbone.View) {\n      return view;\n    } else if (_.isFunction(view)) {\n      return view.call(this, child);\n    }\n  },\n\n  _getChildViewOptions(child) {\n    if (_.isFunction(this.childViewOptions)) {\n      return this.childViewOptions(child);\n    }\n\n    return this.childViewOptions;\n  },\n\n  // Build a `childView` for a model in the collection.\n  // Override to customize the build\n  buildChildView(child, ChildViewClass, childViewOptions) {\n    const options = _.extend({model: child}, childViewOptions);\n    return new ChildViewClass(options);\n  },\n\n  _setupChildView(view) {\n    monitorViewEvents(view);\n\n    // We need to listen for if a view is destroyed in a way other\n    // than through the CollectionView.\n    // If this happens we need to remove the reference to the view\n    // since once a view has been destroyed we can not reuse it.\n    view.on('destroy', this.removeChildView, this);\n\n    // set up the child view event forwarding\n    this._proxyChildViewEvents(view);\n  },\n\n  // used by ViewMixin's `_childViewEventHandler`\n  _getImmediateChildren() {\n    return this.children._views;\n  },\n\n  // Overriding Backbone.View's `setElement` to handle\n  // if an el was previously defined. If so, the view might be\n  // attached on setElement.\n  setElement() {\n    const hasEl = !!this.el;\n\n    Backbone.View.prototype.setElement.apply(this, arguments);\n\n    if (hasEl) {\n      this._isAttached = isNodeAttached(this.el);\n    }\n\n    return this;\n  },\n\n  // Render children views.\n  render() {\n    if (this._isDestroyed) { return this; }\n    this.triggerMethod('before:render', this);\n\n    this._destroyChildren();\n\n    // After all children have been destroyed re-init the container\n    this.children._init();\n\n    if (this.collection) {\n      this._addChildModels(this.collection.models);\n    }\n\n    this._showChildren();\n\n    this._isRendered = true;\n\n    this.triggerMethod('render', this);\n    return this;\n  },\n\n  // Sorts the children then filters and renders the results.\n  sort() {\n    if (this._isDestroyed) { return this; }\n\n    if (!this.children.length) { return this; }\n\n    this._showChildren();\n\n    return this;\n  },\n\n  _showChildren() {\n    if (this.isEmpty()) {\n      this._showEmptyView();\n      return;\n    }\n\n    this._sortChildren();\n\n    this.filter();\n  },\n\n  // Returns true if the collectionView is considered empty.\n  // This is called twice during a render. Once to check the data,\n  // and again when views are filtered. Override this function to\n  // customize what empty means.\n  isEmpty(allViewsFiltered) {\n    return allViewsFiltered || !this.children.length;\n  },\n\n  _showEmptyView() {\n    const EmptyView = this._getEmptyView();\n\n    if (!EmptyView) {\n      return;\n    }\n\n    const options = this._getEmptyViewOptions();\n\n    const emptyRegion = this.getEmptyRegion();\n\n    emptyRegion.show(new EmptyView(options));\n  },\n\n  // Retrieve the empty view class\n  _getEmptyView() {\n    const emptyView = this.emptyView;\n\n    if (!emptyView) { return; }\n\n    return this._getView(emptyView);\n  },\n\n  // Remove the emptyView\n  _destroyEmptyView() {\n    const emptyRegion = this.getEmptyRegion();\n    // Only empty if a view is show so the region\n    // doesn't detach any other unrelated HTML\n    if (emptyRegion.hasView()) {\n      emptyRegion.empty();\n    }\n  },\n\n  //\n  _getEmptyViewOptions() {\n    const emptyViewOptions = this.emptyViewOptions || this.childViewOptions;\n\n    if (_.isFunction(emptyViewOptions)) {\n      return emptyViewOptions.call(this);\n    }\n\n    return emptyViewOptions;\n  },\n\n  // Sorts views by viewComparator and sets the children to the new order\n  _sortChildren() {\n    if (this.viewComparator === false) { return; }\n\n    this.triggerMethod('before:sort', this);\n\n    let viewComparator = this.getComparator();\n\n    if (_.isFunction(viewComparator)) {\n      // Must use native bind to preserve length\n      viewComparator = viewComparator.bind(this);\n    }\n\n    this.children._sort(viewComparator);\n\n    this.triggerMethod('sort', this);\n  },\n\n  // Sets the view's `viewComparator` and applies the sort if the view is ready.\n  // To prevent the render pass `{ preventRender: true }` as the 2nd argument.\n  setComparator(comparator, {preventRender} = {}) {\n    const comparatorChanged = this.viewComparator !== comparator;\n    const shouldSort = comparatorChanged && !preventRender;\n\n    this.viewComparator = comparator;\n\n    if (shouldSort) {\n      this.sort();\n    }\n\n    return this;\n  },\n\n  // Clears the `viewComparator` and follows the same rules for rendering as `setComparator`.\n  removeComparator(options) {\n    return this.setComparator(null, options);\n  },\n\n  // If viewComparator is overriden it will be returned here.\n  // Additionally override this function to provide custom\n  // viewComparator logic\n  getComparator() {\n    return this.viewComparator || this._viewComparator;\n  },\n\n  // Default internal view comparator that order the views by\n  // the order of the collection\n  _viewComparator(view) {\n    if (!this.collection) { return; }\n    return this.collection.indexOf(view.model);\n  },\n\n  // This method re-filters the children views and re-renders the results\n  filter() {\n    if (this._isDestroyed) { return this; }\n\n    if (!this.children.length) { return this; }\n\n    const filteredViews = this._filterChildren();\n\n    this._renderChildren(filteredViews);\n\n    return this;\n  },\n\n  _isAddedAtEnd(addedView, index, addedViews) {\n    const viewIndex = this.children._views.length - addedViews.length + index;\n    return addedView === this.children._views[viewIndex];\n  },\n\n  _filterChildren() {\n    const viewFilter = this._getFilter();\n    const addedViews = this._addedViews;\n\n    delete this._addedViews;\n\n    if (!viewFilter) {\n      if (addedViews && _.every(addedViews, _.bind(this._isAddedAtEnd, this))) {\n        return addedViews;\n      }\n\n      return this.children._views;\n    }\n\n    this.triggerMethod('before:filter', this);\n\n    const filteredViews = _.partition(this.children._views, _.bind(viewFilter, this));\n\n    this._detachChildren(filteredViews[1]);\n\n    this.triggerMethod('filter', this);\n\n    return filteredViews[0];\n  },\n\n  // This method returns a function for the viewFilter\n  _getFilter() {\n    const viewFilter = this.getFilter();\n\n    if (!viewFilter) { return false; }\n\n    if (_.isFunction(viewFilter)) {\n      return viewFilter;\n    }\n\n    // Support filter predicates `{ fooFlag: true }`\n    if (_.isObject(viewFilter)) {\n      const matcher = _.matches(viewFilter);\n      return function(view) {\n        return matcher(view.model && view.model.attributes);\n      };\n    }\n\n    // Filter by model attribute\n    if (_.isString(viewFilter)) {\n      return function(view) {\n        return view.model && view.model.get(viewFilter);\n      };\n    }\n\n    throw new MarionetteError({\n      name: 'InvalidViewFilterError',\n      message: '\"viewFilter\" must be a function, predicate object literal, a string indicating a model attribute, or falsy'\n    });\n  },\n\n  // Override this function to provide custom\n  // viewFilter logic\n  getFilter() {\n    return this.viewFilter;\n  },\n\n  // Sets the view's `viewFilter` and applies the filter if the view is ready.\n  // To prevent the render pass `{ preventRender: true }` as the 2nd argument.\n  setFilter(filter, {preventRender} = {}) {\n    const filterChanged = this.viewFilter !== filter;\n    const shouldRender = filterChanged && !preventRender;\n\n    this.viewFilter = filter;\n\n    if (shouldRender) {\n      this.filter();\n    }\n\n    return this;\n  },\n\n  // Clears the `viewFilter` and follows the same rules for rendering as `setFilter`.\n  removeFilter(options) {\n    return this.setFilter(null, options);\n  },\n\n  _detachChildren(detachingViews) {\n    _.each(detachingViews, _.bind(this._detachChildView, this));\n  },\n\n  _detachChildView(view) {\n    const shouldTriggerDetach = view._isAttached && this.monitorViewEvents !== false;\n    if (shouldTriggerDetach) {\n      triggerMethodOn(view, 'before:detach', view);\n    }\n\n    this.detachHtml(view);\n\n    if (shouldTriggerDetach) {\n      view._isAttached = false;\n      triggerMethodOn(view, 'detach', view);\n    }\n  },\n\n  // Override this method to change how the collectionView detaches a child view\n  detachHtml(view) {\n    this.Dom.detachEl(view.el, view.$el);\n  },\n\n  _renderChildren(views) {\n    if (this.isEmpty(!views.length)) {\n      this._showEmptyView();\n      return;\n    }\n\n    this._destroyEmptyView();\n\n    this.triggerMethod('before:render:children', this, views);\n\n    const els = this._getBuffer(views);\n\n    this._attachChildren(els, views);\n\n    this.triggerMethod('render:children', this, views);\n  },\n\n  _attachChildren(els, views) {\n    const shouldTriggerAttach = this._isAttached && this.monitorViewEvents !== false;\n\n    views = shouldTriggerAttach ? views : [];\n\n    _.each(views, view => {\n      if (view._isAttached) { return; }\n      triggerMethodOn(view, 'before:attach', view);\n    });\n\n    this.attachHtml(els);\n\n    _.each(views, view => {\n      if (view._isAttached) { return; }\n      view._isAttached = true;\n      triggerMethodOn(view, 'attach', view);\n    });\n  },\n\n  // Renders each view in children and creates a fragment buffer from them\n  _getBuffer(views) {\n    const elBuffer = this.Dom.createBuffer();\n\n    _.each(views, view => {\n      renderView(view);\n      this.Dom.appendContents(elBuffer, view.el, {_$contents: view.$el});\n    });\n\n    return elBuffer;\n  },\n\n  // Override this method to do something other than `.append`.\n  // You can attach any HTML at this point including the els.\n  attachHtml(els) {\n    this.Dom.appendContents(this.el, els, {_$el: this.$el});\n  },\n\n  swapChildViews(view1, view2) {\n    if (!this.children.hasView(view1) || !this.children.hasView(view2)) {\n      throw new MarionetteError({\n        name: 'ChildSwapError',\n        message: 'Both views must be children of the collection view'\n      });\n    }\n\n    this.children._swap(view1, view2);\n    this.Dom.swapEl(view1.el, view2.el);\n\n    // If the views are not filtered the same, refilter\n    if (this.Dom.hasEl(this.el, view1.el) !== this.Dom.hasEl(this.el, view2.el)) {\n      this.filter();\n    }\n\n    return this;\n  },\n\n  // Render the child's view and add it to the HTML for the collection view at a given index, based on the current sort\n  addChildView(view, index) {\n    if (!view || view._isDestroyed) {\n      return view;\n    }\n\n    this._addChild(view, index);\n    this._addedViews = [view];\n    this._showChildren();\n\n    return view;\n  },\n\n  // Detach a view from the children.  Best used when adding a\n  // childView from `addChildView`\n  detachChildView(view) {\n    this.removeChildView(view, { shouldDetach: true });\n\n    return view;\n  },\n\n  // Remove the child view and destroy it.  Best used when adding a\n  // childView from `addChildView`\n  // The options argument is for internal use only\n  removeChildView(view, options) {\n    if (!view) {\n      return view;\n    }\n\n    this._removeChildView(view, options);\n\n    this._removeChild(view);\n\n    if (this.isEmpty()) {\n      this._showEmptyView();\n    }\n\n    return view;\n  },\n\n  _removeChildViews(views) {\n    _.each(views, _.bind(this._removeChildView, this));\n  },\n\n  _removeChildView(view, {shouldDetach} = {}) {\n    view.off('destroy', this.removeChildView, this);\n\n    if (shouldDetach) {\n      this._detachChildView(view);\n    } else {\n      this._destroyChildView(view);\n    }\n\n    this.stopListening(view);\n  },\n\n  _destroyChildView(view) {\n    if (view._isDestroyed) {\n      return;\n    }\n\n    view._shouldDisableEvents = this.monitorViewEvents === false;\n    destroyView(view);\n  },\n\n  // called by ViewMixin destroy\n  _removeChildren() {\n    this._destroyChildren();\n    const emptyRegion = this.getEmptyRegion();\n    emptyRegion.destroy();\n    delete this._addedViews;\n  },\n\n  // Destroy the child views that this collection view is holding on to, if any\n  _destroyChildren() {\n    if (!this.children || !this.children.length) {\n      return;\n    }\n\n    this.triggerMethod('before:destroy:children', this);\n    if (this.monitorViewEvents === false) {\n      this.Dom.detachContents(this.el, this.$el);\n    }\n    _.each(this.children._views, _.bind(this._removeChildView, this));\n    this.triggerMethod('destroy:children', this);\n  }\n}, {\n  setDomApi\n});\n\n_.extend(CollectionView.prototype, ViewMixin);\n\nexport default CollectionView;\n","// Composite View\n// --------------\n\nimport _ from 'underscore';\nimport deprecate from './utils/deprecate';\nimport MarionetteError from './error';\nimport CollectionView from './collection-view';\nimport View from './view';\n\nconst ClassOptions = [\n  'childViewContainer',\n  'template',\n  'templateContext'\n];\n\n// Used for rendering a branch-leaf, hierarchical structure.\n// Extends directly from CollectionView\n// @deprecated\nconst CompositeView = CollectionView.extend({\n\n  // Setting up the inheritance chain which allows changes to\n  // Marionette.CollectionView.prototype.constructor which allows overriding\n  // option to pass '{sort: false}' to prevent the CompositeView from\n  // maintaining the sorted order of the collection.\n  // This will fallback onto appending childView's to the end.\n  constructor(options) {\n    deprecate('CompositeView is deprecated. Convert to View at your earliest convenience');\n\n    this.mergeOptions(options, ClassOptions);\n\n    CollectionView.prototype.constructor.apply(this, arguments);\n  },\n\n  // Configured the initial events that the composite view\n  // binds to. Override this method to prevent the initial\n  // events, or to add your own initial events.\n  _initialEvents() {\n\n    // Bind only after composite view is rendered to avoid adding child views\n    // to nonexistent childViewContainer\n\n    if (this.collection) {\n      this.listenTo(this.collection, 'add', this._onCollectionAdd);\n      this.listenTo(this.collection, 'update', this._onCollectionUpdate);\n      this.listenTo(this.collection, 'reset', this.renderChildren);\n\n      if (this.sort) {\n        this.listenTo(this.collection, 'sort', this._sortViews);\n      }\n    }\n  },\n\n  // Retrieve the `childView` to be used when rendering each of\n  // the items in the collection. The default is to return\n  // `this.childView` or Marionette.CompositeView if no `childView`\n  // has been defined. As happens in CollectionView, `childView` can\n  // be a function (which should return a view class).\n  _getChildView(child) {\n    let childView = this.childView;\n\n    // for CompositeView, if `childView` is not specified, we'll get the same\n    // composite view class rendered for each child in the collection\n    // then check if the `childView` is a view class (the common case)\n    // finally check if it's a function (which we assume that returns a view class)\n    if (!childView) {\n      return this.constructor;\n    }\n\n    childView = this._getView(childView, child);\n\n    if (!childView) {\n      throw new MarionetteError({\n        name: 'InvalidChildViewError',\n        message: '\"childView\" must be a view class or a function that returns a view class'\n      });\n    }\n\n    return childView;\n  },\n\n  // Return the serialized model\n  serializeData() {\n    return this.serializeModel();\n  },\n\n  // Renders the model and the collection.\n  render() {\n    if (this._isDestroyed) { return this; }\n    this._isRendering = true;\n    this.resetChildViewContainer();\n\n    this.triggerMethod('before:render', this);\n\n    this._renderTemplate();\n    this.bindUIElements();\n    this.renderChildren();\n\n    this._isRendering = false;\n    this._isRendered = true;\n    this.triggerMethod('render', this);\n    return this;\n  },\n\n  renderChildren() {\n    if (this._isRendered || this._isRendering) {\n      CollectionView.prototype._renderChildren.call(this);\n    }\n  },\n\n  // You might need to override this if you've overridden attachHtml\n  attachBuffer(compositeView, buffer) {\n    const $container = this.getChildViewContainer(compositeView);\n    this.Dom.appendContents($container[0], buffer, {_$el: $container});\n  },\n\n  // Internal method. Append a view to the end of the $el.\n  // Overidden from CollectionView to ensure view is appended to\n  // childViewContainer\n  _insertAfter(childView) {\n    const $container = this.getChildViewContainer(this, childView);\n    this.Dom.appendContents($container[0], childView.el, {_$el: $container, _$contents: childView.$el});\n  },\n\n  // Internal method. Append reordered childView'.\n  // Overidden from CollectionView to ensure reordered views\n  // are appended to childViewContainer\n  _appendReorderedChildren(children) {\n    const $container = this.getChildViewContainer(this);\n    this.Dom.appendContents($container[0], children, {_$el: $container});\n  },\n\n  // Internal method to ensure an `$childViewContainer` exists, for the\n  // `attachHtml` method to use.\n  getChildViewContainer(containerView, childView) {\n    if (!!containerView.$childViewContainer) {\n      return containerView.$childViewContainer;\n    }\n\n    let container;\n    const childViewContainer = containerView.childViewContainer;\n    if (childViewContainer) {\n\n      const selector = _.result(containerView, 'childViewContainer');\n\n      if (selector.charAt(0) === '@' && containerView.ui) {\n        container = containerView.ui[selector.substr(4)];\n      } else {\n        container = this.$(selector);\n      }\n\n      if (container.length <= 0) {\n        throw new MarionetteError({\n          name: 'ChildViewContainerMissingError',\n          message: `The specified \"childViewContainer\" was not found: ${containerView.childViewContainer}`\n        });\n      }\n\n    } else {\n      container = containerView.$el;\n    }\n\n    containerView.$childViewContainer = container;\n    return container;\n  },\n\n  // Internal method to reset the `$childViewContainer` on render\n  resetChildViewContainer() {\n    if (this.$childViewContainer) {\n      this.$childViewContainer = undefined;\n    }\n  }\n});\n\n// To prevent duplication but allow the best View organization\n// Certain View methods are mixed directly into the deprecated CompositeView\nconst MixinFromView = _.pick(View.prototype, 'serializeModel', 'getTemplate', '_renderTemplate', '_renderHtml', 'mixinTemplateContext', 'attachElContent');\n_.extend(CompositeView.prototype, MixinFromView);\n\nexport default CompositeView;\n","// Behavior\n// --------\n\n// A Behavior is an isolated set of DOM /\n// user interactions that can be mixed into any View.\n// Behaviors allow you to blackbox View specific interactions\n// into portable logical chunks, keeping your views simple and your code DRY.\n\nimport _ from 'underscore';\nimport deprecate from './utils/deprecate';\nimport getUniqueEventName from './utils/get-unique-event-name';\nimport MarionetteObject from './object';\nimport DelegateEntityEventsMixin from './mixins/delegate-entity-events';\nimport TriggersMixin from './mixins/triggers';\nimport UIMixin from './mixins/ui';\n\nconst ClassOptions = [\n  'collectionEvents',\n  'events',\n  'modelEvents',\n  'triggers',\n  'ui'\n];\n\nconst Behavior = MarionetteObject.extend({\n  cidPrefix: 'mnb',\n\n  constructor(options, view) {\n    // Setup reference to the view.\n    // this comes in handle when a behavior\n    // wants to directly talk up the chain\n    // to the view.\n    this.view = view;\n\n    if (this.defaults) {\n      deprecate('Behavior defaults are deprecated. For similar functionality set options on the Behavior class.');\n    }\n\n    this.defaults = _.clone(_.result(this, 'defaults', {}));\n\n    this._setOptions(_.extend({}, this.defaults, options));\n    this.mergeOptions(this.options, ClassOptions);\n\n    // Construct an internal UI hash using\n    // the behaviors UI hash and then the view UI hash.\n    // This allows the user to use UI hash elements\n    // defined in the parent view as well as those\n    // defined in the given behavior.\n    // This order will help the reuse and share of a behavior\n    // between multiple views, while letting a view override a\n    // selector under an UI key.\n    this.ui = _.extend({}, _.result(this, 'ui'), _.result(view, 'ui'));\n\n    MarionetteObject.apply(this, arguments);\n  },\n\n  // proxy behavior $ method to the view\n  // this is useful for doing jquery DOM lookups\n  // scoped to behaviors view.\n  $() {\n    return this.view.$.apply(this.view, arguments);\n  },\n\n  // Stops the behavior from listening to events.\n  // Overrides Object#destroy to prevent additional events from being triggered.\n  destroy() {\n    this.stopListening();\n\n    this.view._removeBehavior(this);\n\n    return this;\n  },\n\n  proxyViewProperties() {\n    this.$el = this.view.$el;\n    this.el = this.view.el;\n\n    return this;\n  },\n\n  bindUIElements() {\n    this._bindUIElements();\n\n    return this;\n  },\n\n  unbindUIElements() {\n    this._unbindUIElements();\n\n    return this;\n  },\n\n  getUI(name) {\n    return this._getUI(name);\n  },\n\n  // Handle `modelEvents`, and `collectionEvents` configuration\n  delegateEntityEvents() {\n    this._delegateEntityEvents(this.view.model, this.view.collection);\n\n    return this;\n  },\n\n  undelegateEntityEvents() {\n    this._undelegateEntityEvents(this.view.model, this.view.collection);\n\n    return this;\n  },\n\n  getEvents() {\n    // Normalize behavior events hash to allow\n    // a user to use the @ui. syntax.\n    const behaviorEvents = this.normalizeUIKeys(_.result(this, 'events'));\n\n    // binds the handler to the behavior and builds a unique eventName\n    return _.reduce(behaviorEvents, (events, behaviorHandler, key) => {\n      if (!_.isFunction(behaviorHandler)) {\n        behaviorHandler = this[behaviorHandler];\n      }\n      if (!behaviorHandler) { return; }\n      key = getUniqueEventName(key);\n      events[key] = _.bind(behaviorHandler, this);\n      return events;\n    }, {});\n  },\n\n  // Internal method to build all trigger handlers for a given behavior\n  getTriggers() {\n    if (!this.triggers) { return; }\n\n    // Normalize behavior triggers hash to allow\n    // a user to use the @ui. syntax.\n    const behaviorTriggers = this.normalizeUIKeys(_.result(this, 'triggers'));\n\n    return this._getViewTriggers(this.view, behaviorTriggers);\n  }\n\n});\n\n_.extend(Behavior.prototype, DelegateEntityEventsMixin, TriggersMixin, UIMixin);\n\nexport default Behavior;\n","// Application\n// -----------\nimport buildRegion from './common/build-region';\nimport MarionetteObject from './object';\nimport Region from './region';\n\nconst ClassOptions = [\n  'region',\n  'regionClass'\n];\n\n// A container for a Marionette application.\nconst Application = MarionetteObject.extend({\n  cidPrefix: 'mna',\n\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    this._initRegion();\n\n    MarionetteObject.prototype.constructor.apply(this, arguments);\n  },\n\n  regionClass: Region,\n\n  _initRegion() {\n    const region = this.region;\n\n    if (!region) { return; }\n\n    const defaults = {\n      regionClass: this.regionClass\n    };\n\n    this._region = buildRegion(region, defaults);\n  },\n\n  getRegion() {\n    return this._region;\n  },\n\n  showView(view, ...args) {\n    const region = this.getRegion();\n    return region.show(view, ...args);\n  },\n\n  getView() {\n    return this.getRegion().currentView;\n  },\n\n  // kick off all of the application's processes.\n  start(options) {\n    this.triggerMethod('before:start', this, options);\n    this.triggerMethod('start', this, options);\n    return this;\n  }\n\n});\n\nexport default Application;\n","// App Router\n// ----------\n\n// Reduce the boilerplate code of handling route events\n// and then calling a single method on another object,\n// called a controller.\n// Have your routers configured to call the method on\n// your controller, directly.\n//\n// Configure an AppRouter with `appRoutes`.\n//\n// App routers can only take one `controller` object.\n// It is recommended that you divide your controller\n// objects in to smaller pieces of related functionality\n// and have multiple routers / controllers, instead of\n// just one giant router and controller.\n//\n// You can also add standard routes to an AppRouter.\n\nimport Backbone from 'backbone';\nimport _ from 'underscore';\nimport { triggerMethod } from './common/trigger-method';\nimport MarionetteError from './error';\nimport CommonMixin from './mixins/common';\n\nconst ClassOptions = [\n  'appRoutes',\n  'controller'\n];\n\nconst AppRouter = Backbone.Router.extend({\n\n  constructor(options) {\n    this._setOptions(options);\n\n    this.mergeOptions(options, ClassOptions);\n\n    Backbone.Router.apply(this, arguments);\n\n    const appRoutes = this.appRoutes;\n    const controller = this._getController();\n    this.processAppRoutes(controller, appRoutes);\n    this.on('route', this._processOnRoute, this);\n  },\n\n  // Similar to route method on a Backbone Router but\n  // method is called on the controller\n  appRoute(route, methodName) {\n    const controller = this._getController();\n    this._addAppRoute(controller, route, methodName);\n    return this;\n  },\n\n  // process the route event and trigger the onRoute\n  // method call, if it exists\n  _processOnRoute(routeName, routeArgs) {\n    // make sure an onRoute before trying to call it\n    if (_.isFunction(this.onRoute)) {\n      // find the path that matches the current route\n      const routePath = _.invert(this.appRoutes)[routeName];\n      this.onRoute(routeName, routePath, routeArgs);\n    }\n  },\n\n  // Internal method to process the `appRoutes` for the\n  // router, and turn them in to routes that trigger the\n  // specified method on the specified `controller`.\n  processAppRoutes(controller, appRoutes) {\n    if (!appRoutes) { return this; }\n\n    const routeNames = _.keys(appRoutes).reverse(); // Backbone requires reverted order of routes\n\n    _.each(routeNames, route => {\n      this._addAppRoute(controller, route, appRoutes[route]);\n    });\n\n    return this;\n  },\n\n  _getController() {\n    return this.controller;\n  },\n\n  _addAppRoute(controller, route, methodName) {\n    const method = controller[methodName];\n\n    if (!method) {\n      throw new MarionetteError(`Method \"${methodName}\" was not found on the controller`);\n    }\n\n    this.route(route, methodName, _.bind(method, controller));\n  },\n\n  triggerMethod: triggerMethod\n});\n\n_.extend(AppRouter.prototype, CommonMixin);\n\nexport default AppRouter;\n","import Backbone from 'backbone';\nimport {version} from '../package.json';\n\nimport proxy from './utils/proxy';\nimport extend from './utils/extend';\nimport deprecate from './utils/deprecate';\n\nimport isNodeAttached from './common/is-node-attached';\nimport mergeOptions from './common/merge-options';\nimport getOption from './common/get-option';\nimport normalizeMethods from './common/normalize-methods';\nimport monitorViewEvents from './common/monitor-view-events';\n\nimport {\n  bindEvents,\n  unbindEvents\n} from './common/bind-events';\n\nimport {\n  bindRequests,\n  unbindRequests\n} from './common/bind-requests';\n\nimport {\n  triggerMethod,\n  triggerMethodOn\n} from './common/trigger-method';\n\n\nimport MarionetteObject from './object';\nimport TemplateCache from './template-cache';\nimport View from './view';\nimport CollectionView from './collection-view';\nimport NextCollectionView from './next-collection-view';\nimport CompositeView from './composite-view';\nimport Behavior from './behavior';\nimport Region from './region';\nimport Application from './application';\nimport AppRouter from './app-router';\nimport MarionetteError from './error';\n\nimport behaviorsLookup from './config/behaviors-lookup';\nimport DomApi from './config/dom';\nimport Renderer from './config/renderer';\n\nimport {\n  FEATURES,\n  isEnabled,\n  setEnabled\n} from './config/features';\n\nconst previousMarionette = Backbone.Marionette;\nconst Marionette = Backbone.Marionette = {};\n\n// This allows you to run multiple instances of Marionette on the same\n// webapp. After loading the new version, call `noConflict()` to\n// get a reference to it. At the same time the old version will be\n// returned to Backbone.Marionette.\nMarionette.noConflict = function() {\n  Backbone.Marionette = previousMarionette;\n  return this;\n};\n\n// Utilities\nMarionette.bindEvents = proxy(bindEvents);\nMarionette.unbindEvents = proxy(unbindEvents);\nMarionette.bindRequests = proxy(bindRequests);\nMarionette.unbindRequests = proxy(unbindRequests);\nMarionette.mergeOptions = proxy(mergeOptions);\nMarionette.getOption = proxy(getOption);\nMarionette.normalizeMethods = proxy(normalizeMethods);\nMarionette.extend = extend;\nMarionette.isNodeAttached = isNodeAttached;\nMarionette.deprecate = deprecate;\nMarionette.triggerMethod = proxy(triggerMethod);\nMarionette.triggerMethodOn = triggerMethodOn;\nMarionette.isEnabled = isEnabled;\nMarionette.setEnabled = setEnabled;\nMarionette.monitorViewEvents = monitorViewEvents;\n\nMarionette.Behaviors = {};\nMarionette.Behaviors.behaviorsLookup = behaviorsLookup;\n\n// Classes\nMarionette.Application = Application;\nMarionette.AppRouter = AppRouter;\nMarionette.Renderer = Renderer;\nMarionette.TemplateCache = TemplateCache;\nMarionette.View = View;\nMarionette.CollectionView = CollectionView;\nMarionette.NextCollectionView = NextCollectionView;\nMarionette.CompositeView = CompositeView;\nMarionette.Behavior = Behavior;\nMarionette.Region = Region;\nMarionette.Error = MarionetteError;\nMarionette.Object = MarionetteObject;\n\n// Configuration\nMarionette.DEV_MODE = false;\nMarionette.FEATURES = FEATURES;\nMarionette.VERSION = version;\nMarionette.DomApi = DomApi;\nMarionette.setDomApi = function(mixin) {\n  CollectionView.setDomApi(mixin);\n  CompositeView.setDomApi(mixin);\n  NextCollectionView.setDomApi(mixin);\n  Region.setDomApi(mixin);\n  View.setDomApi(mixin);\n};\n\nexport default Marionette;\n","import MarionetteError from '../error';\n\n// Placeholder method to be extended by the user.\n// The method should define the object that stores the behaviors.\n// i.e.\n//\n// ```js\n// Marionette.Behaviors.behaviorsLookup: function() {\n//   return App.Behaviors\n// }\n// ```\nexport default function behaviorsLookup() {\n  throw new MarionetteError({\n    message: 'You must define where your behaviors are stored.',\n    url: 'marionette.behaviors.md#behaviorslookup'\n  });\n}\n"]}
\ No newline at end of file
diff --git a/js/3rdparty/backbone.radio.js b/js/3rdparty/backbone.radio.js
deleted file mode 100644
index b95fc47a7..000000000
--- a/js/3rdparty/backbone.radio.js
+++ /dev/null
@@ -1,350 +0,0 @@
-// Backbone.Radio v2.0.0
-
-(function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('underscore'), require('backbone')) :
-  typeof define === 'function' && define.amd ? define(['underscore', 'backbone'], factory) :
-  (global.Backbone = global.Backbone || {}, global.Backbone.Radio = factory(global._,global.Backbone));
-}(this, function (_,Backbone) { 'use strict';
-
-  _ = 'default' in _ ? _['default'] : _;
-  Backbone = 'default' in Backbone ? Backbone['default'] : Backbone;
-
-  var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
-    return typeof obj;
-  } : function (obj) {
-    return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj;
-  };
-
-  var previousRadio = Backbone.Radio;
-
-  var Radio = Backbone.Radio = {};
-
-  Radio.VERSION = '2.0.0';
-
-  // This allows you to run multiple instances of Radio on the same
-  // webapp. After loading the new version, call `noConflict()` to
-  // get a reference to it. At the same time the old version will be
-  // returned to Backbone.Radio.
-  Radio.noConflict = function () {
-    Backbone.Radio = previousRadio;
-    return this;
-  };
-
-  // Whether or not we're in DEBUG mode or not. DEBUG mode helps you
-  // get around the issues of lack of warnings when events are mis-typed.
-  Radio.DEBUG = false;
-
-  // Format debug text.
-  Radio._debugText = function (warning, eventName, channelName) {
-    return warning + (channelName ? ' on the ' + channelName + ' channel' : '') + ': "' + eventName + '"';
-  };
-
-  // This is the method that's called when an unregistered event was called.
-  // By default, it logs warning to the console. By overriding this you could
-  // make it throw an Error, for instance. This would make firing a nonexistent event
-  // have the same consequence as firing a nonexistent method on an Object.
-  Radio.debugLog = function (warning, eventName, channelName) {
-    if (Radio.DEBUG && console && console.warn) {
-      console.warn(Radio._debugText(warning, eventName, channelName));
-    }
-  };
-
-  var eventSplitter = /\s+/;
-
-  // An internal method used to handle Radio's method overloading for Requests.
-  // It's borrowed from Backbone.Events. It differs from Backbone's overload
-  // API (which is used in Backbone.Events) in that it doesn't support space-separated
-  // event names.
-  Radio._eventsApi = function (obj, action, name, rest) {
-    if (!name) {
-      return false;
-    }
-
-    var results = {};
-
-    // Handle event maps.
-    if ((typeof name === 'undefined' ? 'undefined' : _typeof(name)) === 'object') {
-      for (var key in name) {
-        var result = obj[action].apply(obj, [key, name[key]].concat(rest));
-        eventSplitter.test(key) ? _.extend(results, result) : results[key] = result;
-      }
-      return results;
-    }
-
-    // Handle space separated event names.
-    if (eventSplitter.test(name)) {
-      var names = name.split(eventSplitter);
-      for (var i = 0, l = names.length; i < l; i++) {
-        results[names[i]] = obj[action].apply(obj, [names[i]].concat(rest));
-      }
-      return results;
-    }
-
-    return false;
-  };
-
-  // An optimized way to execute callbacks.
-  Radio._callHandler = function (callback, context, args) {
-    var a1 = args[0],
-        a2 = args[1],
-        a3 = args[2];
-    switch (args.length) {
-      case 0:
-        return callback.call(context);
-      case 1:
-        return callback.call(context, a1);
-      case 2:
-        return callback.call(context, a1, a2);
-      case 3:
-        return callback.call(context, a1, a2, a3);
-      default:
-        return callback.apply(context, args);
-    }
-  };
-
-  // A helper used by `off` methods to the handler from the store
-  function removeHandler(store, name, callback, context) {
-    var event = store[name];
-    if ((!callback || callback === event.callback || callback === event.callback._callback) && (!context || context === event.context)) {
-      delete store[name];
-      return true;
-    }
-  }
-
-  function removeHandlers(store, name, callback, context) {
-    store || (store = {});
-    var names = name ? [name] : _.keys(store);
-    var matched = false;
-
-    for (var i = 0, length = names.length; i < length; i++) {
-      name = names[i];
-
-      // If there's no event by this name, log it and continue
-      // with the loop
-      if (!store[name]) {
-        continue;
-      }
-
-      if (removeHandler(store, name, callback, context)) {
-        matched = true;
-      }
-    }
-
-    return matched;
-  }
-
-  /*
-   * tune-in
-   * -------
-   * Get console logs of a channel's activity
-   *
-   */
-
-  var _logs = {};
-
-  // This is to produce an identical function in both tuneIn and tuneOut,
-  // so that Backbone.Events unregisters it.
-  function _partial(channelName) {
-    return _logs[channelName] || (_logs[channelName] = _.bind(Radio.log, Radio, channelName));
-  }
-
-  _.extend(Radio, {
-
-    // Log information about the channel and event
-    log: function log(channelName, eventName) {
-      if (typeof console === 'undefined') {
-        return;
-      }
-      var args = _.toArray(arguments).slice(2);
-      console.log('[' + channelName + '] "' + eventName + '"', args);
-    },
-
-    // Logs all events on this channel to the console. It sets an
-    // internal value on the channel telling it we're listening,
-    // then sets a listener on the Backbone.Events
-    tuneIn: function tuneIn(channelName) {
-      var channel = Radio.channel(channelName);
-      channel._tunedIn = true;
-      channel.on('all', _partial(channelName));
-      return this;
-    },
-
-    // Stop logging all of the activities on this channel to the console
-    tuneOut: function tuneOut(channelName) {
-      var channel = Radio.channel(channelName);
-      channel._tunedIn = false;
-      channel.off('all', _partial(channelName));
-      delete _logs[channelName];
-      return this;
-    }
-  });
-
-  /*
-   * Backbone.Radio.Requests
-   * -----------------------
-   * A messaging system for requesting data.
-   *
-   */
-
-  function makeCallback(callback) {
-    return _.isFunction(callback) ? callback : function () {
-      return callback;
-    };
-  }
-
-  Radio.Requests = {
-
-    // Make a request
-    request: function request(name) {
-      var args = _.toArray(arguments).slice(1);
-      var results = Radio._eventsApi(this, 'request', name, args);
-      if (results) {
-        return results;
-      }
-      var channelName = this.channelName;
-      var requests = this._requests;
-
-      // Check if we should log the request, and if so, do it
-      if (channelName && this._tunedIn) {
-        Radio.log.apply(this, [channelName, name].concat(args));
-      }
-
-      // If the request isn't handled, log it in DEBUG mode and exit
-      if (requests && (requests[name] || requests['default'])) {
-        var handler = requests[name] || requests['default'];
-        args = requests[name] ? args : arguments;
-        return Radio._callHandler(handler.callback, handler.context, args);
-      } else {
-        Radio.debugLog('An unhandled request was fired', name, channelName);
-      }
-    },
-
-    // Set up a handler for a request
-    reply: function reply(name, callback, context) {
-      if (Radio._eventsApi(this, 'reply', name, [callback, context])) {
-        return this;
-      }
-
-      this._requests || (this._requests = {});
-
-      if (this._requests[name]) {
-        Radio.debugLog('A request was overwritten', name, this.channelName);
-      }
-
-      this._requests[name] = {
-        callback: makeCallback(callback),
-        context: context || this
-      };
-
-      return this;
-    },
-
-    // Set up a handler that can only be requested once
-    replyOnce: function replyOnce(name, callback, context) {
-      if (Radio._eventsApi(this, 'replyOnce', name, [callback, context])) {
-        return this;
-      }
-
-      var self = this;
-
-      var once = _.once(function () {
-        self.stopReplying(name);
-        return makeCallback(callback).apply(this, arguments);
-      });
-
-      return this.reply(name, once, context);
-    },
-
-    // Remove handler(s)
-    stopReplying: function stopReplying(name, callback, context) {
-      if (Radio._eventsApi(this, 'stopReplying', name)) {
-        return this;
-      }
-
-      // Remove everything if there are no arguments passed
-      if (!name && !callback && !context) {
-        delete this._requests;
-      } else if (!removeHandlers(this._requests, name, callback, context)) {
-        Radio.debugLog('Attempted to remove the unregistered request', name, this.channelName);
-      }
-
-      return this;
-    }
-  };
-
-  /*
-   * Backbone.Radio.channel
-   * ----------------------
-   * Get a reference to a channel by name.
-   *
-   */
-
-  Radio._channels = {};
-
-  Radio.channel = function (channelName) {
-    if (!channelName) {
-      throw new Error('You must provide a name for the channel.');
-    }
-
-    if (Radio._channels[channelName]) {
-      return Radio._channels[channelName];
-    } else {
-      return Radio._channels[channelName] = new Radio.Channel(channelName);
-    }
-  };
-
-  /*
-   * Backbone.Radio.Channel
-   * ----------------------
-   * A Channel is an object that extends from Backbone.Events,
-   * and Radio.Requests.
-   *
-   */
-
-  Radio.Channel = function (channelName) {
-    this.channelName = channelName;
-  };
-
-  _.extend(Radio.Channel.prototype, Backbone.Events, Radio.Requests, {
-
-    // Remove all handlers from the messaging systems of this channel
-    reset: function reset() {
-      this.off();
-      this.stopListening();
-      this.stopReplying();
-      return this;
-    }
-  });
-
-  /*
-   * Top-level API
-   * -------------
-   * Supplies the 'top-level API' for working with Channels directly
-   * from Backbone.Radio.
-   *
-   */
-
-  var channel;
-  var args;
-  var systems = [Backbone.Events, Radio.Requests];
-  _.each(systems, function (system) {
-    _.each(system, function (method, methodName) {
-      Radio[methodName] = function (channelName) {
-        args = _.toArray(arguments).slice(1);
-        channel = this.channel(channelName);
-        return channel[methodName].apply(channel, args);
-      };
-    });
-  });
-
-  Radio.reset = function (channelName) {
-    var channels = !channelName ? this._channels : [this._channels[channelName]];
-    _.each(channels, function (channel) {
-      channel.reset();
-    });
-  };
-
-  return Radio;
-
-}));
-//# sourceMappingURL=./backbone.radio.js.map
\ No newline at end of file
diff --git a/js/3rdparty/backbone.radio.js.map b/js/3rdparty/backbone.radio.js.map
deleted file mode 100644
index feb2e83f7..000000000
--- a/js/3rdparty/backbone.radio.js.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"names":[],"mappings":"","sources":["backbone.radio.js"],"sourcesContent":["// Backbone.Radio v2.0.0\n\n(function (global, factory) {\n  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('underscore'), require('backbone')) :\n  typeof define === 'function' && define.amd ? define(['underscore', 'backbone'], factory) :\n  (global.Backbone = global.Backbone || {}, global.Backbone.Radio = factory(global._,global.Backbone));\n}(this, function (_,Backbone) { 'use strict';\n\n  _ = 'default' in _ ? _['default'] : _;\n  Backbone = 'default' in Backbone ? Backbone['default'] : Backbone;\n\n  var _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n    return typeof obj;\n  } : function (obj) {\n    return obj && typeof Symbol === \"function\" && obj.constructor === Symbol ? \"symbol\" : typeof obj;\n  };\n\n  var previousRadio = Backbone.Radio;\n\n  var Radio = Backbone.Radio = {};\n\n  Radio.VERSION = '2.0.0';\n\n  // This allows you to run multiple instances of Radio on the same\n  // webapp. After loading the new version, call `noConflict()` to\n  // get a reference to it. At the same time the old version will be\n  // returned to Backbone.Radio.\n  Radio.noConflict = function () {\n    Backbone.Radio = previousRadio;\n    return this;\n  };\n\n  // Whether or not we're in DEBUG mode or not. DEBUG mode helps you\n  // get around the issues of lack of warnings when events are mis-typed.\n  Radio.DEBUG = false;\n\n  // Format debug text.\n  Radio._debugText = function (warning, eventName, channelName) {\n    return warning + (channelName ? ' on the ' + channelName + ' channel' : '') + ': \"' + eventName + '\"';\n  };\n\n  // This is the method that's called when an unregistered event was called.\n  // By default, it logs warning to the console. By overriding this you could\n  // make it throw an Error, for instance. This would make firing a nonexistent event\n  // have the same consequence as firing a nonexistent method on an Object.\n  Radio.debugLog = function (warning, eventName, channelName) {\n    if (Radio.DEBUG && console && console.warn) {\n      console.warn(Radio._debugText(warning, eventName, channelName));\n    }\n  };\n\n  var eventSplitter = /\\s+/;\n\n  // An internal method used to handle Radio's method overloading for Requests.\n  // It's borrowed from Backbone.Events. It differs from Backbone's overload\n  // API (which is used in Backbone.Events) in that it doesn't support space-separated\n  // event names.\n  Radio._eventsApi = function (obj, action, name, rest) {\n    if (!name) {\n      return false;\n    }\n\n    var results = {};\n\n    // Handle event maps.\n    if ((typeof name === 'undefined' ? 'undefined' : _typeof(name)) === 'object') {\n      for (var key in name) {\n        var result = obj[action].apply(obj, [key, name[key]].concat(rest));\n        eventSplitter.test(key) ? _.extend(results, result) : results[key] = result;\n      }\n      return results;\n    }\n\n    // Handle space separated event names.\n    if (eventSplitter.test(name)) {\n      var names = name.split(eventSplitter);\n      for (var i = 0, l = names.length; i < l; i++) {\n        results[names[i]] = obj[action].apply(obj, [names[i]].concat(rest));\n      }\n      return results;\n    }\n\n    return false;\n  };\n\n  // An optimized way to execute callbacks.\n  Radio._callHandler = function (callback, context, args) {\n    var a1 = args[0],\n        a2 = args[1],\n        a3 = args[2];\n    switch (args.length) {\n      case 0:\n        return callback.call(context);\n      case 1:\n        return callback.call(context, a1);\n      case 2:\n        return callback.call(context, a1, a2);\n      case 3:\n        return callback.call(context, a1, a2, a3);\n      default:\n        return callback.apply(context, args);\n    }\n  };\n\n  // A helper used by `off` methods to the handler from the store\n  function removeHandler(store, name, callback, context) {\n    var event = store[name];\n    if ((!callback || callback === event.callback || callback === event.callback._callback) && (!context || context === event.context)) {\n      delete store[name];\n      return true;\n    }\n  }\n\n  function removeHandlers(store, name, callback, context) {\n    store || (store = {});\n    var names = name ? [name] : _.keys(store);\n    var matched = false;\n\n    for (var i = 0, length = names.length; i < length; i++) {\n      name = names[i];\n\n      // If there's no event by this name, log it and continue\n      // with the loop\n      if (!store[name]) {\n        continue;\n      }\n\n      if (removeHandler(store, name, callback, context)) {\n        matched = true;\n      }\n    }\n\n    return matched;\n  }\n\n  /*\n   * tune-in\n   * -------\n   * Get console logs of a channel's activity\n   *\n   */\n\n  var _logs = {};\n\n  // This is to produce an identical function in both tuneIn and tuneOut,\n  // so that Backbone.Events unregisters it.\n  function _partial(channelName) {\n    return _logs[channelName] || (_logs[channelName] = _.bind(Radio.log, Radio, channelName));\n  }\n\n  _.extend(Radio, {\n\n    // Log information about the channel and event\n    log: function log(channelName, eventName) {\n      if (typeof console === 'undefined') {\n        return;\n      }\n      var args = _.toArray(arguments).slice(2);\n      console.log('[' + channelName + '] \"' + eventName + '\"', args);\n    },\n\n    // Logs all events on this channel to the console. It sets an\n    // internal value on the channel telling it we're listening,\n    // then sets a listener on the Backbone.Events\n    tuneIn: function tuneIn(channelName) {\n      var channel = Radio.channel(channelName);\n      channel._tunedIn = true;\n      channel.on('all', _partial(channelName));\n      return this;\n    },\n\n    // Stop logging all of the activities on this channel to the console\n    tuneOut: function tuneOut(channelName) {\n      var channel = Radio.channel(channelName);\n      channel._tunedIn = false;\n      channel.off('all', _partial(channelName));\n      delete _logs[channelName];\n      return this;\n    }\n  });\n\n  /*\n   * Backbone.Radio.Requests\n   * -----------------------\n   * A messaging system for requesting data.\n   *\n   */\n\n  function makeCallback(callback) {\n    return _.isFunction(callback) ? callback : function () {\n      return callback;\n    };\n  }\n\n  Radio.Requests = {\n\n    // Make a request\n    request: function request(name) {\n      var args = _.toArray(arguments).slice(1);\n      var results = Radio._eventsApi(this, 'request', name, args);\n      if (results) {\n        return results;\n      }\n      var channelName = this.channelName;\n      var requests = this._requests;\n\n      // Check if we should log the request, and if so, do it\n      if (channelName && this._tunedIn) {\n        Radio.log.apply(this, [channelName, name].concat(args));\n      }\n\n      // If the request isn't handled, log it in DEBUG mode and exit\n      if (requests && (requests[name] || requests['default'])) {\n        var handler = requests[name] || requests['default'];\n        args = requests[name] ? args : arguments;\n        return Radio._callHandler(handler.callback, handler.context, args);\n      } else {\n        Radio.debugLog('An unhandled request was fired', name, channelName);\n      }\n    },\n\n    // Set up a handler for a request\n    reply: function reply(name, callback, context) {\n      if (Radio._eventsApi(this, 'reply', name, [callback, context])) {\n        return this;\n      }\n\n      this._requests || (this._requests = {});\n\n      if (this._requests[name]) {\n        Radio.debugLog('A request was overwritten', name, this.channelName);\n      }\n\n      this._requests[name] = {\n        callback: makeCallback(callback),\n        context: context || this\n      };\n\n      return this;\n    },\n\n    // Set up a handler that can only be requested once\n    replyOnce: function replyOnce(name, callback, context) {\n      if (Radio._eventsApi(this, 'replyOnce', name, [callback, context])) {\n        return this;\n      }\n\n      var self = this;\n\n      var once = _.once(function () {\n        self.stopReplying(name);\n        return makeCallback(callback).apply(this, arguments);\n      });\n\n      return this.reply(name, once, context);\n    },\n\n    // Remove handler(s)\n    stopReplying: function stopReplying(name, callback, context) {\n      if (Radio._eventsApi(this, 'stopReplying', name)) {\n        return this;\n      }\n\n      // Remove everything if there are no arguments passed\n      if (!name && !callback && !context) {\n        delete this._requests;\n      } else if (!removeHandlers(this._requests, name, callback, context)) {\n        Radio.debugLog('Attempted to remove the unregistered request', name, this.channelName);\n      }\n\n      return this;\n    }\n  };\n\n  /*\n   * Backbone.Radio.channel\n   * ----------------------\n   * Get a reference to a channel by name.\n   *\n   */\n\n  Radio._channels = {};\n\n  Radio.channel = function (channelName) {\n    if (!channelName) {\n      throw new Error('You must provide a name for the channel.');\n    }\n\n    if (Radio._channels[channelName]) {\n      return Radio._channels[channelName];\n    } else {\n      return Radio._channels[channelName] = new Radio.Channel(channelName);\n    }\n  };\n\n  /*\n   * Backbone.Radio.Channel\n   * ----------------------\n   * A Channel is an object that extends from Backbone.Events,\n   * and Radio.Requests.\n   *\n   */\n\n  Radio.Channel = function (channelName) {\n    this.channelName = channelName;\n  };\n\n  _.extend(Radio.Channel.prototype, Backbone.Events, Radio.Requests, {\n\n    // Remove all handlers from the messaging systems of this channel\n    reset: function reset() {\n      this.off();\n      this.stopListening();\n      this.stopReplying();\n      return this;\n    }\n  });\n\n  /*\n   * Top-level API\n   * -------------\n   * Supplies the 'top-level API' for working with Channels directly\n   * from Backbone.Radio.\n   *\n   */\n\n  var channel;\n  var args;\n  var systems = [Backbone.Events, Radio.Requests];\n  _.each(systems, function (system) {\n    _.each(system, function (method, methodName) {\n      Radio[methodName] = function (channelName) {\n        args = _.toArray(arguments).slice(1);\n        channel = this.channel(channelName);\n        return channel[methodName].apply(channel, args);\n      };\n    });\n  });\n\n  Radio.reset = function (channelName) {\n    var channels = !channelName ? this._channels : [this._channels[channelName]];\n    _.each(channels, function (channel) {\n      channel.reset();\n    });\n  };\n\n  return Radio;\n\n}));\n"],"file":"backbone.radio.js","sourceRoot":"/source/"}
\ No newline at end of file
diff --git a/js/3rdparty/js_tpl.js b/js/3rdparty/js_tpl.js
deleted file mode 100644
index 62d98ba9d..000000000
--- a/js/3rdparty/js_tpl.js
+++ /dev/null
@@ -1,33 +0,0 @@
-
-// Simple JavaScript Templating
-// John Resig - http://ejohn.org/ - MIT Licensed
-(function () {
-	var cache = {};
-
-	this.tmpl = function tmpl(str, data) {
-		// Figure out if we're getting a template, or if we need to
-		// load the template - and be sure to cache the result.
-		var fn = !/\W/.test(str) ?
-				cache[str] = cache[str] ||
-				tmpl(document.getElementById(str).innerHTML) :
-				// Generate a reusable function that will serve as a template
-				// generator (and which will be cached).
-				new Function("obj",
-						"var p=[],print=function(){p.push.apply(p,arguments);};" +
-						// Introduce the data as local variables using with(){}
-						"with(obj){p.push('" +
-						// Convert the template into pure JavaScript
-						str
-						.replace(/[\r\t\n]/g, " ")
-						.split("<&").join("\t")
-						.replace(/((^|&>)[^\t]*)'/g, "$1\r")
-						.replace(/\t=(.*?)&>/g, "',$1,'")
-						.split("\t").join("');")
-						.split("&>").join("p.push('")
-						.split("\r").join("\\'")
-						+ "');}return p.join('');");
-
-		// Provide some basic currying to the user
-		return data ? fn(data) : fn;
-	};
-})();
diff --git a/js/Application.js b/js/Application.js
index dedf6f5ca..e1e3b5420 100644
--- a/js/Application.js
+++ b/js/Application.js
@@ -1,6 +1,6 @@
 import Backbone from 'backbone'
 import Bookmarks from './models/Bookmarks'
-import Tags from './models/Tagss'
+import Tags from './models/Tags'
 import Router from './Router'
 import AppView from './views/App'
 
diff --git a/js/Router.js b/js/Router.js
index 72c76a95d..295c1bce0 100644
--- a/js/Router.js
+++ b/js/Router.js
@@ -1,6 +1,6 @@
 import Backbone from 'backbone'
 import Bookmarks from './models/Bookmarks'
-import Tags from './models/Tagss'
+import Tags from './models/Tags'
 import Router from './Router'
 import AppView from './views/App'
 
diff --git a/js/index.js b/js/index.js
index 78c5396c3..bfbf494e6 100644
--- a/js/index.js
+++ b/js/index.js
@@ -1,5 +1,6 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
-import Marionette from 'backbone-marionette'
+import Marionette from 'backbone.marionette'
 import Tag from './models/Tag'
 import Tags from './models/Tags'
 import App from './Application'
diff --git a/js/templates/AddBookmark.html b/js/templates/AddBookmark.html
new file mode 100644
index 000000000..33f49ad47
--- /dev/null
+++ b/js/templates/AddBookmark.html
@@ -0,0 +1 @@
+<li class="link"><a href="#"><span>Add Bookmark</span></a></li><li class="form"><input type="text" value="" placeholder="Address..."/><button title="Add" class="icon-add"></button></li>
diff --git a/js/templates/App.html b/js/templates/App.html
new file mode 100644
index 000000000..d876f48e8
--- /dev/null
+++ b/js/templates/App.html
@@ -0,0 +1 @@
+<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>
diff --git a/js/templates/BookmarkCard.html b/js/templates/BookmarkCard.html
new file mode 100644
index 000000000..91070654b
--- /dev/null
+++ b/js/templates/BookmarkCard.html
@@ -0,0 +1 @@
+<div class="panel"><input type="checkbox" class="checkbox"/><label class="selectbox"></label><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="menu-item-checkbox action-select"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Select</span></button></li><li><button class="menu-item-checkbox action-unselect"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Unselect</span></button></li><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>
diff --git a/js/templates/BookmarkDetail_default.html b/js/templates/BookmarkDetail_default.html
new file mode 100644
index 000000000..90f12a90c
--- /dev/null
+++ b/js/templates/BookmarkDetail_default.html
@@ -0,0 +1 @@
+<div class="close icon-close"></div><div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="tags"></div><div class="description"><%- description %></div>
diff --git a/js/templates/BookmarkDetail_editing.html b/js/templates/BookmarkDetail_editing.html
new file mode 100644
index 000000000..18aeef5a6
--- /dev/null
+++ b/js/templates/BookmarkDetail_editing.html
@@ -0,0 +1 @@
+<div class="close icon-close"></div><h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="tags"><input type="text" /></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>
diff --git a/js/templates/BulkActions.html b/js/templates/BulkActions.html
new file mode 100644
index 000000000..890d81182
--- /dev/null
+++ b/js/templates/BulkActions.html
@@ -0,0 +1 @@
+<div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div><button class="delete"><span class="icon-delete"></span><span>Delete</span></button><div class="tags"><input type="text" /></div></div>
diff --git a/js/templates/Content.html b/js/templates/Content.html
new file mode 100644
index 000000000..306caeb8c
--- /dev/null
+++ b/js/templates/Content.html
@@ -0,0 +1 @@
+<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>
diff --git a/js/templates/EmptyBookmarks.html b/js/templates/EmptyBookmarks.html
new file mode 100644
index 000000000..1eac414da
--- /dev/null
+++ b/js/templates/EmptyBookmarks.html
@@ -0,0 +1 @@
+<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>
diff --git a/js/templates/MobileNav.html b/js/templates/MobileNav.html
new file mode 100644
index 000000000..f29a89153
--- /dev/null
+++ b/js/templates/MobileNav.html
@@ -0,0 +1 @@
+<a href="#" class="icon-menu toggle-menu"></a>
diff --git a/js/templates/Navigation.html b/js/templates/Navigation.html
new file mode 100644
index 000000000..ee460a2c0
--- /dev/null
+++ b/js/templates/Navigation.html
@@ -0,0 +1 @@
+<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li>
diff --git a/js/templates/Settings.html b/js/templates/Settings.html
new file mode 100644
index 000000000..0a45a70c9
--- /dev/null
+++ b/js/templates/Settings.html
@@ -0,0 +1 @@
+<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade"><span class="icon-upload"></span> Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export"><span class="icon-download"></span> Export</button><div class="import-status"></div></div>
diff --git a/js/templates/TagsManagementTag_default.html b/js/templates/TagsManagementTag_default.html
new file mode 100644
index 000000000..7b0558277
--- /dev/null
+++ b/js/templates/TagsManagementTag_default.html
@@ -0,0 +1 @@
+<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>
diff --git a/js/templates/TagsManagementTag_editing.html b/js/templates/TagsManagementTag_editing.html
new file mode 100644
index 000000000..8b48d1e62
--- /dev/null
+++ b/js/templates/TagsManagementTag_editing.html
@@ -0,0 +1 @@
+<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>
diff --git a/js/templates/TagsNavigationTag.html b/js/templates/TagsNavigationTag.html
new file mode 100644
index 000000000..c0f2bbc75
--- /dev/null
+++ b/js/templates/TagsNavigationTag.html
@@ -0,0 +1 @@
+<a href="#"><%- name %></a>
diff --git a/js/views/AddBookmark.js b/js/views/AddBookmark.js
index ebe5294c1..a373b2b70 100644
--- a/js/views/AddBookmark.js
+++ b/js/views/AddBookmark.js
@@ -1,11 +1,13 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
 import Bookmark from '../models/Bookmark'
+import templateString from '../templates/AddBookmark.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
-  template: _.template('<li class="link"><a href="#"><span>Add Bookmark</span></a></li><li class="form"><input type="text" value="" placeholder="Address..."/><button title="Add" class="icon-add"></button></li>')
+  template: _.template(templateString)
 , className: 'add-bookmark'
 , tagName: 'ul'
 , events: {
diff --git a/js/views/App.js b/js/views/App.js
index 14f49ec65..c8f65abd8 100644
--- a/js/views/App.js
+++ b/js/views/App.js
@@ -1,16 +1,18 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
-import SearchController from './views/SearchController'
-import AddBookmarkView from './views/AddBookmark'
-import NavigationView from './views/Navigation'
-import TagsManagementView from './views/TagsManagement'
-import ContentView from './views/Content'
-import SettingsView from './views/Settings'
+import SearchController from './SearchController'
+import AddBookmarkView from './AddBookmark'
+import NavigationView from './Navigation'
+import TagsManagementView from './TagsManagement'
+import ContentView from './Content'
+import SettingsView from './Settings'
+import templateString from '../templates/App.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
-  template: _.template('<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>')
+  template: _.template(templateString)
 , regions: {
     'addBookmarks':  {
       el: '#add-bookmark-slot'
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 59fba8502..84b654f85 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -1,11 +1,13 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
 import TagsNavigationView from './TagsNavigation'
+import templateString from '../templates/BookmarkCard.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
-  template: _.template('<div class="panel"><input type="checkbox" class="checkbox"/><label class="selectbox"></label><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="menu-item-checkbox action-select"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Select</span></button></li><li><button class="menu-item-checkbox action-unselect"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Unselect</span></button></li><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>'),
+  template: _.template(templateString),
   className: "bookmark-card",
   ui: {
     'checkbox': '.selectbox'
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index 857983129..57da0345c 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -1,5 +1,8 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
 import TagsNavigationView from './TagsNavigation'
+import templateStringDefault from '../templates/BookmarkDetail_default.html'
+import templateStringEditing from '../templates/BookmarkDetail_default.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
@@ -11,8 +14,8 @@ export default Marionette.View.extend({
     }
     return this.templateDefault
   },
-  templateDefault: _.template('<div class="close icon-close"></div><div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="tags"></div><div class="description"><%- description %></div>'),
-  templateEditing: _.template('<div class="close icon-close"></div><h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="tags"><input type="text" /></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>'),
+  templateDefault: _.template(templateStringDefault),
+  templateEditing: _.template(templateStringEditing),
   className: "bookmark-detail",
   regions: {
     'tags': {
diff --git a/js/views/BulkActions.js b/js/views/BulkActions.js
index c30380604..e3cf20358 100644
--- a/js/views/BulkActions.js
+++ b/js/views/BulkActions.js
@@ -1,11 +1,13 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateString from '../templates/BulkActions.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
   className: 'bulk-actions'
-, template: _.template('<div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div><button class="delete"><span class="icon-delete"></span><span>Delete</span></button><div class="tags"><input type="text" /></div></div>')
+, template: _.template(templateString)
 , events: {
     'click .delete': 'delete'
   , 'click .select-all': 'selectAll'
diff --git a/js/views/Content.js b/js/views/Content.js
index f93528fae..d4b07240f 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -1,15 +1,17 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
 import Bookmarks from '../models/Bookmarks'
-import MobileNavView from './views/MobileNav'
-import BulkActionsView from './views/BulkActions'
-import BookmarksView from './views/Bookmarks'
-import BookmarkDetailView from './views/BookmarkDetail'
+import MobileNavView from './MobileNav'
+import BulkActionsView from './BulkActions'
+import BookmarksView from './Bookmarks'
+import BookmarkDetailView from './BookmarkDetail'
+import templateString from '../templates/Content.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
-  template: _.template('<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>')
+  template: _.template(templateString)
 , regions: {
     'mobileNav': {
       el: '#mobile-nav-slot'
diff --git a/js/views/EmptyBookmarks.js b/js/views/EmptyBookmarks.js
index 162c76698..8cd4c4e59 100644
--- a/js/views/EmptyBookmarks.js
+++ b/js/views/EmptyBookmarks.js
@@ -1,9 +1,11 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateString from '../templates/EmptyBookmarks.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
-  template: _.template('<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>')
+  template: _.template(templateString)
 , className: 'bookmarks-empty'
 })
diff --git a/js/views/MobileNav.js b/js/views/MobileNav.js
index 1bc796fce..5c38bd929 100644
--- a/js/views/MobileNav.js
+++ b/js/views/MobileNav.js
@@ -1,11 +1,13 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateString from '../templates/MobileNav.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
   className: 'mobile-nav'
-, template: _.template('<a href="#" class="icon-menu toggle-menu"></a>')
+, template: _.template(templateString)
 , events: {
     'click .toggle-menu': 'toggleMenu'
   }
diff --git a/js/views/Navigation.js b/js/views/Navigation.js
index 51e074adb..d070d1143 100644
--- a/js/views/Navigation.js
+++ b/js/views/Navigation.js
@@ -1,4 +1,6 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateString from '../templates/Navigation.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
@@ -6,7 +8,7 @@ const Radio = Backbone.Radio
 export default Marionette.View.extend({
   className: 'navigation'
 , tagName: 'ul'
-, template: _.template('<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li>')
+, template: _.template(templateString)
 , events: {
     'click .all': 'onClick'
   , 'click .favorites': 'onClick'
diff --git a/js/views/Settings.js b/js/views/Settings.js
index c50374e91..76e28471d 100644
--- a/js/views/Settings.js
+++ b/js/views/Settings.js
@@ -1,4 +1,6 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateString from '../templates/Settings.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
@@ -6,7 +8,7 @@ const Radio = Backbone.Radio
 export default Marionette.View.extend({
   className: 'settings'
 , id: 'app-settings'
-, template: _.template('<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade"><span class="icon-upload"></span> Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export"><span class="icon-download"></span> Export</button><div class="import-status"></div></div>')
+, template: _.template(templateString)
 , ui: {
     'content': '#app-settings-content'
   , 'import': '.import'
diff --git a/js/views/TagsManagementTag.js b/js/views/TagsManagementTag.js
index b04e2fe9a..464f7e979 100644
--- a/js/views/TagsManagementTag.js
+++ b/js/views/TagsManagementTag.js
@@ -1,4 +1,7 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateStringDefault from '../templates/TagsManagementTag_default.html'
+import templateStringEditing from '../templates/TagsManagementTag_editing.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
@@ -12,8 +15,8 @@ export default Marionette.View.extend({
     }
     return this.templateDefault
   }
-, templateDefault: _.template('<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>')
-, templateEditing: _.template('<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>')
+, templateDefault: _.template(templateString_default)
+, templateEditing: _.template(templateString_editing)
 , ui: {
     'actionsMenu': '.popovermenu'
   , 'actionsToggle': '.app-navigation-entry-utils-menu-button'
diff --git a/js/views/TagsNavigationTag.js b/js/views/TagsNavigationTag.js
index 417ef8dd1..227c59067 100644
--- a/js/views/TagsNavigationTag.js
+++ b/js/views/TagsNavigationTag.js
@@ -1,4 +1,6 @@
+import _ from 'underscore'
 import Backbone from 'backbone'
+import templateString from '../templates/TagsNavigationTag.html'
 
 const Marionette = Backone.Marionette
 const Radio = Backbone.Radio
@@ -6,7 +8,7 @@ const Radio = Backbone.Radio
 export default Marionette.View.extend({
   className: 'tag-nav-item'
 , tagName: 'li'
-, template: _.template('<a href="#"><%- name %></a>')
+, template: _.template(templateString)
 , events: {
     'click': 'open'
   }
diff --git a/package.json b/package.json
new file mode 100644
index 000000000..0a61b44c4
--- /dev/null
+++ b/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "bookmarks",
+  "version": "0.10.1",
+  "main": "js/index.js",
+  "scripts": {
+    "build": "webpack"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/nextcloud/bookmarks.git"
+  },
+  "bugs": {
+    "url": "https://github.com/nextcloud/bookmarks/issues"
+  },
+  "homepage": "https://github.com/nextcloud/bookmarks#readme",
+  "devDependencies": {
+    "html-loader": "^0.5.5",
+    "webpack": "^3.10.0"
+  },
+  "dependencies": {
+    "backbone": "^1.3.3",
+    "backbone.marionette": "^3.5.1",
+    "jquery": "^3.3.1",
+    "underscore": "^1.8.3"
+  }
+}
diff --git a/webpack.config.js b/webpack.config.js
new file mode 100644
index 000000000..dd4b5fdcf
--- /dev/null
+++ b/webpack.config.js
@@ -0,0 +1,22 @@
+var path = require('path')
+module.exports = {
+  entry: './js/index.js',
+  output: {
+    filename: 'bundle.js',
+    path: path.resolve(__dirname, 'dist')
+  },
+  module: {
+    rules: [
+      {
+        test: /\.html$/,
+        use: [ {
+          loader: 'html-loader',
+          options: {
+            minimize: true,
+            exportAsEs6Default: true
+          }
+        }],
+      }
+    ]
+  }
+};

From afc3e9602afd24ac5112303ab6a9f0f2fbe1fbe0 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Feb 2018 23:41:51 +0100
Subject: [PATCH 057/110] Upadate server templates

lots of stuff no longer needed due to webpack
---
 templates/js_tpl.php | 64 --------------------------------------------
 templates/main.php   |  8 ------
 2 files changed, 72 deletions(-)
 delete mode 100644 templates/js_tpl.php

diff --git a/templates/js_tpl.php b/templates/js_tpl.php
deleted file mode 100644
index a78bc8894..000000000
--- a/templates/js_tpl.php
+++ /dev/null
@@ -1,64 +0,0 @@
-<script type="text/html" id="item_tmpl">
-    <div class="bookmark_single" data-id="<&= id &>">
-        <p class="bookmark_actions">
-            <span class="bookmark_delete">
-                <img class="svg" src="<?php print_unescaped(image_path("", "actions/delete.svg")); ?>"
-                     title="<?php p($l->t('Delete')); ?>">
-            </span>&nbsp;
-        </p>
-        <p class="bookmark_title">
-            <a href="<&= checkURL(encodeURI(url)) &>" target="_blank" class="bookmark_link" rel="nofollow noopener noreferrer">
-                <&= escapeHTML(title == '' ? encodeURI(url) : title ) &>
-            </a>
-            <span class="bookmark_edit bookmark_edit_btn">
-                <img class="svg" src="<?php print_unescaped(image_path("", "actions/rename.svg")); ?>" title="<?php p($l->t('Edit')); ?>">
-            </span>
-        </p>
-        <span class="bookmark_desc"><&= escapeHTML(description)&> </span>
-        <span class="bookmark_date"><&= formatDate(added_date) &></span>
-    </div>
-</script>
-
-<script type="text/html" id="item_form_tmpl">
-    <div class="bookmark_single_form" data-id="<&= id &>">
-        <form method="post" action="bookmark" >
-            <input type="hidden" name="record_id" value="<&= id &>" />
-            <p class="bookmark_form_title">
-                <input type="text" name="title" placeholder="<?php p($l->t('The title of the page')); ?>"
-                       value="<&= escapeHTML(title) &>"/>
-            </p>
-            <p class="bookmark_form_url">
-                <input type="text" name="url" placeholder="<?php p($l->t('The address of the page')); ?>"
-                       value="<&= escapeHTML(url)&>"/>
-            </p>
-            <div class="bookmark_form_tags"><ul>
-                    <& for ( var i = 0; i < tags.length; i++ ) { &>
-                    <li><&= escapeHTML(tags[i]) &></li>
-                    <& } &>
-                </ul></div>
-            <p class="bookmark_form_desc">
-                <textarea name="description" placeholder="<?php p($l->t('Description of the page')); ?>"
-                          ><&= escapeHTML(description) &></textarea>
-            </p>
-            <p class="bookmark_form_submit">
-                <button class="reset" ><?php p($l->t('Cancel')); ?></button>
-                <input type="submit" class="primary" value="<?php p($l->t('Save')); ?>">
-            </p>
-        </form>
-    </div>
-</script>
-<script type="text/html" id="tag_tmpl">
-    <li><a href="" class="tag"><&= escapeHTML(tag) &></a>
-        <div class="tags_actions">
-            <span class="tag_delete">
-                <img class="svg" src="<?php print_unescaped(image_path("", "actions/delete.svg")); ?>"
-                     title="<?php p($l->t('Delete')); ?>">
-            </span>
-            <span class="tag_edit">
-                <img class="svg" src="<?php print_unescaped(image_path("", "actions/rename.svg")); ?>"
-                     title="<?php p($l->t('Edit')); ?>">
-            </span>
-            <em><&= nbr &></em>
-        </div>
-    </li>
-</script>
diff --git a/templates/main.php b/templates/main.php
index 393d2d67c..9049c06f2 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -1,14 +1,9 @@
 <?php
-script('bookmarks', '3rdparty/backbone');
-script('bookmarks', '3rdparty/backbone.radio');
-script('bookmarks', '3rdparty/backbone.marionette.min');
-script('bookmarks', 'settings');
 script('bookmarks', 'bookmarks');
 style('bookmarks', 'bookmarks');
 
 
 script('bookmarks', '3rdparty/tag-it');
-script('bookmarks', '3rdparty/js_tpl');
 style('bookmarks', '3rdparty/jquery.tagit');
 
 /**
@@ -32,6 +27,3 @@ function bookmarklet($bookmarkleturl) {
 	return $output;
 }
 ?>
-
-<?php
-require 'js_tpl.php';

From c93ffe9f5948b5f4101135d1b3d81893ab3c6d64 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 2 Feb 2018 19:58:10 +0100
Subject: [PATCH 058/110] Add l10n to templates

and format them to improve legibility
---
 js/templates/AddBookmark.html            | 10 +++++-
 js/templates/App.html                    | 11 ++++++-
 js/templates/BookmarkCard.html           | 39 +++++++++++++++++++++++-
 js/templates/BookmarkDetail_default.html | 10 +++++-
 js/templates/BookmarkDetail_editing.html | 16 +++++++++-
 js/templates/BulkActions.html            | 12 +++++++-
 js/templates/Content.html                |  5 ++-
 js/templates/EmptyBookmarks.html         |  3 +-
 js/templates/MobileNav.html              |  2 +-
 js/templates/Navigation.html             | 10 +++++-
 10 files changed, 108 insertions(+), 10 deletions(-)

diff --git a/js/templates/AddBookmark.html b/js/templates/AddBookmark.html
index 33f49ad47..f9e3434d7 100644
--- a/js/templates/AddBookmark.html
+++ b/js/templates/AddBookmark.html
@@ -1 +1,9 @@
-<li class="link"><a href="#"><span>Add Bookmark</span></a></li><li class="form"><input type="text" value="" placeholder="Address..."/><button title="Add" class="icon-add"></button></li>
+<li class="link">
+	<a href="#">
+		<span><%- t('bookmarks', 'Add a Bookmark') %></span>
+	</a>
+</li>
+<li class="form">
+	<input type="text" value="" placeholder="<%- t('bookmarks', 'Address') %>"/>
+	<button title="<%- t('bookmarks', 'Add this to my bookmarks')" class="icon-add"></button>
+</li>
diff --git a/js/templates/App.html b/js/templates/App.html
index d876f48e8..26d0afcc1 100644
--- a/js/templates/App.html
+++ b/js/templates/App.html
@@ -1 +1,10 @@
-<div id="app-navigation"><div id="add-bookmark-slot"></div><div id="navigation-slot"></div><h3>Tags</h3><div id="favorite-tags-slot"></div><div id="settings-slot"></div></div><div id="app-content"><div id="content-slot"></div></div>
+<div id="app-navigation">
+	<div id="add-bookmark-slot"></div>
+	<div id="navigation-slot"></div>
+	<h3><%- t('bookmarks', 'Tags') %></h3>
+	<div id="favorite-tags-slot"></div>
+	<div id="settings-slot"></div>
+</div>
+<div id="app-content">
+	<div id="content-slot"></div>
+</div>
diff --git a/js/templates/BookmarkCard.html b/js/templates/BookmarkCard.html
index 91070654b..85e5bff27 100644
--- a/js/templates/BookmarkCard.html
+++ b/js/templates/BookmarkCard.html
@@ -1 +1,38 @@
-<div class="panel"><input type="checkbox" class="checkbox"/><label class="selectbox"></label><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="actions"><div class="icon-more toggle"></div><div class="popovermenu"><ul><li><button class="menu-item-checkbox action-select"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Select</span></button></li><li><button class="menu-item-checkbox action-unselect"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Unselect</span></button></li><li><button class="action-edit"><span class="icon-edit"></span><span>Edit</span></button></li><li><button class="action-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div></div></div><div class="tags"></div>
+<div class="panel">
+	<input type="checkbox" name="selector" class="checkbox"/>
+	<label class="selectbox" for="selector"  title="<%- t('bookmarks', 'Select') %>"></label>
+	<h1><%- title %></h1>
+	<h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
+	<div class="actions">
+		<div class="icon-more toggle" title="<%- t('bookmarks', 'Open menu') %>"></div>
+		<div class="popovermenu">
+			<ul>
+				<li>
+					<button class="menu-item-checkbox action-select">
+						<span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span>
+						<span><%- t('bookmarks', 'Select') %></span>
+					</button>
+				</li>
+				<li>
+					<button class="menu-item-checkbox action-unselect">
+						<span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span>
+						<span><%- t('bookmarks', 'Unselect') %></span>
+					</button>
+				</li>
+				<li>
+					<button class="action-edit">
+						<span class="icon-edit"></span>
+						<span><%- t('bookmarks', 'Edit') %></span>
+					</button>
+				</li>
+				<li>
+					<button class="action-delete">
+						<span class="icon-delete"></span>
+						<span><%- t('bookmarks', 'Delete') %></span>
+					</button>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+<div class="tags"></div>
diff --git a/js/templates/BookmarkDetail_default.html b/js/templates/BookmarkDetail_default.html
index 90f12a90c..7443c9ce1 100644
--- a/js/templates/BookmarkDetail_default.html
+++ b/js/templates/BookmarkDetail_default.html
@@ -1 +1,9 @@
-<div class="close icon-close"></div><div class="actions"><button class="edit icon-rename"></button><button class="delete icon-delete"></button></div><h1><%- title %></h1><h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2><div class="tags"></div><div class="description"><%- description %></div>
+<div class="close icon-close" title="<%- t('bookmarks', 'Close') %>"></div>
+<div class="actions">
+	<button class="edit icon-rename"></button>
+	<button class="delete icon-delete"></button>
+</div>
+<h1><%- title %></h1>
+<h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
+<div class="tags"></div>
+<div class="description"><%- description %></div>
diff --git a/js/templates/BookmarkDetail_editing.html b/js/templates/BookmarkDetail_editing.html
index 18aeef5a6..760fcb60d 100644
--- a/js/templates/BookmarkDetail_editing.html
+++ b/js/templates/BookmarkDetail_editing.html
@@ -1 +1,15 @@
-<div class="close icon-close"></div><h1><input class="input-title" type="text" value="<%- title %>" /></h1><h2><input type="type" class="input-url icon-external" value="<%- url %>" /></h2><div class="tags"><input type="text" /></div><div class="description"><textarea class="input-desc"><%- description %></textarea></div><div class="actions editing"><button class="submit primary"><span class="icon-checkmark"></span> <span>Save</span></button><button class="cancel">Cancel</button></div>
+<div class="close icon-close" title="<%- t('bookmarks', 'Close') %>"></div>
+<h1><input class="input-title" type="text" value="<%- title %>" placeholder="<%- t('bookmarks', 'The title of the page') %>" /></h1>
+<h2><input type="type" class="input-url icon-external" value="<%- url %>" placeholder="<%- t('bookmarks', 'The address of the page') %>" /></h2>
+<div class="tags">
+	<input type="text" />
+</div>
+<div class="description">
+	<textarea class="input-desc" placeholder="<%- t('bookmarks', 'A description of the page') %>"><%- description %></textarea>
+</div>
+<div class="actions editing">
+	<button class="submit primary">
+		<span class="icon-checkmark"></span> <span><%- t('bookmarks', 'Save') %></span>
+	</button>
+	<button class="cancel"><%- t('bookmarks', 'Cancel') %></button>
+</div>
diff --git a/js/templates/BulkActions.html b/js/templates/BulkActions.html
index 890d81182..f1864ff92 100644
--- a/js/templates/BulkActions.html
+++ b/js/templates/BulkActions.html
@@ -1 +1,11 @@
-<div class="selection-tools"><button class="select-all"><span class="icon-checkmark"></span> Select all visible</button><div class="close"><span class="icon-close"></span></div></div><button class="delete"><span class="icon-delete"></span><span>Delete</span></button><div class="tags"><input type="text" /></div></div>
+<div class="selection-tools">
+	<button class="select-all"><span class="icon-checkmark"></span><span><%- t('bookmarks', 'Select all visible bookmarks') %></span></button>
+	<div class="close" title="<%- t('bookmarks', 'Cancel') %>"><span class="icon-close"></span></div>
+</div>
+<button class="delete">
+	<span class="icon-delete"></span>
+	<span><%- t('bookmarks', 'Delete') %></span>
+</button>
+<div class="tags">
+	<input type="text" />
+</div>
diff --git a/js/templates/Content.html b/js/templates/Content.html
index 306caeb8c..33eef09c6 100644
--- a/js/templates/Content.html
+++ b/js/templates/Content.html
@@ -1 +1,4 @@
-<div id="mobile-nav-slot"></div><div id="bulk-actions-slot"></div><div id="view-bookmarks-slot"></div><div id="bookmark-detail-slot"></div>
+<div id="mobile-nav-slot"></div>
+<div id="bulk-actions-slot"></div>
+<div id="view-bookmarks-slot"></div>
+<div id="bookmark-detail-slot"></div>
diff --git a/js/templates/EmptyBookmarks.html b/js/templates/EmptyBookmarks.html
index 1eac414da..fe91e76c5 100644
--- a/js/templates/EmptyBookmarks.html
+++ b/js/templates/EmptyBookmarks.html
@@ -1 +1,2 @@
-<h2>No bookmarks, here.</h2><p>There are no bookmarks available for this query. Try adding some using the above form.</p>
+<h2><%- t('bookmarks', 'No bookmarks here.') %></h2>
+<p><%- t('bookmarks', 'There are no bookmarks available for this query. Try changing your filter or add some using the menu entry on the left.') %></p>
diff --git a/js/templates/MobileNav.html b/js/templates/MobileNav.html
index f29a89153..9822086f4 100644
--- a/js/templates/MobileNav.html
+++ b/js/templates/MobileNav.html
@@ -1 +1 @@
-<a href="#" class="icon-menu toggle-menu"></a>
+<a href="#" class="icon-menu toggle-menu" title="<%- t('bookmarks', 'Open main menu') %>"></a>
diff --git a/js/templates/Navigation.html b/js/templates/Navigation.html
index ee460a2c0..425264cde 100644
--- a/js/templates/Navigation.html
+++ b/js/templates/Navigation.html
@@ -1 +1,9 @@
-<li data-id="all" class="all"><a href="#"><span class="icon-home"></span>All bookmarks</a></li><li data-id="favorites" class="favorites"><a href="#"><span class="icon-favorite"></span>Favorites</a></li><li data-id="shared" class="shared"><a href="#"><span class="icon-share"></span>Shared</a></li>
+<li data-id="all" class="all">
+	<a href="#"><span class="icon-home"></span><%- t('bookmarks', '>All bookmarks') %></a>
+</li>
+<li data-id="favorites" class="favorites">
+	<a href="#"><span class="icon-favorite"></span><%- t('bookmarks', 'Favorites') %></a>
+</li>
+<li data-id="shared" class="shared">
+	<a href="#"><span class="icon-share"></span><%- t('bookmarks', 'Shared') %></a>
+</li>

From e51afba4e9d813c551fa933cb745eb0de2aeb75f Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 2 Feb 2018 20:00:52 +0100
Subject: [PATCH 059/110] Fix webpack build

---
 js/Application.js             |  4 ++--
 js/Router.js                  |  2 +-
 js/models/Bookmarks.js        |  1 +
 js/models/Tags.js             |  1 +
 js/views/AddBookmark.js       |  2 +-
 js/views/App.js               |  9 ++++-----
 js/views/BookmarkCard.js      | 10 ++++++----
 js/views/BookmarkDetail.js    |  8 +++++---
 js/views/Bookmarks.js         |  9 ++++++---
 js/views/BulkActions.js       |  9 +++++----
 js/views/Content.js           | 17 +++++++++--------
 js/views/EmptyBookmarks.js    |  2 +-
 js/views/MobileNav.js         |  2 +-
 js/views/Navigation.js        |  2 +-
 js/views/SearchController.js  |  2 +-
 js/views/Settings.js          |  2 +-
 js/views/TagsManagement.js    |  2 +-
 js/views/TagsManagementTag.js |  6 +++---
 js/views/TagsNavigation.js    |  2 +-
 js/views/TagsNavigationTag.js |  2 +-
 templates/main.php            |  2 +-
 webpack.config.js             |  2 +-
 22 files changed, 54 insertions(+), 44 deletions(-)

diff --git a/js/Application.js b/js/Application.js
index e1e3b5420..db0f8b526 100644
--- a/js/Application.js
+++ b/js/Application.js
@@ -4,7 +4,7 @@ import Tags from './models/Tags'
 import Router from './Router'
 import AppView from './views/App'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 
 export default Marionette.Application.extend({
   region: '#content'
@@ -26,7 +26,7 @@ export default Marionette.Application.extend({
     this.router = new Router({app: this})
   }
 , onStart: function() {
-    this.showView(new AppView({bookmarks: this.bookmarks, tags: this.tags}));
+    this.showView(new AppView({app: this}));
     Backbone.history.start();
   }
 , onTagChanged: function(tag) {
diff --git a/js/Router.js b/js/Router.js
index 295c1bce0..0bfc370ba 100644
--- a/js/Router.js
+++ b/js/Router.js
@@ -4,7 +4,7 @@ import Tags from './models/Tags'
 import Router from './Router'
 import AppView from './views/App'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.AppRouter.extend({
diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
index 5751de44c..8bf674483 100644
--- a/js/models/Bookmarks.js
+++ b/js/models/Bookmarks.js
@@ -1,4 +1,5 @@
 import Backbone from 'backbone'
+import Bookmark from './Bookmark'
 
 export default Backbone.Collection.extend({
   model: Bookmark
diff --git a/js/models/Tags.js b/js/models/Tags.js
index 3d88edc0b..6b4df5af6 100644
--- a/js/models/Tags.js
+++ b/js/models/Tags.js
@@ -1,4 +1,5 @@
 import Backbone from 'backbone'
+import Tag from './Tag'
 
 var Tags = Backbone.Collection.extend({
   model: Tag
diff --git a/js/views/AddBookmark.js b/js/views/AddBookmark.js
index a373b2b70..af02aa813 100644
--- a/js/views/AddBookmark.js
+++ b/js/views/AddBookmark.js
@@ -3,7 +3,7 @@ import Backbone from 'backbone'
 import Bookmark from '../models/Bookmark'
 import templateString from '../templates/AddBookmark.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/js/views/App.js b/js/views/App.js
index c8f65abd8..358dcfa06 100644
--- a/js/views/App.js
+++ b/js/views/App.js
@@ -8,7 +8,7 @@ import ContentView from './Content'
 import SettingsView from './Settings'
 import templateString from '../templates/App.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
@@ -36,8 +36,7 @@ export default Marionette.View.extend({
     }
   }
 , initialize: function(options) {
-    this.bookmarks = options.bookmarks
-    this.tags = options.tags
+    this.app = options.app
     this.searchController = new SearchController
     
     $(window.document).click(function(e) {
@@ -47,8 +46,8 @@ export default Marionette.View.extend({
 , onRender: function() {
     this.showChildView('addBookmarks', new AddBookmarkView());
     this.showChildView('navigation', new NavigationView);
-    this.showChildView('content', new ContentView({bookmarks: this.bookmarks})); 
-    this.showChildView('tags', new TagsManagementView({collection: this.tags}))
+    this.showChildView('content', new ContentView({app: this.app})); 
+    this.showChildView('tags', new TagsManagementView({collection: this.app.tags}))
     this.showChildView('settings', new SettingsView())
   }
 })
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 84b654f85..f86fc2755 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -3,7 +3,7 @@ import Backbone from 'backbone'
 import TagsNavigationView from './TagsNavigation'
 import templateString from '../templates/BookmarkCard.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
@@ -27,7 +27,8 @@ export default Marionette.View.extend({
   , 'click .action-select': 'select'
   , 'click .action-unselect': 'select'
   },
-  initialize: function() {
+  initialize: function(opts) {
+    this.app = opts.app
     this.listenTo(this.model, "change", this.render);
     this.listenTo(this.model, "select", this.onSelect);
     this.listenTo(this.model, "unselect", this.onUnselect);
@@ -35,9 +36,10 @@ export default Marionette.View.extend({
     this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
   }
 , onRender: function() {
-	this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)')
+	  var that = this
+    this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)')
     var tags = new Tags(this.model.get('tags').map(function(id) {
-      return app.tags.findWhere({name: id})
+      return that.app.tags.findWhere({name: id})
     }))
     this.showChildView('tags', new TagsNavigationView({collection: tags}))
     this.$('.checkbox').prop('checked', this.$el.hasClass('active'))
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index 57da0345c..b7a44437c 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -4,7 +4,7 @@ import TagsNavigationView from './TagsNavigation'
 import templateStringDefault from '../templates/BookmarkDetail_default.html'
 import templateStringEditing from '../templates/BookmarkDetail_default.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
@@ -36,16 +36,18 @@ export default Marionette.View.extend({
   , 'click .cancel': 'cancel'
   },
   initialize: function(opts) {
+    this.app = opts.app
     this.listenTo(this.model, "change", this.render);
     this.listenTo(app.tags, 'sync', this.render)
   },
   onRender: function() {
+    var that = this
     if (this.editing) {
       this.$('.tags input')
       .val(this.model.get('tags').join(','))
       .tagit({
         allowSpaces: true,
-        availableTags: app.tags.pluck('name'),
+        availableTags: this.app.tags.pluck('name'),
         placeholderText: t('bookmarks', 'Enter tags'),
         onTagRemoved: function() {},
         onTagFinishRemoved: function() {},
@@ -53,7 +55,7 @@ export default Marionette.View.extend({
       })
     }else{
       var tags = new Tags(this.model.get('tags').map(function(id) {
-        return app.tags.findWhere({name: id})
+        return that.app.tags.findWhere({name: id})
       }))
       this.showChildView('tags', new TagsNavigationView({collection: tags}))
     }
diff --git a/js/views/Bookmarks.js b/js/views/Bookmarks.js
index 6d1833429..986456c1f 100644
--- a/js/views/Bookmarks.js
+++ b/js/views/Bookmarks.js
@@ -2,13 +2,16 @@ import Backbone from 'backbone'
 import BookmarkCardView from './BookmarkCard'
 import EmptyBookmarksView from './EmptyBookmarks'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.CollectionView.extend({
   className: 'bookmarks'
-, regions: {
-
+, initialize: function(opts) {
+    this.app = opts.app
+  }
+, childViewOptions: function() {
+    return {app: this.app}
   }
 , childView: function() {return BookmarkCardView}
 , emptyView: function() {return EmptyBookmarksView}
diff --git a/js/views/BulkActions.js b/js/views/BulkActions.js
index e3cf20358..9ae904de1 100644
--- a/js/views/BulkActions.js
+++ b/js/views/BulkActions.js
@@ -2,7 +2,7 @@ import _ from 'underscore'
 import Backbone from 'backbone'
 import templateString from '../templates/BulkActions.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
@@ -14,19 +14,20 @@ export default Marionette.View.extend({
   , 'click .selection-tools .close': 'abort'
   }
 , initialize: function(opts) {
-    this.all = opts.all
+    this.app = opts.app
+    this.all = this.app.bookmarks
     this.selected = opts.selected
     this.listenTo(this.selected, 'remove', this.onReduceSelection)
     this.listenTo(this.selected, 'add', this.onExtendSelection)
   }
 , onRender: function() {
     // hack to ignore events caused by tagit setup -- we should really get something else...
-	this.rendering = true
+    this.rendering = true
     this.$('.tags input')
     .val(_.intersection.apply(_, this.selected.pluck('tags')).join(','))
     .tagit({
       allowSpaces: true,
-      availableTags: app.tags.pluck('name'),
+      availableTags: this.app.tags.pluck('name'),
       placeholderText: t('bookmarks', 'Enter tags'),
       onTagRemoved: this.onTagRemoved.bind(this),
       onTagAdded: this.onTagAdded.bind(this),
diff --git a/js/views/Content.js b/js/views/Content.js
index d4b07240f..09fcffc3b 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -7,7 +7,7 @@ import BookmarksView from './Bookmarks'
 import BookmarkDetailView from './BookmarkDetail'
 import templateString from '../templates/Content.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
@@ -31,7 +31,8 @@ export default Marionette.View.extend({
     }
   }
 , initialize: function(options) {
-    this.bookmarks = options.bookmarks
+    this.app = options.app
+    this.bookmarks = this.app.bookmarks
     this.selected = new Bookmarks
     this.listenTo(this.bookmarks, 'select', this.onSelect)
     this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
@@ -42,14 +43,14 @@ export default Marionette.View.extend({
   }
 , onRender: function() {
     this.showChildView('mobileNav', new MobileNavView())
-    this.showChildView('bulkActions', new BulkActionsView({all: this.bookmarks, selected: this.selected}))
-    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks}));
+    this.showChildView('bulkActions', new BulkActionsView({selected: this.selected, app: this.app}))
+    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks, app: this.app}));
   }
 , onSelect: function(model) {
     if (this.selected.length == 0) {
-      this.$el.addClass('selection-active')
-	}
-	this.selected.add(model)
+        this.$el.addClass('selection-active')
+    }
+    this.selected.add(model)
   }
 , onUnselect: function(model) {
     if (this.selected.length == 1) {
@@ -59,7 +60,7 @@ export default Marionette.View.extend({
   }
 , onShowDetails: function(model) {
     var that = this
-    var view = new BookmarkDetailView({model: model})
+    var view = new BookmarkDetailView({model: model, app: this.app})
     this.showChildView('bookmarkDetail', view)
   }
 , onEditDetails: function(model) {
diff --git a/js/views/EmptyBookmarks.js b/js/views/EmptyBookmarks.js
index 8cd4c4e59..73f3c756d 100644
--- a/js/views/EmptyBookmarks.js
+++ b/js/views/EmptyBookmarks.js
@@ -2,7 +2,7 @@ import _ from 'underscore'
 import Backbone from 'backbone'
 import templateString from '../templates/EmptyBookmarks.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/js/views/MobileNav.js b/js/views/MobileNav.js
index 5c38bd929..cf0b37273 100644
--- a/js/views/MobileNav.js
+++ b/js/views/MobileNav.js
@@ -2,7 +2,7 @@ import _ from 'underscore'
 import Backbone from 'backbone'
 import templateString from '../templates/MobileNav.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/js/views/Navigation.js b/js/views/Navigation.js
index d070d1143..2852f9b82 100644
--- a/js/views/Navigation.js
+++ b/js/views/Navigation.js
@@ -2,7 +2,7 @@ import _ from 'underscore'
 import Backbone from 'backbone'
 import templateString from '../templates/Navigation.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/js/views/SearchController.js b/js/views/SearchController.js
index 934054d56..b8d1b8dfa 100644
--- a/js/views/SearchController.js
+++ b/js/views/SearchController.js
@@ -1,6 +1,6 @@
 import Backbone from 'backbone'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/js/views/Settings.js b/js/views/Settings.js
index 76e28471d..12aad83de 100644
--- a/js/views/Settings.js
+++ b/js/views/Settings.js
@@ -2,7 +2,7 @@ import _ from 'underscore'
 import Backbone from 'backbone'
 import templateString from '../templates/Settings.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/js/views/TagsManagement.js b/js/views/TagsManagement.js
index 0b38f8eef..5aed7cb24 100644
--- a/js/views/TagsManagement.js
+++ b/js/views/TagsManagement.js
@@ -1,7 +1,7 @@
 import Backbone from 'backbone'
 import TagView from './TagsManagementTag'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.CollectionView.extend({
diff --git a/js/views/TagsManagementTag.js b/js/views/TagsManagementTag.js
index 464f7e979..5f03cf310 100644
--- a/js/views/TagsManagementTag.js
+++ b/js/views/TagsManagementTag.js
@@ -3,7 +3,7 @@ import Backbone from 'backbone'
 import templateStringDefault from '../templates/TagsManagementTag_default.html'
 import templateStringEditing from '../templates/TagsManagementTag_editing.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
@@ -15,8 +15,8 @@ export default Marionette.View.extend({
     }
     return this.templateDefault
   }
-, templateDefault: _.template(templateString_default)
-, templateEditing: _.template(templateString_editing)
+, templateDefault: _.template(templateStringDefault)
+, templateEditing: _.template(templateStringEditing)
 , ui: {
     'actionsMenu': '.popovermenu'
   , 'actionsToggle': '.app-navigation-entry-utils-menu-button'
diff --git a/js/views/TagsNavigation.js b/js/views/TagsNavigation.js
index 3a39d1c90..d3bfcaf13 100644
--- a/js/views/TagsNavigation.js
+++ b/js/views/TagsNavigation.js
@@ -1,7 +1,7 @@
 import Backbone from 'backbone'
 import TagView from '../views/TagsNavigationTag'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.CollectionView.extend({
diff --git a/js/views/TagsNavigationTag.js b/js/views/TagsNavigationTag.js
index 227c59067..fba7b7893 100644
--- a/js/views/TagsNavigationTag.js
+++ b/js/views/TagsNavigationTag.js
@@ -2,7 +2,7 @@ import _ from 'underscore'
 import Backbone from 'backbone'
 import templateString from '../templates/TagsNavigationTag.html'
 
-const Marionette = Backone.Marionette
+const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
 
 export default Marionette.View.extend({
diff --git a/templates/main.php b/templates/main.php
index 9049c06f2..e5785d419 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -1,5 +1,5 @@
 <?php
-script('bookmarks', 'bookmarks');
+script('bookmarks', 'dist/bundle');
 style('bookmarks', 'bookmarks');
 
 
diff --git a/webpack.config.js b/webpack.config.js
index dd4b5fdcf..16864252a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,7 +3,7 @@ module.exports = {
   entry: './js/index.js',
   output: {
     filename: 'bundle.js',
-    path: path.resolve(__dirname, 'dist')
+    path: path.resolve(__dirname, 'js/dist')
   },
   module: {
     rules: [

From 5c7dd67007be108cdbda2491ff3a1ea2a171b736 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 2 Feb 2018 21:30:48 +0100
Subject: [PATCH 060/110] Replace tagit with select2

+ Fix use of global app var
---
 css/3rdparty/jquery.tagit.css            | 111 ------
 css/bookmarks.css                        |  37 +-
 css/select2.css                          | 484 +++++++++++++++++++++++
 js/3rdparty/tag-it.js                    | 365 -----------------
 js/Application.js                        |   1 +
 js/index.js                              |   4 +
 js/templates/BookmarkDetail_editing.html |   1 -
 js/templates/BulkActions.html            |   1 -
 js/templates/Navigation.html             |   2 +-
 js/views/BookmarkCard.js                 |   3 +-
 js/views/BookmarkDetail.js               |  28 +-
 js/views/BulkActions.js                  |  56 +--
 js/views/TagsManagement.js               |   1 +
 js/views/TagsSelection.js                |  64 +++
 package.json                             |   1 +
 templates/main.php                       |   5 +-
 16 files changed, 613 insertions(+), 551 deletions(-)
 delete mode 100644 css/3rdparty/jquery.tagit.css
 create mode 100644 css/select2.css
 delete mode 100644 js/3rdparty/tag-it.js
 create mode 100644 js/views/TagsSelection.js

diff --git a/css/3rdparty/jquery.tagit.css b/css/3rdparty/jquery.tagit.css
deleted file mode 100644
index ae814986c..000000000
--- a/css/3rdparty/jquery.tagit.css
+++ /dev/null
@@ -1,111 +0,0 @@
-ul.tagit {
-	padding: 1px 5px;
-	overflow: auto;
-    margin-left: inherit; /* usually we don't want the regular ul margins. */
-    margin-right: inherit;
-    width: 91.5%;
-}
-ul.tagit li {
-	display: block;
-	float: left;
-	margin: 2px 5px 2px 0;
-}
-ul.tagit li.tagit-choice {
-	padding: .2em 18px .2em .5em;
-    position: relative;
-    line-height: inherit;
-}
-ul.tagit li.tagit-new {
-	padding: .25em 4px .25em 0;
-}
-
-ul.tagit li.tagit-choice a.tagit-label {
-	cursor: pointer;
-	text-decoration: none;
-}
-ul.tagit li.tagit-choice .close {
-	cursor: pointer;
-    position: absolute;
-    right: .1em;
-    top: 50%;
-    margin-top: -8px;
-}
-
-/* used for some custom themes that don't need image icons */
-ul.tagit li.tagit-choice .close .text-icon {
-    display: none;
-}
-
-ul.tagit li.tagit-choice input {
-	display: block;
-	float: left;
-	margin: 2px 5px 2px 0;
-}
-ul.tagit input[type="text"] {
-    -moz-box-sizing:    border-box;
-    -webkit-box-sizing: border-box;
-    box-sizing:         border-box;
-
-    border: none;
-	margin: 0;
-	padding: 0;
-	width: inherit;
-	background-color: inherit;
-    outline: none;
-}
-
-
-/***** ZENDESK ***/
-
-/* Optional scoped theme for tag-it which mimics the zendesk widget. */
-
-
-ul.tagit {
-	border-style: solid;
-	border-width: 1px;
-	border-color: #C6C6C6;
-    background: inherit;
-}
-ul.tagit li.tagit-choice {
-    -moz-border-radius: 6px;
-    border-radius: 6px;
-    -webkit-border-radius: 6px;
-	border: 1px solid #CAD8F3;
-
-    background: none;
-	background-color: #DEE7F8;
-
-    color: #555;
-    font-weight: normal;
-}
-ul.tagit li.tagit-choice a.close {
-    text-decoration: none;
-}
-ul.tagit li.tagit-choice .close {
-    right: .4em;
-}
-ul.tagit li.tagit-choice .ui-icon {
-    display: none;
-}
-ul.tagit li.tagit-choice .close .text-icon {
-    display: inline;
-    font-family: arial, sans-serif;
-    font-size: 16px;
-    line-height: 16px;
-    color: #777;
-}
-ul.tagit li.tagit-choice:hover, ul.tagit li.tagit-choice.remove {
-    background-color: #bbcef1;
-    border-color: #6d95e0;
-}
-ul.tagit li.tagit-choice a.tagLabel:hover,
-ul.tagit li.tagit-choice a.close .text-icon:hover {
-    color: #222;
-}
-ul.tagit input[type="text"] {
-	color: #333333;
-    background: none;
-}
- 
-
-
diff --git a/css/bookmarks.css b/css/bookmarks.css
index 08fbf4b4b..ed820b913 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -95,7 +95,7 @@
   display: block;
 }
 .bulk-actions.active + * {
-  margin-top: 1.5cm;
+  margin-top: 2.5cm;
 }
 @media only screen and (max-width: 768px) {
   .bulk-actions {
@@ -107,15 +107,17 @@
   }
 }
 .bulk-actions > button {
-  vertical-align: text-bottom;
+  vertical-align: top;
 }
 .bulk-actions .tags {
   display: inline-block;
   width: 60%;
   margin: 3px 3px 3px 0;
+  position: relative;
 }
-.bulk-actions .tagit {
-  background: white;
+.bulk-actions .tags-selection {
+  display: block;
+  width: 100%;
 }
 .bulk-actions .selection-tools {
   float: right;
@@ -307,18 +309,18 @@ button span,
   height: 1cm;
   width: 1cm;
 }
-.bulk-actions ul.tagit li.tagit-choice,
-.bookmark-detail ul.tagit li.tagit-choice,
+.bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice,
+.bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice,
 .bookmark-detail .tag-nav-item {
   border-radius: .2cm;
   border: none;
   background: #ebebeb;
   display: inline-block;
-  padding: .1cm .4cm;
+  padding: .1cm .2cm;
   margin: .1cm;
 }
-.bulk-actions ul.tagit li.tagit-choice:hover,
-.bookmark-detail ul.tagit li.tagit-choice:hover,
+.bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
+.bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
 .bookmark-detail .tag-nav-item:hover {
   background: #e0e0e0;
 }
@@ -336,29 +338,16 @@ button span,
 .bookmark-detail .input-url,
 .bookmark-detail .input-title,
 .bookmark-detail .input-desc,
-.bookmarks-detail ul.tagit,
-.bulk-actions ul.tagit {
+.bookmark-detail .tags-selection  {
   width: 100%;
   font-size: inherit;
   box-sizing: border-box;
   padding: 0 !important;
 }
 .bookmark-detail .input-url {
-  padding-left: 25px;
+  padding-left: 25px !important;
   background-position: 5px;
 }
-.bookmatks-detail ul.tagit li.tagit-choice,
-.bulk-actions ul.tagit li.tagit-choice {
-  padding: .1cm .5cm .1cm .2cm;
-}
-.bulk-actions ul.tagit li.tagit-new,
-.bookmarks-detail ul.tagit li.tagit-new {
-  float: none;
-  display: inline-block;
-  padding: 0 !important;
-  cursor: auto;
-  margin: 0;
-}
 .bookmark-detail .input-desc {
   height: 300px;
 }
diff --git a/css/select2.css b/css/select2.css
new file mode 100644
index 000000000..ce3afd1d5
--- /dev/null
+++ b/css/select2.css
@@ -0,0 +1,484 @@
+.select2-container {
+  box-sizing: border-box;
+  display: inline-block;
+  margin: 0;
+  position: relative;
+  vertical-align: middle; }
+  .select2-container .select2-selection--single {
+    box-sizing: border-box;
+    cursor: pointer;
+    display: block;
+    height: 28px;
+    user-select: none;
+    -webkit-user-select: none; }
+    .select2-container .select2-selection--single .select2-selection__rendered {
+      display: block;
+      padding-left: 8px;
+      padding-right: 20px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap; }
+    .select2-container .select2-selection--single .select2-selection__clear {
+      position: relative; }
+  .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
+    padding-right: 8px;
+    padding-left: 20px; }
+  .select2-container .select2-selection--multiple {
+    box-sizing: border-box;
+    cursor: pointer;
+    display: block;
+    min-height: 32px;
+    user-select: none;
+    -webkit-user-select: none; }
+    .select2-container .select2-selection--multiple .select2-selection__rendered {
+      display: inline-block;
+      overflow: hidden;
+      padding-left: 8px;
+      text-overflow: ellipsis;
+      white-space: nowrap; }
+  .select2-container .select2-search--inline {
+    float: left; }
+    .select2-container .select2-search--inline .select2-search__field {
+      box-sizing: border-box;
+      border: none;
+      font-size: 100%;
+      margin-top: 5px;
+      padding: 0; }
+      .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
+        -webkit-appearance: none; }
+
+.select2-dropdown {
+  background-color: white;
+  border: 1px solid #aaa;
+  border-radius: 4px;
+  box-sizing: border-box;
+  display: block;
+  position: absolute;
+  left: -100000px;
+  width: 100%;
+  z-index: 1051; }
+
+.select2-results {
+  display: block; }
+
+.select2-results__options {
+  list-style: none;
+  margin: 0;
+  padding: 0; }
+
+.select2-results__option {
+  padding: 6px;
+  user-select: none;
+  -webkit-user-select: none; }
+  .select2-results__option[aria-selected] {
+    cursor: pointer; }
+
+.select2-container--open .select2-dropdown {
+  left: 0; }
+
+.select2-container--open .select2-dropdown--above {
+  border-bottom: none;
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0; }
+
+.select2-container--open .select2-dropdown--below {
+  border-top: none;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0; }
+
+.select2-search--dropdown {
+  display: block;
+  padding: 4px; }
+  .select2-search--dropdown .select2-search__field {
+    padding: 4px;
+    width: 100%;
+    box-sizing: border-box; }
+    .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
+      -webkit-appearance: none; }
+  .select2-search--dropdown.select2-search--hide {
+    display: none; }
+
+.select2-close-mask {
+  border: 0;
+  margin: 0;
+  padding: 0;
+  display: block;
+  position: fixed;
+  left: 0;
+  top: 0;
+  min-height: 100%;
+  min-width: 100%;
+  height: auto;
+  width: auto;
+  opacity: 0;
+  z-index: 99;
+  background-color: #fff;
+  filter: alpha(opacity=0); }
+
+.select2-hidden-accessible {
+  border: 0 !important;
+  clip: rect(0 0 0 0) !important;
+  -webkit-clip-path: inset(50%) !important;
+  clip-path: inset(50%) !important;
+  height: 1px !important;
+  overflow: hidden !important;
+  padding: 0 !important;
+  position: absolute !important;
+  width: 1px !important;
+  white-space: nowrap !important; }
+
+.select2-container--default .select2-selection--single {
+  background-color: #fff;
+  border: 1px solid #aaa;
+  border-radius: 4px; }
+  .select2-container--default .select2-selection--single .select2-selection__rendered {
+    color: #444;
+    line-height: 28px; }
+  .select2-container--default .select2-selection--single .select2-selection__clear {
+    cursor: pointer;
+    float: right;
+    font-weight: bold; }
+  .select2-container--default .select2-selection--single .select2-selection__placeholder {
+    color: #999; }
+  .select2-container--default .select2-selection--single .select2-selection__arrow {
+    height: 26px;
+    position: absolute;
+    top: 1px;
+    right: 1px;
+    width: 20px; }
+    .select2-container--default .select2-selection--single .select2-selection__arrow b {
+      border-color: #888 transparent transparent transparent;
+      border-style: solid;
+      border-width: 5px 4px 0 4px;
+      height: 0;
+      left: 50%;
+      margin-left: -4px;
+      margin-top: -2px;
+      position: absolute;
+      top: 50%;
+      width: 0; }
+
+.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
+  float: left; }
+
+.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
+  left: 1px;
+  right: auto; }
+
+.select2-container--default.select2-container--disabled .select2-selection--single {
+  background-color: #eee;
+  cursor: default; }
+  .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
+    display: none; }
+
+.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
+  border-color: transparent transparent #888 transparent;
+  border-width: 0 4px 5px 4px; }
+
+.select2-container--default .select2-selection--multiple {
+  background-color: white;
+  border: 1px solid #aaa;
+  border-radius: 4px;
+  cursor: text; }
+  .select2-container--default .select2-selection--multiple .select2-selection__rendered {
+    box-sizing: border-box;
+    list-style: none;
+    margin: 0;
+    padding: 0 5px;
+    width: 100%; }
+    .select2-container--default .select2-selection--multiple .select2-selection__rendered li {
+      list-style: none; }
+  .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
+    color: #999;
+    margin-top: 5px;
+    float: left; }
+  .select2-container--default .select2-selection--multiple .select2-selection__clear {
+    cursor: pointer;
+    float: right;
+    font-weight: bold;
+    margin-top: 5px;
+    margin-right: 10px; }
+  .select2-container--default .select2-selection--multiple .select2-selection__choice {
+    background-color: #e4e4e4;
+    border: 1px solid #aaa;
+    border-radius: 4px;
+    cursor: default;
+    float: left;
+    margin-right: 5px;
+    margin-top: 5px;
+    padding: 0 5px; }
+  .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
+    color: #999;
+    cursor: pointer;
+    display: inline-block;
+    font-weight: bold;
+    margin-right: 2px; }
+    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
+      color: #333; }
+
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline {
+  float: right; }
+
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
+  margin-left: 5px;
+  margin-right: auto; }
+
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
+  margin-left: 2px;
+  margin-right: auto; }
+
+.select2-container--default.select2-container--focus .select2-selection--multiple {
+  border: solid black 1px;
+  outline: 0; }
+
+.select2-container--default.select2-container--disabled .select2-selection--multiple {
+  background-color: #eee;
+  cursor: default; }
+
+.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
+  display: none; }
+
+.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0; }
+
+.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0; }
+
+.select2-container--default .select2-search--dropdown .select2-search__field {
+  border: 1px solid #aaa; }
+
+.select2-container--default .select2-search--inline .select2-search__field {
+  background: transparent;
+  border: none;
+  outline: 0;
+  box-shadow: none;
+  -webkit-appearance: textfield; }
+
+.select2-container--default .select2-results > .select2-results__options {
+  max-height: 200px;
+  overflow-y: auto; }
+
+.select2-container--default .select2-results__option[role=group] {
+  padding: 0; }
+
+.select2-container--default .select2-results__option[aria-disabled=true] {
+  color: #999; }
+
+.select2-container--default .select2-results__option[aria-selected=true] {
+  background-color: #ddd; }
+
+.select2-container--default .select2-results__option .select2-results__option {
+  padding-left: 1em; }
+  .select2-container--default .select2-results__option .select2-results__option .select2-results__group {
+    padding-left: 0; }
+  .select2-container--default .select2-results__option .select2-results__option .select2-results__option {
+    margin-left: -1em;
+    padding-left: 2em; }
+    .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+      margin-left: -2em;
+      padding-left: 3em; }
+      .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+        margin-left: -3em;
+        padding-left: 4em; }
+        .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+          margin-left: -4em;
+          padding-left: 5em; }
+          .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+            margin-left: -5em;
+            padding-left: 6em; }
+
+.select2-container--default .select2-results__option--highlighted[aria-selected] {
+  background-color: #5897fb;
+  color: white; }
+
+.select2-container--default .select2-results__group {
+  cursor: default;
+  display: block;
+  padding: 6px; }
+
+.select2-container--classic .select2-selection--single {
+  background-color: #f7f7f7;
+  border: 1px solid #aaa;
+  border-radius: 4px;
+  outline: 0;
+  background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%);
+  background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%);
+  background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
+  .select2-container--classic .select2-selection--single:focus {
+    border: 1px solid #5897fb; }
+  .select2-container--classic .select2-selection--single .select2-selection__rendered {
+    color: #444;
+    line-height: 28px; }
+  .select2-container--classic .select2-selection--single .select2-selection__clear {
+    cursor: pointer;
+    float: right;
+    font-weight: bold;
+    margin-right: 10px; }
+  .select2-container--classic .select2-selection--single .select2-selection__placeholder {
+    color: #999; }
+  .select2-container--classic .select2-selection--single .select2-selection__arrow {
+    background-color: #ddd;
+    border: none;
+    border-left: 1px solid #aaa;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+    height: 26px;
+    position: absolute;
+    top: 1px;
+    right: 1px;
+    width: 20px;
+    background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
+    background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
+    background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
+    background-repeat: repeat-x;
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); }
+    .select2-container--classic .select2-selection--single .select2-selection__arrow b {
+      border-color: #888 transparent transparent transparent;
+      border-style: solid;
+      border-width: 5px 4px 0 4px;
+      height: 0;
+      left: 50%;
+      margin-left: -4px;
+      margin-top: -2px;
+      position: absolute;
+      top: 50%;
+      width: 0; }
+
+.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
+  float: left; }
+
+.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
+  border: none;
+  border-right: 1px solid #aaa;
+  border-radius: 0;
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  left: 1px;
+  right: auto; }
+
+.select2-container--classic.select2-container--open .select2-selection--single {
+  border: 1px solid #5897fb; }
+  .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
+    background: transparent;
+    border: none; }
+    .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
+      border-color: transparent transparent #888 transparent;
+      border-width: 0 4px 5px 4px; }
+
+.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
+  border-top: none;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+  background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%);
+  background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%);
+  background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
+
+.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
+  border-bottom: none;
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%);
+  background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%);
+  background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); }
+
+.select2-container--classic .select2-selection--multiple {
+  background-color: white;
+  border: 1px solid #aaa;
+  border-radius: 4px;
+  cursor: text;
+  outline: 0; }
+  .select2-container--classic .select2-selection--multiple:focus {
+    border: 1px solid #5897fb; }
+  .select2-container--classic .select2-selection--multiple .select2-selection__rendered {
+    list-style: none;
+    margin: 0;
+    padding: 0 5px; }
+  .select2-container--classic .select2-selection--multiple .select2-selection__clear {
+    display: none; }
+  .select2-container--classic .select2-selection--multiple .select2-selection__choice {
+    background-color: #e4e4e4;
+    border: 1px solid #aaa;
+    border-radius: 4px;
+    cursor: default;
+    float: left;
+    margin-right: 5px;
+    margin-top: 5px;
+    padding: 0 5px; }
+  .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
+    color: #888;
+    cursor: pointer;
+    display: inline-block;
+    font-weight: bold;
+    margin-right: 2px; }
+    .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
+      color: #555; }
+
+.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
+  float: right;
+  margin-left: 5px;
+  margin-right: auto; }
+
+.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
+  margin-left: 2px;
+  margin-right: auto; }
+
+.select2-container--classic.select2-container--open .select2-selection--multiple {
+  border: 1px solid #5897fb; }
+
+.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
+  border-top: none;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0; }
+
+.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
+  border-bottom: none;
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0; }
+
+.select2-container--classic .select2-search--dropdown .select2-search__field {
+  border: 1px solid #aaa;
+  outline: 0; }
+
+.select2-container--classic .select2-search--inline .select2-search__field {
+  outline: 0;
+  box-shadow: none; }
+
+.select2-container--classic .select2-dropdown {
+  background-color: white;
+  border: 1px solid transparent; }
+
+.select2-container--classic .select2-dropdown--above {
+  border-bottom: none; }
+
+.select2-container--classic .select2-dropdown--below {
+  border-top: none; }
+
+.select2-container--classic .select2-results > .select2-results__options {
+  max-height: 200px;
+  overflow-y: auto; }
+
+.select2-container--classic .select2-results__option[role=group] {
+  padding: 0; }
+
+.select2-container--classic .select2-results__option[aria-disabled=true] {
+  color: grey; }
+
+.select2-container--classic .select2-results__option--highlighted[aria-selected] {
+  background-color: #3875d7;
+  color: white; }
+
+.select2-container--classic .select2-results__group {
+  cursor: default;
+  display: block;
+  padding: 6px; }
+
+.select2-container--classic.select2-container--open .select2-dropdown {
+  border-color: #5897fb; }
diff --git a/js/3rdparty/tag-it.js b/js/3rdparty/tag-it.js
deleted file mode 100644
index f16d021f6..000000000
--- a/js/3rdparty/tag-it.js
+++ /dev/null
@@ -1,365 +0,0 @@
-/*
- * jQuery UI Tag-it!
- *
- * @version v2.0 (06/2011)
- *
- * Copyright 2011, Levy Carneiro Jr.
- * Released under the MIT license.
- * http://aehlke.github.com/tag-it/LICENSE
- *
- * Homepage:
- *   http://aehlke.github.com/tag-it/
- *
- * Authors:
- *   Levy Carneiro Jr.
- *   Martin Rehfeld
- *   Tobias Schmidt
- *   Skylar Challand
- *   Alex Ehlke
- *
- * Maintainer:
- *   Alex Ehlke - Twitter: @aehlke
- *
- * Dependencies:
- *   jQuery v1.4+
- *   jQuery UI v1.8+
- */
-(function ($) {
-
-	$.widget('ui.tagit', {
-		options: {
-			itemName: 'item',
-			fieldName: 'tags',
-			availableTags: [],
-			tagSource: null,
-			removeConfirmation: false,
-			caseSensitive: true,
-			placeholderText: null,
-			// When enabled, quotes are not neccesary
-			// for inputting multi-word tags.
-			allowSpaces: false,
-			// The below options are for using a single field instead of several
-			// for our form values.
-			//
-			// When enabled, will use a single hidden field for the form,
-			// rather than one per tag. It will delimit tags in the field
-			// with singleFieldDelimiter.
-			//
-			// The easiest way to use singleField is to just instantiate tag-it
-			// on an INPUT element, in which case singleField is automatically
-			// set to true, and singleFieldNode is set to that element. This 
-			// way, you don't need to fiddle with these options.
-			singleField: false,
-			singleFieldDelimiter: ',',
-			// Set this to an input DOM node to use an existing form field.
-			// Any text in it will be erased on init. But it will be
-			// populated with the text of tags as they are created,
-			// delimited by singleFieldDelimiter.
-			//
-			// If this is not set, we create an input node for it,
-			// with the name given in settings.fieldName, 
-			// ignoring settings.itemName.
-			singleFieldNode: null,
-			// Optionally set a tabindex attribute on the input that gets
-			// created for tag-it.
-			tabIndex: null,
-			// Event callbacks.
-			onTagAdded: null,
-			onTagRemoved: null,
-			onTagClicked: null
-		},
-		_create: function () {
-			// for handling static scoping inside callbacks
-			var that = this;
-
-			// There are 2 kinds of DOM nodes this widget can be instantiated on:
-			//     1. UL, OL, or some element containing either of these.
-			//     2. INPUT, in which case 'singleField' is overridden to true,
-			//        a UL is created and the INPUT is hidden.
-			if (this.element.is('input')) {
-				this.tagList = $('<ul></ul>').insertAfter(this.element);
-				this.options.singleField = true;
-				this.options.singleFieldNode = this.element;
-				this.element.css('display', 'none');
-			} else {
-				this.tagList = this.element.find('ul, ol').andSelf().last();
-			}
-
-			this._tagInput = $('<input type="text">').addClass('ui-widget-content');
-			if (this.options.tabIndex) {
-				this._tagInput.attr('tabindex', this.options.tabIndex);
-			}
-			if (this.options.placeholderText) {
-				this._tagInput.attr('placeholder', this.options.placeholderText);
-			}
-			this.options.tagSource = this.options.tagSource || function (search, showChoices) {
-				var filter = search.term.toLowerCase();
-				var choices = $.grep(that.options.availableTags, function (element) {
-					// Only match autocomplete options that begin with the search term.
-					// (Case insensitive.)
-					return (element.toLowerCase().indexOf(filter) === 0);
-				});
-				showChoices(that._subtractArray(choices, that.assignedTags()));
-			};
-
-			this.tagList
-					.addClass('tagit')
-					.addClass('ui-widget ui-widget-content ui-corner-all')
-					// Create the input field.
-					.append($('<li class="tagit-new"></li>').append(this._tagInput))
-					.click(function (e) {
-						var target = $(e.target);
-						if (target.hasClass('tagit-label')) {
-							that._trigger('onTagClicked', e, target.closest('.tagit-choice'));
-						} else {
-							// Sets the focus() to the input field, if the user
-							// clicks anywhere inside the UL. This is needed
-							// because the input field needs to be of a small size.
-							that._tagInput.focus();
-						}
-					});
-
-			// Add existing tags from the list, if any.
-			this.tagList.children('li').each(function () {
-				if (!$(this).hasClass('tagit-new')) {
-					that.createTag($(this).html(), $(this).attr('class'));
-					$(this).remove();
-				}
-			});
-
-			// Single field support.
-			if (this.options.singleField) {
-				if (this.options.singleFieldNode) {
-					// Add existing tags from the input field.
-					var node = $(this.options.singleFieldNode);
-					var tags = node.val().split(this.options.singleFieldDelimiter);
-					node.val('');
-					$.each(tags, function (index, tag) {
-						that.createTag(tag);
-					});
-				} else {
-					// Create our single field input after our list.
-					this.options.singleFieldNode = this.tagList.after('<input type="hidden" style="display:none;" value="" name="' + this.options.fieldName + '">');
-				}
-			}
-
-			// Events.
-			this._tagInput
-					.keydown(function (event) {
-						// Backspace is not detected within a keypress, so it must use keydown.
-						if (event.which == $.ui.keyCode.BACKSPACE && that._tagInput.val() === '') {
-							var tag = that._lastTag();
-							if (!that.options.removeConfirmation || tag.hasClass('remove')) {
-								// When backspace is pressed, the last tag is deleted.
-								that.removeTag(tag);
-							} else if (that.options.removeConfirmation) {
-								tag.addClass('remove ui-state-highlight');
-							}
-						} else if (that.options.removeConfirmation) {
-							that._lastTag().removeClass('remove ui-state-highlight');
-						}
-
-						// Comma/Space/Enter are all valid delimiters for new tags,
-						// except when there is an open quote or if setting allowSpaces = true.
-						// Tab will also create a tag, unless the tag input is empty, in which case it isn't caught.
-						if (
-								event.which == $.ui.keyCode.COMMA ||
-								event.which == $.ui.keyCode.ENTER ||
-								(
-										event.which == $.ui.keyCode.TAB &&
-										that._tagInput.val() !== ''
-										) ||
-								(
-										event.which == $.ui.keyCode.SPACE &&
-										that.options.allowSpaces !== true &&
-										(
-												$.trim(that._tagInput.val()).replace(/^s*/, '').charAt(0) != '"' ||
-												(
-														$.trim(that._tagInput.val()).charAt(0) == '"' &&
-														$.trim(that._tagInput.val()).charAt($.trim(that._tagInput.val()).length - 1) == '"' &&
-														$.trim(that._tagInput.val()).length - 1 !== 0
-														)
-												)
-										)
-								) {
-							event.preventDefault();
-							that.createTag(that._cleanedInput());
-
-							// The autocomplete doesn't close automatically when TAB is pressed.
-							// So let's ensure that it closes.
-							that._tagInput.autocomplete('close');
-						}
-					}).blur(function (e) {
-				//If autocomplete is enabled and suggestion was clicked, don't add it
-				if (that.options.tagSource && that._tagInput.data('autocomplete-open')) {
-					that._cleanedInput();
-				} else {
-					that.createTag(that._cleanedInput());
-				}
-			});
-
-
-			// Autocomplete.
-			if (this.options.availableTags || this.options.tagSource) {
-				this._tagInput.autocomplete({
-					source: this.options.tagSource,
-					open: function () {
-						that._tagInput.data('autocomplete-open', true)
-					},
-					close: function () {
-						that._tagInput.data('autocomplete-open', false)
-					},
-					select: function (event, ui) {
-						that.createTag(ui.item.value);
-						// Preventing the tag input to be updated with the chosen value.
-						return false;
-					}
-				});
-			}
-		},
-		_cleanedInput: function () {
-			// Returns the contents of the tag input, cleaned and ready to be passed to createTag
-			return $.trim(this._tagInput.val().replace(/^"(.*)"$/, '$1'));
-		},
-		_lastTag: function () {
-			return this.tagList.children('.tagit-choice:last');
-		},
-		assignedTags: function () {
-			// Returns an array of tag string values
-			var that = this;
-			var tags = [];
-			if (this.options.singleField) {
-				tags = $(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter);
-				if (tags[0] === '') {
-					tags = [];
-				}
-			} else {
-				this.tagList.children('.tagit-choice').each(function () {
-					tags.push(that.tagLabel(this));
-				});
-			}
-			return tags;
-		},
-		_updateSingleTagsField: function (tags) {
-			// Takes a list of tag string values, updates this.options.singleFieldNode.val to the tags delimited by this.options.singleFieldDelimiter
-			$(this.options.singleFieldNode).val(tags.join(this.options.singleFieldDelimiter));
-		},
-		_subtractArray: function (a1, a2) {
-			var result = [];
-			for (var i = 0; i < a1.length; i++) {
-				if ($.inArray(a1[i], a2) == -1) {
-					result.push(a1[i]);
-				}
-			}
-			return result;
-		},
-		tagLabel: function (tag) {
-			// Returns the tag's string label.
-			if (this.options.singleField) {
-				return $(tag).children('.tagit-label').text();
-			} else {
-				return $(tag).children('input').val();
-			}
-		},
-		_isNew: function (value) {
-			var that = this;
-			var isNew = true;
-			this.tagList.children('.tagit-choice').each(function (i) {
-				if (that._formatStr(value) == that._formatStr(that.tagLabel(this))) {
-					isNew = false;
-					return;
-				}
-			});
-			return isNew;
-		},
-		_formatStr: function (str) {
-			if (this.options.caseSensitive) {
-				return str;
-			}
-			return $.trim(str.toLowerCase());
-		},
-		createTag: function (value, additionalClass) {
-			that = this;
-			// Automatically trims the value of leading and trailing whitespace.
-			value = $.trim(value);
-
-			if (!this._isNew(value) || value === '') {
-				return false;
-			}
-
-			var label = $(this.options.onTagClicked ? '<a class="tagit-label"></a>' : '<span class="tagit-label"></span>').text(value);
-
-			// Create tag.
-			var tag = $('<li></li>')
-					.addClass('tagit-choice ui-widget-content ui-state-default ui-corner-all')
-					.addClass(additionalClass)
-					.append(label);
-
-			// Button for removing the tag.
-			var removeTagIcon = $('<span></span>')
-					.addClass('ui-icon ui-icon-close');
-			var removeTag = $('<a><span class="text-icon">\xd7</span></a>') // \xd7 is an X
-					.addClass('close')
-					.append(removeTagIcon)
-					.click(function (e) {
-						// Removes a tag when the little 'x' is clicked.
-						that.removeTag(tag);
-					});
-			tag.append(removeTag);
-
-			// Unless options.singleField is set, each tag has a hidden input field inline.
-			if (this.options.singleField) {
-				var tags = this.assignedTags();
-				tags.push(value);
-				this._updateSingleTagsField(tags);
-			} else {
-				var escapedValue = label.html();
-				tag.append('<input type="hidden" style="display:none;" value="' + escapedValue + '" name="' + this.options.itemName + '[' + this.options.fieldName + '][]">');
-			}
-
-			this._trigger('onTagAdded', null, tag);
-
-			// Cleaning the input.
-			this._tagInput.val('');
-
-			// insert tag
-			this._tagInput.parent().after(tag);
-		},
-		removeTag: function (tag, animate) {
-			if (typeof animate === 'undefined') {
-				animate = true;
-			}
-
-			tag = $(tag);
-
-			this._trigger('onTagRemoved', null, tag);
-
-			if (this.options.singleField) {
-				var tags = this.assignedTags();
-				var removedTagLabel = this.tagLabel(tag);
-				tags = $.grep(tags, function (el) {
-					return el != removedTagLabel;
-				});
-				this._updateSingleTagsField(tags);
-			}
-			// Animate the removal.
-			if (animate) {
-				tag.fadeOut('fast').hide('blind', {direction: 'horizontal'}, 'fast', function () {
-					tag.remove();
-				}).dequeue();
-			} else {
-				tag.remove();
-			}
-			this._trigger('onTagFinishRemoved', null, tag);
-		},
-		removeAll: function () {
-			// Removes all tags. Takes an optional `animate` argument.
-			var that = this;
-			this.tagList.children('.tagit-choice').each(function (index, tag) {
-				that.removeTag(tag, false);
-			});
-		}
-
-	});
-
-})(jQuery);
diff --git a/js/Application.js b/js/Application.js
index db0f8b526..07375bb99 100644
--- a/js/Application.js
+++ b/js/Application.js
@@ -1,5 +1,6 @@
 import Backbone from 'backbone'
 import Bookmarks from './models/Bookmarks'
+import Tag from './models/Tag'
 import Tags from './models/Tags'
 import Router from './Router'
 import AppView from './views/App'
diff --git a/js/index.js b/js/index.js
index bfbf494e6..8e3e5d907 100644
--- a/js/index.js
+++ b/js/index.js
@@ -1,6 +1,7 @@
 import _ from 'underscore'
 import Backbone from 'backbone'
 import Marionette from 'backbone.marionette'
+import select2 from 'select2'
 import Tag from './models/Tag'
 import Tags from './models/Tags'
 import App from './Application'
@@ -19,6 +20,9 @@ Backbone.sync = function(method, model, options) {
   , error: function() {
       console.log(arguments)
     }
+  , headers: {
+      'requesttoken': oc_requesttoken
+    }
   }
   if (method === 'update' && model instanceof Tag) {
     overrideOptions.url = model.urlRoot+'/'+model.previous('name') 
diff --git a/js/templates/BookmarkDetail_editing.html b/js/templates/BookmarkDetail_editing.html
index 760fcb60d..db15e17f8 100644
--- a/js/templates/BookmarkDetail_editing.html
+++ b/js/templates/BookmarkDetail_editing.html
@@ -2,7 +2,6 @@
 <h1><input class="input-title" type="text" value="<%- title %>" placeholder="<%- t('bookmarks', 'The title of the page') %>" /></h1>
 <h2><input type="type" class="input-url icon-external" value="<%- url %>" placeholder="<%- t('bookmarks', 'The address of the page') %>" /></h2>
 <div class="tags">
-	<input type="text" />
 </div>
 <div class="description">
 	<textarea class="input-desc" placeholder="<%- t('bookmarks', 'A description of the page') %>"><%- description %></textarea>
diff --git a/js/templates/BulkActions.html b/js/templates/BulkActions.html
index f1864ff92..f3b8ba40b 100644
--- a/js/templates/BulkActions.html
+++ b/js/templates/BulkActions.html
@@ -7,5 +7,4 @@
 	<span><%- t('bookmarks', 'Delete') %></span>
 </button>
 <div class="tags">
-	<input type="text" />
 </div>
diff --git a/js/templates/Navigation.html b/js/templates/Navigation.html
index 425264cde..f4cae13b7 100644
--- a/js/templates/Navigation.html
+++ b/js/templates/Navigation.html
@@ -1,5 +1,5 @@
 <li data-id="all" class="all">
-	<a href="#"><span class="icon-home"></span><%- t('bookmarks', '>All bookmarks') %></a>
+	<a href="#"><span class="icon-home"></span><%- t('bookmarks', 'All bookmarks') %></a>
 </li>
 <li data-id="favorites" class="favorites">
 	<a href="#"><span class="icon-favorite"></span><%- t('bookmarks', 'Favorites') %></a>
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index f86fc2755..893f3887c 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -1,5 +1,6 @@
 import _ from 'underscore'
 import Backbone from 'backbone'
+import Tags from '../models/Tags'
 import TagsNavigationView from './TagsNavigation'
 import templateString from '../templates/BookmarkCard.html'
 
@@ -32,7 +33,7 @@ export default Marionette.View.extend({
     this.listenTo(this.model, "change", this.render);
     this.listenTo(this.model, "select", this.onSelect);
     this.listenTo(this.model, "unselect", this.onUnselect);
-    this.listenTo(app.tags, 'sync', this.render)
+    this.listenTo(this.app.tags, 'sync', this.render)
     this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
   }
 , onRender: function() {
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index b7a44437c..32897fb22 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -1,8 +1,10 @@
 import _ from 'underscore'
 import Backbone from 'backbone'
+import Tags from '../models/Tags'
 import TagsNavigationView from './TagsNavigation'
+import TagsSelectionView from './TagsSelection'
 import templateStringDefault from '../templates/BookmarkDetail_default.html'
-import templateStringEditing from '../templates/BookmarkDetail_default.html'
+import templateStringEditing from '../templates/BookmarkDetail_editing.html'
 
 const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
@@ -20,7 +22,6 @@ export default Marionette.View.extend({
   regions: {
     'tags': {
       el: '.tags'
-    , replaceElement: true
     }
   },
   ui: {
@@ -38,26 +39,17 @@ export default Marionette.View.extend({
   initialize: function(opts) {
     this.app = opts.app
     this.listenTo(this.model, "change", this.render);
-    this.listenTo(app.tags, 'sync', this.render)
+    this.listenTo(this.app.tags, 'sync', this.render)
   },
   onRender: function() {
     var that = this
+    this.tags = new Tags(this.model.get('tags').map(function(id) {
+      return that.app.tags.findWhere({name: id})
+    }))
     if (this.editing) {
-      this.$('.tags input')
-      .val(this.model.get('tags').join(','))
-      .tagit({
-        allowSpaces: true,
-        availableTags: this.app.tags.pluck('name'),
-        placeholderText: t('bookmarks', 'Enter tags'),
-        onTagRemoved: function() {},
-        onTagFinishRemoved: function() {},
-        onTagClicked: function(){}
-      })
+      this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }))
     }else{
-      var tags = new Tags(this.model.get('tags').map(function(id) {
-        return that.app.tags.findWhere({name: id})
-      }))
-      this.showChildView('tags', new TagsNavigationView({collection: tags}))
+      this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
     }
   },
   close: function() {
@@ -81,7 +73,7 @@ export default Marionette.View.extend({
     this.model.set({
       'title': this.$('.input-title').val()
     , 'url': this.$('.input-url').val()
-    , 'tags': this.$('.tags input').tagit("assignedTags")
+    , 'tags': this.tags.pluck('name')
     , 'description': this.$('.input-desc').val()
     })
     this.model.save({wait: true})
diff --git a/js/views/BulkActions.js b/js/views/BulkActions.js
index 9ae904de1..d9f380b54 100644
--- a/js/views/BulkActions.js
+++ b/js/views/BulkActions.js
@@ -1,5 +1,7 @@
 import _ from 'underscore'
 import Backbone from 'backbone'
+import Tags from '../models/Tags'
+import TagsSelectionView from './TagsSelection'
 import templateString from '../templates/BulkActions.html'
 
 const Marionette = Backbone.Marionette
@@ -8,7 +10,12 @@ const Radio = Backbone.Radio
 export default Marionette.View.extend({
   className: 'bulk-actions'
 , template: _.template(templateString)
-, events: {
+, regions: {
+    'tags': {
+      el: '.tags'
+    }
+  },
+  events: {
     'click .delete': 'delete'
   , 'click .select-all': 'selectAll'
   , 'click .selection-tools .close': 'abort'
@@ -17,36 +24,37 @@ export default Marionette.View.extend({
     this.app = opts.app
     this.all = this.app.bookmarks
     this.selected = opts.selected
+    this.tags = new Tags
+    this.listenTo(this.tags, 'remove', this.onTagRemoved)
+    this.listenTo(this.tags, 'add', this.onTagAdded)
     this.listenTo(this.selected, 'remove', this.onReduceSelection)
     this.listenTo(this.selected, 'add', this.onExtendSelection)
   }
 , onRender: function() {
-    // hack to ignore events caused by tagit setup -- we should really get something else...
-    this.rendering = true
-    this.$('.tags input')
-    .val(_.intersection.apply(_, this.selected.pluck('tags')).join(','))
-    .tagit({
-      allowSpaces: true,
-      availableTags: this.app.tags.pluck('name'),
-      placeholderText: t('bookmarks', 'Enter tags'),
-      onTagRemoved: this.onTagRemoved.bind(this),
-      onTagAdded: this.onTagAdded.bind(this),
-      onTagFinishRemoved: function() {},
-      onTagClicked: function(){}
-    })
-    this.rendering = false
+    this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }))
+  }
+, updateTags: function() {
+    var that = this
+    this.triggeredByAlgo = true
+    this.tags.reset(
+      _.intersection.apply(_, this.selected.pluck('tags'))
+        .map(function(name) {
+        return that.app.tags.get(name)
+      })
+    )
+    this.triggeredByAlgo = false
   }
 , onReduceSelection: function() {
     if (this.selected.length == 0) {
 	    this.$el.removeClass('active')
     }
-    this.render()
+    this.updateTags()
   }
 , onExtendSelection: function() {
     if (this.selected.length == 1) {
       this.$el.addClass('active')
     }
-    this.render()
+    this.updateTags()
   }
 , delete: function() {
     var that = this
@@ -59,21 +67,19 @@ export default Marionette.View.extend({
       })
     })
   }
-, onTagAdded: function(e, el) {
-    if (this.rendering) return
-    var tagName = $('.tagit-label', el).text()
+, onTagAdded: function(tag) {
+    if (this.triggeredByAlgo) return
     this.selected.forEach(function(model) {
       var tags = model.get('tags')
-      model.set('tags', _.union(tags, [tagName]))
+      model.set('tags', _.union(tags, [tag.get('name')]))
       model.save()
     }) 
   }
-, onTagRemoved: function(e, el) {
-    if (this.rendering) return
-    var tagName = $('.tagit-label', el).text()
+, onTagRemoved: function(tag) {
+    if (this.triggeredByAlgo) return
     this.selected.forEach(function(model) {
       var tags = model.get('tags')
-      model.set('tags', _.without(tags, tagName))
+      model.set('tags', _.without(tags, tag.get('name')))
       model.save()
     }) 
   }
diff --git a/js/views/TagsManagement.js b/js/views/TagsManagement.js
index 5aed7cb24..8a2ec216c 100644
--- a/js/views/TagsManagement.js
+++ b/js/views/TagsManagement.js
@@ -1,4 +1,5 @@
 import Backbone from 'backbone'
+import Tags from '../models/Tags'
 import TagView from './TagsManagementTag'
 
 const Marionette = Backbone.Marionette
diff --git a/js/views/TagsSelection.js b/js/views/TagsSelection.js
new file mode 100644
index 000000000..f6fa0dbc6
--- /dev/null
+++ b/js/views/TagsSelection.js
@@ -0,0 +1,64 @@
+import _ from 'underscore'
+import Backbone from 'backbone'
+
+const Marionette = Backbone.Marionette
+const Radio = Backbone.Radio
+
+export default Marionette.View.extend({
+  tagName: 'select'
+, template: _.template('')
+, className: 'tags-selection'
+, events: {
+    'select2:select': 'onAdd'
+  , 'select2:unselect': 'onRemove'
+  }
+, initialize: function(options) {
+    this.app = options.app 
+    this.selected = options.selected || new Tags
+    this.selected.comparator = 'name'
+    
+    this.listenTo(this.selected, 'add', this.onChangeByAlgo)
+    this.listenTo(this.selected, 'remove', this.onChangeByAlgo)
+    this.listenTo(this.selected, 'reset', this.onChangeByAlgo)
+    this.listenTo(this.collection, 'add', this.onAttach)
+  }
+, onAttach: function() {
+    if (this.$el.hasClass("select2-hidden-accessible")) {
+      this.$el.select2('destroy')
+    }
+    this.$el.select2({
+      placeholder: t('bookmarks', 'Set tags')
+    , allowClear: true
+    , width: '100%'
+    , tags: true
+    , multiple: true
+    , tokenSeparators: [',', ' ']
+    , data: this.app.tags.pluck('name').map(function(name) {
+        return {id: name, text: name}
+      })
+    })
+    .val(this.selected.pluck('name'))
+    .trigger('change')
+  }
+, onDetach: function() {
+    this.$el.select2('destroy')
+  }
+, onAddByUser: function(e) {
+    if (this.triggeredByAlgo) {
+      return this.triggeredByAlgo = false
+    }
+    this.selected.add(this.app.tags.get(e.params.data.id))
+  }
+, onRemoveByUser: function(e) {
+    if (this.triggeredByAlgo) {
+      return this.triggeredByAlgo = false
+    }
+    this.selected.remove(this.app.tags.get(e.params.data.id))
+  }
+, onChangeByAlgo: function(e) {
+    this.$el
+    .val(this.selected.pluck('name'))
+    .trigger('change')
+    this.triggeredByAlgo = true
+  }
+})
diff --git a/package.json b/package.json
index 0a61b44c4..273fa061d 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "backbone": "^1.3.3",
     "backbone.marionette": "^3.5.1",
     "jquery": "^3.3.1",
+    "select2": "^4.0.6-rc.1",
     "underscore": "^1.8.3"
   }
 }
diff --git a/templates/main.php b/templates/main.php
index e5785d419..e717f3f60 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -2,10 +2,7 @@
 script('bookmarks', 'dist/bundle');
 style('bookmarks', 'bookmarks');
 
-
-script('bookmarks', '3rdparty/tag-it');
-style('bookmarks', '3rdparty/jquery.tagit');
-
+style('bookmarks', 'select2');
 /**
  * Copyright (c) 2011 Marvin Thomas Rabe <mrabe@marvinrabe.de>
  * Copyright (c) 2011 Arthur Schiwon <blizzz@arthur-schiwon.de>

From 0bdab7bb93f85f88c3c1274994d5c3dd0f51912d Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 2 Feb 2018 23:07:32 +0100
Subject: [PATCH 061/110] Disable 'Shared' & 'Favorites' views for now

---
 css/bookmarks.css            | 3 ---
 js/templates/Navigation.html | 2 ++
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index ed820b913..142d5a090 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -39,9 +39,6 @@
   }
 }
 
-.add-bookmark {
-  border-bottom: 1px solid #ebebeb;
-}
 .add-bookmark input {
 	margin: 0;
 	width: 100%;
diff --git a/js/templates/Navigation.html b/js/templates/Navigation.html
index f4cae13b7..fee537b79 100644
--- a/js/templates/Navigation.html
+++ b/js/templates/Navigation.html
@@ -1,9 +1,11 @@
 <li data-id="all" class="all">
 	<a href="#"><span class="icon-home"></span><%- t('bookmarks', 'All bookmarks') %></a>
 </li>
+<!--
 <li data-id="favorites" class="favorites">
 	<a href="#"><span class="icon-favorite"></span><%- t('bookmarks', 'Favorites') %></a>
 </li>
 <li data-id="shared" class="shared">
 	<a href="#"><span class="icon-share"></span><%- t('bookmarks', 'Shared') %></a>
 </li>
+-->

From e88ca12ab5203df26c13142dcae3f9fdf322cb35 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 2 Feb 2018 23:39:52 +0100
Subject: [PATCH 062/110] Fix tags-selection

---
 js/views/TagsSelection.js | 19 ++++++++-----------
 1 file changed, 8 insertions(+), 11 deletions(-)

diff --git a/js/views/TagsSelection.js b/js/views/TagsSelection.js
index f6fa0dbc6..19213a9d1 100644
--- a/js/views/TagsSelection.js
+++ b/js/views/TagsSelection.js
@@ -1,5 +1,7 @@
 import _ from 'underscore'
 import Backbone from 'backbone'
+import Tag from '../models/Tag'
+import Tags from '../models/Tags'
 
 const Marionette = Backbone.Marionette
 const Radio = Backbone.Radio
@@ -9,8 +11,8 @@ export default Marionette.View.extend({
 , template: _.template('')
 , className: 'tags-selection'
 , events: {
-    'select2:select': 'onAdd'
-  , 'select2:unselect': 'onRemove'
+    'select2:select': 'onAddByUser'
+  , 'select2:unselect': 'onRemoveByUser'
   }
 , initialize: function(options) {
     this.app = options.app 
@@ -44,21 +46,16 @@ export default Marionette.View.extend({
     this.$el.select2('destroy')
   }
 , onAddByUser: function(e) {
-    if (this.triggeredByAlgo) {
-      return this.triggeredByAlgo = false
-    }
-    this.selected.add(this.app.tags.get(e.params.data.id))
+    var tag = this.app.tags.get(e.params.data.text) || new Tag({name: e.params.data.text})
+    this.selected.add(tag)
   }
 , onRemoveByUser: function(e) {
-    if (this.triggeredByAlgo) {
-      return this.triggeredByAlgo = false
-    }
-    this.selected.remove(this.app.tags.get(e.params.data.id))
+    var tag = this.app.tags.get(e.params.data.text) || new Tag({name: e.params.data.text})
+    this.selected.remove(tag)
   }
 , onChangeByAlgo: function(e) {
     this.$el
     .val(this.selected.pluck('name'))
     .trigger('change')
-    this.triggeredByAlgo = true
   }
 })

From d42c1810819da83f6d905623613dbe5dce334f7f Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 2 Feb 2018 23:42:08 +0100
Subject: [PATCH 063/110] Allow scrolling through sidebar tags

---
 css/bookmarks.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 142d5a090..87f6c879f 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -7,6 +7,7 @@
 }
 #app-navigation > ul {
   height: auto;
+  overflow: hidden;
 }
 .navigation a > span {
   display: inline-block;
@@ -352,7 +353,7 @@ button span,
 .tags-management {
   float: left;
   width: 250px;
-  overflow: visible !important;
+  overflow: auto !important;
 }
 @media only screen and (max-width: 768px) {
   .tags-management {

From e95a12039f80e5d5d612767106ac46f260bb3600 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Feb 2018 19:50:53 +0100
Subject: [PATCH 064/110] Pretty-print templates/Settings.html

---
 js/templates/Settings.html | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/js/templates/Settings.html b/js/templates/Settings.html
index 0a45a70c9..6efd35500 100644
--- a/js/templates/Settings.html
+++ b/js/templates/Settings.html
@@ -1 +1,13 @@
-<div id="app-settings-header"><button class="settings-button">Settings</a></div><div id="app-settings-content"><form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data"><input type="file" class="import" name="bm_import" size="5" /><input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" /><button class="import-facade"><span class="icon-upload"></span> Import</button></form><iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe><button class="export"><span class="icon-download"></span> Export</button><div class="import-status"></div></div>
+<div id="app-settings-header">
+	<button class="settings-button">Settings</button>
+</div>
+<div id="app-settings-content">
+	<form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data">
+		<input type="file" class="import" name="bm_import" size="5" />
+		<input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" />
+		<button class="import-facade"><span class="icon-upload"></span> Import</button>
+	</form>
+	<iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe>
+	<button class="export"><span class="icon-download"></span> Export</button>
+	<div class="import-status"></div>
+</div>

From de38d43f6345a63c682dabb78cbed4fce975ee13 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Feb 2018 20:16:41 +0100
Subject: [PATCH 065/110] Prettify css

---
 css/bookmarks.css | 428 ----------------------------------------
 css/select2.css   | 483 ----------------------------------------------
 2 files changed, 911 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 87f6c879f..8b1378917 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,429 +1 @@
-#content > div {
-  height: 100%;
-}
-#app-navigation {
-  height: 100%;
-  position: relative;
-}
-#app-navigation > ul {
-  height: auto;
-  overflow: hidden;
-}
-.navigation a > span {
-  display: inline-block;
-  vertical-align: text-bottom;
-  margin-right: 12px;
-}
-#app-navigation h3 {
-	padding-top: .7cm;
-	padding-left: 12px;
-	border-top: 1px solid #ededed;
-}
 
-#app-content {
-  transition: transform .5s ease;
-  transform: none;
-}
-.mobile-nav {
-  padding: .3cm;
-  display: none;
-}
-.mobile-nav .toggle-menu {
-  display: inline-block;
-}
-@media only screen and (max-width: 768px) {
-  .mobile-nav-open #app-content {
-    transform: translate(250px, 0);
-  }
-  .mobile-nav {
-    display: block;
-  }
-}
-
-.add-bookmark input {
-	margin: 0;
-	width: 100%;
-	padding: 12px 40px 12px 12px;
-	box-sizing: border-box;
-	background-color: transparent;
-	border: none;
-	border-bottom: 1px solid #eee;
-	border-radius: 0;
-}
-.add-bookmark button {
-	position: absolute;
-	right: 0;
-	top: 0;
-  min-height: 34px;
-	padding: 10px 20px;
-	background-color: transparent;
-	border: none;
-	opacity: .5;
-  font-weight: bold;
-}
-.add-bookmark li.link a span {
-  margin-left: 28px;
-}
-.add-bookmark li.link a span::before {
-	position: absolute;
-	left: 12px;
-	content: '+';
-	font-weight: bold;
-	font-size: 28px;
-}
-.add-bookmark .form {
-  display: none;
-}
-
-.bulk-actions {
-  display: none;
-  position: fixed;
-  top: 45px;
-  left: 250px;
-  right: 0;
-  border-bottom: 1px solid #ebebeb;
-  padding: .3cm .5cm;
-  background: #e9f7ff;
-  z-index: 3;
-}
-.bulk-actions + * {
-  transition: margin-top .5s ease;
-}
-.bulk-actions.active {
-  display: block;
-}
-.bulk-actions.active + * {
-  margin-top: 2.5cm;
-}
-@media only screen and (max-width: 768px) {
-  .bulk-actions {
-    position: relative;
-	top: 0; right: 0; bottom: 0; left: 0;
-  }
-  .bulk-actions.active + * {
-    margin-top: 0;
-  }
-}
-.bulk-actions > button {
-  vertical-align: top;
-}
-.bulk-actions .tags {
-  display: inline-block;
-  width: 60%;
-  margin: 3px 3px 3px 0;
-  position: relative;
-}
-.bulk-actions .tags-selection {
-  display: block;
-  width: 100%;
-}
-.bulk-actions .selection-tools {
-  float: right;
-}
-.bulk-actions .selection-tools .close {
-  display: inline-block;
-  cursor: pointer;
-  margin: 3px 3px 3px 0; 
-  padding: 6px 12px;
-  width: auto;
-  min-height: 34px;
-  cursor: pointer;
-  box-sizing: border-box;
-}
-.bulk-actions .selection-tools .close span {
-  display: inline-block;
-  vertical-align: text-top;
-}
-button span,
-.bulk-actions .selection-tools .close span {
-  cursor: pointer;
-}
-
-.bookmarks-empty {
-  width: 5cm;
-  margin: 20% auto;
-}
-
-.bookmarks {
-  display: flex;
-  flex-wrap: wrap;
-  overflow: hidden;
-  padding-right: .6cm;
-}
-.bookmark-card {
-  position: relative;
-  box-sizing: border-box; /*necessary for hover effect goodness to work*/
-  flex-grow: 1;
-  width: 6cm;
-  height: 6cm;
-  margin: .6cm 0 0 .6cm;
-  padding: .5cm;
-  border: 1px solid #ddd;
-  overflow: hidden;
-  background-color: rgb(210, 210, 210);
-  background-size: cover;
-  background-position: center;
-  transition: background-color .3s ease;
-  background-blend-mode: overlay;
-}
-.bookmark-card,
-.bookmark-card * {
-  cursor: pointer;
-}
-.bookmark-card:hover {
-  background-color: rgb(180, 180, 180);
-}
-.bookmark-card.active,
-.bookmark-card.active:hover {
-  transform: none;
-  border: 1px solid #0082c9;
-  box-shadow: inset 0 0 10px #0082c9;
-}
-.bookmark-card .panel {
-  position: absolute;
-  top: 0; left: 0; right: 0;
-  padding: .5cm .5cm .1cm .6cm;
-  background: rgba(255, 255, 255, .8);
-  box-shadow: #aaa 0 0 5px;
-}
-.bookmark-card:hover .panel {
-  background: rgba(255, 255, 255, .90); 
-}
-.bookmark-card .selectbox {
-  display: none;
-  position: absolute;
-  left: .1cm;
-  top: .5cm;
-}
-.selection-active .bookmark-card .selectbox,
-.bookmark-card:hover .selectbox,
-.bookmark-card.active .selectbox {
-  display: inline-block;
-}
-.bookmark-card h1 {
-  font-size: .5cm;
-  padding-right: .5cm;
-}
-.bookmark-card h2 {
-  margin-top: .1cm;
-  font-size: .4cm;
-  opacity: .4;
-}
-.bookmark-card h2 :link span {
-  display: inline-block;
-  vertical-align: text-bottom;
-  margin-right: 3px;
-}
-.bookmark-card h2 :link:hover {
-  text-decoration: underline;
-}
-.bookmark-card .actions {
-  display: none;
-  position: absolute;
-  top: .5cm;
-  right: .5cm;
-}
-.bookmark-card:hover .actions,
-.bookmark-card.actions-open .actions {
-  display: block;
-}
-.bookmark-card .actions .popovermenu {
-  top: 24px;
-  right: -14px;
-}
-.bookmark-card .actions .action-select,
-.bookmark-card.active .actions .action-unselect {
-  display: block;
-}
-.bookmark-card .actions .action-unselect,
-.bookmark-card.active .actions .action-select {
-  display: none;
-}
-.bookmark-card .tags {
-  max-height: 2.5cm;
-  overflow: hidden;
-  position: absolute;
-  bottom: .5cm;
-}
-.bookmark-card .tag-nav-item {
-  border-radius: .2cm;
-  background: #ebebeb;
-  display: inline-block;
-  padding: 0 .2cm;
-  margin: .1cm;
-}
-.bookmark-card .tag-nav-item:hover {
-  background: #e0e0e0;
-}
-
-.bookmark-detail {
-  position: fixed;
-  top: 45px;
-  right: 0;
-  z-index: 2;
-  width: 500px;
-  height: 100%;
-  box-sizing: border-box;
-  padding: 1cm;
-  background: white;
-  border-left: 1px solid #ebebeb;
-}
-@media only screen and (max-width: 768px) {
-  .bookmark-detail {
-    width: auto;
-    left: 0;
-  }
-}
-.bookmark-detail h1 {
-  font-size: .8cm;
-  line-height: 1;
-  padding-right: 2.3cm;
-}
-.bookmark-detail h2 {
-  margin-top: .3cm;
-  opacity: .4;
-}
-.bookmark-detail h2 :link:hover {
-  text-decoration: underline;
-}
-.bookmark-detail h2 :link span {
-  display: inline-block;
-  vertical-align: middle;
-  margin-right: 3px;
-}
-.bookmark-detail > .close {
-  position: absolute;
-  top: .1cm;
-  right: .1cm;
-  width: 1cm;
-  height: 1cm;
-  cursor: pointer;
-}
-.bookmark-detail .actions {
-  position: absolute;
-  right: 1cm;
-}
-.bookmark-detail .actions button {
-  height: 1cm;
-  width: 1cm;
-}
-.bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice,
-.bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice,
-.bookmark-detail .tag-nav-item {
-  border-radius: .2cm;
-  border: none;
-  background: #ebebeb;
-  display: inline-block;
-  padding: .1cm .2cm;
-  margin: .1cm;
-}
-.bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
-.bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
-.bookmark-detail .tag-nav-item:hover {
-  background: #e0e0e0;
-}
-.bookmark-detail .description {
-  margin-top: .5cm;
-}
-
-.bookmark-detail.editing h1 {
-  padding-right: 0;
-}
-.bookmark-detail.editing .actions button {
-  height: auto;
-  width: auto;
-}
-.bookmark-detail .input-url,
-.bookmark-detail .input-title,
-.bookmark-detail .input-desc,
-.bookmark-detail .tags-selection  {
-  width: 100%;
-  font-size: inherit;
-  box-sizing: border-box;
-  padding: 0 !important;
-}
-.bookmark-detail .input-url {
-  padding-left: 25px !important;
-  background-position: 5px;
-}
-.bookmark-detail .input-desc {
-  height: 300px;
-}
-
-.tags-management {
-  float: left;
-  width: 250px;
-  overflow: auto !important;
-}
-@media only screen and (max-width: 768px) {
-  .tags-management {
-    width: auto;
-    float: none;
-    border-bottom: 2px solid #bbb;
-  }
-}
-.tags-management > ul:first-child > li:last-child {
-  border-bottom: 2px solid #ebebeb;
-}
-.tags-management .tag-man-item {
-  /*padding: .3cm;*/
-  cursor: pointer;
-}
-.tags-management .tag-man-item.active {
-  background: #f3f3f3;
-}
-.tags-management .tag-man-item > a {
-  padding-left: .2cm;
-}
-.tags-management .tag-man-item .actions {
-  float: right;
-}
-
-.tags-management .tag-man-item .actions ul {
-  display: block !important;
-}
-.tags-management .tag-man-item .actions .action {
-  display: inline-block;
-  width: auto !important;
-}
-.tags-management .tag-man-item .action button {
-	border: none;
-	background-color: transparent;
-	opacity: .45;
-  padding: 3px 12px;
-}
-.tags-management .tag-man-item .action button:hover {
-  opacity: 1;
-}
-.tags-management .tag-man-item input[type="text"] {
-  min-height: .7cm;
-  padding: 0 .1cm;
-  margin: 0;
-  width: 70%;
-}
-
-/* make checkbox look like an icon */
-.menu-item-checkbox span:first-child {
-  padding: 0 10px;
-}
-
-/* display 'remove from filter' when selected, and 'add to ...' when unselected*/
-.tags-management .tag-man-item.active .menu-filter-add {
-  display: none;
-}
-.tags-management .tag-man-item .menu-filter-remove {
-  display: none;
-}
-.tags-management .tag-man-item.active .menu-filter-remove {
-  display: block;
-}
-
-.settings .import-form {
-  display: inline-block;
-}
-.settings .import {
-  display: none;
-}
-.settings .upload {
-  display: none;
-}
diff --git a/css/select2.css b/css/select2.css
index ce3afd1d5..8b1378917 100644
--- a/css/select2.css
+++ b/css/select2.css
@@ -1,484 +1 @@
-.select2-container {
-  box-sizing: border-box;
-  display: inline-block;
-  margin: 0;
-  position: relative;
-  vertical-align: middle; }
-  .select2-container .select2-selection--single {
-    box-sizing: border-box;
-    cursor: pointer;
-    display: block;
-    height: 28px;
-    user-select: none;
-    -webkit-user-select: none; }
-    .select2-container .select2-selection--single .select2-selection__rendered {
-      display: block;
-      padding-left: 8px;
-      padding-right: 20px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap; }
-    .select2-container .select2-selection--single .select2-selection__clear {
-      position: relative; }
-  .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
-    padding-right: 8px;
-    padding-left: 20px; }
-  .select2-container .select2-selection--multiple {
-    box-sizing: border-box;
-    cursor: pointer;
-    display: block;
-    min-height: 32px;
-    user-select: none;
-    -webkit-user-select: none; }
-    .select2-container .select2-selection--multiple .select2-selection__rendered {
-      display: inline-block;
-      overflow: hidden;
-      padding-left: 8px;
-      text-overflow: ellipsis;
-      white-space: nowrap; }
-  .select2-container .select2-search--inline {
-    float: left; }
-    .select2-container .select2-search--inline .select2-search__field {
-      box-sizing: border-box;
-      border: none;
-      font-size: 100%;
-      margin-top: 5px;
-      padding: 0; }
-      .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
-        -webkit-appearance: none; }
 
-.select2-dropdown {
-  background-color: white;
-  border: 1px solid #aaa;
-  border-radius: 4px;
-  box-sizing: border-box;
-  display: block;
-  position: absolute;
-  left: -100000px;
-  width: 100%;
-  z-index: 1051; }
-
-.select2-results {
-  display: block; }
-
-.select2-results__options {
-  list-style: none;
-  margin: 0;
-  padding: 0; }
-
-.select2-results__option {
-  padding: 6px;
-  user-select: none;
-  -webkit-user-select: none; }
-  .select2-results__option[aria-selected] {
-    cursor: pointer; }
-
-.select2-container--open .select2-dropdown {
-  left: 0; }
-
-.select2-container--open .select2-dropdown--above {
-  border-bottom: none;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0; }
-
-.select2-container--open .select2-dropdown--below {
-  border-top: none;
-  border-top-left-radius: 0;
-  border-top-right-radius: 0; }
-
-.select2-search--dropdown {
-  display: block;
-  padding: 4px; }
-  .select2-search--dropdown .select2-search__field {
-    padding: 4px;
-    width: 100%;
-    box-sizing: border-box; }
-    .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
-      -webkit-appearance: none; }
-  .select2-search--dropdown.select2-search--hide {
-    display: none; }
-
-.select2-close-mask {
-  border: 0;
-  margin: 0;
-  padding: 0;
-  display: block;
-  position: fixed;
-  left: 0;
-  top: 0;
-  min-height: 100%;
-  min-width: 100%;
-  height: auto;
-  width: auto;
-  opacity: 0;
-  z-index: 99;
-  background-color: #fff;
-  filter: alpha(opacity=0); }
-
-.select2-hidden-accessible {
-  border: 0 !important;
-  clip: rect(0 0 0 0) !important;
-  -webkit-clip-path: inset(50%) !important;
-  clip-path: inset(50%) !important;
-  height: 1px !important;
-  overflow: hidden !important;
-  padding: 0 !important;
-  position: absolute !important;
-  width: 1px !important;
-  white-space: nowrap !important; }
-
-.select2-container--default .select2-selection--single {
-  background-color: #fff;
-  border: 1px solid #aaa;
-  border-radius: 4px; }
-  .select2-container--default .select2-selection--single .select2-selection__rendered {
-    color: #444;
-    line-height: 28px; }
-  .select2-container--default .select2-selection--single .select2-selection__clear {
-    cursor: pointer;
-    float: right;
-    font-weight: bold; }
-  .select2-container--default .select2-selection--single .select2-selection__placeholder {
-    color: #999; }
-  .select2-container--default .select2-selection--single .select2-selection__arrow {
-    height: 26px;
-    position: absolute;
-    top: 1px;
-    right: 1px;
-    width: 20px; }
-    .select2-container--default .select2-selection--single .select2-selection__arrow b {
-      border-color: #888 transparent transparent transparent;
-      border-style: solid;
-      border-width: 5px 4px 0 4px;
-      height: 0;
-      left: 50%;
-      margin-left: -4px;
-      margin-top: -2px;
-      position: absolute;
-      top: 50%;
-      width: 0; }
-
-.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
-  float: left; }
-
-.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
-  left: 1px;
-  right: auto; }
-
-.select2-container--default.select2-container--disabled .select2-selection--single {
-  background-color: #eee;
-  cursor: default; }
-  .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
-    display: none; }
-
-.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
-  border-color: transparent transparent #888 transparent;
-  border-width: 0 4px 5px 4px; }
-
-.select2-container--default .select2-selection--multiple {
-  background-color: white;
-  border: 1px solid #aaa;
-  border-radius: 4px;
-  cursor: text; }
-  .select2-container--default .select2-selection--multiple .select2-selection__rendered {
-    box-sizing: border-box;
-    list-style: none;
-    margin: 0;
-    padding: 0 5px;
-    width: 100%; }
-    .select2-container--default .select2-selection--multiple .select2-selection__rendered li {
-      list-style: none; }
-  .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
-    color: #999;
-    margin-top: 5px;
-    float: left; }
-  .select2-container--default .select2-selection--multiple .select2-selection__clear {
-    cursor: pointer;
-    float: right;
-    font-weight: bold;
-    margin-top: 5px;
-    margin-right: 10px; }
-  .select2-container--default .select2-selection--multiple .select2-selection__choice {
-    background-color: #e4e4e4;
-    border: 1px solid #aaa;
-    border-radius: 4px;
-    cursor: default;
-    float: left;
-    margin-right: 5px;
-    margin-top: 5px;
-    padding: 0 5px; }
-  .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
-    color: #999;
-    cursor: pointer;
-    display: inline-block;
-    font-weight: bold;
-    margin-right: 2px; }
-    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
-      color: #333; }
-
-.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline {
-  float: right; }
-
-.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
-  margin-left: 5px;
-  margin-right: auto; }
-
-.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
-  margin-left: 2px;
-  margin-right: auto; }
-
-.select2-container--default.select2-container--focus .select2-selection--multiple {
-  border: solid black 1px;
-  outline: 0; }
-
-.select2-container--default.select2-container--disabled .select2-selection--multiple {
-  background-color: #eee;
-  cursor: default; }
-
-.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
-  display: none; }
-
-.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
-  border-top-left-radius: 0;
-  border-top-right-radius: 0; }
-
-.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0; }
-
-.select2-container--default .select2-search--dropdown .select2-search__field {
-  border: 1px solid #aaa; }
-
-.select2-container--default .select2-search--inline .select2-search__field {
-  background: transparent;
-  border: none;
-  outline: 0;
-  box-shadow: none;
-  -webkit-appearance: textfield; }
-
-.select2-container--default .select2-results > .select2-results__options {
-  max-height: 200px;
-  overflow-y: auto; }
-
-.select2-container--default .select2-results__option[role=group] {
-  padding: 0; }
-
-.select2-container--default .select2-results__option[aria-disabled=true] {
-  color: #999; }
-
-.select2-container--default .select2-results__option[aria-selected=true] {
-  background-color: #ddd; }
-
-.select2-container--default .select2-results__option .select2-results__option {
-  padding-left: 1em; }
-  .select2-container--default .select2-results__option .select2-results__option .select2-results__group {
-    padding-left: 0; }
-  .select2-container--default .select2-results__option .select2-results__option .select2-results__option {
-    margin-left: -1em;
-    padding-left: 2em; }
-    .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
-      margin-left: -2em;
-      padding-left: 3em; }
-      .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
-        margin-left: -3em;
-        padding-left: 4em; }
-        .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
-          margin-left: -4em;
-          padding-left: 5em; }
-          .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
-            margin-left: -5em;
-            padding-left: 6em; }
-
-.select2-container--default .select2-results__option--highlighted[aria-selected] {
-  background-color: #5897fb;
-  color: white; }
-
-.select2-container--default .select2-results__group {
-  cursor: default;
-  display: block;
-  padding: 6px; }
-
-.select2-container--classic .select2-selection--single {
-  background-color: #f7f7f7;
-  border: 1px solid #aaa;
-  border-radius: 4px;
-  outline: 0;
-  background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%);
-  background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%);
-  background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
-  background-repeat: repeat-x;
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
-  .select2-container--classic .select2-selection--single:focus {
-    border: 1px solid #5897fb; }
-  .select2-container--classic .select2-selection--single .select2-selection__rendered {
-    color: #444;
-    line-height: 28px; }
-  .select2-container--classic .select2-selection--single .select2-selection__clear {
-    cursor: pointer;
-    float: right;
-    font-weight: bold;
-    margin-right: 10px; }
-  .select2-container--classic .select2-selection--single .select2-selection__placeholder {
-    color: #999; }
-  .select2-container--classic .select2-selection--single .select2-selection__arrow {
-    background-color: #ddd;
-    border: none;
-    border-left: 1px solid #aaa;
-    border-top-right-radius: 4px;
-    border-bottom-right-radius: 4px;
-    height: 26px;
-    position: absolute;
-    top: 1px;
-    right: 1px;
-    width: 20px;
-    background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
-    background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
-    background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
-    background-repeat: repeat-x;
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); }
-    .select2-container--classic .select2-selection--single .select2-selection__arrow b {
-      border-color: #888 transparent transparent transparent;
-      border-style: solid;
-      border-width: 5px 4px 0 4px;
-      height: 0;
-      left: 50%;
-      margin-left: -4px;
-      margin-top: -2px;
-      position: absolute;
-      top: 50%;
-      width: 0; }
-
-.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
-  float: left; }
-
-.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
-  border: none;
-  border-right: 1px solid #aaa;
-  border-radius: 0;
-  border-top-left-radius: 4px;
-  border-bottom-left-radius: 4px;
-  left: 1px;
-  right: auto; }
-
-.select2-container--classic.select2-container--open .select2-selection--single {
-  border: 1px solid #5897fb; }
-  .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
-    background: transparent;
-    border: none; }
-    .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
-      border-color: transparent transparent #888 transparent;
-      border-width: 0 4px 5px 4px; }
-
-.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
-  border-top: none;
-  border-top-left-radius: 0;
-  border-top-right-radius: 0;
-  background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%);
-  background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%);
-  background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
-  background-repeat: repeat-x;
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
-
-.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
-  border-bottom: none;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-  background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%);
-  background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%);
-  background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
-  background-repeat: repeat-x;
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); }
-
-.select2-container--classic .select2-selection--multiple {
-  background-color: white;
-  border: 1px solid #aaa;
-  border-radius: 4px;
-  cursor: text;
-  outline: 0; }
-  .select2-container--classic .select2-selection--multiple:focus {
-    border: 1px solid #5897fb; }
-  .select2-container--classic .select2-selection--multiple .select2-selection__rendered {
-    list-style: none;
-    margin: 0;
-    padding: 0 5px; }
-  .select2-container--classic .select2-selection--multiple .select2-selection__clear {
-    display: none; }
-  .select2-container--classic .select2-selection--multiple .select2-selection__choice {
-    background-color: #e4e4e4;
-    border: 1px solid #aaa;
-    border-radius: 4px;
-    cursor: default;
-    float: left;
-    margin-right: 5px;
-    margin-top: 5px;
-    padding: 0 5px; }
-  .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
-    color: #888;
-    cursor: pointer;
-    display: inline-block;
-    font-weight: bold;
-    margin-right: 2px; }
-    .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
-      color: #555; }
-
-.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
-  float: right;
-  margin-left: 5px;
-  margin-right: auto; }
-
-.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
-  margin-left: 2px;
-  margin-right: auto; }
-
-.select2-container--classic.select2-container--open .select2-selection--multiple {
-  border: 1px solid #5897fb; }
-
-.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
-  border-top: none;
-  border-top-left-radius: 0;
-  border-top-right-radius: 0; }
-
-.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
-  border-bottom: none;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0; }
-
-.select2-container--classic .select2-search--dropdown .select2-search__field {
-  border: 1px solid #aaa;
-  outline: 0; }
-
-.select2-container--classic .select2-search--inline .select2-search__field {
-  outline: 0;
-  box-shadow: none; }
-
-.select2-container--classic .select2-dropdown {
-  background-color: white;
-  border: 1px solid transparent; }
-
-.select2-container--classic .select2-dropdown--above {
-  border-bottom: none; }
-
-.select2-container--classic .select2-dropdown--below {
-  border-top: none; }
-
-.select2-container--classic .select2-results > .select2-results__options {
-  max-height: 200px;
-  overflow-y: auto; }
-
-.select2-container--classic .select2-results__option[role=group] {
-  padding: 0; }
-
-.select2-container--classic .select2-results__option[aria-disabled=true] {
-  color: grey; }
-
-.select2-container--classic .select2-results__option--highlighted[aria-selected] {
-  background-color: #3875d7;
-  color: white; }
-
-.select2-container--classic .select2-results__group {
-  cursor: default;
-  display: block;
-  padding: 6px; }
-
-.select2-container--classic.select2-container--open .select2-dropdown {
-  border-color: #5897fb; }

From 447a35d16cd404736a834db12d2c9e3b9c1d2f43 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Feb 2018 21:12:23 +0100
Subject: [PATCH 066/110] Format js correctly

---
 js/Application.js             | 104 +++++++++----------
 js/Router.js                  | 104 +++++++++----------
 js/bookmarklet.js             |  16 +--
 js/index.js                   |  64 ++++++------
 js/models/Bookmark.js         |   6 +-
 js/models/Bookmarks.js        |  10 +-
 js/models/Tag.js              |   8 +-
 js/models/Tags.js             |  14 +--
 js/views/AddBookmark.js       | 148 +++++++++++++--------------
 js/views/App.js               |  98 +++++++++---------
 js/views/BookmarkCard.js      | 160 ++++++++++++++---------------
 js/views/BookmarkDetail.js    | 174 +++++++++++++++----------------
 js/views/Bookmarks.js         |  30 +++---
 js/views/BulkActions.js       | 185 +++++++++++++++++----------------
 js/views/Content.js           | 137 +++++++++++++------------
 js/views/EmptyBookmarks.js    |  16 +--
 js/views/MobileNav.js         |  30 +++---
 js/views/Navigation.js        |  50 ++++-----
 js/views/SearchController.js  |  66 ++++++------
 js/views/Settings.js          | 187 +++++++++++++++++-----------------
 js/views/TagsManagement.js    | 116 +++++++++++----------
 js/views/TagsManagementTag.js | 182 ++++++++++++++++-----------------
 js/views/TagsNavigation.js    |  14 +--
 js/views/TagsNavigationTag.js |  50 ++++-----
 js/views/TagsSelection.js     | 114 ++++++++++-----------
 25 files changed, 1037 insertions(+), 1046 deletions(-)

diff --git a/js/Application.js b/js/Application.js
index 07375bb99..e3cabe21f 100644
--- a/js/Application.js
+++ b/js/Application.js
@@ -1,58 +1,58 @@
-import Backbone from 'backbone'
-import Bookmarks from './models/Bookmarks'
-import Tag from './models/Tag'
-import Tags from './models/Tags'
-import Router from './Router'
-import AppView from './views/App'
+import Backbone from 'backbone';
+import Bookmarks from './models/Bookmarks';
+import Tag from './models/Tag';
+import Tags from './models/Tags';
+import Router from './Router';
+import AppView from './views/App';
 
-const Marionette = Backbone.Marionette
+const Marionette = Backbone.Marionette;
 
 export default Marionette.Application.extend({
-  region: '#content'
-, onBeforeStart: function() {
-    var that = this
-    this.bookmarks = new Bookmarks
-    this.tags = new Tags
-    this.tags.fetch({
-	  data: {count: true}
-    , success: function() {
-        // we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
-        that.listenTo(that.tags, 'sync', that.onTagChanged)
-        that.listenTo(that.tags, 'add', that.onTagChanged)
-        that.listenTo(that.tags, 'remove', that.onTagChanged)
-      }
-    })
-    this.listenTo(this.bookmarks, 'sync', this.onBookmarkTagsChanged)
+	region: '#content',
+	onBeforeStart: function() {
+		var that = this;
+		this.bookmarks = new Bookmarks;
+		this.tags = new Tags;
+		this.tags.fetch({
+			data: {count: true},
+			success: function() {
+				// we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
+				that.listenTo(that.tags, 'sync', that.onTagChanged);
+				that.listenTo(that.tags, 'add', that.onTagChanged);
+				that.listenTo(that.tags, 'remove', that.onTagChanged);
+			}
+		});
+		this.listenTo(this.bookmarks, 'sync', this.onBookmarkTagsChanged);
 
-    this.router = new Router({app: this})
-  }
-, onStart: function() {
-    this.showView(new AppView({app: this}));
-    Backbone.history.start();
-  }
-, onTagChanged: function(tag) {
-    var that = this
-    if (!(tag instanceof Tag)) return // we can also receive 'sync' events from the collection, which we don't want here
-    if (this.bookmarkChanged) return this.bookmarkChanged = false // set to true by onBookmarkTagsChanged
-    this.tagChanged = true
+		this.router = new Router({app: this});
+	},
+	onStart: function() {
+		this.showView(new AppView({app: this}));
+		Backbone.history.start();
+	},
+	onTagChanged: function(tag) {
+		var that = this;
+		if (!(tag instanceof Tag)) return; // we can also receive 'sync' events from the collection, which we don't want here
+		if (this.bookmarkChanged) return this.bookmarkChanged = false; // set to true by onBookmarkTagsChanged
+		this.tagChanged = true;
 
-    // we need to wait 'till the tag change has been acknowledged by the server
-    setTimeout(function() {
-      that.bookmarks
-      .filter(function(bm) {
-        return bm.get('tags').some(function(t) {
-          return t === tag.get('name') || t === tag.previous('name')
-        })
-      })
-      .forEach(function(bm) {
-        bm.fetch()
-      })
-    }, 100)
-  }
-, onBookmarkTagsChanged: function() {
-    var that = this
-    if (this.tagChanged === true) return this.tagChanged = false
-    this.bokmarkChanged = true
-    that.tags.fetch({data: {count: true}}) // we listen to 'sync', so we can fetch immediately
-  }
+		// we need to wait 'till the tag change has been acknowledged by the server
+		setTimeout(function() {
+			that.bookmarks
+				.filter(function(bm) {
+					return bm.get('tags').some(function(t) {
+						return t === tag.get('name') || t === tag.previous('name');
+					});
+				})
+				.forEach(function(bm) {
+					bm.fetch();
+				});
+		}, 100);
+	},
+	onBookmarkTagsChanged: function() {
+		var that = this;
+		if (this.tagChanged === true) return this.tagChanged = false;
+		this.bokmarkChanged = true;
+		that.tags.fetch({data: {count: true}}); // we listen to 'sync', so we can fetch immediately
+	}
 });
diff --git a/js/Router.js b/js/Router.js
index 0bfc370ba..57409559b 100644
--- a/js/Router.js
+++ b/js/Router.js
@@ -1,57 +1,53 @@
-import Backbone from 'backbone'
-import Bookmarks from './models/Bookmarks'
-import Tags from './models/Tags'
-import Router from './Router'
-import AppView from './views/App'
+import Backbone from 'backbone';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.AppRouter.extend({
-  controller: {
-    index: function() {
-      setTimeout(function(){
-        Backbone.history.navigate('all', {trigger: true})
-      }, 1)
-    }
-  , all: function() {
-      this.app.bookmarks.fetch({ 
-        data: {page: -1}
-	  })
-      Radio.channel('nav').trigger('navigate', 'all')
-    }
-  , favorites: function() {
-      Radio.channel('nav').trigger('navigate', 'favorites')
-    }
-  , shared: function() {
-      this.app.bookmarks.fetch({ 
-        data: {page: -1}
-	  })
-      Radio.channel('nav').trigger('navigate', 'shared')
-    }
-  , tags: function(tagString) {
-      var tags = tagString? tagString.split(',').map(decodeURIComponent) : [] 
-      this.app.bookmarks.fetch({
-        data: {tags: tags, page: -1}
-      })
-      Radio.channel('nav').trigger('navigate', 'tags', tags)
-    }
-  , search: function(query) {
-      this.app.bookmarks.fetch({
-        data: {search: decodeURIComponent(query).split(' '), page: -1}
-      })
-      Radio.channel('nav').trigger('navigate', 'search', query)
-    }
-  }
-, appRoutes: {
-    '': 'index'
-  , 'all': 'all'
-  , 'favorites': 'favorites'
-  , 'shared': 'shared'
-  , 'tags(/*tags)': 'tags'
-  , 'search/:query': 'search'
-  }
-, initialize: function(options) {
-    this.controller.app = options.app
-  }
-})
+	controller: {
+		index: function() {
+			setTimeout(function(){
+				Backbone.history.navigate('all', {trigger: true});
+			}, 1);
+		},
+		all: function() {
+			this.app.bookmarks.fetch({ 
+				data: {page: -1}
+			});
+			Radio.channel('nav').trigger('navigate', 'all');
+		},
+		favorites: function() {
+			Radio.channel('nav').trigger('navigate', 'favorites');
+		},
+		shared: function() {
+			this.app.bookmarks.fetch({ 
+				data: {page: -1}
+			});
+			Radio.channel('nav').trigger('navigate', 'shared');
+		},
+		tags: function(tagString) {
+			var tags = tagString? tagString.split(',').map(decodeURIComponent) : []; 
+			this.app.bookmarks.fetch({
+				data: {tags: tags, page: -1}
+			});
+			Radio.channel('nav').trigger('navigate', 'tags', tags);
+		},
+		search: function(query) {
+			this.app.bookmarks.fetch({
+				data: {search: decodeURIComponent(query).split(' '), page: -1}
+			});
+			Radio.channel('nav').trigger('navigate', 'search', query);
+		}
+	},
+	appRoutes: {
+		'': 'index',
+		'all': 'all',
+		'favorites': 'favorites',
+		'shared': 'shared',
+		'tags(/*tags)': 'tags',
+		'search/:query': 'search'
+	},
+	initialize: function(options) {
+		this.controller.app = options.app;
+	}
+});
diff --git a/js/bookmarklet.js b/js/bookmarklet.js
index bd5895748..c3b54e154 100644
--- a/js/bookmarklet.js
+++ b/js/bookmarklet.js
@@ -16,14 +16,14 @@ function decreaseAjaxCallCount() {
 
 function updateLoadingAnimation() {
 	if (ajaxCallCount === 0) {
-		$("#add_form_loading").css("visibility", "hidden");
+		$('#add_form_loading').css('visibility', 'hidden');
 	} else {
-		$("#add_form_loading").css("visibility", "visible");
+		$('#add_form_loading').css('visibility', 'visible');
 	}
 }
 
 $(document).ready(function () {
-	$(".submit").click(function () {
+	$('.submit').click(function () {
 		increaseAjaxCallCount();
 
 		var endpoint = 'bookmark';
@@ -39,8 +39,8 @@ $(document).ready(function () {
 		$('.tagit-choice .tagit-label').each(function() {
 			tags += '&item[tags][]='+$(this).text();
 		});
-		var dataString = 'url=' + $("input#url").val() + '&description=' +
-			$("textarea#description").val() + '&title=' + $("input#title").val() + tags + id;
+		var dataString = 'url=' + $('input#url').val() + '&description=' +
+			$('textarea#description').val() + '&title=' + $('input#title').val() + tags + id;
 		$.ajax({
 			type: method,
 			url: endpoint,
@@ -50,13 +50,13 @@ $(document).ready(function () {
 			},
 			success: function (data) {
 				if (data.status === 'success') {
-					OC.dialogs.message("Bookmark added.", "Success", undefined, [], undefined, true)
+					OC.dialogs.message('Bookmark added.', 'Success', undefined, [], undefined, true);
 					_.delay(function() {
 						window.close();
 					}, 1e3);
 				} else {
-					OC.dialogs.alert(t("bookmarks", "Some Error happened."),
-							t("bookmarks", "Error"), null, true);
+					OC.dialogs.alert(t('bookmarks', 'Some Error happened.'),
+						t('bookmarks', 'Error'), null, true);
 				}
 			}
 		});
diff --git a/js/index.js b/js/index.js
index 8e3e5d907..b3f77b68e 100644
--- a/js/index.js
+++ b/js/index.js
@@ -1,38 +1,38 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Marionette from 'backbone.marionette'
-import select2 from 'select2'
-import Tag from './models/Tag'
-import Tags from './models/Tags'
-import App from './Application'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Marionette from 'backbone.marionette';
+import select2 from 'select2';
+import Tag from './models/Tag';
+import Tags from './models/Tags';
+import App from './Application';
 
-var _sync = Backbone.sync
+var _sync = Backbone.sync;
 Backbone.sync = function(method, model, options) {
-  var overrideOptions = {
-   success: function(json) {
-      console.log(json)
-      if (!(model instanceof Tags)) {
-        options.success(json.item || json.data)
-      } else {
-        options.success(json)
-      }
-    }
-  , error: function() {
-      console.log(arguments)
-    }
-  , headers: {
-      'requesttoken': oc_requesttoken
-    }
-  }
-  if (method === 'update' && model instanceof Tag) {
-    overrideOptions.url = model.urlRoot+'/'+model.previous('name') 
-  }
-  _sync(method, model, _.extend({}, options, overrideOptions))
-}
+	var overrideOptions = {
+		success: function(json) {
+			console.log(json);
+			if (!(model instanceof Tags)) {
+				options.success(json.item || json.data);
+			} else {
+				options.success(json);
+			}
+		},
+		error: function() {
+			console.log(arguments);
+		},
+		headers: {
+			'requesttoken': oc_requesttoken
+		}
+	};
+	if (method === 'update' && model instanceof Tag) {
+		overrideOptions.url = model.urlRoot+'/'+model.previous('name'); 
+	}
+	_sync(method, model, _.extend({}, options, overrideOptions));
+};
 
 // init
 
-var app = new App()
+var app = new App();
 $(function() {
-  app.start()
-})
+	app.start();
+});
diff --git a/js/models/Bookmark.js b/js/models/Bookmark.js
index 05568aa46..3663b9f90 100644
--- a/js/models/Bookmark.js
+++ b/js/models/Bookmark.js
@@ -1,5 +1,5 @@
-import Backbone from 'backbone'
+import Backbone from 'backbone';
 
 export default Backbone.Model.extend({
-  urlRoot: 'bookmark'
-})
+	urlRoot: 'bookmark'
+});
diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
index 8bf674483..c36734761 100644
--- a/js/models/Bookmarks.js
+++ b/js/models/Bookmarks.js
@@ -1,7 +1,7 @@
-import Backbone from 'backbone'
-import Bookmark from './Bookmark'
+import Backbone from 'backbone';
+import Bookmark from './Bookmark';
 
 export default Backbone.Collection.extend({
-  model: Bookmark
-, url: 'bookmark'
-})
+	model: Bookmark,
+	url: 'bookmark'
+});
diff --git a/js/models/Tag.js b/js/models/Tag.js
index 844af4826..78999f55e 100644
--- a/js/models/Tag.js
+++ b/js/models/Tag.js
@@ -1,6 +1,6 @@
-import Backbone from 'backbone'
+import Backbone from 'backbone';
 
 export default Backbone.Model.extend({
-  idAttribute: 'name'
-, urlRoot: 'tag'
-})
+	idAttribute: 'name',
+	urlRoot: 'tag'
+});
diff --git a/js/models/Tags.js b/js/models/Tags.js
index 6b4df5af6..bcdb4f026 100644
--- a/js/models/Tags.js
+++ b/js/models/Tags.js
@@ -1,10 +1,10 @@
-import Backbone from 'backbone'
-import Tag from './Tag'
+import Backbone from 'backbone';
+import Tag from './Tag';
 
 var Tags = Backbone.Collection.extend({
-  model: Tag
-, comparator: function(t) {return -t.get('count')}
-, url: 'tag'
-})
+	model: Tag,
+	comparator: function(t) {return -t.get('count');},
+	url: 'tag'
+});
 
-export default Tags
+export default Tags;
diff --git a/js/views/AddBookmark.js b/js/views/AddBookmark.js
index af02aa813..30c4e662a 100644
--- a/js/views/AddBookmark.js
+++ b/js/views/AddBookmark.js
@@ -1,77 +1,77 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Bookmark from '../models/Bookmark'
-import templateString from '../templates/AddBookmark.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Bookmark from '../models/Bookmark';
+import templateString from '../templates/AddBookmark.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  template: _.template(templateString)
-, className: 'add-bookmark'
-, tagName: 'ul'
-, events: {
-    'click @ui.link': 'activate'
-  , 'click @ui.button': 'submit'
-  , 'keydown @ui.input': 'onKeydown'
-  , 'blur @ui.input': 'deactivate'
-  }
-, ui: {
-    'link': '.link a'
-  , 'linkEntry': '.link'
-  , 'formEntry': '.form'
-  , 'input': 'input'
-  , 'button': 'button'
-  }
-, activate: function() {
-    this.getUI('linkEntry').hide()
-    this.getUI('formEntry').show()
-    this.getUI('input').focus()
-  }
-, deactivate: function() {
-    this.getUI('linkEntry').show()
-    this.getUI('formEntry').hide()
-    this.getUI('input').val('')
-  }
-, onKeydown: function(e) {
-    if (e.which != 13) return
-    // Enter
-    this.submit()
-  }
-, submit: function(e) {
-    var $input = this.getUI('input')
-    if (this.pending || $input.val() === '') return
-    var url = $input.val()
-    var bm = new Bookmark({url: url})
-    this.setPending(true)
-    var that = this
-    bm.save(null,{
-      success: function() {
-	    // needed in order for the route to be revaluated when it's already active
-        Backbone.history.navigate('dummyroute')
-        Backbone.history.navigate('all', {trigger: true})
-        that.setPending(false)
-        that.deactivate()
-      }
-    , error: function() {
-        that.setPending(false)
-        that.getUI('button').removeClass('icon-add')
-        that.getUI('button').addClass('icon-error-color')
-      }
-    })
-  }
-, setPending: function(pending) {
-    if (pending) {
-      this.getUI('button').removeClass('icon-add')
-      this.getUI('button').removeClass('icon-error-color')
-      this.getUI('button').addClass('icon-loading-small')
-      this.getUI('button').prop('disabled', true)
-    }else {
-      this.getUI('button').removeClass('icon-error-color')
-      this.getUI('button').addClass('icon-add')
-      this.getUI('button').removeClass('icon-loading-small')
-      this.getUI('button').prop('disabled', false) 
-    }
-    this.pending = pending
-  }
-})
+	template: _.template(templateString),
+	className: 'add-bookmark',
+	tagName: 'ul',
+	events: {
+		'click @ui.link': 'activate',
+		'click @ui.button': 'submit',
+		'keydown @ui.input': 'onKeydown',
+		'blur @ui.input': 'deactivate'
+	},
+	ui: {
+		'link': '.link a',
+		'linkEntry': '.link',
+		'formEntry': '.form',
+		'input': 'input',
+		'button': 'button'
+	},
+	activate: function() {
+		this.getUI('linkEntry').hide();
+		this.getUI('formEntry').show();
+		this.getUI('input').focus();
+	},
+	deactivate: function() {
+		this.getUI('linkEntry').show();
+		this.getUI('formEntry').hide();
+		this.getUI('input').val('');
+	},
+	onKeydown: function(e) {
+		if (e.which != 13) return;
+		// Enter
+		this.submit();
+	},
+	submit: function(e) {
+		var $input = this.getUI('input');
+		if (this.pending || $input.val() === '') return;
+		var url = $input.val();
+		var bm = new Bookmark({url: url});
+		this.setPending(true);
+		var that = this;
+		bm.save(null,{
+			success: function() {
+				// needed in order for the route to be revaluated when it's already active
+				Backbone.history.navigate('dummyroute');
+				Backbone.history.navigate('all', {trigger: true});
+				that.setPending(false);
+				that.deactivate();
+			},
+			error: function() {
+				that.setPending(false);
+				that.getUI('button').removeClass('icon-add');
+				that.getUI('button').addClass('icon-error-color');
+			}
+		});
+	},
+	setPending: function(pending) {
+		if (pending) {
+			this.getUI('button').removeClass('icon-add');
+			this.getUI('button').removeClass('icon-error-color');
+			this.getUI('button').addClass('icon-loading-small');
+			this.getUI('button').prop('disabled', true);
+		}else {
+			this.getUI('button').removeClass('icon-error-color');
+			this.getUI('button').addClass('icon-add');
+			this.getUI('button').removeClass('icon-loading-small');
+			this.getUI('button').prop('disabled', false); 
+		}
+		this.pending = pending;
+	}
+});
diff --git a/js/views/App.js b/js/views/App.js
index 358dcfa06..491217362 100644
--- a/js/views/App.js
+++ b/js/views/App.js
@@ -1,53 +1,53 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import SearchController from './SearchController'
-import AddBookmarkView from './AddBookmark'
-import NavigationView from './Navigation'
-import TagsManagementView from './TagsManagement'
-import ContentView from './Content'
-import SettingsView from './Settings'
-import templateString from '../templates/App.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import SearchController from './SearchController';
+import AddBookmarkView from './AddBookmark';
+import NavigationView from './Navigation';
+import TagsManagementView from './TagsManagement';
+import ContentView from './Content';
+import SettingsView from './Settings';
+import templateString from '../templates/App.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  template: _.template(templateString)
-, regions: {
-    'addBookmarks':  {
-      el: '#add-bookmark-slot'
-    , replaceElement: true
-    }
-  , 'navigation': {
-      el: '#navigation-slot'
-    , replaceElement: true
-    }
-  , 'content': {
-      el: '#content-slot'
-    , replaceElement: true
-    }
-  , 'tags': {
-      el: '#favorite-tags-slot'
-    , replaceElement: true
-    }
-  , 'settings': {
-      el: '#settings-slot'
-    , replaceElement: true
-    }
-  }
-, initialize: function(options) {
-    this.app = options.app
-    this.searchController = new SearchController
+	template: _.template(templateString),
+	regions: {
+		'addBookmarks':  {
+			el: '#add-bookmark-slot',
+			replaceElement: true
+		},
+		'navigation': {
+			el: '#navigation-slot',
+			replaceElement: true
+		},
+		'content': {
+			el: '#content-slot',
+			replaceElement: true
+		},
+		'tags': {
+			el: '#favorite-tags-slot',
+			replaceElement: true
+		},
+		'settings': {
+			el: '#settings-slot',
+			replaceElement: true
+		}
+	},
+	initialize: function(options) {
+		this.app = options.app;
+		this.searchController = new SearchController;
     
-    $(window.document).click(function(e) {
-      Radio.channel('documentClicked').trigger('click', e)
-    })
-  }
-, onRender: function() {
-    this.showChildView('addBookmarks', new AddBookmarkView());
-    this.showChildView('navigation', new NavigationView);
-    this.showChildView('content', new ContentView({app: this.app})); 
-    this.showChildView('tags', new TagsManagementView({collection: this.app.tags}))
-    this.showChildView('settings', new SettingsView())
-  }
-})
+		$(window.document).click(function(e) {
+			Radio.channel('documentClicked').trigger('click', e);
+		});
+	},
+	onRender: function() {
+		this.showChildView('addBookmarks', new AddBookmarkView());
+		this.showChildView('navigation', new NavigationView);
+		this.showChildView('content', new ContentView({app: this.app})); 
+		this.showChildView('tags', new TagsManagementView({collection: this.app.tags}));
+		this.showChildView('settings', new SettingsView());
+	}
+});
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 893f3887c..9669a1e11 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -1,83 +1,83 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Tags from '../models/Tags'
-import TagsNavigationView from './TagsNavigation'
-import templateString from '../templates/BookmarkCard.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Tags from '../models/Tags';
+import TagsNavigationView from './TagsNavigation';
+import templateString from '../templates/BookmarkCard.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  template: _.template(templateString),
-  className: "bookmark-card",
-  ui: {
-    'checkbox': '.selectbox'
-  , 'actionsToggle': '.actions .toggle'
-  , 'actionsMenu': '.actions .popovermenu'
-  },
-  regions: {
-    'tags': '.tags'
-  },
-  events: {
-    "click": "open"
-  , "click @ui.checkbox": "select"
-  , 'click @ui.actionsToggle': 'toggleActions'
-  , 'blur @ui.actionsToggle': 'closeActions'
-  , 'click .action-edit': 'actionEdit'
-  , 'click .action-delete': 'actionDelete'
-  , 'click .action-select': 'select'
-  , 'click .action-unselect': 'select'
-  },
-  initialize: function(opts) {
-    this.app = opts.app
-    this.listenTo(this.model, "change", this.render);
-    this.listenTo(this.model, "select", this.onSelect);
-    this.listenTo(this.model, "unselect", this.onUnselect);
-    this.listenTo(this.app.tags, 'sync', this.render)
-    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions) 
-  }
-, onRender: function() {
-	  var that = this
-    this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)')
-    var tags = new Tags(this.model.get('tags').map(function(id) {
-      return that.app.tags.findWhere({name: id})
-    }))
-    this.showChildView('tags', new TagsNavigationView({collection: tags}))
-    this.$('.checkbox').prop('checked', this.$el.hasClass('active'))
-  }
-, open: function(e) {
-    if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return
-    Radio.channel('details').trigger('show', this.model)
-  }
-, select: function(e) {
-    e.stopPropagation()
-    if (this.$el.hasClass('active')) {
-      this.model.trigger('unselect', this.model)
-    }else{
-      this.model.trigger('select', this.model)
-    }
-  }
-, onSelect: function() {
-    this.$el.addClass('active')
-    this.render()
-  }
-, onUnselect: function() {
-    this.$el.removeClass('active')
-    this.render()
-  }
-, toggleActions: function(e) {
-    this.getUI('actionsMenu').toggleClass('open')
-    this.$el.toggleClass('actions-open')
-  }
-, closeActions: function(e) {
-    if (e.target === this.getUI('actionsToggle')[0]) return
-    this.getUI('actionsMenu').removeClass('open')
-    this.$el.removeClass('actions-open')
-  }
-, actionDelete: function() {
-    this.model.destroy()
-  }
-, actionEdit: function() {
-    Radio.channel('details').trigger('edit', this.model)
-  }
-})
+	template: _.template(templateString),
+	className: 'bookmark-card',
+	ui: {
+		'checkbox': '.selectbox',
+		'actionsToggle': '.actions .toggle',
+		'actionsMenu': '.actions .popovermenu'
+	},
+	regions: {
+		'tags': '.tags'
+	},
+	events: {
+		'click': 'open',
+		 'click @ui.checkbox': 'select',
+		 'click @ui.actionsToggle': 'toggleActions',
+		'blur @ui.actionsToggle': 'closeActions',
+		'click .action-edit': 'actionEdit',
+		'click .action-delete': 'actionDelete',
+		'click .action-select': 'select',
+		'click .action-unselect': 'select'
+	},
+	initialize: function(opts) {
+		this.app = opts.app;
+		this.listenTo(this.model, 'change', this.render);
+		this.listenTo(this.model, 'select', this.onSelect);
+		this.listenTo(this.model, 'unselect', this.onUnselect);
+		this.listenTo(this.app.tags, 'sync', this.render);
+		this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions); 
+	},
+	onRender: function() {
+	  var that = this;
+		this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)');
+		var tags = new Tags(this.model.get('tags').map(function(id) {
+			return that.app.tags.findWhere({name: id});
+		}));
+		this.showChildView('tags', new TagsNavigationView({collection: tags}));
+		this.$('.checkbox').prop('checked', this.$el.hasClass('active'));
+	},
+	open: function(e) {
+		if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return;
+		Radio.channel('details').trigger('show', this.model);
+	},
+	select: function(e) {
+		e.stopPropagation();
+		if (this.$el.hasClass('active')) {
+			this.model.trigger('unselect', this.model);
+		}else{
+			this.model.trigger('select', this.model);
+		}
+	},
+	onSelect: function() {
+		this.$el.addClass('active');
+		this.render();
+	},
+	onUnselect: function() {
+		this.$el.removeClass('active');
+		this.render();
+	},
+	toggleActions: function(e) {
+		this.getUI('actionsMenu').toggleClass('open');
+		this.$el.toggleClass('actions-open');
+	},
+	closeActions: function(e) {
+		if (e.target === this.getUI('actionsToggle')[0]) return;
+		this.getUI('actionsMenu').removeClass('open');
+		this.$el.removeClass('actions-open');
+	},
+	actionDelete: function() {
+		this.model.destroy();
+	},
+	actionEdit: function() {
+		Radio.channel('details').trigger('edit', this.model);
+	}
+});
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index 32897fb22..2fda1dac8 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -1,90 +1,90 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Tags from '../models/Tags'
-import TagsNavigationView from './TagsNavigation'
-import TagsSelectionView from './TagsSelection'
-import templateStringDefault from '../templates/BookmarkDetail_default.html'
-import templateStringEditing from '../templates/BookmarkDetail_editing.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Tags from '../models/Tags';
+import TagsNavigationView from './TagsNavigation';
+import TagsSelectionView from './TagsSelection';
+import templateStringDefault from '../templates/BookmarkDetail_default.html';
+import templateStringEditing from '../templates/BookmarkDetail_editing.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  getTemplate: function() {
-    if (this.editing) {
-      return this.templateEditing
-    }
-    return this.templateDefault
-  },
-  templateDefault: _.template(templateStringDefault),
-  templateEditing: _.template(templateStringEditing),
-  className: "bookmark-detail",
-  regions: {
-    'tags': {
-      el: '.tags'
-    }
-  },
-  ui: {
-    'close': '> .close'
-  , 'edit': '.edit'
-  , 'delete': '.delete'
-  },
-  events: {
-    'click @ui.close': 'close'
-  , 'click @ui.edit': 'edit'
-  , 'click @ui.delete': 'delete'
-  , 'click .submit': 'submit'
-  , 'click .cancel': 'cancel'
-  },
-  initialize: function(opts) {
-    this.app = opts.app
-    this.listenTo(this.model, "change", this.render);
-    this.listenTo(this.app.tags, 'sync', this.render)
-  },
-  onRender: function() {
-    var that = this
-    this.tags = new Tags(this.model.get('tags').map(function(id) {
-      return that.app.tags.findWhere({name: id})
-    }))
-    if (this.editing) {
-      this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }))
-    }else{
-      this.showChildView('tags', new TagsNavigationView({collection: this.tags}))
-    }
-  },
-  close: function() {
-    Radio.channel('details').trigger('close')
-  },
-  setEditing: function(isEditing) {
-    if (isEditing) {
-      this.editing = true
-      this.$el.addClass('editing')
-    }else{
-      this.editing = false
-      this.$el.removeClass('editing')
-    }
-    this.render()
-  },
-  edit: function() {
-    this.setEditing(true)
-  }
-, submit: function() {
-    var that = this
-    this.model.set({
-      'title': this.$('.input-title').val()
-    , 'url': this.$('.input-url').val()
-    , 'tags': this.tags.pluck('name')
-    , 'description': this.$('.input-desc').val()
-    })
-    this.model.save({wait: true})
-    this.model.once('sync', function() {
-      that.cancel()
-    })
-  }
-, cancel: function() {
-    this.setEditing(false)
-  }
-, onDestroy: function() {
-    this.close() 
-  }
-})
+	getTemplate: function() {
+		if (this.editing) {
+			return this.templateEditing;
+		}
+		return this.templateDefault;
+	},
+	templateDefault: _.template(templateStringDefault),
+	templateEditing: _.template(templateStringEditing),
+	className: 'bookmark-detail',
+	regions: {
+		'tags': {
+			el: '.tags'
+		}
+	},
+	ui: {
+		'close': '> .close',
+		'edit': '.edit',
+		'delete': '.delete'
+	},
+	events: {
+		'click @ui.close': 'close',
+		'click @ui.edit': 'edit',
+		'click @ui.delete': 'delete',
+		'click .submit': 'submit',
+		'click .cancel': 'cancel'
+	},
+	initialize: function(opts) {
+		this.app = opts.app;
+		this.listenTo(this.model, 'change', this.render);
+		this.listenTo(this.app.tags, 'sync', this.render);
+	},
+	onRender: function() {
+		var that = this;
+		this.tags = new Tags(this.model.get('tags').map(function(id) {
+			return that.app.tags.findWhere({name: id});
+		}));
+		if (this.editing) {
+			this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }));
+		}else{
+			this.showChildView('tags', new TagsNavigationView({collection: this.tags}));
+		}
+	},
+	close: function() {
+		Radio.channel('details').trigger('close');
+	},
+	setEditing: function(isEditing) {
+		if (isEditing) {
+			this.editing = true;
+			this.$el.addClass('editing');
+		}else{
+			this.editing = false;
+			this.$el.removeClass('editing');
+		}
+		this.render();
+	},
+	edit: function() {
+		this.setEditing(true);
+	},
+	submit: function() {
+		var that = this;
+		this.model.set({
+			'title': this.$('.input-title').val(),
+			'url': this.$('.input-url').val(),
+			'tags': this.tags.pluck('name'),
+			'description': this.$('.input-desc').val()
+		});
+		this.model.save({wait: true});
+		this.model.once('sync', function() {
+			that.cancel();
+		});
+	},
+	cancel: function() {
+		this.setEditing(false);
+	},
+	onDestroy: function() {
+		this.close(); 
+	}
+});
diff --git a/js/views/Bookmarks.js b/js/views/Bookmarks.js
index 986456c1f..8bd7e7a7b 100644
--- a/js/views/Bookmarks.js
+++ b/js/views/Bookmarks.js
@@ -1,18 +1,18 @@
-import Backbone from 'backbone'
-import BookmarkCardView from './BookmarkCard'
-import EmptyBookmarksView from './EmptyBookmarks'
+import Backbone from 'backbone';
+import BookmarkCardView from './BookmarkCard';
+import EmptyBookmarksView from './EmptyBookmarks';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.CollectionView.extend({
-  className: 'bookmarks'
-, initialize: function(opts) {
-    this.app = opts.app
-  }
-, childViewOptions: function() {
-    return {app: this.app}
-  }
-, childView: function() {return BookmarkCardView}
-, emptyView: function() {return EmptyBookmarksView}
-})
+	className: 'bookmarks',
+	initialize: function(opts) {
+		this.app = opts.app;
+	},
+	childViewOptions: function() {
+		return {app: this.app};
+	},
+	childView: function() {return BookmarkCardView;},
+	emptyView: function() {return EmptyBookmarksView;}
+});
diff --git a/js/views/BulkActions.js b/js/views/BulkActions.js
index d9f380b54..e02844723 100644
--- a/js/views/BulkActions.js
+++ b/js/views/BulkActions.js
@@ -1,96 +1,95 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Tags from '../models/Tags'
-import TagsSelectionView from './TagsSelection'
-import templateString from '../templates/BulkActions.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Tags from '../models/Tags';
+import TagsSelectionView from './TagsSelection';
+import templateString from '../templates/BulkActions.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  className: 'bulk-actions'
-, template: _.template(templateString)
-, regions: {
-    'tags': {
-      el: '.tags'
-    }
-  },
-  events: {
-    'click .delete': 'delete'
-  , 'click .select-all': 'selectAll'
-  , 'click .selection-tools .close': 'abort'
-  }
-, initialize: function(opts) {
-    this.app = opts.app
-    this.all = this.app.bookmarks
-    this.selected = opts.selected
-    this.tags = new Tags
-    this.listenTo(this.tags, 'remove', this.onTagRemoved)
-    this.listenTo(this.tags, 'add', this.onTagAdded)
-    this.listenTo(this.selected, 'remove', this.onReduceSelection)
-    this.listenTo(this.selected, 'add', this.onExtendSelection)
-  }
-, onRender: function() {
-    this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }))
-  }
-, updateTags: function() {
-    var that = this
-    this.triggeredByAlgo = true
-    this.tags.reset(
-      _.intersection.apply(_, this.selected.pluck('tags'))
-        .map(function(name) {
-        return that.app.tags.get(name)
-      })
-    )
-    this.triggeredByAlgo = false
-  }
-, onReduceSelection: function() {
-    if (this.selected.length == 0) {
-	    this.$el.removeClass('active')
-    }
-    this.updateTags()
-  }
-, onExtendSelection: function() {
-    if (this.selected.length == 1) {
-      this.$el.addClass('active')
-    }
-    this.updateTags()
-  }
-, delete: function() {
-    var that = this
-    this.selected.forEach(function(model) {
-      model.trigger('unselect', model)
-      model.destroy({
-        error: function() {
-          Backbone.history.navigate('all', {trigger: true})
-        }
-      })
-    })
-  }
-, onTagAdded: function(tag) {
-    if (this.triggeredByAlgo) return
-    this.selected.forEach(function(model) {
-      var tags = model.get('tags')
-      model.set('tags', _.union(tags, [tag.get('name')]))
-      model.save()
-    }) 
-  }
-, onTagRemoved: function(tag) {
-    if (this.triggeredByAlgo) return
-    this.selected.forEach(function(model) {
-      var tags = model.get('tags')
-      model.set('tags', _.without(tags, tag.get('name')))
-      model.save()
-    }) 
-  }
-, selectAll: function() {
-    this.all.forEach(function(model) {
-      model.trigger('select', model) 
-    })
-  }
-, abort: function() {
-    this.selected.models.slice().forEach(function(model) {
-      model.trigger('unselect', model)
-    })
-  }
-})
+	className: 'bulk-actions',
+	template: _.template(templateString),
+	regions: {
+		'tags': {
+			el: '.tags'
+		}
+	},
+	events: {
+		'click .delete': 'delete',
+		'click .select-all': 'selectAll',
+		'click .selection-tools .close': 'abort'
+	},
+	initialize: function(opts) {
+		this.app = opts.app;
+		this.all = this.app.bookmarks;
+		this.selected = opts.selected;
+		this.tags = new Tags;
+		this.listenTo(this.tags, 'remove', this.onTagRemoved);
+		this.listenTo(this.tags, 'add', this.onTagAdded);
+		this.listenTo(this.selected, 'remove', this.onReduceSelection);
+		this.listenTo(this.selected, 'add', this.onExtendSelection);
+	},
+	onRender: function() {
+		this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }));
+	},
+	updateTags: function() {
+		var that = this;
+		this.triggeredByAlgo = true;
+		this.tags.reset(
+			_.intersection.apply(_, this.selected.pluck('tags'))
+				.map(function(name) {
+					return that.app.tags.get(name);
+				})
+		);
+		this.triggeredByAlgo = false;
+	},
+	onReduceSelection: function() {
+		if (this.selected.length == 0) {
+			this.$el.removeClass('active');
+		}
+		this.updateTags();
+	},
+	onExtendSelection: function() {
+		if (this.selected.length == 1) {
+			this.$el.addClass('active');
+		}
+		this.updateTags();
+	},
+	delete: function() {
+		this.selected.forEach(function(model) {
+			model.trigger('unselect', model);
+			model.destroy({
+				error: function() {
+					Backbone.history.navigate('all', {trigger: true});
+				}
+			});
+		});
+	},
+	onTagAdded: function(tag) {
+		if (this.triggeredByAlgo) return;
+		this.selected.forEach(function(model) {
+			var tags = model.get('tags');
+			model.set('tags', _.union(tags, [tag.get('name')]));
+			model.save();
+		}); 
+	},
+	onTagRemoved: function(tag) {
+		if (this.triggeredByAlgo) return;
+		this.selected.forEach(function(model) {
+			var tags = model.get('tags');
+			model.set('tags', _.without(tags, tag.get('name')));
+			model.save();
+		}); 
+	},
+	selectAll: function() {
+		this.all.forEach(function(model) {
+			model.trigger('select', model); 
+		});
+	},
+	abort: function() {
+		this.selected.models.slice().forEach(function(model) {
+			model.trigger('unselect', model);
+		});
+	}
+});
diff --git a/js/views/Content.js b/js/views/Content.js
index 09fcffc3b..726684165 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -1,73 +1,72 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Bookmarks from '../models/Bookmarks'
-import MobileNavView from './MobileNav'
-import BulkActionsView from './BulkActions'
-import BookmarksView from './Bookmarks'
-import BookmarkDetailView from './BookmarkDetail'
-import templateString from '../templates/Content.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Bookmarks from '../models/Bookmarks';
+import MobileNavView from './MobileNav';
+import BulkActionsView from './BulkActions';
+import BookmarksView from './Bookmarks';
+import BookmarkDetailView from './BookmarkDetail';
+import templateString from '../templates/Content.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  template: _.template(templateString)
-, regions: {
-    'mobileNav': {
-      el: '#mobile-nav-slot'
-    , replaceElement: true
-    }
-  , 'bulkActions': {
-      el: '#bulk-actions-slot'
-    , replaceElement: true
-    }
-  , 'viewBookmarks': {
-      el: '#view-bookmarks-slot'
-    , replaceElement: true
-    }
-  , 'bookmarkDetail': {
-      el: '#bookmark-detail-slot'
-    , replaceElement: true
-    }
-  }
-, initialize: function(options) {
-    this.app = options.app
-    this.bookmarks = this.app.bookmarks
-    this.selected = new Bookmarks
-    this.listenTo(this.bookmarks, 'select', this.onSelect)
-    this.listenTo(this.bookmarks, 'unselect', this.onUnselect)
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
-    this.listenTo(Radio.channel('details'), 'show', this.onShowDetails)
-    this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails)
-    this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails)
-  }
-, onRender: function() {
-    this.showChildView('mobileNav', new MobileNavView())
-    this.showChildView('bulkActions', new BulkActionsView({selected: this.selected, app: this.app}))
-    this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks, app: this.app}));
-  }
-, onSelect: function(model) {
-    if (this.selected.length == 0) {
-        this.$el.addClass('selection-active')
-    }
-    this.selected.add(model)
-  }
-, onUnselect: function(model) {
-    if (this.selected.length == 1) {
-      this.$el.removeClass('selection-active')
+	template: _.template(templateString),
+	regions: {
+		'mobileNav': {
+			el: '#mobile-nav-slot',
+			replaceElement: true
+		},
+		'bulkActions': {
+			el: '#bulk-actions-slot',
+			replaceElement: true
+		},
+		'viewBookmarks': {
+			el: '#view-bookmarks-slot',
+			replaceElement: true
+		},
+		'bookmarkDetail': {
+			el: '#bookmark-detail-slot',
+			replaceElement: true
+		}
+	},
+	initialize: function(options) {
+		this.app = options.app;
+		this.bookmarks = this.app.bookmarks;
+		this.selected = new Bookmarks;
+		this.listenTo(this.bookmarks, 'select', this.onSelect);
+		this.listenTo(this.bookmarks, 'unselect', this.onUnselect);
+		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate);
+		this.listenTo(Radio.channel('details'), 'show', this.onShowDetails);
+		this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails);
+		this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails);
+	},
+	onRender: function() {
+		this.showChildView('mobileNav', new MobileNavView());
+		this.showChildView('bulkActions', new BulkActionsView({selected: this.selected, app: this.app}));
+		this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks, app: this.app}));
+	},
+	onSelect: function(model) {
+		if (this.selected.length == 0) {
+			this.$el.addClass('selection-active');
+		}
+		this.selected.add(model);
+	},
+	onUnselect: function(model) {
+		if (this.selected.length == 1) {
+			this.$el.removeClass('selection-active');
+		}
+		this.selected.remove(model);
+	},
+	onShowDetails: function(model) {
+		var view = new BookmarkDetailView({model: model, app: this.app});
+		this.showChildView('bookmarkDetail', view);
+	},
+	onEditDetails: function(model) {
+		this.onShowDetails(model);
+		this.getRegion('bookmarkDetail').currentView.setEditing(true);
+	},
+	onCloseDetails: function() {
+		this.detachChildView('bookmarkDetail');
 	}
-    this.selected.remove(model)
-  }
-, onShowDetails: function(model) {
-    var that = this
-    var view = new BookmarkDetailView({model: model, app: this.app})
-    this.showChildView('bookmarkDetail', view)
-  }
-, onEditDetails: function(model) {
-    this.onShowDetails(model)
-    this.getRegion('bookmarkDetail').currentView.setEditing(true)
-  }
-, onCloseDetails: function() {
-    this.detachChildView('bookmarkDetail')
-  }
-})
+});
diff --git a/js/views/EmptyBookmarks.js b/js/views/EmptyBookmarks.js
index 73f3c756d..9f13305ef 100644
--- a/js/views/EmptyBookmarks.js
+++ b/js/views/EmptyBookmarks.js
@@ -1,11 +1,11 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import templateString from '../templates/EmptyBookmarks.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import templateString from '../templates/EmptyBookmarks.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  template: _.template(templateString)
-, className: 'bookmarks-empty'
-})
+	template: _.template(templateString),
+	className: 'bookmarks-empty'
+});
diff --git a/js/views/MobileNav.js b/js/views/MobileNav.js
index cf0b37273..aa167c5f9 100644
--- a/js/views/MobileNav.js
+++ b/js/views/MobileNav.js
@@ -1,18 +1,18 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import templateString from '../templates/MobileNav.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import templateString from '../templates/MobileNav.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  className: 'mobile-nav'
-, template: _.template(templateString)
-, events: {
-    'click .toggle-menu': 'toggleMenu'
-  }
-, toggleMenu: function(e) {
-    e.preventDefault()
-    $('body').toggleClass('mobile-nav-open')
-  }
-})
+	className: 'mobile-nav',
+	template: _.template(templateString),
+	events: {
+		'click .toggle-menu': 'toggleMenu'
+	},
+	toggleMenu: function(e) {
+		e.preventDefault();
+		$('body').toggleClass('mobile-nav-open');
+	}
+});
diff --git a/js/views/Navigation.js b/js/views/Navigation.js
index 2852f9b82..a943c4d7c 100644
--- a/js/views/Navigation.js
+++ b/js/views/Navigation.js
@@ -1,28 +1,28 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import templateString from '../templates/Navigation.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import templateString from '../templates/Navigation.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  className: 'navigation'
-, tagName: 'ul'
-, template: _.template(templateString)
-, events: {
-    'click .all': 'onClick'
-  , 'click .favorites': 'onClick'
-  , 'click .shared': 'onClick'
-  }
-, initialize: function() {
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
-  }
-, onClick: function(e) {
-    e.preventDefault()
-    Backbone.history.navigate(e.target.parentNode.dataset.id, {trigger: true})
-  }
-, onNavigate: function(category) {
-    $('.active', this.$el).removeClass('active')
-    if (category && this.$('[data-id='+category+']').length) this.$('[data-id='+category+']').addClass('active')
-  }
-})
+	className: 'navigation',
+	tagName: 'ul',
+	template: _.template(templateString),
+	events: {
+		'click .all': 'onClick',
+		'click .favorites': 'onClick',
+		'click .shared': 'onClick'
+	},
+	initialize: function() {
+		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this);
+	},
+	onClick: function(e) {
+		e.preventDefault();
+		Backbone.history.navigate(e.target.parentNode.dataset.id, {trigger: true});
+	},
+	onNavigate: function(category) {
+		$('.active', this.$el).removeClass('active');
+		if (category && this.$('[data-id='+category+']').length) this.$('[data-id='+category+']').addClass('active');
+	}
+});
diff --git a/js/views/SearchController.js b/js/views/SearchController.js
index b8d1b8dfa..53ad678cb 100644
--- a/js/views/SearchController.js
+++ b/js/views/SearchController.js
@@ -1,36 +1,36 @@
-import Backbone from 'backbone'
+import Backbone from 'backbone';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  el: '#searchbox'
-, initialize: function() {
-    var that = this
-    // register a dummy search plugin
-    OC.Plugins.register('OCA.Search', { attach: function(search) {
-        search.setFilter('bookmarks', function(query) {
-          that.submit(query)
-        })
-      }
-    });
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
-  }
-, events: {
-    'keydown': 'onKeydown'
-  }
-, onRender: function() {
-    this.$el.show()
-  }
-, onNavigate: function(route, query) {
-    if (route === 'search/:query') this.$el.val(decodeURIComponent(query))
-  }
-, submit: function(query) {
-    if (query !== '') {
-      query = encodeURIComponent(query)
-      Backbone.history.navigate('search/'+query, {trigger: true})
-    }else {
-      Backbone.history.navigate('all', {trigger: true})
-    }
-  }
-})
+	el: '#searchbox',
+	initialize: function() {
+		var that = this;
+		// register a dummy search plugin
+		OC.Plugins.register('OCA.Search', { attach: function(search) {
+			search.setFilter('bookmarks', function(query) {
+				that.submit(query);
+			});
+		}
+		});
+		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this);
+	},
+	events: {
+		'keydown': 'onKeydown'
+	},
+	onRender: function() {
+		this.$el.show();
+	},
+	onNavigate: function(route, query) {
+		if (route === 'search/:query') this.$el.val(decodeURIComponent(query));
+	},
+	submit: function(query) {
+		if (query !== '') {
+			query = encodeURIComponent(query);
+			Backbone.history.navigate('search/'+query, {trigger: true});
+		}else {
+			Backbone.history.navigate('all', {trigger: true});
+		}
+	}
+});
diff --git a/js/views/Settings.js b/js/views/Settings.js
index 12aad83de..5d2b09f52 100644
--- a/js/views/Settings.js
+++ b/js/views/Settings.js
@@ -1,97 +1,96 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import templateString from '../templates/Settings.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import templateString from '../templates/Settings.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  className: 'settings'
-, id: 'app-settings'
-, template: _.template(templateString)
-, ui: {
-    'content': '#app-settings-content'
-  , 'import': '.import'
-  , 'form': '.import-form'
-  , 'iframe': '.upload'
-  , 'status': '.import-status'
-  }
-, events: {
-    'click .settings-button': 'open'
-  , 'click .import-facade': 'importTrigger'
-  , 'change @ui.import': 'importSubmit'
-  , 'load @ui.iframe': 'importResult'
-  , 'click .export': 'exportTrigger'
-  }
-, open: function(e) {
-    e.preventDefault()
-    this.getUI('content').slideToggle()
-  }
-, importTrigger: function(e) {
-    e.preventDefault()
-    this.getUI('import').click()
-  }
-, importSubmit: function(e) {
-    var that = this
-    e.preventDefault()
-    if (typeof(window.fetch) !== 'undefined') {
-      // If we have fetch() do a little hapiness dance and go!
-      var data = new FormData()
-      data.append('bm_import', this.getUI('import')[0].files[0])
-      fetch(this.getUI('form').attr('action'), {
-        method: 'POST'
-      , headers: {
-          requesttoken: oc_requesttoken
-        }
-      , body: data 
-      , mode: 'same-origin'
-      , credentials: 'same-origin'
-      })
-      .then(function(res) {
-        if (!res.ok) {
-          if (res.status === 413) {
-            return {status: 'error', data: ['Selected file is too large']}
-          }
-          return {status: 'error', data: [res.statusText]} 
-        }
-        return res.json()
-      })
-      .then(function(json) {
-        that.importResult(JSON.stringify(json));
-      })
-      .catch(function(e) {
-        that.importResult(JSON.stringify({status: 'error', data: [e.message]}));
-      })
-    } else {
-      // If we don't have fetch() ask grandpa iframe to send it
-      this.getUI('iframe').load(function() {
-        that.importResult(that.getUI('iframe').contents().text());
-      })
-      this.getUI('form').submit();
-    }
-    this.getUI('status').text(t('bookmark', 'Uploading...'));
-  }
-, importResult: function (data) {
-    var data;
-    try {
-      data = $.parseJSON(data);
-    } catch (e) {
-      this.getUI('status').text(t('bookmark', 'Import error'));
-      return;
-    }
-    if (data.status == 'error') {
-      var list = $("<ul></ul>").addClass('setting_error_list');
-      console.log(data);
-      $.each(data.data, function (index, item) {
-        list.append($("<li></li>").text(item));
-      });
-      this.getUI('status').html(list);
-      return
-    }
-    this.getUI('status').text(t('bookmark', 'Import completed successfully.'));
-    Backbone.history.navigate('all', {trigger: true})
-  }
-, exportTrigger: function() {
-    window.location = 'bookmark/export?requesttoken='+oc_requesttoken
-  }
-})
+	className: 'settings',
+	id: 'app-settings',
+	template: _.template(templateString),
+	ui: {
+		'content': '#app-settings-content',
+		'import': '.import',
+		'form': '.import-form',
+		'iframe': '.upload',
+		'status': '.import-status'
+	},
+	events: {
+		'click .settings-button': 'open',
+		'click .import-facade': 'importTrigger',
+		'change @ui.import': 'importSubmit',
+		'load @ui.iframe': 'importResult',
+		'click .export': 'exportTrigger'
+	},
+	open: function(e) {
+		e.preventDefault();
+		this.getUI('content').slideToggle();
+	},
+	importTrigger: function(e) {
+		e.preventDefault();
+		this.getUI('import').click();
+	},
+	importSubmit: function(e) {
+		var that = this;
+		e.preventDefault();
+		if (typeof(window.fetch) !== 'undefined') {
+			// If we have fetch() do a little hapiness dance and go!
+			var data = new FormData();
+			data.append('bm_import', this.getUI('import')[0].files[0]);
+			fetch(this.getUI('form').attr('action'), {
+				method: 'POST',
+				headers: {
+					requesttoken: oc_requesttoken
+				},
+				body: data, 
+				mode: 'same-origin',
+				credentials: 'same-origin'
+			})
+				.then(function(res) {
+					if (!res.ok) {
+						if (res.status === 413) {
+							return {status: 'error', data: ['Selected file is too large']};
+						}
+						return {status: 'error', data: [res.statusText]}; 
+					}
+					return res.json();
+				})
+				.then(function(json) {
+					that.importResult(JSON.stringify(json));
+				})
+				.catch(function(e) {
+					that.importResult(JSON.stringify({status: 'error', data: [e.message]}));
+				});
+		} else {
+			// If we don't have fetch() ask grandpa iframe to send it
+			this.getUI('iframe').load(function() {
+				that.importResult(that.getUI('iframe').contents().text());
+			});
+			this.getUI('form').submit();
+		}
+		this.getUI('status').text(t('bookmark', 'Uploading...'));
+	},
+	importResult: function (data) {
+		try {
+			data = $.parseJSON(data);
+		} catch (e) {
+			this.getUI('status').text(t('bookmark', 'Import error'));
+			return;
+		}
+		if (data.status == 'error') {
+			var list = $('<ul></ul>').addClass('setting_error_list');
+			console.log(data);
+			$.each(data.data, function (index, item) {
+				list.append($('<li></li>').text(item));
+			});
+			this.getUI('status').html(list);
+			return;
+		}
+		this.getUI('status').text(t('bookmark', 'Import completed successfully.'));
+		Backbone.history.navigate('all', {trigger: true});
+	},
+	exportTrigger: function() {
+		window.location = 'bookmark/export?requesttoken='+oc_requesttoken;
+	}
+});
diff --git a/js/views/TagsManagement.js b/js/views/TagsManagement.js
index 8a2ec216c..15da35a55 100644
--- a/js/views/TagsManagement.js
+++ b/js/views/TagsManagement.js
@@ -1,66 +1,64 @@
-import Backbone from 'backbone'
-import Tags from '../models/Tags'
-import TagView from './TagsManagementTag'
+import Backbone from 'backbone';
+import Tags from '../models/Tags';
+import TagView from './TagsManagementTag';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.CollectionView.extend({
-  childView: TagView
-, tagName: 'ul'
-, className: 'tags-management'
-, initialize: function(options) {
-    var that = this
-     
-    this.selected = new Tags
-    this.selected.comparator = 'name'
+	childView: TagView,
+	tagName: 'ul',
+	className: 'tags-management',
+	initialize: function(options) {
+		this.selected = new Tags;
+		this.selected.comparator = 'name';
     
-    this.listenTo(this.collection, 'select', this.onSelect)
-    this.listenTo(this.collection, 'unselect', this.onUnselect)
-    this.listenTo(this.collection, 'add', this.onAdd)
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate)
-  }
-, onNavigate: function(category, tags) {
-    // reset selection (needs slice, since we pull the models out from under the loop otherwise)
-    this.selected.slice().forEach(function(t) {
-      t.trigger('unselect', t, true)
-    })
-    if (category !== 'tags') {
-      this.lastRouteTags = [] // for the below hack
-      return
-    }
+		this.listenTo(this.collection, 'select', this.onSelect);
+		this.listenTo(this.collection, 'unselect', this.onUnselect);
+		this.listenTo(this.collection, 'add', this.onAdd);
+		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate);
+	},
+	onNavigate: function(category, tags) {
+		// reset selection (needs slice, since we pull the models out from under the loop otherwise)
+		this.selected.slice().forEach(function(t) {
+			t.trigger('unselect', t, true);
+		});
+		if (category !== 'tags') {
+			this.lastRouteTags = []; // for the below hack
+			return;
+		}
 
-    var that = this
-    // select all tags passed by router
-    tags.forEach(function(tagName) {
-      var tag = that.collection.findWhere({name: tagName})
-      if (!tag) return
+		var that = this;
+		// select all tags passed by router
+		tags.forEach(function(tagName) {
+			var tag = that.collection.findWhere({name: tagName});
+			if (!tag) return;
 
-      tag.trigger('select', tag, true)
-    })
+			tag.trigger('select', tag, true);
+		});
 
-    // hack!
-    // this is for when the route is triggered before the tags are loaded
-    this.lastRouteTags = tags
-  }
-, onAdd: function(model) {
-    if (~this.lastRouteTags.indexOf(model.get('name'))) {
-      // wait for the tag view to render, so it can receive the event
-      setTimeout(function() {
-        model.trigger('select', model, true)
-      }, 1)
-      return
-    }
-  }
-, onSelect: function(model, silentRoute) {
-    this.selected.add(model)
-    if (!silentRoute) this.triggerRoute()
-  }
-, onUnselect: function(model, silentRoute) {
-    this.selected.remove(model)
-    if (!silentRoute) this.triggerRoute()
-  }
-, triggerRoute: function() {
-    Backbone.history.navigate('tags/'+this.selected.pluck('name').map(encodeURIComponent).join(','), {trigger: true})
-  }
-})
+		// hack!
+		// this is for when the route is triggered before the tags are loaded
+		this.lastRouteTags = tags;
+	},
+	onAdd: function(model) {
+		if (~this.lastRouteTags.indexOf(model.get('name'))) {
+			// wait for the tag view to render, so it can receive the event
+			setTimeout(function() {
+				model.trigger('select', model, true);
+			}, 1);
+			return;
+		}
+	},
+	onSelect: function(model, silentRoute) {
+		this.selected.add(model);
+		if (!silentRoute) this.triggerRoute();
+	},
+	onUnselect: function(model, silentRoute) {
+		this.selected.remove(model);
+		if (!silentRoute) this.triggerRoute();
+	},
+	triggerRoute: function() {
+		Backbone.history.navigate('tags/'+this.selected.pluck('name').map(encodeURIComponent).join(','), {trigger: true});
+	}
+});
diff --git a/js/views/TagsManagementTag.js b/js/views/TagsManagementTag.js
index 5f03cf310..87fde0195 100644
--- a/js/views/TagsManagementTag.js
+++ b/js/views/TagsManagementTag.js
@@ -1,94 +1,94 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import templateStringDefault from '../templates/TagsManagementTag_default.html'
-import templateStringEditing from '../templates/TagsManagementTag_editing.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import templateStringDefault from '../templates/TagsManagementTag_default.html';
+import templateStringEditing from '../templates/TagsManagementTag_editing.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  className: 'tag-man-item'
-, tagName: 'li'
-, getTemplate: function() {
-    if (this.editing) {
-      return this.templateEditing
-    }
-    return this.templateDefault
-  }
-, templateDefault: _.template(templateStringDefault)
-, templateEditing: _.template(templateStringEditing)
-, ui: {
-    'actionsMenu': '.popovermenu'
-  , 'actionsToggle': '.app-navigation-entry-utils-menu-button'
-  }
-, events: {
-    'click': 'selectSimple'
-  , 'click @ui.actionsToggle': 'toggleActions'
-  , 'click .menu-filter-add': 'actionSelect'
-  , 'click .menu-filter-remove': 'actionUnselect'
-  , 'click .menu-delete': 'actionDelete'
-  , 'click .menu-edit': 'actionEdit'
-  , 'click .action .submit': 'actionSubmit'
-  , 'click .action .cancel': 'actionCancel'
-  }
-, initialize: function() {
-    this.listenTo(this.model, 'select', this.onSelect)
-    this.listenTo(this.model, 'unselect', this.onUnselect)
-    this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions)   
-  }
-, onRender: function() {
-    if (this.selected) {
-      this.$el.addClass('active')
-    }else{
-      this.$el.removeClass('active')
-    }
-    if (this.editing) {
-      this.$('input').focus()
-    }
-  }
-, onSelect: function() {
-    this.selected = true
-    this.render()
-  }
-, onUnselect: function() {
-    this.selected = false
-    this.render()
-  }
-, selectSimple: function(e) {
-    e.preventDefault()
-    if (e && !~[ this.el, this.$('a')[0], this.$('span')[0] ].indexOf(e.target)) {
-      return
-    }
-    if (this.editing) return
-    Backbone.history.navigate('tags/'+encodeURIComponent(this.model.get('name')), {trigger: true})
-  }
-, toggleActions: function() {
-    this.getUI('actionsMenu').toggleClass('open')
-  }
-, closeActions: function(e) {
-    if (this.editing || $.contains(this.getUI('actionsToggle')[0], e.target)) return
-    this.getUI('actionsMenu').removeClass('open')
-  }
-, actionSelect: function(e) {
-    this.model.trigger('select', this.model)
-  }
-, actionUnselect: function(e) {
-    this.model.trigger('unselect', this.model)
-  }
-, actionDelete: function() {
-    this.model.destroy()
-  }
-, actionEdit: function() {
-    this.editing = true
-    this.render()
-  }
-, actionSubmit: function() {
-    this.model.set('name', this.$('input').val())
-    this.model.save()
-    this.actionCancel()
-  }
-, actionCancel: function() {
-    this.editing = false
-    this.render()
-  }
-})
+	className: 'tag-man-item',
+	tagName: 'li',
+	getTemplate: function() {
+		if (this.editing) {
+			return this.templateEditing;
+		}
+		return this.templateDefault;
+	},
+	templateDefault: _.template(templateStringDefault),
+	templateEditing: _.template(templateStringEditing),
+	ui: {
+		'actionsMenu': '.popovermenu',
+		'actionsToggle': '.app-navigation-entry-utils-menu-button'
+	},
+	events: {
+		'click': 'selectSimple',
+		'click @ui.actionsToggle': 'toggleActions',
+		'click .menu-filter-add': 'actionSelect',
+		'click .menu-filter-remove': 'actionUnselect',
+		'click .menu-delete': 'actionDelete',
+		'click .menu-edit': 'actionEdit',
+		'click .action .submit': 'actionSubmit',
+		'click .action .cancel': 'actionCancel'
+	},
+	initialize: function() {
+		this.listenTo(this.model, 'select', this.onSelect);
+		this.listenTo(this.model, 'unselect', this.onUnselect);
+		this.listenTo(Radio.channel('documentClicked'), 'click', this.closeActions);   
+	},
+	onRender: function() {
+		if (this.selected) {
+			this.$el.addClass('active');
+		}else{
+			this.$el.removeClass('active');
+		}
+		if (this.editing) {
+			this.$('input').focus();
+		}
+	},
+	onSelect: function() {
+		this.selected = true;
+		this.render();
+	},
+	onUnselect: function() {
+		this.selected = false;
+		this.render();
+	},
+	selectSimple: function(e) {
+		e.preventDefault();
+		if (e && !~[ this.el, this.$('a')[0], this.$('span')[0] ].indexOf(e.target)) {
+			return;
+		}
+		if (this.editing) return;
+		Backbone.history.navigate('tags/'+encodeURIComponent(this.model.get('name')), {trigger: true});
+	},
+	toggleActions: function() {
+		this.getUI('actionsMenu').toggleClass('open');
+	},
+	closeActions: function(e) {
+		if (this.editing || $.contains(this.getUI('actionsToggle')[0], e.target)) return;
+		this.getUI('actionsMenu').removeClass('open');
+	},
+	actionSelect: function(e) {
+		this.model.trigger('select', this.model);
+	},
+	actionUnselect: function(e) {
+		this.model.trigger('unselect', this.model);
+	},
+	actionDelete: function() {
+		this.model.destroy();
+	},
+	actionEdit: function() {
+		this.editing = true;
+		this.render();
+	},
+	actionSubmit: function() {
+		this.model.set('name', this.$('input').val());
+		this.model.save();
+		this.actionCancel();
+	},
+	actionCancel: function() {
+		this.editing = false;
+		this.render();
+	}
+});
diff --git a/js/views/TagsNavigation.js b/js/views/TagsNavigation.js
index d3bfcaf13..0cdb65ee5 100644
--- a/js/views/TagsNavigation.js
+++ b/js/views/TagsNavigation.js
@@ -1,10 +1,10 @@
-import Backbone from 'backbone'
-import TagView from '../views/TagsNavigationTag'
+import Backbone from 'backbone';
+import TagView from '../views/TagsNavigationTag';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.CollectionView.extend({
-  tagName: 'ul'
-, childView: TagView
-})
+	tagName: 'ul',
+	childView: TagView
+});
diff --git a/js/views/TagsNavigationTag.js b/js/views/TagsNavigationTag.js
index fba7b7893..415d5932b 100644
--- a/js/views/TagsNavigationTag.js
+++ b/js/views/TagsNavigationTag.js
@@ -1,28 +1,28 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import templateString from '../templates/TagsNavigationTag.html'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import templateString from '../templates/TagsNavigationTag.html';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  className: 'tag-nav-item'
-, tagName: 'li'
-, template: _.template(templateString)
-, events: {
-    'click': 'open'
-  }
-, initialize: function() {
-    this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this)
-  }
-, open: function(e) {
-    e.preventDefault()
-    Backbone.history.navigate('tags/' + encodeURIComponent(this.model.get('name')), {trigger: true});
-  }
-, onNavigate: function(category, tags) {
-    this.$el.removeClass('active')
-    if (category === 'tags' && ~tags.indexOf(this.model.get('name'))) {
-      this.$el.addClass('active')
-    }
-  }
-})
+	className: 'tag-nav-item',
+	tagName: 'li',
+	template: _.template(templateString),
+	events: {
+		'click': 'open'
+	},
+	initialize: function() {
+		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate, this);
+	},
+	open: function(e) {
+		e.preventDefault();
+		Backbone.history.navigate('tags/' + encodeURIComponent(this.model.get('name')), {trigger: true});
+	},
+	onNavigate: function(category, tags) {
+		this.$el.removeClass('active');
+		if (category === 'tags' && ~tags.indexOf(this.model.get('name'))) {
+			this.$el.addClass('active');
+		}
+	}
+});
diff --git a/js/views/TagsSelection.js b/js/views/TagsSelection.js
index 19213a9d1..90b04c6a4 100644
--- a/js/views/TagsSelection.js
+++ b/js/views/TagsSelection.js
@@ -1,61 +1,61 @@
-import _ from 'underscore'
-import Backbone from 'backbone'
-import Tag from '../models/Tag'
-import Tags from '../models/Tags'
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Tag from '../models/Tag';
+import Tags from '../models/Tags';
 
-const Marionette = Backbone.Marionette
-const Radio = Backbone.Radio
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-  tagName: 'select'
-, template: _.template('')
-, className: 'tags-selection'
-, events: {
-    'select2:select': 'onAddByUser'
-  , 'select2:unselect': 'onRemoveByUser'
-  }
-, initialize: function(options) {
-    this.app = options.app 
-    this.selected = options.selected || new Tags
-    this.selected.comparator = 'name'
+	tagName: 'select',
+	template: _.template(''),
+	className: 'tags-selection',
+	events: {
+		'select2:select': 'onAddByUser',
+		'select2:unselect': 'onRemoveByUser'
+	},
+	initialize: function(options) {
+		this.app = options.app; 
+		this.selected = options.selected || new Tags;
+		this.selected.comparator = 'name';
     
-    this.listenTo(this.selected, 'add', this.onChangeByAlgo)
-    this.listenTo(this.selected, 'remove', this.onChangeByAlgo)
-    this.listenTo(this.selected, 'reset', this.onChangeByAlgo)
-    this.listenTo(this.collection, 'add', this.onAttach)
-  }
-, onAttach: function() {
-    if (this.$el.hasClass("select2-hidden-accessible")) {
-      this.$el.select2('destroy')
-    }
-    this.$el.select2({
-      placeholder: t('bookmarks', 'Set tags')
-    , allowClear: true
-    , width: '100%'
-    , tags: true
-    , multiple: true
-    , tokenSeparators: [',', ' ']
-    , data: this.app.tags.pluck('name').map(function(name) {
-        return {id: name, text: name}
-      })
-    })
-    .val(this.selected.pluck('name'))
-    .trigger('change')
-  }
-, onDetach: function() {
-    this.$el.select2('destroy')
-  }
-, onAddByUser: function(e) {
-    var tag = this.app.tags.get(e.params.data.text) || new Tag({name: e.params.data.text})
-    this.selected.add(tag)
-  }
-, onRemoveByUser: function(e) {
-    var tag = this.app.tags.get(e.params.data.text) || new Tag({name: e.params.data.text})
-    this.selected.remove(tag)
-  }
-, onChangeByAlgo: function(e) {
-    this.$el
-    .val(this.selected.pluck('name'))
-    .trigger('change')
-  }
-})
+		this.listenTo(this.selected, 'add', this.onChangeByAlgo);
+		this.listenTo(this.selected, 'remove', this.onChangeByAlgo);
+		this.listenTo(this.selected, 'reset', this.onChangeByAlgo);
+		this.listenTo(this.collection, 'add', this.onAttach);
+	},
+	onAttach: function() {
+		if (this.$el.hasClass('select2-hidden-accessible')) {
+			this.$el.select2('destroy');
+		}
+		this.$el.select2({
+			placeholder: t('bookmarks', 'Set tags'),
+			allowClear: true,
+			width: '100%',
+			tags: true,
+			multiple: true,
+			tokenSeparators: [',', ' '],
+			data: this.app.tags.pluck('name').map(function(name) {
+				return {id: name, text: name};
+			})
+		})
+			.val(this.selected.pluck('name'))
+			.trigger('change');
+	},
+	onDetach: function() {
+		this.$el.select2('destroy');
+	},
+	onAddByUser: function(e) {
+		var tag = this.app.tags.get(e.params.data.text) || new Tag({name: e.params.data.text});
+		this.selected.add(tag);
+	},
+	onRemoveByUser: function(e) {
+		var tag = this.app.tags.get(e.params.data.text) || new Tag({name: e.params.data.text});
+		this.selected.remove(tag);
+	},
+	onChangeByAlgo: function(e) {
+		this.$el
+			.val(this.selected.pluck('name'))
+			.trigger('change');
+	}
+});

From 5a04f8f4c0ac7e2ce40ff391bb2bfc9dbaeea355 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Feb 2018 21:15:25 +0100
Subject: [PATCH 067/110] Fix Settings template

fix requesttoken interpolation
allow l10n
---
 js/templates/Settings.html | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/js/templates/Settings.html b/js/templates/Settings.html
index 6efd35500..15cd3ccad 100644
--- a/js/templates/Settings.html
+++ b/js/templates/Settings.html
@@ -1,13 +1,13 @@
 <div id="app-settings-header">
-	<button class="settings-button">Settings</button>
+	<button class="settings-button"><%- t('bookmarks', 'Settings') %></button>
 </div>
 <div id="app-settings-content">
 	<form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data">
 		<input type="file" class="import" name="bm_import" size="5" />
-		<input type="hidden" name="requesttoken" value="'+oc_requesttoken+'" />
-		<button class="import-facade"><span class="icon-upload"></span> Import</button>
+		<input type="hidden" name="requesttoken" value="<%- oc_requesttoken %>" />
+		<button class="import-facade"><span class="icon-upload"></span> <%- t('bookmarks', 'Import') %></button>
 	</form>
 	<iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe>
-	<button class="export"><span class="icon-download"></span> Export</button>
+	<button class="export"><span class="icon-download"></span> <%- t('bookmarks', 'Import') %></button>
 	<div class="import-status"></div>
 </div>

From ea73367a718d0380bfa8a0bbde18a9b9c02e57e3 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Feb 2018 21:23:20 +0100
Subject: [PATCH 068/110] Fix TagsManagementTag templates

---
 js/templates/TagsManagementTag_default.html | 40 ++++++++++++++++++++-
 js/templates/TagsManagementTag_editing.html | 14 +++++++-
 2 files changed, 52 insertions(+), 2 deletions(-)

diff --git a/js/templates/TagsManagementTag_default.html b/js/templates/TagsManagementTag_default.html
index 7b0558277..321deab06 100644
--- a/js/templates/TagsManagementTag_default.html
+++ b/js/templates/TagsManagementTag_default.html
@@ -1 +1,39 @@
-<a href="#"><span><%- name %></span><div class="app-navigation-entry-utils"><ul><li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li><li class="app-navigation-entry-utils-menu-button"><button></button></li></ul></div></a><div class="popovermenu"><ul><li><button class="menu-filter-add"><span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span><span>Add to filter</span></button></li><li><button class="menu-filter-remove"><span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span><span>Remove from filter</span></button></li><li><button class="menu-edit"><span class="icon-rename"></span><span>Rename</span></button></li><li><button class="menu-delete"><span class="icon-delete"></span><span>Delete</span></button></li></ul></div>
+<a href="#">
+	<span><%- name %></span>
+	<div class="app-navigation-entry-utils">
+		<ul>
+			<li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li>
+			<li class="app-navigation-entry-utils-menu-button">
+				<button></button>
+			</li>
+		</ul>
+	</div>
+</a>
+<div class="popovermenu">
+	<ul>
+		<li>
+			<button class="menu-filter-add">
+				<span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span>
+				<span><%- t('bookmarks', 'Add to filter') %></span>
+			</button>
+		</li>
+		<li>
+			<button class="menu-filter-remove">
+				<span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span>
+				<span><%- t('bookmarks', 'Remove from filter') %></span>
+			</button>
+		</li>
+		<li>
+			<button class="menu-edit">
+				<span class="icon-rename"></span>
+				<span><%- t('bookmarks', 'Rename') %></span>
+			</button>
+		</li>
+		<li>
+			<button class="menu-delete">
+				<span class="icon-delete"></span>
+				<span><%- t('bookmarks', 'Delete') %></span>
+			</button>
+		</li>
+	</ul>
+</div>
diff --git a/js/templates/TagsManagementTag_editing.html b/js/templates/TagsManagementTag_editing.html
index 8b48d1e62..28ededa3f 100644
--- a/js/templates/TagsManagementTag_editing.html
+++ b/js/templates/TagsManagementTag_editing.html
@@ -1 +1,13 @@
-<a href="#"><input type="text" value="<%- name %>"><div class="actions"><ul><li class="action"><button class="submit icon-checkmark"></button></li><li class="action"><button class="cancel icon-close"></button></li></ul></div></a>
+<a href="#">
+	<input type="text" value="<%- name %>">
+	<div class="actions">
+		<ul>
+			<li class="action">
+				<button class="submit icon-checkmark"></button>
+			</li>
+			<li class="action">
+				<button class="cancel icon-close"></button>
+			</li>
+		</ul>
+	</div>
+</a>

From 9e85d901d5578251bfe2626ea866c55cc8ffdb6b Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 9 Feb 2018 23:15:37 +0100
Subject: [PATCH 069/110] Fix select2.css

---
 css/select2.css | 636 ++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 636 insertions(+)

diff --git a/css/select2.css b/css/select2.css
index 8b1378917..2506a3bdf 100644
--- a/css/select2.css
+++ b/css/select2.css
@@ -1 +1,637 @@
+.select2-container {
+	box-sizing: border-box;
+	display: inline-block;
+	margin: 0;
+	position: relative;
+	vertical-align: middle;
+}
 
+.select2-container .select2-selection--single {
+	box-sizing: border-box;
+	cursor: pointer;
+	display: block;
+	height: 28px;
+	user-select: none;
+	-webkit-user-select: none;
+}
+
+.select2-container .select2-selection--single .select2-selection__rendered {
+	display: block;
+	padding-left: 8px;
+	padding-right: 20px;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.select2-container .select2-selection--single .select2-selection__clear {
+	position: relative;
+}
+
+.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
+	padding-right: 8px;
+	padding-left: 20px;
+}
+
+.select2-container .select2-selection--multiple {
+	box-sizing: border-box;
+	cursor: pointer;
+	display: block;
+	min-height: 32px;
+	user-select: none;
+	-webkit-user-select: none;
+}
+
+.select2-container .select2-selection--multiple .select2-selection__rendered {
+	display: inline-block;
+	overflow: hidden;
+	padding-left: 8px;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.select2-container .select2-search--inline {
+	float: left;
+}
+
+.select2-container .select2-search--inline .select2-search__field {
+	box-sizing: border-box;
+	border: none;
+	font-size: 100%;
+	margin-top: 5px;
+	padding: 0;
+}
+
+.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
+	-webkit-appearance: none;
+}
+
+.select2-dropdown {
+	background-color: white;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	box-sizing: border-box;
+	display: block;
+	position: absolute;
+	left: -100000px;
+	width: 100%;
+	z-index: 1051;
+}
+
+.select2-results {
+	display: block;
+}
+
+.select2-results__options {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+}
+
+.select2-results__option {
+	padding: 6px;
+	user-select: none;
+	-webkit-user-select: none;
+}
+
+.select2-results__option[aria-selected] {
+	cursor: pointer;
+}
+
+.select2-container--open .select2-dropdown {
+	left: 0;
+}
+
+.select2-container--open .select2-dropdown--above {
+	border-bottom: none;
+	border-bottom-left-radius: 0;
+	border-bottom-right-radius: 0;
+}
+
+.select2-container--open .select2-dropdown--below {
+	border-top: none;
+	border-top-left-radius: 0;
+	border-top-right-radius: 0;
+}
+
+.select2-search--dropdown {
+	display: block;
+	padding: 4px;
+}
+
+.select2-search--dropdown .select2-search__field {
+	padding: 4px;
+	width: 100%;
+	box-sizing: border-box;
+}
+
+.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
+	-webkit-appearance: none;
+}
+
+.select2-search--dropdown.select2-search--hide {
+	display: none;
+}
+
+.select2-close-mask {
+	border: 0;
+	margin: 0;
+	padding: 0;
+	display: block;
+	position: fixed;
+	left: 0;
+	top: 0;
+	min-height: 100%;
+	min-width: 100%;
+	height: auto;
+	width: auto;
+	opacity: 0;
+	z-index: 99;
+	background-color: #fff;
+	filter: alpha(opacity=0);
+}
+
+.select2-hidden-accessible {
+	border: 0 !important;
+	clip: rect(0 0 0 0) !important;
+	-webkit-clip-path: inset(50%) !important;
+	clip-path: inset(50%) !important;
+	height: 1px !important;
+	overflow: hidden !important;
+	padding: 0 !important;
+	position: absolute !important;
+	width: 1px !important;
+	white-space: nowrap !important;
+}
+
+.select2-container--default .select2-selection--single {
+	background-color: #fff;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__rendered {
+	color: #444;
+	line-height: 28px;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__clear {
+	cursor: pointer;
+	float: right;
+	font-weight: bold;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__placeholder {
+	color: #999;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__arrow {
+	height: 26px;
+	position: absolute;
+	top: 1px;
+	right: 1px;
+	width: 20px;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__arrow b {
+	border-color: #888 transparent transparent transparent;
+	border-style: solid;
+	border-width: 5px 4px 0 4px;
+	height: 0;
+	left: 50%;
+	margin-left: -4px;
+	margin-top: -2px;
+	position: absolute;
+	top: 50%;
+	width: 0;
+}
+
+.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
+	float: left;
+}
+
+.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
+	left: 1px;
+	right: auto;
+}
+
+.select2-container--default.select2-container--disabled .select2-selection--single {
+	background-color: #eee;
+	cursor: default;
+}
+
+.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
+	display: none;
+}
+
+.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
+	border-color: transparent transparent #888 transparent;
+	border-width: 0 4px 5px 4px;
+}
+
+.select2-container--default .select2-selection--multiple {
+	background-color: white;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	cursor: text;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__rendered {
+	box-sizing: border-box;
+	list-style: none;
+	margin: 0;
+	padding: 0 5px;
+	width: 100%;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__rendered li {
+	list-style: none;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
+	color: #999;
+	margin-top: 5px;
+	float: left;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__clear {
+	cursor: pointer;
+	float: right;
+	font-weight: bold;
+	margin-top: 5px;
+	margin-right: 10px;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__choice {
+	background-color: #e4e4e4;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	cursor: default;
+	float: left;
+	margin-right: 5px;
+	margin-top: 5px;
+	padding: 0 5px;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
+	color: #999;
+	cursor: pointer;
+	display: inline-block;
+	font-weight: bold;
+	margin-right: 2px;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
+	color: #333;
+}
+
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice,
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder,
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline {
+	float: right;
+}
+
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
+	margin-left: 5px;
+	margin-right: auto;
+}
+
+.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
+	margin-left: 2px;
+	margin-right: auto;
+}
+
+.select2-container--default.select2-container--focus .select2-selection--multiple {
+	border: solid black 1px;
+	outline: 0;
+}
+
+.select2-container--default.select2-container--disabled .select2-selection--multiple {
+	background-color: #eee;
+	cursor: default;
+}
+
+.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
+	display: none;
+}
+
+.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,
+.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
+	border-top-left-radius: 0;
+	border-top-right-radius: 0;
+}
+
+.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
+.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
+	border-bottom-left-radius: 0;
+	border-bottom-right-radius: 0;
+}
+
+.select2-container--default .select2-search--dropdown .select2-search__field {
+	border: 1px solid #aaa;
+}
+
+.select2-container--default .select2-search--inline .select2-search__field {
+	background: transparent;
+	border: none;
+	outline: 0;
+	box-shadow: none;
+	-webkit-appearance: textfield;
+}
+
+.select2-container--default .select2-results > .select2-results__options {
+	max-height: 200px;
+	overflow-y: auto;
+}
+
+.select2-container--default .select2-results__option[role=group] {
+	padding: 0;
+}
+
+.select2-container--default .select2-results__option[aria-disabled=true] {
+	color: #999;
+}
+
+.select2-container--default .select2-results__option[aria-selected=true] {
+	background-color: #ddd;
+}
+
+.select2-container--default .select2-results__option .select2-results__option {
+	padding-left: 1em;
+}
+
+.select2-container--default .select2-results__option .select2-results__option .select2-results__group {
+	padding-left: 0;
+}
+
+.select2-container--default .select2-results__option .select2-results__option .select2-results__option {
+	margin-left: -1em;
+	padding-left: 2em;
+}
+
+.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+	margin-left: -2em;
+	padding-left: 3em;
+}
+
+.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+	margin-left: -3em;
+	padding-left: 4em;
+}
+
+.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+	margin-left: -4em;
+	padding-left: 5em;
+}
+
+.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
+	margin-left: -5em;
+	padding-left: 6em;
+}
+
+.select2-container--default .select2-results__option--highlighted[aria-selected] {
+	background-color: #5897fb;
+	color: white;
+}
+
+.select2-container--default .select2-results__group {
+	cursor: default;
+	display: block;
+	padding: 6px;
+}
+
+.select2-container--classic .select2-selection--single {
+	background-color: #f7f7f7;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	outline: 0;
+	background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%);
+	background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%);
+	background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
+	background-repeat: repeat-x;
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
+}
+
+.select2-container--classic .select2-selection--single:focus {
+	border: 1px solid #5897fb;
+}
+
+.select2-container--classic .select2-selection--single .select2-selection__rendered {
+	color: #444;
+	line-height: 28px;
+}
+
+.select2-container--classic .select2-selection--single .select2-selection__clear {
+	cursor: pointer;
+	float: right;
+	font-weight: bold;
+	margin-right: 10px;
+}
+
+.select2-container--classic .select2-selection--single .select2-selection__placeholder {
+	color: #999;
+}
+
+.select2-container--classic .select2-selection--single .select2-selection__arrow {
+	background-color: #ddd;
+	border: none;
+	border-left: 1px solid #aaa;
+	border-top-right-radius: 4px;
+	border-bottom-right-radius: 4px;
+	height: 26px;
+	position: absolute;
+	top: 1px;
+	right: 1px;
+	width: 20px;
+	background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
+	background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
+	background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
+	background-repeat: repeat-x;
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0);
+}
+
+.select2-container--classic .select2-selection--single .select2-selection__arrow b {
+	border-color: #888 transparent transparent transparent;
+	border-style: solid;
+	border-width: 5px 4px 0 4px;
+	height: 0;
+	left: 50%;
+	margin-left: -4px;
+	margin-top: -2px;
+	position: absolute;
+	top: 50%;
+	width: 0;
+}
+
+.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
+	float: left;
+}
+
+.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
+	border: none;
+	border-right: 1px solid #aaa;
+	border-radius: 0;
+	border-top-left-radius: 4px;
+	border-bottom-left-radius: 4px;
+	left: 1px;
+	right: auto;
+}
+
+.select2-container--classic.select2-container--open .select2-selection--single {
+	border: 1px solid #5897fb;
+}
+
+.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
+	background: transparent;
+	border: none;
+}
+
+.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
+	border-color: transparent transparent #888 transparent;
+	border-width: 0 4px 5px 4px;
+}
+
+.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
+	border-top: none;
+	border-top-left-radius: 0;
+	border-top-right-radius: 0;
+	background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%);
+	background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%);
+	background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
+	background-repeat: repeat-x;
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
+}
+
+.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
+	border-bottom: none;
+	border-bottom-left-radius: 0;
+	border-bottom-right-radius: 0;
+	background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%);
+	background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%);
+	background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
+	background-repeat: repeat-x;
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0);
+}
+
+.select2-container--classic .select2-selection--multiple {
+	background-color: white;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	cursor: text;
+	outline: 0;
+}
+
+.select2-container--classic .select2-selection--multiple:focus {
+	border: 1px solid #5897fb;
+}
+
+.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
+	list-style: none;
+	margin: 0;
+	padding: 0 5px;
+}
+
+.select2-container--classic .select2-selection--multiple .select2-selection__clear {
+	display: none;
+}
+
+.select2-container--classic .select2-selection--multiple .select2-selection__choice {
+	background-color: #e4e4e4;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	cursor: default;
+	float: left;
+	margin-right: 5px;
+	margin-top: 5px;
+	padding: 0 5px;
+}
+
+.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
+	color: #888;
+	cursor: pointer;
+	display: inline-block;
+	font-weight: bold;
+	margin-right: 2px;
+}
+
+.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
+	color: #555;
+}
+
+.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
+	float: right;
+	margin-left: 5px;
+	margin-right: auto;
+}
+
+.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
+	margin-left: 2px;
+	margin-right: auto;
+}
+
+.select2-container--classic.select2-container--open .select2-selection--multiple {
+	border: 1px solid #5897fb;
+}
+
+.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
+	border-top: none;
+	border-top-left-radius: 0;
+	border-top-right-radius: 0;
+}
+
+.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
+	border-bottom: none;
+	border-bottom-left-radius: 0;
+	border-bottom-right-radius: 0;
+}
+
+.select2-container--classic .select2-search--dropdown .select2-search__field {
+	border: 1px solid #aaa;
+	outline: 0;
+}
+
+.select2-container--classic .select2-search--inline .select2-search__field {
+	outline: 0;
+	box-shadow: none;
+}
+
+.select2-container--classic .select2-dropdown {
+	background-color: white;
+	border: 1px solid transparent;
+}
+
+.select2-container--classic .select2-dropdown--above {
+	border-bottom: none;
+}
+
+.select2-container--classic .select2-dropdown--below {
+	border-top: none;
+}
+
+.select2-container--classic .select2-results > .select2-results__options {
+	max-height: 200px;
+	overflow-y: auto;
+}
+
+.select2-container--classic .select2-results__option[role=group] {
+	padding: 0;
+}
+
+.select2-container--classic .select2-results__option[aria-disabled=true] {
+	color: grey;
+}
+
+.select2-container--classic .select2-results__option--highlighted[aria-selected] {
+	background-color: #3875d7;
+	color: white;
+}
+
+.select2-container--classic .select2-results__group {
+	cursor: default;
+	display: block;
+	padding: 6px;
+}
+
+.select2-container--classic.select2-container--open .select2-dropdown {
+	border-color: #5897fb;
+}

From 87d8f2de7bf78a60df99eaaa15ad276ed1bd2990 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 9 Feb 2018 23:16:51 +0100
Subject: [PATCH 070/110] Add ImageService

---
 controller/lib/imageservice.php | 112 ++++++++++++++++++++++++++++++++
 1 file changed, 112 insertions(+)
 create mode 100644 controller/lib/imageservice.php

diff --git a/controller/lib/imageservice.php b/controller/lib/imageservice.php
new file mode 100644
index 000000000..98b309903
--- /dev/null
+++ b/controller/lib/imageservice.php
@@ -0,0 +1,112 @@
+<?php
+/**
+ * @author Marcel Klehr
+ * @copyright 2016 Marcel Klehr mklehr@gmx.net
+ *
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public
+ * License along with this library.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+namespace OCA\Bookmarks\Controller\Lib;
+
+use OCP\ICache;
+use OCP\ICacheFactory;
+use GuzzleHttp\ClientInterface;
+use GuzzleHttp\Exception\ClientException;
+
+class ImageService {
+
+	// Cache for one month
+	const CACHE_TTL = 4 * 7 * 24 * 60 * 60;
+
+	/** @var ICache */
+	private $cache;
+
+	/**
+	 * @param ICacheFactory $cacheFactory
+	 */
+	public function __construct(ICacheFactory $cacheFactory) {
+		$this->cache = $cacheFactory->create('bookmarks.images');
+	}
+
+	private function buildKey($url) {
+		return base64_encode($url);
+	}
+
+	/**
+	 * @param string $url
+	 * @return string|null image data
+	 */
+	public function getImage($url) {
+		$key = $this->buildKey($url);
+		// Try cache first
+		if ($image = $this->cache->get($key)) {
+			 $image = json_decode($image, true);
+			 return [
+			 	'contentType' => $image['contentType'],
+				'data' => base64_decode($image['data'])
+			];
+		}
+
+		// Fetch image from remote server
+		$image = $this->fetchImage($url);
+
+		if (is_null($image)) {
+			return null;
+		}
+
+		// Store in cache for next time
+		$json = json_encode([
+			'contentType' => $image['contentType'],
+			'data' => base64_encode($image['data'])
+		]);
+		$this->cache->set($key, $json, self::CACHE_TTL);
+
+		return $image; 
+	}
+	
+	/**
+	 * @param string $url
+	 * @return string|null fetched image data
+	 */
+	private function fetchImage($url) {	
+		$body = $contentType = '';
+		try {
+			$client = new \GuzzleHTTP\Client();
+			$request = $client->get($url);
+			$body = $request->getBody();
+			$contentType = $request->getHeader('Content-Type');
+		} catch (\GuzzleHttp\Exception\RequestException $e) {
+			return null;
+		} catch (\Exception $e) {
+			throw $e;
+		}
+
+		// Some HTPP Error occured :/
+		if (200 != $request->getStatusCode()) {
+			return null;
+		}
+
+		// It's not actually an image, doh.
+		if (!$contentType || stripos($contentType, 'image') !== 0) {
+			return null;
+		}
+		
+		return [
+			'contentType' => $contentType,
+			'data' => $body
+		];
+	}
+}
+

From f7638b18d678bd6c5804056757bcebbbf7f20929 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 9 Feb 2018 23:24:29 +0100
Subject: [PATCH 071/110] Fix bookmarks.css

---
 css/bookmarks.css | 428 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 428 insertions(+)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 8b1378917..87f6c879f 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1 +1,429 @@
+#content > div {
+  height: 100%;
+}
+#app-navigation {
+  height: 100%;
+  position: relative;
+}
+#app-navigation > ul {
+  height: auto;
+  overflow: hidden;
+}
+.navigation a > span {
+  display: inline-block;
+  vertical-align: text-bottom;
+  margin-right: 12px;
+}
+#app-navigation h3 {
+	padding-top: .7cm;
+	padding-left: 12px;
+	border-top: 1px solid #ededed;
+}
 
+#app-content {
+  transition: transform .5s ease;
+  transform: none;
+}
+.mobile-nav {
+  padding: .3cm;
+  display: none;
+}
+.mobile-nav .toggle-menu {
+  display: inline-block;
+}
+@media only screen and (max-width: 768px) {
+  .mobile-nav-open #app-content {
+    transform: translate(250px, 0);
+  }
+  .mobile-nav {
+    display: block;
+  }
+}
+
+.add-bookmark input {
+	margin: 0;
+	width: 100%;
+	padding: 12px 40px 12px 12px;
+	box-sizing: border-box;
+	background-color: transparent;
+	border: none;
+	border-bottom: 1px solid #eee;
+	border-radius: 0;
+}
+.add-bookmark button {
+	position: absolute;
+	right: 0;
+	top: 0;
+  min-height: 34px;
+	padding: 10px 20px;
+	background-color: transparent;
+	border: none;
+	opacity: .5;
+  font-weight: bold;
+}
+.add-bookmark li.link a span {
+  margin-left: 28px;
+}
+.add-bookmark li.link a span::before {
+	position: absolute;
+	left: 12px;
+	content: '+';
+	font-weight: bold;
+	font-size: 28px;
+}
+.add-bookmark .form {
+  display: none;
+}
+
+.bulk-actions {
+  display: none;
+  position: fixed;
+  top: 45px;
+  left: 250px;
+  right: 0;
+  border-bottom: 1px solid #ebebeb;
+  padding: .3cm .5cm;
+  background: #e9f7ff;
+  z-index: 3;
+}
+.bulk-actions + * {
+  transition: margin-top .5s ease;
+}
+.bulk-actions.active {
+  display: block;
+}
+.bulk-actions.active + * {
+  margin-top: 2.5cm;
+}
+@media only screen and (max-width: 768px) {
+  .bulk-actions {
+    position: relative;
+	top: 0; right: 0; bottom: 0; left: 0;
+  }
+  .bulk-actions.active + * {
+    margin-top: 0;
+  }
+}
+.bulk-actions > button {
+  vertical-align: top;
+}
+.bulk-actions .tags {
+  display: inline-block;
+  width: 60%;
+  margin: 3px 3px 3px 0;
+  position: relative;
+}
+.bulk-actions .tags-selection {
+  display: block;
+  width: 100%;
+}
+.bulk-actions .selection-tools {
+  float: right;
+}
+.bulk-actions .selection-tools .close {
+  display: inline-block;
+  cursor: pointer;
+  margin: 3px 3px 3px 0; 
+  padding: 6px 12px;
+  width: auto;
+  min-height: 34px;
+  cursor: pointer;
+  box-sizing: border-box;
+}
+.bulk-actions .selection-tools .close span {
+  display: inline-block;
+  vertical-align: text-top;
+}
+button span,
+.bulk-actions .selection-tools .close span {
+  cursor: pointer;
+}
+
+.bookmarks-empty {
+  width: 5cm;
+  margin: 20% auto;
+}
+
+.bookmarks {
+  display: flex;
+  flex-wrap: wrap;
+  overflow: hidden;
+  padding-right: .6cm;
+}
+.bookmark-card {
+  position: relative;
+  box-sizing: border-box; /*necessary for hover effect goodness to work*/
+  flex-grow: 1;
+  width: 6cm;
+  height: 6cm;
+  margin: .6cm 0 0 .6cm;
+  padding: .5cm;
+  border: 1px solid #ddd;
+  overflow: hidden;
+  background-color: rgb(210, 210, 210);
+  background-size: cover;
+  background-position: center;
+  transition: background-color .3s ease;
+  background-blend-mode: overlay;
+}
+.bookmark-card,
+.bookmark-card * {
+  cursor: pointer;
+}
+.bookmark-card:hover {
+  background-color: rgb(180, 180, 180);
+}
+.bookmark-card.active,
+.bookmark-card.active:hover {
+  transform: none;
+  border: 1px solid #0082c9;
+  box-shadow: inset 0 0 10px #0082c9;
+}
+.bookmark-card .panel {
+  position: absolute;
+  top: 0; left: 0; right: 0;
+  padding: .5cm .5cm .1cm .6cm;
+  background: rgba(255, 255, 255, .8);
+  box-shadow: #aaa 0 0 5px;
+}
+.bookmark-card:hover .panel {
+  background: rgba(255, 255, 255, .90); 
+}
+.bookmark-card .selectbox {
+  display: none;
+  position: absolute;
+  left: .1cm;
+  top: .5cm;
+}
+.selection-active .bookmark-card .selectbox,
+.bookmark-card:hover .selectbox,
+.bookmark-card.active .selectbox {
+  display: inline-block;
+}
+.bookmark-card h1 {
+  font-size: .5cm;
+  padding-right: .5cm;
+}
+.bookmark-card h2 {
+  margin-top: .1cm;
+  font-size: .4cm;
+  opacity: .4;
+}
+.bookmark-card h2 :link span {
+  display: inline-block;
+  vertical-align: text-bottom;
+  margin-right: 3px;
+}
+.bookmark-card h2 :link:hover {
+  text-decoration: underline;
+}
+.bookmark-card .actions {
+  display: none;
+  position: absolute;
+  top: .5cm;
+  right: .5cm;
+}
+.bookmark-card:hover .actions,
+.bookmark-card.actions-open .actions {
+  display: block;
+}
+.bookmark-card .actions .popovermenu {
+  top: 24px;
+  right: -14px;
+}
+.bookmark-card .actions .action-select,
+.bookmark-card.active .actions .action-unselect {
+  display: block;
+}
+.bookmark-card .actions .action-unselect,
+.bookmark-card.active .actions .action-select {
+  display: none;
+}
+.bookmark-card .tags {
+  max-height: 2.5cm;
+  overflow: hidden;
+  position: absolute;
+  bottom: .5cm;
+}
+.bookmark-card .tag-nav-item {
+  border-radius: .2cm;
+  background: #ebebeb;
+  display: inline-block;
+  padding: 0 .2cm;
+  margin: .1cm;
+}
+.bookmark-card .tag-nav-item:hover {
+  background: #e0e0e0;
+}
+
+.bookmark-detail {
+  position: fixed;
+  top: 45px;
+  right: 0;
+  z-index: 2;
+  width: 500px;
+  height: 100%;
+  box-sizing: border-box;
+  padding: 1cm;
+  background: white;
+  border-left: 1px solid #ebebeb;
+}
+@media only screen and (max-width: 768px) {
+  .bookmark-detail {
+    width: auto;
+    left: 0;
+  }
+}
+.bookmark-detail h1 {
+  font-size: .8cm;
+  line-height: 1;
+  padding-right: 2.3cm;
+}
+.bookmark-detail h2 {
+  margin-top: .3cm;
+  opacity: .4;
+}
+.bookmark-detail h2 :link:hover {
+  text-decoration: underline;
+}
+.bookmark-detail h2 :link span {
+  display: inline-block;
+  vertical-align: middle;
+  margin-right: 3px;
+}
+.bookmark-detail > .close {
+  position: absolute;
+  top: .1cm;
+  right: .1cm;
+  width: 1cm;
+  height: 1cm;
+  cursor: pointer;
+}
+.bookmark-detail .actions {
+  position: absolute;
+  right: 1cm;
+}
+.bookmark-detail .actions button {
+  height: 1cm;
+  width: 1cm;
+}
+.bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice,
+.bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice,
+.bookmark-detail .tag-nav-item {
+  border-radius: .2cm;
+  border: none;
+  background: #ebebeb;
+  display: inline-block;
+  padding: .1cm .2cm;
+  margin: .1cm;
+}
+.bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
+.bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
+.bookmark-detail .tag-nav-item:hover {
+  background: #e0e0e0;
+}
+.bookmark-detail .description {
+  margin-top: .5cm;
+}
+
+.bookmark-detail.editing h1 {
+  padding-right: 0;
+}
+.bookmark-detail.editing .actions button {
+  height: auto;
+  width: auto;
+}
+.bookmark-detail .input-url,
+.bookmark-detail .input-title,
+.bookmark-detail .input-desc,
+.bookmark-detail .tags-selection  {
+  width: 100%;
+  font-size: inherit;
+  box-sizing: border-box;
+  padding: 0 !important;
+}
+.bookmark-detail .input-url {
+  padding-left: 25px !important;
+  background-position: 5px;
+}
+.bookmark-detail .input-desc {
+  height: 300px;
+}
+
+.tags-management {
+  float: left;
+  width: 250px;
+  overflow: auto !important;
+}
+@media only screen and (max-width: 768px) {
+  .tags-management {
+    width: auto;
+    float: none;
+    border-bottom: 2px solid #bbb;
+  }
+}
+.tags-management > ul:first-child > li:last-child {
+  border-bottom: 2px solid #ebebeb;
+}
+.tags-management .tag-man-item {
+  /*padding: .3cm;*/
+  cursor: pointer;
+}
+.tags-management .tag-man-item.active {
+  background: #f3f3f3;
+}
+.tags-management .tag-man-item > a {
+  padding-left: .2cm;
+}
+.tags-management .tag-man-item .actions {
+  float: right;
+}
+
+.tags-management .tag-man-item .actions ul {
+  display: block !important;
+}
+.tags-management .tag-man-item .actions .action {
+  display: inline-block;
+  width: auto !important;
+}
+.tags-management .tag-man-item .action button {
+	border: none;
+	background-color: transparent;
+	opacity: .45;
+  padding: 3px 12px;
+}
+.tags-management .tag-man-item .action button:hover {
+  opacity: 1;
+}
+.tags-management .tag-man-item input[type="text"] {
+  min-height: .7cm;
+  padding: 0 .1cm;
+  margin: 0;
+  width: 70%;
+}
+
+/* make checkbox look like an icon */
+.menu-item-checkbox span:first-child {
+  padding: 0 10px;
+}
+
+/* display 'remove from filter' when selected, and 'add to ...' when unselected*/
+.tags-management .tag-man-item.active .menu-filter-add {
+  display: none;
+}
+.tags-management .tag-man-item .menu-filter-remove {
+  display: none;
+}
+.tags-management .tag-man-item.active .menu-filter-remove {
+  display: block;
+}
+
+.settings .import-form {
+  display: inline-block;
+}
+.settings .import {
+  display: none;
+}
+.settings .upload {
+  display: none;
+}

From 32f00764a0ef66cea926bb113db5de499ab27ce8 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 11 Feb 2018 17:32:03 +0100
Subject: [PATCH 072/110] Fix bulk deletion: Would iterate on mutable
 collection

---
 js/views/BulkActions.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/views/BulkActions.js b/js/views/BulkActions.js
index e02844723..8acaa926d 100644
--- a/js/views/BulkActions.js
+++ b/js/views/BulkActions.js
@@ -57,7 +57,7 @@ export default Marionette.View.extend({
 		this.updateTags();
 	},
 	delete: function() {
-		this.selected.forEach(function(model) {
+		this.selected.slice().forEach(function(model) {
 			model.trigger('unselect', model);
 			model.destroy({
 				error: function() {

From 1ab70b296d6c5d0dbfe69437d0af4adddb71837e Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 11 Feb 2018 17:35:18 +0100
Subject: [PATCH 073/110] Move meta fetching to bm lib

allows import to use it, too
---
 controller/lib/bookmarks.php           | 57 +++++++++++++++++++--
 controller/rest/bookmarkcontroller.php | 70 ++++----------------------
 2 files changed, 63 insertions(+), 64 deletions(-)

diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index b0eab5e02..f1c925759 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -470,10 +470,49 @@ public function editBookmark($userid, $id, $url, $title, $tags = [], $descriptio
 	 */
 	public function addBookmark($userid, $url, $title, $tags = array(), $description = '', $isPublic = false, $image = null) {
 		$public = $isPublic ? 1 : 0;
-		$urlWithoutPrefix = trim(substr($url, strpos($url, "://") + 3)); // Removes everything from the url before the "://" pattern (included)
-		if($urlWithoutPrefix === '') {
-			throw new \InvalidArgumentException('Bookmark URL is missing');
+		
+        // do some meta tag inspection of the link...
+
+		// allow only http(s) and (s)ftp
+		$protocols = '/^(https?|s?ftp)\:\/\//i';
+		try {
+			if (preg_match($protocols, $url)) {
+				$data = $this->getURLMetadata($url);
+			} else {
+				// if no allowed protocol is given, evaluate https and https
+				foreach(['https://', 'http://'] as $protocol) {
+					$testUrl = $protocol . $url;
+					$data = $this->getURLMetadata($testUrl);
+					if(isset($data['title'])) {
+						break;
+					}
+				}
+			}
+		} catch (\Exception $e) {
+			// only because the server cannot reach a certain URL it does not
+			// mean the user's browser cannot.
+			\OC::$server->getLogger()->logException($e, ['app' => 'bookmarks']);
+		}
+		if (isset($data['url'])) {
+			$url   = $data['url'];
+		}
+		if ((!isset($title) || trim($title) === '')) {
+			$title =  isset($data['title'])? $data['title'] : $url;
+		}
+		if (isset($data['description']) && (!isset($description) || trim($description) === '')) {
+		  $description = $data['description'];
 		}
+		if (isset($data['image']) && !isset($image)) {
+		  $image = $data['image'];
+		}
+
+		// Check if it is a valid URL (after adding http(s) prefix)
+        $urlData = parse_url($url);
+		if(!$this->isProperURL($urlData)) {
+			throw new \InvalidArgumentException('Invalid URL supplied');
+		}
+    
+        $urlWithoutPrefix = trim(substr($url, strpos($url, "://") + 3)); // Removes everything from the url before the "://" pattern (included)
 		$decodedUrlNoPrefix = htmlspecialchars_decode($urlWithoutPrefix);
 		$decodedUrl = htmlspecialchars_decode($url);
 
@@ -704,4 +743,16 @@ public function analyzeTagRequest($line) {
 		return $filterTag;
 	}
 
+	/**
+	 * Checks whether parse_url was able to return proper URL data
+	 *
+	 * @param bool|array $urlData result of parse_url
+	 * @return bool
+	 */
+	protected function isProperURL($urlData) {
+		if ($urlData === false || !isset($urlData['scheme']) || !isset($urlData['host'])) {
+			return false;
+		}
+		return true;
+	}
 }
diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index 3e828e750..545dd035a 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -184,53 +184,15 @@ public function getBookmarks(
 	public function newBookmark($url = "", $item = array(), $title = "", $is_public = false, $description = "") {
 		$title = trim($title);
 		$image = null;
-
-		// do some meta tag inspection of the link...
-
-		// allow only http(s) and (s)ftp
-		$protocols = '/^(https?|s?ftp)\:\/\//i';
-		try {
-			if (preg_match($protocols, $url)) {
-				$data = $this->bookmarks->getURLMetadata($url);
-			} else {
-				// if no allowed protocol is given, evaluate https and https
-				foreach(['https://', 'http://'] as $protocol) {
-					$testUrl = $protocol . $url;
-					$data = $this->bookmarks->getURLMetadata($testUrl);
-					if(isset($data['title'])) {
-						break;
-					}
-				}
-			}
-		} catch (\Exception $e) {
-			// only because the server cannot reach a certain URL it does not
-			// mean the user's browser cannot.
-			\OC::$server->getLogger()->logException($e, ['app' => 'bookmarks']);
-		}
-		if (isset($data['url'])) {
-			$url   = $data['url'];
-		}
-		if ((!isset($title) || trim($title) === '')) {
-			$title =  isset($data['title'])? $data['title'] : $url;
-		}
-		if (isset($data['description']) && (!isset($description) || trim($description) === '')) {
-		  $description = $data['description'];
-		}
-		if (isset($data['image'])) {
-		  $image = $data['image'];
-		}
-
-		// Check if it is a valid URL (after adding http(s) prefix)
-		$urlData = parse_url($url);
-		if(!$this->isProperURL($urlData)) {
-			return new JSONResponse(array('status' => 'error'), Http::STATUS_BAD_REQUEST);
-		}
-
 		$tags = isset($item['tags']) ? $item['tags'] : array();
 
-		$id = $this->bookmarks->addBookmark($this->userId, $url, $title, $tags, $description, $is_public, $image);
-		$bm = $this->bookmarks->findUniqueBookmark($id, $this->userId);
-		return new JSONResponse(array('item' => $bm, 'status' => 'success'));
+        try {
+            $id = $this->bookmarks->addBookmark($this->userId, $url, $title, $tags, $description, $is_public, $image);
+		} catch(\InvalidArgumentException $e) {
+			return new JSONResponse(array('status' => 'error', 'data' => [$e->getMessage()]), Http::STATUS_BAD_REQUEST);
+        }
+        $bm = $this->bookmarks->findUniqueBookmark($id, $this->userId);
+        return new JSONResponse(array('item' => $bm, 'status' => 'success'));
 	}
 
 	/**
@@ -298,7 +260,7 @@ public function editBookmark($id = null, $url = null, $item = null, $title = nul
 
 		// Check if url and id are valid
 		$urlData = parse_url($bookmark['url']);
-		if(!$this->isProperURL($urlData) || !is_numeric($bookmark['id'])) {
+		if(!$this->bookmarks->isProperURL($urlData) || !is_numeric($bookmark['id'])) {
 			return new JSONResponse(array(), Http::STATUS_BAD_REQUEST);
 		}
 
@@ -348,7 +310,7 @@ public function deleteBookmark($id = -1) {
 	public function clickBookmark($url = "") {
 		$url = urldecode($url);
 		$urlData = parse_url($url);
-		if(!$this->isProperURL($urlData)) {
+		if(!$this->bookmarks->isProperURL($urlData)) {
 			return new JSONResponse([], Http::STATUS_BAD_REQUEST);
 		}
 		// prepare url for query
@@ -441,18 +403,4 @@ public function exportBookmark() {
 
 		return new ExportResponse($file);
 	}
-
-	/**
-	 * Checks whether parse_url was able to return proper URL data
-	 *
-	 * @param bool|array $urlData result of parse_url
-	 * @return bool
-	 */
-	protected function isProperURL($urlData) {
-		if ($urlData === false || !isset($urlData['scheme']) || !isset($urlData['host'])) {
-			return false;
-		}
-		return true;
-	}
-
 }

From f6a9b2c4ad193038bfcf981b5ab1172c186b817c Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 11 Feb 2018 17:44:09 +0100
Subject: [PATCH 074/110] Reload bookmarks after import

---
 js/views/Settings.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/views/Settings.js b/js/views/Settings.js
index 5d2b09f52..b147170cd 100644
--- a/js/views/Settings.js
+++ b/js/views/Settings.js
@@ -88,7 +88,7 @@ export default Marionette.View.extend({
 			return;
 		}
 		this.getUI('status').text(t('bookmark', 'Import completed successfully.'));
-		Backbone.history.navigate('all', {trigger: true});
+		Backbone.history.navigate('', {trigger: true}); // reload app
 	},
 	exportTrigger: function() {
 		window.location = 'bookmark/export?requesttoken='+oc_requesttoken;

From a495bce209c7100e576efb56578cbf13760d48cb Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 11 Feb 2018 20:38:49 +0100
Subject: [PATCH 075/110] Fix Bookmarks#isProperURL

---
 controller/lib/bookmarks.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index f1c925759..4cbb75298 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -749,7 +749,7 @@ public function analyzeTagRequest($line) {
 	 * @param bool|array $urlData result of parse_url
 	 * @return bool
 	 */
-	protected function isProperURL($urlData) {
+	public function isProperURL($urlData) {
 		if ($urlData === false || !isset($urlData['scheme']) || !isset($urlData['host'])) {
 			return false;
 		}

From 52bf384744551cba7477651c61ae9a6101b2b12d Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Mon, 12 Feb 2018 13:34:51 +0100
Subject: [PATCH 076/110] Fix styles for NCv13

---
 css/bookmarks.css             | 13 -------------
 js/templates/AddBookmark.html |  6 ++----
 js/templates/Navigation.html  |  2 +-
 3 files changed, 3 insertions(+), 18 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 87f6c879f..7133d0c00 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -61,19 +61,6 @@
 	opacity: .5;
   font-weight: bold;
 }
-.add-bookmark li.link a span {
-  margin-left: 28px;
-}
-.add-bookmark li.link a span::before {
-	position: absolute;
-	left: 12px;
-	content: '+';
-	font-weight: bold;
-	font-size: 28px;
-}
-.add-bookmark .form {
-  display: none;
-}
 
 .bulk-actions {
   display: none;
diff --git a/js/templates/AddBookmark.html b/js/templates/AddBookmark.html
index f9e3434d7..5ee872c5d 100644
--- a/js/templates/AddBookmark.html
+++ b/js/templates/AddBookmark.html
@@ -1,9 +1,7 @@
 <li class="link">
-	<a href="#">
-		<span><%- t('bookmarks', 'Add a Bookmark') %></span>
-	</a>
+	<a href="#" class="icon-add"><%- t('bookmarks', 'Add a Bookmark') %></a>
 </li>
-<li class="form">
+<li class="form" style="display: none">
 	<input type="text" value="" placeholder="<%- t('bookmarks', 'Address') %>"/>
 	<button title="<%- t('bookmarks', 'Add this to my bookmarks')" class="icon-add"></button>
 </li>
diff --git a/js/templates/Navigation.html b/js/templates/Navigation.html
index fee537b79..c31bfe632 100644
--- a/js/templates/Navigation.html
+++ b/js/templates/Navigation.html
@@ -1,5 +1,5 @@
 <li data-id="all" class="all">
-	<a href="#"><span class="icon-home"></span><%- t('bookmarks', 'All bookmarks') %></a>
+	<a href="#" class="icon-home"><%- t('bookmarks', 'All bookmarks') %></a>
 </li>
 <!--
 <li data-id="favorites" class="favorites">

From 1f82ac4ea885c7433beda1514baef31d3cdb04ea Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 14 Feb 2018 21:35:24 +0100
Subject: [PATCH 077/110] Fix tags management styles

---
 css/bookmarks.css                           |  9 ++-------
 js/templates/TagsManagementTag_default.html | 18 +++++++++---------
 js/views/TagsManagementTag.js               |  2 +-
 3 files changed, 12 insertions(+), 17 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 7133d0c00..3b8feb4df 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -338,9 +338,8 @@ button span,
 }
 
 .tags-management {
-  float: left;
-  width: 250px;
-  overflow: auto !important;
+  height: 80% !important;
+  height: calc(100% - 80px - 100px) !important;
 }
 @media only screen and (max-width: 768px) {
   .tags-management {
@@ -349,11 +348,7 @@ button span,
     border-bottom: 2px solid #bbb;
   }
 }
-.tags-management > ul:first-child > li:last-child {
-  border-bottom: 2px solid #ebebeb;
-}
 .tags-management .tag-man-item {
-  /*padding: .3cm;*/
   cursor: pointer;
 }
 .tags-management .tag-man-item.active {
diff --git a/js/templates/TagsManagementTag_default.html b/js/templates/TagsManagementTag_default.html
index 321deab06..2b7b2322e 100644
--- a/js/templates/TagsManagementTag_default.html
+++ b/js/templates/TagsManagementTag_default.html
@@ -1,15 +1,15 @@
 <a href="#">
 	<span><%- name %></span>
-	<div class="app-navigation-entry-utils">
-		<ul>
-			<li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li>
-			<li class="app-navigation-entry-utils-menu-button">
-				<button></button>
-			</li>
-		</ul>
-	</div>
 </a>
-<div class="popovermenu">
+<div class="app-navigation-entry-utils">
+  <ul>
+    <li class="app-navigation-entry-utils-counter"><%- count > 999 ? "999+" :count  %></li>
+    <li class="app-navigation-entry-utils-menu-button">
+      <button></button>
+    </li>
+  </ul>
+</div>
+<div class="app-navigation-entry-menu">
 	<ul>
 		<li>
 			<button class="menu-filter-add">
diff --git a/js/views/TagsManagementTag.js b/js/views/TagsManagementTag.js
index 87fde0195..de20fb4eb 100644
--- a/js/views/TagsManagementTag.js
+++ b/js/views/TagsManagementTag.js
@@ -18,7 +18,7 @@ export default Marionette.View.extend({
 	templateDefault: _.template(templateStringDefault),
 	templateEditing: _.template(templateStringEditing),
 	ui: {
-		'actionsMenu': '.popovermenu',
+		'actionsMenu': '.app-navigation-entry-menu',
 		'actionsToggle': '.app-navigation-entry-utils-menu-button'
 	},
 	events: {

From 9ae22cd462a52b66371b959358750fe8c632b575 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 14 Feb 2018 21:38:50 +0100
Subject: [PATCH 078/110] Fix tabs in bookmarks.css

---
 css/bookmarks.css | 488 +++++++++++++++++++++++++++-------------------
 1 file changed, 286 insertions(+), 202 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 3b8feb4df..1f0b2b75d 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,19 +1,23 @@
 #content > div {
-  height: 100%;
+	height: 100%;
 }
+
 #app-navigation {
-  height: 100%;
-  position: relative;
+	height: 100%;
+	position: relative;
 }
+
 #app-navigation > ul {
-  height: auto;
-  overflow: hidden;
+	height: auto;
+	overflow: hidden;
 }
+
 .navigation a > span {
-  display: inline-block;
-  vertical-align: text-bottom;
-  margin-right: 12px;
+	display: inline-block;
+	vertical-align: text-bottom;
+	margin-right: 12px;
 }
+
 #app-navigation h3 {
 	padding-top: .7cm;
 	padding-left: 12px;
@@ -21,23 +25,29 @@
 }
 
 #app-content {
-  transition: transform .5s ease;
-  transform: none;
+	transition: transform .5s ease;
+	transform: none;
 }
+
 .mobile-nav {
-  padding: .3cm;
-  display: none;
+	padding: .3cm;
+	display: none;
 }
+
 .mobile-nav .toggle-menu {
-  display: inline-block;
+	display: inline-block;
 }
+
 @media only screen and (max-width: 768px) {
-  .mobile-nav-open #app-content {
-    transform: translate(250px, 0);
-  }
-  .mobile-nav {
-    display: block;
-  }
+
+	.mobile-nav-open #app-content {
+		transform: translate(250px, 0);
+	}
+
+	.mobile-nav {
+		display: block;
+	}
+
 }
 
 .add-bookmark input {
@@ -50,362 +60,436 @@
 	border-bottom: 1px solid #eee;
 	border-radius: 0;
 }
+
 .add-bookmark button {
 	position: absolute;
 	right: 0;
 	top: 0;
-  min-height: 34px;
+	min-height: 34px;
 	padding: 10px 20px;
 	background-color: transparent;
 	border: none;
 	opacity: .5;
-  font-weight: bold;
+	font-weight: bold;
 }
 
 .bulk-actions {
-  display: none;
-  position: fixed;
-  top: 45px;
-  left: 250px;
-  right: 0;
-  border-bottom: 1px solid #ebebeb;
-  padding: .3cm .5cm;
-  background: #e9f7ff;
-  z-index: 3;
+	display: none;
+	position: fixed;
+	top: 45px;
+	left: 250px;
+	right: 0;
+	border-bottom: 1px solid #ebebeb;
+	padding: .3cm .5cm;
+	background: #e9f7ff;
+	z-index: 3;
 }
+
 .bulk-actions + * {
-  transition: margin-top .5s ease;
+	transition: margin-top .5s ease;
 }
+
 .bulk-actions.active {
-  display: block;
+	display: block;
 }
+
 .bulk-actions.active + * {
-  margin-top: 2.5cm;
+	margin-top: 2.5cm;
 }
+
 @media only screen and (max-width: 768px) {
-  .bulk-actions {
-    position: relative;
-	top: 0; right: 0; bottom: 0; left: 0;
-  }
-  .bulk-actions.active + * {
-    margin-top: 0;
-  }
+
+	.bulk-actions {
+		position: relative;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
+	}
+
+	.bulk-actions.active + * {
+		margin-top: 0;
+	}
+
 }
+
 .bulk-actions > button {
-  vertical-align: top;
+	vertical-align: top;
 }
+
 .bulk-actions .tags {
-  display: inline-block;
-  width: 60%;
-  margin: 3px 3px 3px 0;
-  position: relative;
+	display: inline-block;
+	width: 60%;
+	margin: 3px 3px 3px 0;
+	position: relative;
 }
+
 .bulk-actions .tags-selection {
-  display: block;
-  width: 100%;
+	display: block;
+	width: 100%;
 }
+
 .bulk-actions .selection-tools {
-  float: right;
+	float: right;
 }
+
 .bulk-actions .selection-tools .close {
-  display: inline-block;
-  cursor: pointer;
-  margin: 3px 3px 3px 0; 
-  padding: 6px 12px;
-  width: auto;
-  min-height: 34px;
-  cursor: pointer;
-  box-sizing: border-box;
+	display: inline-block;
+	cursor: pointer;
+	margin: 3px 3px 3px 0;
+	padding: 6px 12px;
+	width: auto;
+	min-height: 34px;
+	cursor: pointer;
+	box-sizing: border-box;
 }
+
 .bulk-actions .selection-tools .close span {
-  display: inline-block;
-  vertical-align: text-top;
+	display: inline-block;
+	vertical-align: text-top;
 }
+
 button span,
 .bulk-actions .selection-tools .close span {
-  cursor: pointer;
+	cursor: pointer;
 }
 
 .bookmarks-empty {
-  width: 5cm;
-  margin: 20% auto;
+	width: 5cm;
+	margin: 20% auto;
 }
 
 .bookmarks {
-  display: flex;
-  flex-wrap: wrap;
-  overflow: hidden;
-  padding-right: .6cm;
+	display: flex;
+	flex-wrap: wrap;
+	overflow: hidden;
+	padding-right: .6cm;
 }
+
 .bookmark-card {
-  position: relative;
-  box-sizing: border-box; /*necessary for hover effect goodness to work*/
-  flex-grow: 1;
-  width: 6cm;
-  height: 6cm;
-  margin: .6cm 0 0 .6cm;
-  padding: .5cm;
-  border: 1px solid #ddd;
-  overflow: hidden;
-  background-color: rgb(210, 210, 210);
-  background-size: cover;
-  background-position: center;
-  transition: background-color .3s ease;
-  background-blend-mode: overlay;
+	position: relative;
+	box-sizing: border-box; /*necessary for hover effect goodness to work*/
+	flex-grow: 1;
+	width: 6cm;
+	height: 6cm;
+	margin: .6cm 0 0 .6cm;
+	padding: .5cm;
+	border: 1px solid #ddd;
+	overflow: hidden;
+	background-color: rgb(210, 210, 210);
+	background-size: cover;
+	background-position: center;
+	transition: background-color .3s ease;
+	background-blend-mode: overlay;
 }
+
 .bookmark-card,
 .bookmark-card * {
-  cursor: pointer;
+	cursor: pointer;
 }
+
 .bookmark-card:hover {
-  background-color: rgb(180, 180, 180);
+	background-color: rgb(180, 180, 180);
 }
+
 .bookmark-card.active,
 .bookmark-card.active:hover {
-  transform: none;
-  border: 1px solid #0082c9;
-  box-shadow: inset 0 0 10px #0082c9;
+	transform: none;
+	border: 1px solid #0082c9;
+	box-shadow: inset 0 0 10px #0082c9;
 }
+
 .bookmark-card .panel {
-  position: absolute;
-  top: 0; left: 0; right: 0;
-  padding: .5cm .5cm .1cm .6cm;
-  background: rgba(255, 255, 255, .8);
-  box-shadow: #aaa 0 0 5px;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	padding: .5cm .5cm .1cm .6cm;
+	background: rgba(255, 255, 255, .8);
+	box-shadow: #aaa 0 0 5px;
 }
+
 .bookmark-card:hover .panel {
-  background: rgba(255, 255, 255, .90); 
+	background: rgba(255, 255, 255, .90);
 }
+
 .bookmark-card .selectbox {
-  display: none;
-  position: absolute;
-  left: .1cm;
-  top: .5cm;
+	display: none;
+	position: absolute;
+	left: .1cm;
+	top: .5cm;
 }
+
 .selection-active .bookmark-card .selectbox,
 .bookmark-card:hover .selectbox,
 .bookmark-card.active .selectbox {
-  display: inline-block;
+	display: inline-block;
 }
+
 .bookmark-card h1 {
-  font-size: .5cm;
-  padding-right: .5cm;
+	font-size: .5cm;
+	padding-right: .5cm;
 }
+
 .bookmark-card h2 {
-  margin-top: .1cm;
-  font-size: .4cm;
-  opacity: .4;
+	margin-top: .1cm;
+	font-size: .4cm;
+	opacity: .4;
 }
+
 .bookmark-card h2 :link span {
-  display: inline-block;
-  vertical-align: text-bottom;
-  margin-right: 3px;
+	display: inline-block;
+	vertical-align: text-bottom;
+	margin-right: 3px;
 }
+
 .bookmark-card h2 :link:hover {
-  text-decoration: underline;
+	text-decoration: underline;
 }
+
 .bookmark-card .actions {
-  display: none;
-  position: absolute;
-  top: .5cm;
-  right: .5cm;
+	display: none;
+	position: absolute;
+	top: .5cm;
+	right: .5cm;
 }
+
 .bookmark-card:hover .actions,
 .bookmark-card.actions-open .actions {
-  display: block;
+	display: block;
 }
+
 .bookmark-card .actions .popovermenu {
-  top: 24px;
-  right: -14px;
+	top: 24px;
+	right: -14px;
 }
+
 .bookmark-card .actions .action-select,
 .bookmark-card.active .actions .action-unselect {
-  display: block;
+	display: block;
 }
+
 .bookmark-card .actions .action-unselect,
 .bookmark-card.active .actions .action-select {
-  display: none;
+	display: none;
 }
+
 .bookmark-card .tags {
-  max-height: 2.5cm;
-  overflow: hidden;
-  position: absolute;
-  bottom: .5cm;
+	max-height: 2.5cm;
+	overflow: hidden;
+	position: absolute;
+	bottom: .5cm;
 }
+
 .bookmark-card .tag-nav-item {
-  border-radius: .2cm;
-  background: #ebebeb;
-  display: inline-block;
-  padding: 0 .2cm;
-  margin: .1cm;
+	border-radius: .2cm;
+	background: #ebebeb;
+	display: inline-block;
+	padding: 0 .2cm;
+	margin: .1cm;
 }
+
 .bookmark-card .tag-nav-item:hover {
-  background: #e0e0e0;
+	background: #e0e0e0;
 }
 
 .bookmark-detail {
-  position: fixed;
-  top: 45px;
-  right: 0;
-  z-index: 2;
-  width: 500px;
-  height: 100%;
-  box-sizing: border-box;
-  padding: 1cm;
-  background: white;
-  border-left: 1px solid #ebebeb;
+	position: fixed;
+	top: 45px;
+	right: 0;
+	z-index: 2;
+	width: 500px;
+	height: 100%;
+	box-sizing: border-box;
+	padding: 1cm;
+	background: white;
+	border-left: 1px solid #ebebeb;
 }
+
 @media only screen and (max-width: 768px) {
-  .bookmark-detail {
-    width: auto;
-    left: 0;
-  }
+
+	.bookmark-detail {
+		width: auto;
+		left: 0;
+	}
+
 }
+
 .bookmark-detail h1 {
-  font-size: .8cm;
-  line-height: 1;
-  padding-right: 2.3cm;
+	font-size: .8cm;
+	line-height: 1;
+	padding-right: 2.3cm;
 }
+
 .bookmark-detail h2 {
-  margin-top: .3cm;
-  opacity: .4;
+	margin-top: .3cm;
+	opacity: .4;
 }
+
 .bookmark-detail h2 :link:hover {
-  text-decoration: underline;
+	text-decoration: underline;
 }
+
 .bookmark-detail h2 :link span {
-  display: inline-block;
-  vertical-align: middle;
-  margin-right: 3px;
+	display: inline-block;
+	vertical-align: middle;
+	margin-right: 3px;
 }
+
 .bookmark-detail > .close {
-  position: absolute;
-  top: .1cm;
-  right: .1cm;
-  width: 1cm;
-  height: 1cm;
-  cursor: pointer;
+	position: absolute;
+	top: .1cm;
+	right: .1cm;
+	width: 1cm;
+	height: 1cm;
+	cursor: pointer;
 }
+
 .bookmark-detail .actions {
-  position: absolute;
-  right: 1cm;
+	position: absolute;
+	right: 1cm;
 }
+
 .bookmark-detail .actions button {
-  height: 1cm;
-  width: 1cm;
+	height: 1cm;
+	width: 1cm;
 }
+
 .bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice,
 .bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice,
 .bookmark-detail .tag-nav-item {
-  border-radius: .2cm;
-  border: none;
-  background: #ebebeb;
-  display: inline-block;
-  padding: .1cm .2cm;
-  margin: .1cm;
+	border-radius: .2cm;
+	border: none;
+	background: #ebebeb;
+	display: inline-block;
+	padding: .1cm .2cm;
+	margin: .1cm;
 }
+
 .bookmark-detail .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
 .bulk-actions .select2-container--default .select2-selection--multiple .select2-selection__choice:hover,
 .bookmark-detail .tag-nav-item:hover {
-  background: #e0e0e0;
+	background: #e0e0e0;
 }
+
 .bookmark-detail .description {
-  margin-top: .5cm;
+	margin-top: .5cm;
 }
 
 .bookmark-detail.editing h1 {
-  padding-right: 0;
+	padding-right: 0;
 }
+
 .bookmark-detail.editing .actions button {
-  height: auto;
-  width: auto;
+	height: auto;
+	width: auto;
 }
+
 .bookmark-detail .input-url,
 .bookmark-detail .input-title,
 .bookmark-detail .input-desc,
-.bookmark-detail .tags-selection  {
-  width: 100%;
-  font-size: inherit;
-  box-sizing: border-box;
-  padding: 0 !important;
+.bookmark-detail .tags-selection {
+	width: 100%;
+	font-size: inherit;
+	box-sizing: border-box;
+	padding: 0 !important;
 }
+
 .bookmark-detail .input-url {
-  padding-left: 25px !important;
-  background-position: 5px;
+	padding-left: 25px !important;
+	background-position: 5px;
 }
+
 .bookmark-detail .input-desc {
-  height: 300px;
+	height: 300px;
 }
 
 .tags-management {
-  height: 80% !important;
-  height: calc(100% - 80px - 100px) !important;
+	height: 80% !important;
+	height: calc(100% - 80px - 100px) !important;
 }
+
 @media only screen and (max-width: 768px) {
-  .tags-management {
-    width: auto;
-    float: none;
-    border-bottom: 2px solid #bbb;
-  }
+
+	.tags-management {
+		width: auto;
+		float: none;
+		border-bottom: 2px solid #bbb;
+	}
+
 }
+
 .tags-management .tag-man-item {
-  cursor: pointer;
+	cursor: pointer;
 }
+
 .tags-management .tag-man-item.active {
-  background: #f3f3f3;
+	background: #f3f3f3;
 }
+
 .tags-management .tag-man-item > a {
-  padding-left: .2cm;
+	padding-left: .2cm;
 }
+
 .tags-management .tag-man-item .actions {
-  float: right;
+	float: right;
 }
 
 .tags-management .tag-man-item .actions ul {
-  display: block !important;
+	display: block !important;
 }
+
 .tags-management .tag-man-item .actions .action {
-  display: inline-block;
-  width: auto !important;
+	display: inline-block;
+	width: auto !important;
 }
+
 .tags-management .tag-man-item .action button {
 	border: none;
 	background-color: transparent;
 	opacity: .45;
-  padding: 3px 12px;
+	padding: 3px 12px;
 }
+
 .tags-management .tag-man-item .action button:hover {
-  opacity: 1;
+	opacity: 1;
 }
+
 .tags-management .tag-man-item input[type="text"] {
-  min-height: .7cm;
-  padding: 0 .1cm;
-  margin: 0;
-  width: 70%;
+	min-height: .7cm;
+	padding: 0 .1cm;
+	margin: 0;
+	width: 70%;
 }
 
 /* make checkbox look like an icon */
+
 .menu-item-checkbox span:first-child {
-  padding: 0 10px;
+	padding: 0 10px;
 }
 
 /* display 'remove from filter' when selected, and 'add to ...' when unselected*/
+
 .tags-management .tag-man-item.active .menu-filter-add {
-  display: none;
+	display: none;
 }
+
 .tags-management .tag-man-item .menu-filter-remove {
-  display: none;
+	display: none;
 }
+
 .tags-management .tag-man-item.active .menu-filter-remove {
-  display: block;
+	display: block;
 }
 
 .settings .import-form {
-  display: inline-block;
+	display: inline-block;
 }
+
 .settings .import {
-  display: none;
+	display: none;
 }
+
 .settings .upload {
-  display: none;
+	display: none;
 }

From 13c043603cce8a522a1a8bdf8c01ed4973244b9a Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 20 Feb 2018 19:49:02 +0100
Subject: [PATCH 079/110] Fix app.php

---
 appinfo/app.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/appinfo/app.php b/appinfo/app.php
index fe5dbbf58..4ea25942c 100644
--- a/appinfo/app.php
+++ b/appinfo/app.php
@@ -14,7 +14,7 @@
 namespace OCA\Bookmarks\AppInfo;
 
 if ((@include_once __DIR__ . '/../vendor/autoload.php')===false) {
-  throw new Exception('Cannot include autoload. Did you run install dependencies using composer?');
+  throw new \Exception('Cannot include autoload. Did you run install dependencies using composer?');
 }
 
 $navigationEntry = function () {

From 66f63b87afda3c8143bdb7f3ae58f52614847225 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 17:20:18 +0100
Subject: [PATCH 080/110] Encapsule LinkPreview lib in LinkExplorer service

---
 controller/lib/bookmarks.php    |  33 +++-------
 controller/lib/linkexplorer.php |  38 ++++++++++++
 tests/lib_bookmark_test.php     | 105 +-------------------------------
 3 files changed, 46 insertions(+), 130 deletions(-)
 create mode 100644 controller/lib/linkexplorer.php

diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index 4cbb75298..30f60f95d 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -31,8 +31,6 @@
 use OCP\ILogger;
 use Symfony\Component\EventDispatcher\EventDispatcherInterface;
 use Symfony\Component\EventDispatcher\GenericEvent;
-use Marcelklehr\LinkPreview\Client as LinkPreview;
-use Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException;
 
 class Bookmarks {
 
@@ -44,6 +42,9 @@ class Bookmarks {
 
 	/** @var IL10N */
 	private $l;
+	
+    /** @var LinkExplorer */
+	private $linkExplorer;
 
 	/** @var EventDispatcherInterface */
 	private $eventDispatcher;
@@ -55,12 +56,14 @@ public function __construct(
 		IDBConnection $db,
 		IConfig $config,
 		IL10N $l,
+        LinkExplorer $linkExplorer,
 		EventDispatcherInterface $eventDispatcher,
 		ILogger $logger
 	) {
 		$this->db = $db;
 		$this->config = $config;
 		$this->l = $l;
+		$this->linkExplorer = $linkExplorer;
 		$this->eventDispatcher = $eventDispatcher;
 		$this->logger = $logger;
 	}
@@ -699,34 +702,12 @@ public function importFile($user, $file) {
 	/**
 	 * @brief Load Url and receive Metadata (Title)
 	 * @param string $url Url to load and analyze
-	 * @param bool $tryHarder modifies cURL options for another atttempt if the
-	 *                        first request did not succeed (e.g. cURL error 18)
 	 * @return array Metadata for url;
 	 * @throws \Exception|ClientException
 	 */
 	public function getURLMetadata($url) {
-		$data = ['url' => $url];
-
-		// Use LinkPreview to get the meta data
-		$previewClient = new LinkPreview($url);
-		$previewClient->getParser('general')->setMinimumImageDimension(0,0);
-		try {
-			$preview = $previewClient->getPreview('general');
-		} catch (\Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException $e) {
-			\OCP\Util::writeLog('bookmarks', $e, \OCP\Util::WARN);
-			return $data;
-		}
-		
-		$data = $preview->toArray();
-		if (!isset($data)) {
-			return ['url' => $url];
-		}
-
-		$data['url'] = (string) $previewClient->getUrl();
-		$data['image'] = $data['cover'];
-
-		return $data;
-	}
+	    return $this->linkExplorer->get($url);
+    }
 
 	/**
 	 * @brief Separate Url String at comma character
diff --git a/controller/lib/linkexplorer.php b/controller/lib/linkexplorer.php
new file mode 100644
index 000000000..6d6f44506
--- /dev/null
+++ b/controller/lib/linkexplorer.php
@@ -0,0 +1,38 @@
+<?php
+namespace OCA\Bookmarks\Controller\Lib;
+
+use Marcelklehr\LinkPreview\Client as LinkPreview;
+use Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException;
+
+class LinkExplorer {
+
+    /**
+	 * @brief Load Url and receive Metadata (Title)
+	 * @param string $url Url to load and analyze
+	 * @return array Metadata for url;
+	 */
+	public function get($url) {
+		$data = ['url' => $url];
+
+		// Use LinkPreview to get the meta data
+		$previewClient = new LinkPreview($url);
+		$previewClient->getParser('general')->setMinimumImageDimension(0,0);
+		try {
+			$preview = $previewClient->getPreview('general');
+		} catch (\Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException $e) {
+			\OCP\Util::writeLog('bookmarks', $e, \OCP\Util::WARN);
+			return $data;
+		}
+		
+		$data = $preview->toArray();
+		if (!isset($data)) {
+			return ['url' => $url];
+		}
+
+		$data['url'] = (string) $previewClient->getUrl();
+		$data['image'] = $data['cover'];
+
+		return $data;
+	}
+
+}
diff --git a/tests/lib_bookmark_test.php b/tests/lib_bookmark_test.php
index 89006b3bc..e77b80e37 100644
--- a/tests/lib_bookmark_test.php
+++ b/tests/lib_bookmark_test.php
@@ -2,12 +2,8 @@
 
 namespace OCA\Bookmarks\Tests;
 
-use GuzzleHttp\ClientInterface;
-use GuzzleHttp\Exception\RequestException;
 use OCA\Bookmarks\Controller\Lib\Bookmarks;
-use OCP\Http\Client\IClient;
-use OCP\Http\Client\IClientService;
-use OCP\Http\Client\IResponse;
+use OCA\Bookmarks\Controller\Lib\LinkExplorer;
 use OCP\User;
 
 /**
@@ -227,105 +223,6 @@ function testDeleteBookmark() {
 		$this->assertFalse($this->libBookmarks->bookmarkExists("http://www.heise.de", $this->userid));
 	}
 
-	function testGetURLMetadata() {
-		$amazonResponse = $this->fetchMock(IResponse::class);
-		$amazonResponse->expects($this->once())
-			->method('getBody')
-			->will($this->returnValue(file_get_contents(__DIR__ . '/res/amazonHtml.file')));
-		$amazonResponse->expects($this->once())
-			->method('getHeader')
-			->with('Content-Type')
-			->will($this->returnValue(''));
-
-		$golemResponse = $this->fetchMock(IResponse::class);
-		$golemResponse->expects($this->once())
-			->method('getBody')
-			->will($this->returnValue(file_get_contents(__DIR__ . '/res/golemHtml.file')));
-		$golemResponse->expects($this->once())
-			->method('getHeader')
-			->with('Content-Type')
-			->will($this->returnValue('text/html; charset=UTF-8'));
-
-		$clientMock = $this->fetchMock(IClient::class);
-		$clientMock->expects($this->exactly(2))
-			->method('get')
-			->will($this->returnCallback(function ($page) use($amazonResponse, $golemResponse) {
-				if($page === 'amazonHtml') {
-					return $amazonResponse;
-				} else if($page === 'golemHtml') {
-					return $golemResponse;
-				}
-				return null;
-			}));
-
-		$clientServiceMock = $this->fetchMock(IClientService::class);
-		$clientServiceMock->expects($this->any())
-			->method('newClient')
-			->will($this->returnValue($clientMock));
-
-		$this->registerHttpService($clientServiceMock);
-
-		// ugly, but works
-		$db = \OC::$server->getDatabaseConnection();
-		$config = \OC::$server->getConfig();
-		$l = \OC::$server->getL10N('bookmarks');
-		$clientService = \OC::$server->getHTTPClientService();
-		$event = \OC::$server->getEventDispatcher();
-		$logger = \OC::$server->getLogger();
-		$this->libBookmarks = new Bookmarks($db, $config, $l, $clientService, $event, $logger);
-
-		$metadataAmazon = $this->libBookmarks->getURLMetadata('amazonHtml');
-		$this->assertTrue($metadataAmazon['url'] == 'amazonHtml');
-		$this->assertTrue(strpos($metadataAmazon['title'], 'ü') !== false);
-
-		$metadataGolem = $this->libBookmarks->getURLMetadata('golemHtml');
-		$this->assertTrue($metadataGolem['url'] == 'golemHtml');
-		$this->assertTrue(strpos($metadataGolem['title'], 'f&uuml;r') == false);
-	}
-
-	/**
-	 * @expectedException \GuzzleHttp\Exception\RequestException
-	 */
-	public function testGetURLMetaDataTryHarder() {
-		$url = 'https://yolo.swag/check';
-
-		$curlOptions = [ 'curl' =>
-			[ CURLOPT_HTTPHEADER => ['Expect:'] ]
-		];
-		if(version_compare(ClientInterface::VERSION, '6') === -1) {
-			$options = ['config' => $curlOptions];
-		} else {
-			$options = $curlOptions;
-		}
-
-		$exceptionMock = $this->getMockBuilder(RequestException::class)
-			->disableOriginalConstructor()
-			->getMock();
-		$clientMock = $this->fetchMock(IClient::class);
-		$clientMock->expects($this->exactly(2))
-			->method('get')
-			->withConsecutive(
-				[$url, []],
-				[$url, $options]
-			)
-			->willThrowException($exceptionMock);
-
-		$clientServiceMock = $this->fetchMock(IClientService::class);
-		$clientServiceMock->expects($this->any())
-			->method('newClient')
-			->will($this->returnValue($clientMock));
-
-		// ugly, but works
-		$db = \OC::$server->getDatabaseConnection();
-		$config = \OC::$server->getConfig();
-		$l = \OC::$server->getL10N('bookmarks');
-		$event = \OC::$server->getEventDispatcher();
-		$logger = \OC::$server->getLogger();
-		$this->libBookmarks = new Bookmarks($db, $config, $l, $clientServiceMock, $event, $logger);
-
-		$this->libBookmarks->getURLMetadata($url);
-	}
-
 	protected function tearDown() {
 		$this->cleanDB();
 	}

From e8dd6acb9a8d9d453e69686786b4e70eb5e5fa98 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 17:20:59 +0100
Subject: [PATCH 081/110] Install composer deps on travis

---
 .travis.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.travis.yml b/.travis.yml
index 03c675f29..ccabfd5c4 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -104,6 +104,7 @@ branches:
 before_install:
   - sudo apt-get -qq update
   - sudo apt-get install -y libxml2-utils
+  - composer install
   - wget https://raw.githubusercontent.com/$SERVER/before_install.sh
   - . ./before_install.sh "$APP_NAME" "$SERVER_BRANCH" "$DB"
   - cd ../core || cd ../server

From 298fa87222447aed460a253f7b8616579a2753be Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 17:29:04 +0100
Subject: [PATCH 082/110] Fix tests

---
 tests/bookmarkcontroller_test.php | 5 +++--
 tests/lib_bookmark_test.php       | 4 ++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/tests/bookmarkcontroller_test.php b/tests/bookmarkcontroller_test.php
index 1fe87b150..1ccd615f6 100644
--- a/tests/bookmarkcontroller_test.php
+++ b/tests/bookmarkcontroller_test.php
@@ -4,6 +4,7 @@
 
 use OCA\Bookmarks\Controller\Rest\BookmarkController;
 use OCA\Bookmarks\Controller\Lib\Bookmarks;
+use OCA\Bookmarks\Controller\Lib\LinkExplorer;
 use OCP\AppFramework\Http;
 use OCP\AppFramework\Http\JSONResponse;
 
@@ -43,10 +44,10 @@ protected function setUp() {
 
 		$config = \OC::$server->getConfig();
 		$l = \OC::$server->getL10N('bookmarks');
-		$clientService = \OC::$server->getHTTPClientService();
+		$linkExplorer = \OC::$server->query(LinkExplorer::class);
 		$event = \OC::$server->getEventDispatcher();
 		$logger = \OC::$server->getLogger();
-		$this->libBookmarks = new Bookmarks($this->db, $config, $l, $clientService, $event, $logger);
+		$this->libBookmarks = new Bookmarks($this->db, $config, $l, $linkExplorer, $event, $logger);
 
 		$this->controller = new BookmarkController("bookmarks", $this->request, $this->userid, $this->db, $l, $this->libBookmarks, $this->userManager);
 		$this->publicController = new BookmarkController("bookmarks", $this->request, $this->otherUser, $this->db, $l, $this->libBookmarks, $this->userManager);
diff --git a/tests/lib_bookmark_test.php b/tests/lib_bookmark_test.php
index e77b80e37..edd1233bf 100644
--- a/tests/lib_bookmark_test.php
+++ b/tests/lib_bookmark_test.php
@@ -26,10 +26,10 @@ protected function setUp() {
 		$db = \OC::$server->getDatabaseConnection();
 		$config = \OC::$server->getConfig();
 		$l = \OC::$server->getL10N('bookmarks');
-		$clientService = \OC::$server->getHTTPClientService();
+		$linkExplorer = \OC::$server->query(LinkExplorer::class);
 		$event = \OC::$server->getEventDispatcher();
 		$logger = \OC::$server->getLogger();
-		$this->libBookmarks = new Bookmarks($db, $config, $l, $clientService, $event, $logger);
+		$this->libBookmarks = new Bookmarks($db, $config, $l, $linkExplorer, $event, $logger);
 		
     $this->otherUser = "otheruser";
 		$this->userManager = \OC::$server->getUserManager();

From 7c605c31d5999a24197ed9492f9582bc1283a4fd Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 17:45:42 +0100
Subject: [PATCH 083/110] Tests: Account for http->https redirects

---
 tests/bookmarkcontroller_test.php | 24 ++++++++++++------------
 tests/lib_bookmark_test.php       | 22 +++++++++++-----------
 2 files changed, 23 insertions(+), 23 deletions(-)

diff --git a/tests/bookmarkcontroller_test.php b/tests/bookmarkcontroller_test.php
index 1ccd615f6..5a8f5e46d 100644
--- a/tests/bookmarkcontroller_test.php
+++ b/tests/bookmarkcontroller_test.php
@@ -54,8 +54,8 @@ protected function setUp() {
 	}
 
 	function setupBookmarks() {
-		$this->testSubjectPrivateBmId = $this->libBookmarks->addBookmark($this->userid, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", false);
-		$this->testSubjectPublicBmId = $this->libBookmarks->addBookmark($this->userid, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->testSubjectPrivateBmId = $this->libBookmarks->addBookmark($this->userid, "https://www.golem.de", "Golem", array("four"), "PublicNoTag", false);
+		$this->testSubjectPublicBmId = $this->libBookmarks->addBookmark($this->userid, "https://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 	}
 	
 	function testPrivateRead() {
@@ -64,7 +64,7 @@ function testPrivateRead() {
 		$output = $this->controller->getSingleBookmark($this->testSubjectPublicBmId);
 		$data = $output->getData();
 		$this->assertEquals('success', $data['status']);
-		$this->assertEquals("http://www.9gag.com", $data['item']['url']);
+		$this->assertEquals("https://www.9gag.com", $data['item']['url']);
 	}
 
 	function testPublicReadSuccess() {
@@ -73,7 +73,7 @@ function testPublicReadSuccess() {
 		$output = $this->publicController->getSingleBookmark($this->testSubjectPublicBmId, $this->userid);
 		$data = $output->getData();
 		$this->assertEquals('success', $data['status']);
-		$this->assertEquals("http://www.9gag.com", $data['item']['url']);
+		$this->assertEquals("https://www.9gag.com", $data['item']['url']);
 	}
   
 	function testPublicReadFailure() {
@@ -113,10 +113,10 @@ function testPublicQuery() {
 	function testPublicCreate() {
 		$this->cleanDB();
 		$this->setupBookmarks();
-		$this->controller->newBookmark("http://www.heise.de", array("tags"=> array("four")), "Heise", true, "PublicNoTag");
+		$this->controller->newBookmark("https://www.heise.de", array("tags"=> array("four")), "Heise", true, "PublicNoTag");
 
 		// the bookmark should exist
-		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("http://www.heise.de", $this->userid));
+		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("https://www.heise.de", $this->userid));
 		// user should see this bookmark
 		$output = $this->controller->getBookmarks();
 		$data = $output->getData();
@@ -131,10 +131,10 @@ function testPublicCreate() {
 	function testPrivateCreate() {
 		$this->cleanDB();
 		$this->setupBookmarks();
-		$this->controller->newBookmark("http://www.heise.de", array("tags"=> array("four")), "Heise", false, "PublicNoTag");
+		$this->controller->newBookmark("https://www.heise.de", array("tags"=> array("four")), "Heise", false, "PublicNoTag");
 		
 		// the bookmark should exist
-		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("http://www.heise.de", $this->userid));
+		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("https://www.heise.de", $this->userid));
 		
 		// user should see this bookmark
 		$output = $this->controller->getBookmarks();
@@ -150,7 +150,7 @@ function testPrivateCreate() {
 	function testPrivateEditBookmark() {
 		$this->cleanDB();
 		$this->setupBookmarks();
-		$id = $this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Golem", array("four"), "PublicNoTag", true);
+		$id = $this->libBookmarks->addBookmark($this->userid, "https://www.heise.de", "Golem", array("four"), "PublicNoTag", true);
 
 		$this->controller->editBookmark($id, 'https://www.heise.de', null, '', true, $id, '');
 		
@@ -161,10 +161,10 @@ function testPrivateEditBookmark() {
 	function testPrivateDeleteBookmark() {
 		$this->cleanDB();
 		$this->setupBookmarks();
-		$id = $this->libBookmarks->addBookmark($this->userid, "http://www.google.com", "Heise", array("one", "two"), "PrivatTag", false);
+		$id = $this->libBookmarks->addBookmark($this->userid, "https://www.google.com", "Heise", array("one", "two"), "PrivatTag", false);
 		
 		$this->controller->deleteBookmark($id);
-		$this->assertFalse($this->libBookmarks->bookmarkExists("http://www.google.com", $this->userid));
+		$this->assertFalse($this->libBookmarks->bookmarkExists("https://www.google.com", $this->userid));
 	}
 
 	function testFindBookmarksEmptyTags() {
@@ -180,7 +180,7 @@ public function testClick() {
 		$this->cleanDB();
 		$this->setupBookmarks();
 
-		$r = $this->publicController->clickBookmark('http://www.golem.de');
+		$r = $this->publicController->clickBookmark('https://www.golem.de');
 		$this->assertInstanceOf(JSONResponse::class, $r);
 		$this->assertSame(Http::STATUS_OK, $r->getStatus());
 	}
diff --git a/tests/lib_bookmark_test.php b/tests/lib_bookmark_test.php
index edd1233bf..abc1d839f 100644
--- a/tests/lib_bookmark_test.php
+++ b/tests/lib_bookmark_test.php
@@ -197,30 +197,30 @@ function testFindUniqueBookmark() {
 
 	function testEditBookmark() {
 		$this->cleanDB();
-		$control_bm_id = $this->libBookmarks->addBookmark($this->userid, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($this->userid, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
-		$id = $this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
-		$this->libBookmarks->editBookmark($this->userid, $id, "http://www.google.de", "NewTitle", array("three", "four"));
+		$control_bm_id = $this->libBookmarks->addBookmark($this->userid, "https://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
+		$this->libBookmarks->addBookmark($this->userid, "https://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$id = $this->libBookmarks->addBookmark($this->userid, "https://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
+		$this->libBookmarks->editBookmark($this->userid, $id, "https://www.google.de", "NewTitle", array("three", "four"));
 		$bookmark = $this->libBookmarks->findUniqueBookmark($id, $this->userid);
 		$this->assertEquals("NewTitle", $bookmark['title']);
-		$this->assertEquals("http://www.google.de", $bookmark['url']);
+		$this->assertEquals("https://www.google.de", $bookmark['url']);
 		$this->assertEquals(['four', 'three'], $bookmark['tags']);
 		
 		// Make sure nothing else changed
 		$control_bookmark = $this->libBookmarks->findUniqueBookmark($control_bm_id, $this->userid);
 		$this->assertEquals("Golem", $control_bookmark['title']);
-		$this->assertEquals("http://www.golem.de", $control_bookmark['url']);
+		$this->assertEquals("https://www.golem.de", $control_bookmark['url']);
 		$this->assertEquals($control_bookmark['tags'], ['four']);
 	}
 
 	function testDeleteBookmark() {
 		$this->cleanDB();
-		$this->libBookmarks->addBookmark($this->userid, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
-		$id = $this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
-		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("http://www.google.de", $this->userid));
-		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("http://www.heise.de", $this->userid));
+		$this->libBookmarks->addBookmark($this->userid, "https://www.google.de", "Google", array("one"), "PrivateNoTag", false);
+		$id = $this->libBookmarks->addBookmark($this->userid, "https://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
+		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("https://www.google.de", $this->userid));
+		$this->assertNotEquals(false, $this->libBookmarks->bookmarkExists("https://www.heise.de", $this->userid));
 		$this->libBookmarks->deleteUrl($this->userid, $id);
-		$this->assertFalse($this->libBookmarks->bookmarkExists("http://www.heise.de", $this->userid));
+		$this->assertFalse($this->libBookmarks->bookmarkExists("https://www.heise.de", $this->userid));
 	}
 
 	protected function tearDown() {

From 5e13f6f8aa78c4ecd7098ee7b9f69a7db975bf2a Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 18:11:30 +0100
Subject: [PATCH 084/110] Don't store xml errors in memory

---
 controller/lib/bookmarks.php | 1 -
 1 file changed, 1 deletion(-)

diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index 30f60f95d..3ce17b288 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -657,7 +657,6 @@ private function addTags($bookmarkID, $tags) {
 	 * @return null
 	 * */
 	public function importFile($user, $file) {
-		libxml_use_internal_errors(true);
 		$dom = new \domDocument();
 
 		$dom->loadHTMLFile($file, \LIBXML_PARSEHUGE);

From c8333d3f4a8b3c62ecf07e9bd07b2168ad02b375 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 18:38:18 +0100
Subject: [PATCH 085/110] Disable internal errors in LinkExplorer

---
 controller/lib/linkexplorer.php | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/controller/lib/linkexplorer.php b/controller/lib/linkexplorer.php
index 6d6f44506..0d1470ac1 100644
--- a/controller/lib/linkexplorer.php
+++ b/controller/lib/linkexplorer.php
@@ -18,7 +18,8 @@ public function get($url) {
 		$previewClient = new LinkPreview($url);
 		$previewClient->getParser('general')->setMinimumImageDimension(0,0);
 		try {
-			$preview = $previewClient->getPreview('general');
+			libxml_use_internal_errors(false);
+            $preview = $previewClient->getPreview('general');
 		} catch (\Marcelklehr\LinkPreview\Exceptions\ConnectionErrorException $e) {
 			\OCP\Util::writeLog('bookmarks', $e, \OCP\Util::WARN);
 			return $data;

From d535a31301731bbdf498cb63d7b52d929c7767bb Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 18:39:23 +0100
Subject: [PATCH 086/110] Fix tests: www.9gag.com -> 9gag.com

---
 tests/bookmarkcontroller_test.php |  6 +++---
 tests/lib_bookmark_test.php       | 16 ++++++++--------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/tests/bookmarkcontroller_test.php b/tests/bookmarkcontroller_test.php
index 5a8f5e46d..82b28d5bf 100644
--- a/tests/bookmarkcontroller_test.php
+++ b/tests/bookmarkcontroller_test.php
@@ -55,7 +55,7 @@ protected function setUp() {
 
 	function setupBookmarks() {
 		$this->testSubjectPrivateBmId = $this->libBookmarks->addBookmark($this->userid, "https://www.golem.de", "Golem", array("four"), "PublicNoTag", false);
-		$this->testSubjectPublicBmId = $this->libBookmarks->addBookmark($this->userid, "https://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->testSubjectPublicBmId = $this->libBookmarks->addBookmark($this->userid, "https://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 	}
 	
 	function testPrivateRead() {
@@ -64,7 +64,7 @@ function testPrivateRead() {
 		$output = $this->controller->getSingleBookmark($this->testSubjectPublicBmId);
 		$data = $output->getData();
 		$this->assertEquals('success', $data['status']);
-		$this->assertEquals("https://www.9gag.com", $data['item']['url']);
+		$this->assertEquals("https://9gag.com", $data['item']['url']);
 	}
 
 	function testPublicReadSuccess() {
@@ -73,7 +73,7 @@ function testPublicReadSuccess() {
 		$output = $this->publicController->getSingleBookmark($this->testSubjectPublicBmId, $this->userid);
 		$data = $output->getData();
 		$this->assertEquals('success', $data['status']);
-		$this->assertEquals("https://www.9gag.com", $data['item']['url']);
+		$this->assertEquals("https://9gag.com", $data['item']['url']);
 	}
   
 	function testPublicReadFailure() {
diff --git a/tests/lib_bookmark_test.php b/tests/lib_bookmark_test.php
index abc1d839f..4e07209bb 100644
--- a/tests/lib_bookmark_test.php
+++ b/tests/lib_bookmark_test.php
@@ -53,7 +53,7 @@ function testFindBookmarks() {
 		$this->libBookmarks->addBookmark($this->userid, "http://www.google.de", "Google", array("one"), "PrivateTwoTags", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.golem.de", "Golem", array("one"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($this->userid, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($this->userid, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		$outputPrivate = $this->libBookmarks->findBookmarks($this->userid, 0, "", [], true, -1, false);
 		$this->assertCount(5, $outputPrivate);
 		$outputPrivateFiltered = $this->libBookmarks->findBookmarks($this->userid, 0, "", ["one"], true, -1, false);
@@ -70,11 +70,11 @@ function testFindBookmarksSelectAndOrFilteredTags() {
 		$this->libBookmarks->addBookmark($this->userid, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($this->userid, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($this->userid, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($secondUser, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($secondUser, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		$resultSetOne = $this->libBookmarks->findBookmarks($this->userid, 0, 'lastmodified', array('one', 'three'), true, -1, false, array('url', 'title', 'tags'), 'or');
     $this->assertEquals(3, count($resultSetOne));
 		$resultOne = $resultSetOne[0];
@@ -112,11 +112,11 @@ function testRenameTag() {
 		$this->libBookmarks->addBookmark($this->userid, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($this->userid, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($this->userid, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($secondUser, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($secondUser, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		
 		$firstUserTags = $this->libBookmarks->findTags($this->userid);
 		$this->assertTrue(in_array(['tag' => 'one', 'nbr' => 2], $firstUserTags));
@@ -152,11 +152,11 @@ function testDeleteTag() {
 		$this->libBookmarks->addBookmark($this->userid, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($this->userid, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($this->userid, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($this->userid, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.google.de", "Google", array("one"), "PrivateNoTag", false);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->addBookmark($secondUser, "http://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($secondUser, "http://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($secondUser, "http://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		
 		$firstUserTags = $this->libBookmarks->findTags($this->userid);
 		$this->assertTrue(in_array(['tag' => 'one', 'nbr' => 2], $firstUserTags));
@@ -198,7 +198,7 @@ function testFindUniqueBookmark() {
 	function testEditBookmark() {
 		$this->cleanDB();
 		$control_bm_id = $this->libBookmarks->addBookmark($this->userid, "https://www.golem.de", "Golem", array("four"), "PublicNoTag", true);
-		$this->libBookmarks->addBookmark($this->userid, "https://www.9gag.com", "9gag", array("two", "three"), "PublicTag", true);
+		$this->libBookmarks->addBookmark($this->userid, "https://9gag.com", "9gag", array("two", "three"), "PublicTag", true);
 		$id = $this->libBookmarks->addBookmark($this->userid, "https://www.heise.de", "Heise", array("one", "two"), "PrivatTag", false);
 		$this->libBookmarks->editBookmark($this->userid, $id, "https://www.google.de", "NewTitle", array("three", "four"));
 		$bookmark = $this->libBookmarks->findUniqueBookmark($id, $this->userid);

From 00d34c2d7ce3ef8c3f4d160bf727f7886cf36f23 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 20:20:30 +0100
Subject: [PATCH 087/110] Fix clickcount API endpoint

---
 controller/rest/bookmarkcontroller.php | 14 +-------------
 1 file changed, 1 insertion(+), 13 deletions(-)

diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index 545dd035a..ada5ecc73 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -313,24 +313,12 @@ public function clickBookmark($url = "") {
 		if(!$this->bookmarks->isProperURL($urlData)) {
 			return new JSONResponse([], Http::STATUS_BAD_REQUEST);
 		}
-		// prepare url for query
-		$url = $this->db->escapeLikeParameter(htmlspecialchars_decode($url));
-
-		$config = \OC::$server->getConfig();
-		$escape = '';
-		if(
-			strpos($config->getSystemValue('dbtype'),'sqlite') !== false
-			&& version_compare($config->getSystemValue('version'), 12, '<')
-		) {
-			// sqlite requires the ESCAPE declaration, which is added per default as of Nc 12
-			$escape = ' ESCAPE \'\\\'';
-		}
 
 		$qb = $this->db->getQueryBuilder();
 		$qb->update('bookmarks')
 			->set('clickcount', $qb->createFunction('`clickcount` +1'))
 			->where($qb->expr()->eq('user_id', $qb->createNamedParameter($this->userId)))
-			->andWhere($qb->expr()->like('url', $qb->createNamedParameter($url)) . $escape)
+			->andWhere($qb->expr()->eq('url', $qb->createNamedParameter(htmlspecialchars_decode($url))))
 			->execute();
 
 		return new JSONResponse(['status' => 'success'], Http::STATUS_OK);

From af919c503a8a6cb6b548ebd6ddf394db84617d6d Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 21:02:50 +0100
Subject: [PATCH 088/110] Wire up click counter: Count and sort by clicks

also: open links in new tab
---
 js/models/Bookmark.js                    | 13 ++++++++++++-
 js/models/Bookmarks.js                   |  3 ++-
 js/templates/BookmarkCard.html           |  2 +-
 js/templates/BookmarkDetail_default.html |  2 +-
 js/views/BookmarkCard.js                 |  9 +++++++--
 js/views/BookmarkDetail.js               |  5 +++++
 6 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/js/models/Bookmark.js b/js/models/Bookmark.js
index 3663b9f90..39e279c47 100644
--- a/js/models/Bookmark.js
+++ b/js/models/Bookmark.js
@@ -1,5 +1,16 @@
 import Backbone from 'backbone';
+import $ from 'jquery'
 
 export default Backbone.Model.extend({
-	urlRoot: 'bookmark'
+	urlRoot: 'bookmark',
+	clickLink: function() {
+		const url = encodeURIComponent(this.get('url'))
+		$.ajax({
+			method: 'POST',
+			url: 'bookmark/click?url='+url,
+			headers: {
+				'requesttoken': oc_requesttoken
+			}
+		})
+	}
 });
diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
index c36734761..812b78132 100644
--- a/js/models/Bookmarks.js
+++ b/js/models/Bookmarks.js
@@ -3,5 +3,6 @@ import Bookmark from './Bookmark';
 
 export default Backbone.Collection.extend({
 	model: Bookmark,
-	url: 'bookmark'
+	url: 'bookmark',
+	comparator: function(b) {return -b.get('clickcount');}
 });
diff --git a/js/templates/BookmarkCard.html b/js/templates/BookmarkCard.html
index 85e5bff27..b05d6ee49 100644
--- a/js/templates/BookmarkCard.html
+++ b/js/templates/BookmarkCard.html
@@ -2,7 +2,7 @@
 	<input type="checkbox" name="selector" class="checkbox"/>
 	<label class="selectbox" for="selector"  title="<%- t('bookmarks', 'Select') %>"></label>
 	<h1><%- title %></h1>
-	<h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
+	<h2><a target="_blank" href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
 	<div class="actions">
 		<div class="icon-more toggle" title="<%- t('bookmarks', 'Open menu') %>"></div>
 		<div class="popovermenu">
diff --git a/js/templates/BookmarkDetail_default.html b/js/templates/BookmarkDetail_default.html
index 7443c9ce1..8b59c7dc1 100644
--- a/js/templates/BookmarkDetail_default.html
+++ b/js/templates/BookmarkDetail_default.html
@@ -4,6 +4,6 @@
 	<button class="delete icon-delete"></button>
 </div>
 <h1><%- title %></h1>
-<h2><a href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
+<h2><a target="_blank" href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
 <div class="tags"></div>
 <div class="description"><%- description %></div>
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 9669a1e11..135d05186 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -11,6 +11,7 @@ export default Marionette.View.extend({
 	template: _.template(templateString),
 	className: 'bookmark-card',
 	ui: {
+		'link': 'h2 > a',
 		'checkbox': '.selectbox',
 		'actionsToggle': '.actions .toggle',
 		'actionsMenu': '.actions .popovermenu'
@@ -20,8 +21,9 @@ export default Marionette.View.extend({
 	},
 	events: {
 		'click': 'open',
-		 'click @ui.checkbox': 'select',
-		 'click @ui.actionsToggle': 'toggleActions',
+		'click @ui.link': 'clickLink',
+		'click @ui.checkbox': 'select',
+		'click @ui.actionsToggle': 'toggleActions',
 		'blur @ui.actionsToggle': 'closeActions',
 		'click .action-edit': 'actionEdit',
 		'click .action-delete': 'actionDelete',
@@ -45,6 +47,9 @@ export default Marionette.View.extend({
 		this.showChildView('tags', new TagsNavigationView({collection: tags}));
 		this.$('.checkbox').prop('checked', this.$el.hasClass('active'));
 	},
+	clickLink: function() {
+		this.model.clickLink();
+	},
 	open: function(e) {
 		if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return;
 		Radio.channel('details').trigger('show', this.model);
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index 2fda1dac8..a5bf9a5c6 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -25,11 +25,13 @@ export default Marionette.View.extend({
 		}
 	},
 	ui: {
+		'link': 'h2 > a',
 		'close': '> .close',
 		'edit': '.edit',
 		'delete': '.delete'
 	},
 	events: {
+		'click @ui.link': 'clickLink',
 		'click @ui.close': 'close',
 		'click @ui.edit': 'edit',
 		'click @ui.delete': 'delete',
@@ -52,6 +54,9 @@ export default Marionette.View.extend({
 			this.showChildView('tags', new TagsNavigationView({collection: this.tags}));
 		}
 	},
+	clickLink: function() {
+		this.model.clickLink();
+	},
 	close: function() {
 		Radio.channel('details').trigger('close');
 	},

From 7d5d03f27c5bc0492e1e9f6761cd72f777517906 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 21 Feb 2018 21:08:01 +0100
Subject: [PATCH 089/110] Sort by lastmodified

---
 js/models/Bookmarks.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
index 812b78132..c3503627d 100644
--- a/js/models/Bookmarks.js
+++ b/js/models/Bookmarks.js
@@ -4,5 +4,4 @@ import Bookmark from './Bookmark';
 export default Backbone.Collection.extend({
 	model: Bookmark,
 	url: 'bookmark',
-	comparator: function(b) {return -b.get('clickcount');}
 });

From d18d2d9a35ea7bc6f348da38ecb7230c0b2d52e4 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sun, 25 Feb 2018 16:56:20 +0100
Subject: [PATCH 090/110] Fix multi-tag filter functionality

---
 js/Router.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/Router.js b/js/Router.js
index 57409559b..e15c9c371 100644
--- a/js/Router.js
+++ b/js/Router.js
@@ -28,7 +28,7 @@ export default Marionette.AppRouter.extend({
 		tags: function(tagString) {
 			var tags = tagString? tagString.split(',').map(decodeURIComponent) : []; 
 			this.app.bookmarks.fetch({
-				data: {tags: tags, page: -1}
+				data: {tags: tags, page: -1, conjunction: 'and'}
 			});
 			Radio.channel('nav').trigger('navigate', 'tags', tags);
 		},

From d6f1ca5aa1c818995abfc4f2c8c62e630b590fc1 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 27 Feb 2018 20:08:04 +0100
Subject: [PATCH 091/110] Fix some minor styling issues

---
 css/bookmarks.css                           | 3 ++-
 js/templates/BookmarkDetail_editing.html    | 2 +-
 js/templates/Settings.html                  | 2 +-
 js/templates/TagsManagementTag_default.html | 4 ++--
 4 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 1f0b2b75d..2c9059a14 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -402,6 +402,7 @@ button span,
 
 .bookmark-detail .input-desc {
 	height: 300px;
+    resize: vertical;
 }
 
 .tags-management {
@@ -465,7 +466,7 @@ button span,
 /* make checkbox look like an icon */
 
 .menu-item-checkbox span:first-child {
-	padding: 0 10px;
+  padding: 5px 5px;
 }
 
 /* display 'remove from filter' when selected, and 'add to ...' when unselected*/
diff --git a/js/templates/BookmarkDetail_editing.html b/js/templates/BookmarkDetail_editing.html
index db15e17f8..f0dcdcc73 100644
--- a/js/templates/BookmarkDetail_editing.html
+++ b/js/templates/BookmarkDetail_editing.html
@@ -8,7 +8,7 @@ <h2><input type="type" class="input-url icon-external" value="<%- url %>" placeh
 </div>
 <div class="actions editing">
 	<button class="submit primary">
-		<span class="icon-checkmark"></span> <span><%- t('bookmarks', 'Save') %></span>
+		<span class="icon-checkmark-white"></span> <span><%- t('bookmarks', 'Save') %></span>
 	</button>
 	<button class="cancel"><%- t('bookmarks', 'Cancel') %></button>
 </div>
diff --git a/js/templates/Settings.html b/js/templates/Settings.html
index 15cd3ccad..1a38cdf3c 100644
--- a/js/templates/Settings.html
+++ b/js/templates/Settings.html
@@ -8,6 +8,6 @@
 		<button class="import-facade"><span class="icon-upload"></span> <%- t('bookmarks', 'Import') %></button>
 	</form>
 	<iframe class="upload" name="upload_iframe" id="upload_iframe"></iframe>
-	<button class="export"><span class="icon-download"></span> <%- t('bookmarks', 'Import') %></button>
+	<button class="export"><span class="icon-download"></span> <%- t('bookmarks', 'Export') %></button>
 	<div class="import-status"></div>
 </div>
diff --git a/js/templates/TagsManagementTag_default.html b/js/templates/TagsManagementTag_default.html
index 2b7b2322e..2f1e5e0c6 100644
--- a/js/templates/TagsManagementTag_default.html
+++ b/js/templates/TagsManagementTag_default.html
@@ -12,13 +12,13 @@
 <div class="app-navigation-entry-menu">
 	<ul>
 		<li>
-			<button class="menu-filter-add">
+			<button class="menu-item-checkbox menu-filter-add">
 				<span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span>
 				<span><%- t('bookmarks', 'Add to filter') %></span>
 			</button>
 		</li>
 		<li>
-			<button class="menu-filter-remove">
+			<button class="menu-item-checkbox menu-filter-remove">
 				<span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span>
 				<span><%- t('bookmarks', 'Remove from filter') %></span>
 			</button>

From 9c28057ee25cb4653959aee6110004fadb400ddf Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 27 Feb 2018 20:38:22 +0100
Subject: [PATCH 092/110] Fix select2 styles

---
 css/bookmarks.css |  3 +++
 css/select2.css   | 18 ++++++++++++++++++
 2 files changed, 21 insertions(+)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 2c9059a14..6fc08ff88 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -379,6 +379,9 @@ button span,
 .bookmark-detail.editing h1 {
 	padding-right: 0;
 }
+.bookmark-detail.editing h2 {
+	opacity: 1;
+}
 
 .bookmark-detail.editing .actions button {
 	height: auto;
diff --git a/css/select2.css b/css/select2.css
index 2506a3bdf..54d8e0e4c 100644
--- a/css/select2.css
+++ b/css/select2.css
@@ -635,3 +635,21 @@
 .select2-container--classic.select2-container--open .select2-dropdown {
 	border-color: #5897fb;
 }
+
+/* Nextcloud styling */
+
+.select2-selection__choice__remove,
+.select2-selection__clear {
+	font-size: .5cm;
+	vertical-align: bottom;
+}
+
+.select2-container--default.select2-container--focus .select2-selection--multiple {
+	border-color: #0082c9;
+}
+.select2-container--default .select2-selection--multiple {
+	border-color: #dbdbdb;
+}
+.select2-container--default .select2-selection--multiple:hover {
+	border-color: #0082c9;
+}

From 96d4a98653372660f38e94a280337d4ceb9a2040 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 27 Feb 2018 21:09:41 +0100
Subject: [PATCH 093/110] Fix styling of bulk actions

---
 css/bookmarks.css             | 23 ++++++++++++++++++-----
 js/templates/BulkActions.html |  2 +-
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 6fc08ff88..70d98bda5 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -79,9 +79,9 @@
 	top: 45px;
 	left: 250px;
 	right: 0;
-	border-bottom: 1px solid #ebebeb;
-	padding: .3cm .5cm;
-	background: #e9f7ff;
+	box-shadow: 2px 1px 4px 0px #666;
+    padding: .3cm .5cm;
+	background: white;
 	z-index: 3;
 }
 
@@ -108,9 +108,8 @@
 	}
 
 	.bulk-actions.active + * {
-		margin-top: 0;
+		margin-top: 0 !important;
 	}
-
 }
 
 .bulk-actions > button {
@@ -154,6 +153,20 @@ button span,
 	cursor: pointer;
 }
 
+@media only screen and (max-width: 925px) {
+    .bulk-actions .tags {
+        width: 80%;
+    }
+    .bulk-actions .selection-tools {
+        float: none;
+        text-align: right;
+        margin-bottom: .5cm;
+    }
+	.bulk-actions.active + * {
+		margin-top: 3.5cm;
+	}
+}
+
 .bookmarks-empty {
 	width: 5cm;
 	margin: 20% auto;
diff --git a/js/templates/BulkActions.html b/js/templates/BulkActions.html
index f3b8ba40b..ce7a3b9d5 100644
--- a/js/templates/BulkActions.html
+++ b/js/templates/BulkActions.html
@@ -1,5 +1,5 @@
 <div class="selection-tools">
-	<button class="select-all"><span class="icon-checkmark"></span><span><%- t('bookmarks', 'Select all visible bookmarks') %></span></button>
+	<button class="primary select-all"><span class="icon-checkmark-white"></span><span> <%- t('bookmarks', 'Select all visible') %></span></button>
 	<div class="close" title="<%- t('bookmarks', 'Cancel') %>"><span class="icon-close"></span></div>
 </div>
 <button class="delete">

From f3c5bee354be40df2431701dded19fcaa41d4919 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 27 Feb 2018 21:13:40 +0100
Subject: [PATCH 094/110] TagSelection: Remove clear button

---
 js/views/TagsSelection.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/js/views/TagsSelection.js b/js/views/TagsSelection.js
index 90b04c6a4..c824e9be8 100644
--- a/js/views/TagsSelection.js
+++ b/js/views/TagsSelection.js
@@ -30,7 +30,6 @@ export default Marionette.View.extend({
 		}
 		this.$el.select2({
 			placeholder: t('bookmarks', 'Set tags'),
-			allowClear: true,
 			width: '100%',
 			tags: true,
 			multiple: true,

From dcbecdd581d34c7280423685779a403f9f1d1e76 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Tue, 27 Feb 2018 23:19:30 +0100
Subject: [PATCH 095/110] BookmarkDetailView: In-place editing + auto-save

---
 css/bookmarks.css                        | 48 +++++----------
 js/templates/BookmarkCard.html           |  6 --
 js/templates/BookmarkDetail.html         | 14 +++++
 js/templates/BookmarkDetail_default.html |  9 ---
 js/templates/BookmarkDetail_editing.html | 14 -----
 js/views/BookmarkCard.js                 |  4 --
 js/views/BookmarkDetail.js               | 75 ++++++++++++------------
 js/views/Content.js                      |  5 --
 8 files changed, 67 insertions(+), 108 deletions(-)
 create mode 100644 js/templates/BookmarkDetail.html
 delete mode 100644 js/templates/BookmarkDetail_default.html
 delete mode 100644 js/templates/BookmarkDetail_editing.html

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 70d98bda5..ec068b329 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -317,6 +317,7 @@ button span,
 	padding: 1cm;
 	background: white;
 	border-left: 1px solid #ebebeb;
+    color: #333;
 }
 
 @media only screen and (max-width: 768px) {
@@ -329,8 +330,8 @@ button span,
 }
 
 .bookmark-detail h1 {
-	font-size: .8cm;
-	line-height: 1;
+	font-size: .7cm;
+	line-height: 1.3;
 	padding-right: 2.3cm;
 }
 
@@ -338,6 +339,14 @@ button span,
 	margin-top: .3cm;
 	opacity: .4;
 }
+.bookmark-detail h2 .edit {
+    float: right;
+}
+.bookmark-detail h3 {
+	margin-top: 1cm;
+	margin-bottom: .3cm;
+    border-bottom: 1px solid #ebebeb;
+}
 
 .bookmark-detail h2 :link:hover {
 	text-decoration: underline;
@@ -387,39 +396,12 @@ button span,
 
 .bookmark-detail .description {
 	margin-top: .5cm;
+    font-size: .4cm;
+	/*for editing*/
+    width: auto;
+    min-height: 300px;
 }
 
-.bookmark-detail.editing h1 {
-	padding-right: 0;
-}
-.bookmark-detail.editing h2 {
-	opacity: 1;
-}
-
-.bookmark-detail.editing .actions button {
-	height: auto;
-	width: auto;
-}
-
-.bookmark-detail .input-url,
-.bookmark-detail .input-title,
-.bookmark-detail .input-desc,
-.bookmark-detail .tags-selection {
-	width: 100%;
-	font-size: inherit;
-	box-sizing: border-box;
-	padding: 0 !important;
-}
-
-.bookmark-detail .input-url {
-	padding-left: 25px !important;
-	background-position: 5px;
-}
-
-.bookmark-detail .input-desc {
-	height: 300px;
-    resize: vertical;
-}
 
 .tags-management {
 	height: 80% !important;
diff --git a/js/templates/BookmarkCard.html b/js/templates/BookmarkCard.html
index b05d6ee49..b4cd81c00 100644
--- a/js/templates/BookmarkCard.html
+++ b/js/templates/BookmarkCard.html
@@ -19,12 +19,6 @@ <h2><a target="_blank" href="<%- url %>"><span class="icon-external"></span><%-
 						<span><%- t('bookmarks', 'Unselect') %></span>
 					</button>
 				</li>
-				<li>
-					<button class="action-edit">
-						<span class="icon-edit"></span>
-						<span><%- t('bookmarks', 'Edit') %></span>
-					</button>
-				</li>
 				<li>
 					<button class="action-delete">
 						<span class="icon-delete"></span>
diff --git a/js/templates/BookmarkDetail.html b/js/templates/BookmarkDetail.html
new file mode 100644
index 000000000..6f4ba74e2
--- /dev/null
+++ b/js/templates/BookmarkDetail.html
@@ -0,0 +1,14 @@
+<div class="close icon-close" title="<%- t('bookmarks', 'Close') %>"></div>
+<div class="actions">
+	<button class="delete icon-delete"></button>
+</div>
+<h1 data-attribute="title"><%- title %></h1>
+<h3>Link</h3>
+<h2 data-attribute="url">
+	<a target="_blank" href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a>
+	<a href="#" class="edit"><span class="icon-rename"></span></a>
+</h2>
+<h3><%- t('bookmarks', 'Tags') %></h3>
+<div class="tags"></div>
+<h3><%- t('bookmarks', 'Description') %></h3>
+<div class="description" data-attribute="description"><%- description %></div>
diff --git a/js/templates/BookmarkDetail_default.html b/js/templates/BookmarkDetail_default.html
deleted file mode 100644
index 8b59c7dc1..000000000
--- a/js/templates/BookmarkDetail_default.html
+++ /dev/null
@@ -1,9 +0,0 @@
-<div class="close icon-close" title="<%- t('bookmarks', 'Close') %>"></div>
-<div class="actions">
-	<button class="edit icon-rename"></button>
-	<button class="delete icon-delete"></button>
-</div>
-<h1><%- title %></h1>
-<h2><a target="_blank" href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
-<div class="tags"></div>
-<div class="description"><%- description %></div>
diff --git a/js/templates/BookmarkDetail_editing.html b/js/templates/BookmarkDetail_editing.html
deleted file mode 100644
index f0dcdcc73..000000000
--- a/js/templates/BookmarkDetail_editing.html
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="close icon-close" title="<%- t('bookmarks', 'Close') %>"></div>
-<h1><input class="input-title" type="text" value="<%- title %>" placeholder="<%- t('bookmarks', 'The title of the page') %>" /></h1>
-<h2><input type="type" class="input-url icon-external" value="<%- url %>" placeholder="<%- t('bookmarks', 'The address of the page') %>" /></h2>
-<div class="tags">
-</div>
-<div class="description">
-	<textarea class="input-desc" placeholder="<%- t('bookmarks', 'A description of the page') %>"><%- description %></textarea>
-</div>
-<div class="actions editing">
-	<button class="submit primary">
-		<span class="icon-checkmark-white"></span> <span><%- t('bookmarks', 'Save') %></span>
-	</button>
-	<button class="cancel"><%- t('bookmarks', 'Cancel') %></button>
-</div>
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 135d05186..3f417b297 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -25,7 +25,6 @@ export default Marionette.View.extend({
 		'click @ui.checkbox': 'select',
 		'click @ui.actionsToggle': 'toggleActions',
 		'blur @ui.actionsToggle': 'closeActions',
-		'click .action-edit': 'actionEdit',
 		'click .action-delete': 'actionDelete',
 		'click .action-select': 'select',
 		'click .action-unselect': 'select'
@@ -81,8 +80,5 @@ export default Marionette.View.extend({
 	},
 	actionDelete: function() {
 		this.model.destroy();
-	},
-	actionEdit: function() {
-		Radio.channel('details').trigger('edit', this.model);
 	}
 });
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index a5bf9a5c6..a81af28ab 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -3,21 +3,13 @@ import Backbone from 'backbone';
 import Tags from '../models/Tags';
 import TagsNavigationView from './TagsNavigation';
 import TagsSelectionView from './TagsSelection';
-import templateStringDefault from '../templates/BookmarkDetail_default.html';
-import templateStringEditing from '../templates/BookmarkDetail_editing.html';
+import templateString from '../templates/BookmarkDetail.html';
 
 const Marionette = Backbone.Marionette;
 const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-	getTemplate: function() {
-		if (this.editing) {
-			return this.templateEditing;
-		}
-		return this.templateDefault;
-	},
-	templateDefault: _.template(templateStringDefault),
-	templateEditing: _.template(templateStringEditing),
+	template: _.template(templateString),
 	className: 'bookmark-detail',
 	regions: {
 		'tags': {
@@ -33,8 +25,10 @@ export default Marionette.View.extend({
 	events: {
 		'click @ui.link': 'clickLink',
 		'click @ui.close': 'close',
-		'click @ui.edit': 'edit',
 		'click @ui.delete': 'delete',
+		'click h1': 'edit',
+		'click h2 .edit': 'edit',
+		'click .description': 'edit',
 		'click .submit': 'submit',
 		'click .cancel': 'cancel'
 	},
@@ -48,11 +42,8 @@ export default Marionette.View.extend({
 		this.tags = new Tags(this.model.get('tags').map(function(id) {
 			return that.app.tags.findWhere({name: id});
 		}));
-		if (this.editing) {
-			this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }));
-		}else{
-			this.showChildView('tags', new TagsNavigationView({collection: this.tags}));
-		}
+		this.listenTo(this.tags, 'add remove', this.submitTags);
+		this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }));
 	},
 	clickLink: function() {
 		this.model.clickLink();
@@ -60,34 +51,44 @@ export default Marionette.View.extend({
 	close: function() {
 		Radio.channel('details').trigger('close');
 	},
-	setEditing: function(isEditing) {
-		if (isEditing) {
-			this.editing = true;
-			this.$el.addClass('editing');
-		}else{
-			this.editing = false;
-			this.$el.removeClass('editing');
+	edit: function(e) {
+	    var that = this;
+		e.preventDefault();
+		
+		var $el = $(e.target).closest('[data-attribute]');
+		
+		switch($el.data('attribute')) {
+		case 'url':
+			$el.text(this.model.get('url'));
+			// fallthrough
+		case 'title':
+			$el.keydown(function(e) {
+				// enter
+				if (e.which === 13) {
+					that.submit($el);
+				}
+			});
+			break;
+		case 'description':
+			break;
 		}
-		this.render();
-	},
-	edit: function() {
-		this.setEditing(true);
+		$el.prop('contenteditable', true);
+		$el.blur(function() {
+			that.submit($el);
+		});
+		$el.focus();
 	},
-	submit: function() {
-		var that = this;
+	submitTags: function() {
 		this.model.set({
-			'title': this.$('.input-title').val(),
-			'url': this.$('.input-url').val(),
 			'tags': this.tags.pluck('name'),
-			'description': this.$('.input-desc').val()
 		});
 		this.model.save({wait: true});
-		this.model.once('sync', function() {
-			that.cancel();
-		});
 	},
-	cancel: function() {
-		this.setEditing(false);
+	submit: function($el) {
+		this.model.set({
+			[$el.data('attribute')]: $el.text()
+		});
+		this.model.save({wait: true});
 	},
 	onDestroy: function() {
 		this.close(); 
diff --git a/js/views/Content.js b/js/views/Content.js
index 726684165..8191d2779 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -38,7 +38,6 @@ export default Marionette.View.extend({
 		this.listenTo(this.bookmarks, 'unselect', this.onUnselect);
 		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate);
 		this.listenTo(Radio.channel('details'), 'show', this.onShowDetails);
-		this.listenTo(Radio.channel('details'), 'edit', this.onEditDetails);
 		this.listenTo(Radio.channel('details'), 'close', this.onCloseDetails);
 	},
 	onRender: function() {
@@ -62,10 +61,6 @@ export default Marionette.View.extend({
 		var view = new BookmarkDetailView({model: model, app: this.app});
 		this.showChildView('bookmarkDetail', view);
 	},
-	onEditDetails: function(model) {
-		this.onShowDetails(model);
-		this.getRegion('bookmarkDetail').currentView.setEditing(true);
-	},
 	onCloseDetails: function() {
 		this.detachChildView('bookmarkDetail');
 	}

From 75fdb36593363b5ca6dfe2864f417057bcbe7776 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 28 Feb 2018 21:41:24 +0100
Subject: [PATCH 096/110] Add visual cue for editability of description

---
 css/bookmarks.css                | 11 ++++++++---
 js/templates/BookmarkDetail.html |  2 +-
 js/views/BookmarkDetail.js       |  3 +++
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index ec068b329..f1ad05cb5 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -333,6 +333,7 @@ button span,
 	font-size: .7cm;
 	line-height: 1.3;
 	padding-right: 2.3cm;
+    cursor: text;
 }
 
 .bookmark-detail h2 {
@@ -396,12 +397,16 @@ button span,
 
 .bookmark-detail .description {
 	margin-top: .5cm;
-    font-size: .4cm;
+	font-size: .4cm;
 	/*for editing*/
-    width: auto;
-    min-height: 300px;
+	width: auto;
+	min-height: 300px;
+	cursor: text;
 }
 
+.bookmark-detail .description.empty {
+	opacity: .4;
+}
 
 .tags-management {
 	height: 80% !important;
diff --git a/js/templates/BookmarkDetail.html b/js/templates/BookmarkDetail.html
index 6f4ba74e2..f9ba62211 100644
--- a/js/templates/BookmarkDetail.html
+++ b/js/templates/BookmarkDetail.html
@@ -11,4 +11,4 @@ <h2 data-attribute="url">
 <h3><%- t('bookmarks', 'Tags') %></h3>
 <div class="tags"></div>
 <h3><%- t('bookmarks', 'Description') %></h3>
-<div class="description" data-attribute="description"><%- description %></div>
+<div class="description <%- !description.trim()? 'empty' : '' %>" data-attribute="description"><%- description.trim()? description : t('bookmarks', 'Add a description...') %></div>
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index a81af28ab..b0362190e 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -70,6 +70,9 @@ export default Marionette.View.extend({
 			});
 			break;
 		case 'description':
+			if ($el.hasClass('empty')) {
+				$el.text('')
+			}
 			break;
 		}
 		$el.prop('contenteditable', true);

From ad20199c0940796c1b4345dc1eeeead804768589 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 28 Feb 2018 22:03:20 +0100
Subject: [PATCH 097/110] Remove menu from  bookmark cards

and always display checkbox
---
 css/bookmarks.css              | 34 ----------------------------------
 js/templates/BookmarkCard.html | 25 -------------------------
 js/views/BookmarkCard.js       | 19 -------------------
 js/views/BookmarkDetail.js     |  4 ++++
 4 files changed, 4 insertions(+), 78 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index f1ad05cb5..b287c98c2 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -227,18 +227,11 @@ button span,
 }
 
 .bookmark-card .selectbox {
-	display: none;
 	position: absolute;
 	left: .1cm;
 	top: .5cm;
 }
 
-.selection-active .bookmark-card .selectbox,
-.bookmark-card:hover .selectbox,
-.bookmark-card.active .selectbox {
-	display: inline-block;
-}
-
 .bookmark-card h1 {
 	font-size: .5cm;
 	padding-right: .5cm;
@@ -260,33 +253,6 @@ button span,
 	text-decoration: underline;
 }
 
-.bookmark-card .actions {
-	display: none;
-	position: absolute;
-	top: .5cm;
-	right: .5cm;
-}
-
-.bookmark-card:hover .actions,
-.bookmark-card.actions-open .actions {
-	display: block;
-}
-
-.bookmark-card .actions .popovermenu {
-	top: 24px;
-	right: -14px;
-}
-
-.bookmark-card .actions .action-select,
-.bookmark-card.active .actions .action-unselect {
-	display: block;
-}
-
-.bookmark-card .actions .action-unselect,
-.bookmark-card.active .actions .action-select {
-	display: none;
-}
-
 .bookmark-card .tags {
 	max-height: 2.5cm;
 	overflow: hidden;
diff --git a/js/templates/BookmarkCard.html b/js/templates/BookmarkCard.html
index b4cd81c00..7f80ffc32 100644
--- a/js/templates/BookmarkCard.html
+++ b/js/templates/BookmarkCard.html
@@ -3,30 +3,5 @@
 	<label class="selectbox" for="selector"  title="<%- t('bookmarks', 'Select') %>"></label>
 	<h1><%- title %></h1>
 	<h2><a target="_blank" href="<%- url %>"><span class="icon-external"></span><%- new URL(url).host %></a></h2>
-	<div class="actions">
-		<div class="icon-more toggle" title="<%- t('bookmarks', 'Open menu') %>"></div>
-		<div class="popovermenu">
-			<ul>
-				<li>
-					<button class="menu-item-checkbox action-select">
-						<span><input type="checkbox" name="select" class="checkbox" /><label for="select"></label></span>
-						<span><%- t('bookmarks', 'Select') %></span>
-					</button>
-				</li>
-				<li>
-					<button class="menu-item-checkbox action-unselect">
-						<span><input type="checkbox" name="select" checked class="checkbox" /><label for="select"></label></span>
-						<span><%- t('bookmarks', 'Unselect') %></span>
-					</button>
-				</li>
-				<li>
-					<button class="action-delete">
-						<span class="icon-delete"></span>
-						<span><%- t('bookmarks', 'Delete') %></span>
-					</button>
-				</li>
-			</ul>
-		</div>
-	</div>
 </div>
 <div class="tags"></div>
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 3f417b297..42018138a 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -13,8 +13,6 @@ export default Marionette.View.extend({
 	ui: {
 		'link': 'h2 > a',
 		'checkbox': '.selectbox',
-		'actionsToggle': '.actions .toggle',
-		'actionsMenu': '.actions .popovermenu'
 	},
 	regions: {
 		'tags': '.tags'
@@ -23,11 +21,6 @@ export default Marionette.View.extend({
 		'click': 'open',
 		'click @ui.link': 'clickLink',
 		'click @ui.checkbox': 'select',
-		'click @ui.actionsToggle': 'toggleActions',
-		'blur @ui.actionsToggle': 'closeActions',
-		'click .action-delete': 'actionDelete',
-		'click .action-select': 'select',
-		'click .action-unselect': 'select'
 	},
 	initialize: function(opts) {
 		this.app = opts.app;
@@ -68,17 +61,5 @@ export default Marionette.View.extend({
 	onUnselect: function() {
 		this.$el.removeClass('active');
 		this.render();
-	},
-	toggleActions: function(e) {
-		this.getUI('actionsMenu').toggleClass('open');
-		this.$el.toggleClass('actions-open');
-	},
-	closeActions: function(e) {
-		if (e.target === this.getUI('actionsToggle')[0]) return;
-		this.getUI('actionsMenu').removeClass('open');
-		this.$el.removeClass('actions-open');
-	},
-	actionDelete: function() {
-		this.model.destroy();
 	}
 });
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index b0362190e..db759a48a 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -35,6 +35,7 @@ export default Marionette.View.extend({
 	initialize: function(opts) {
 		this.app = opts.app;
 		this.listenTo(this.model, 'change', this.render);
+		this.listenTo(this.model, 'destroy', this.onDestroy);
 		this.listenTo(this.app.tags, 'sync', this.render);
 	},
 	onRender: function() {
@@ -93,6 +94,9 @@ export default Marionette.View.extend({
 		});
 		this.model.save({wait: true});
 	},
+	delete: function() {
+		this.model.destroy()
+	},
 	onDestroy: function() {
 		this.close(); 
 	}

From 07593506a7078effd2425116d19729f5b9f184a4 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 28 Feb 2018 22:15:02 +0100
Subject: [PATCH 098/110] If selection is active: (Un)select instead of open

---
 js/views/BookmarkCard.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 42018138a..d79d7bf87 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -43,7 +43,13 @@ export default Marionette.View.extend({
 		this.model.clickLink();
 	},
 	open: function(e) {
-		if (e && e.target !== this.el && e.target !== this.$('h1')[0]) return;
+		if (e && (e.target === this.getUI('checkbox')[0] || e.target === this.getUI('link')[0])) {
+			return;
+		}
+		if (this.$el.closest('.selection-active').length) {
+			this.select(e);
+			return
+		}
 		Radio.channel('details').trigger('show', this.model);
 	},
 	select: function(e) {

From 240c4207cf210c4ed4fce675c0a4c95e3a19e529 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 28 Feb 2018 22:23:12 +0100
Subject: [PATCH 099/110] Make tag list scrollable

---
 css/bookmarks.css | 1 -
 1 file changed, 1 deletion(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index b287c98c2..219a6988c 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -9,7 +9,6 @@
 
 #app-navigation > ul {
 	height: auto;
-	overflow: hidden;
 }
 
 .navigation a > span {

From 9a2a990c098e1a92f48afb0683cb70cbeaa6405d Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 1 Mar 2018 00:14:06 +0100
Subject: [PATCH 100/110] Add saving/saved status to detail view

---
 css/bookmarks.css                | 37 ++++++++++++++++++++++++++++++++
 js/Application.js                |  4 +---
 js/index.js                      |  1 +
 js/templates/BookmarkDetail.html |  4 ++++
 js/views/BookmarkDetail.js       | 27 +++++++++++++++++++----
 5 files changed, 66 insertions(+), 7 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 219a6988c..73958c9a8 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -333,6 +333,43 @@ button span,
 	cursor: pointer;
 }
 
+.bookmark-detail .status {
+	position: absolute;
+	top: .4cm;
+	left: 1cm;
+	font-size: .4cm;
+	opacity: .4;
+}
+.bookmark-detail .status [class^="icon-"] {
+	display: inline-block;
+}
+.bookmark-detail .status .message {
+	display: none;
+}
+.bookmark-detail .status.saving .message.message-saving {
+	display: inline;
+	position: relative;
+	left: .2cm;
+}
+.bookmark-detail .status.saved .message.message-saved {
+	display: inline;
+	animation: fadeout ease 5s both 1;
+}
+@keyframes fadeout {
+	0% {
+		opacity: 1;
+		display: inline;
+	}
+	99% {
+		opacity: 0;
+		display: inline;
+	}
+	100% {
+		opacity: 0;
+		display: none;
+	}
+}
+
 .bookmark-detail .actions {
 	position: absolute;
 	right: 1cm;
diff --git a/js/Application.js b/js/Application.js
index e3cabe21f..e046426ad 100644
--- a/js/Application.js
+++ b/js/Application.js
@@ -17,9 +17,7 @@ export default Marionette.Application.extend({
 			data: {count: true},
 			success: function() {
 				// we sadly cannot listen ot 'sync', which would fire after fetching, so we have to listen to these and add some timeout
-				that.listenTo(that.tags, 'sync', that.onTagChanged);
-				that.listenTo(that.tags, 'add', that.onTagChanged);
-				that.listenTo(that.tags, 'remove', that.onTagChanged);
+				that.listenTo(that.tags, 'sync add remove', that.onTagChanged);
 			}
 		});
 		this.listenTo(this.bookmarks, 'sync', this.onBookmarkTagsChanged);
diff --git a/js/index.js b/js/index.js
index b3f77b68e..37d7b59a7 100644
--- a/js/index.js
+++ b/js/index.js
@@ -19,6 +19,7 @@ Backbone.sync = function(method, model, options) {
 		},
 		error: function() {
 			console.log(arguments);
+			options.error.apply(null, arguments)
 		},
 		headers: {
 			'requesttoken': oc_requesttoken
diff --git a/js/templates/BookmarkDetail.html b/js/templates/BookmarkDetail.html
index f9ba62211..43984bf32 100644
--- a/js/templates/BookmarkDetail.html
+++ b/js/templates/BookmarkDetail.html
@@ -1,4 +1,8 @@
 <div class="close icon-close" title="<%- t('bookmarks', 'Close') %>"></div>
+<div class="status">
+	<span class="message message-saving"><span class="icon-loading"></span></span>
+	<span class="message message-saved"><span class="icon-checkmark"></span> <%- t('bookmarks', 'Saved') %></span>
+</div>
 <div class="actions">
 	<button class="delete icon-delete"></button>
 </div>
diff --git a/js/views/BookmarkDetail.js b/js/views/BookmarkDetail.js
index db759a48a..66ad7a699 100644
--- a/js/views/BookmarkDetail.js
+++ b/js/views/BookmarkDetail.js
@@ -20,7 +20,8 @@ export default Marionette.View.extend({
 		'link': 'h2 > a',
 		'close': '> .close',
 		'edit': '.edit',
-		'delete': '.delete'
+		'delete': '.delete',
+		'status': '.status'
 	},
 	events: {
 		'click @ui.link': 'clickLink',
@@ -45,6 +46,13 @@ export default Marionette.View.extend({
 		}));
 		this.listenTo(this.tags, 'add remove', this.submitTags);
 		this.showChildView('tags', new TagsSelectionView({collection: this.app.tags, selected: this.tags, app: this.app }));
+		
+		if (this.savingState === 'saving') {
+			this.savingState = 'saved';
+		}
+		if (this.savingState === 'saved') {
+			this.getUI('status').addClass('saved');
+		}
 	},
 	clickLink: function() {
 		this.model.clickLink();
@@ -57,13 +65,17 @@ export default Marionette.View.extend({
 		e.preventDefault();
 		
 		var $el = $(e.target).closest('[data-attribute]');
-		
+
+		if ($el.prop('contenteditable') === true) {
+			return;
+		}
+
 		switch($el.data('attribute')) {
 		case 'url':
 			$el.text(this.model.get('url'));
 			// fallthrough
 		case 'title':
-			$el.keydown(function(e) {
+			$el.on('keydown', function(e) {
 				// enter
 				if (e.which === 13) {
 					that.submit($el);
@@ -77,7 +89,7 @@ export default Marionette.View.extend({
 			break;
 		}
 		$el.prop('contenteditable', true);
-		$el.blur(function() {
+		$el.one('blur', function() {
 			that.submit($el);
 		});
 		$el.focus();
@@ -87,12 +99,19 @@ export default Marionette.View.extend({
 			'tags': this.tags.pluck('name'),
 		});
 		this.model.save({wait: true});
+		this.savingState = 'saving';
+		this.getUI('status').removeClass('saved').addClass('saving');
 	},
 	submit: function($el) {
+		if (this.savingState === 'saving') {
+			return;
+		}
+		this.savingState = 'saving';
 		this.model.set({
 			[$el.data('attribute')]: $el.text()
 		});
 		this.model.save({wait: true});
+		this.getUI('status').removeClass('saved').addClass('saving');
 	},
 	delete: function() {
 		this.model.destroy()

From 98495df0804f4961b7e5b09be321f9b2f861e31a Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 3 Mar 2018 03:56:46 +0100
Subject: [PATCH 101/110] Assign background colors to bookmarks without images

---
 controller/lib/bookmarks.php           |  2 +-
 controller/rest/bookmarkcontroller.php |  2 +-
 js/views/BookmarkCard.js               | 16 +++++++++++++++-
 package.json                           |  1 +
 4 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/controller/lib/bookmarks.php b/controller/lib/bookmarks.php
index 3ce17b288..f8d5d5e05 100644
--- a/controller/lib/bookmarks.php
+++ b/controller/lib/bookmarks.php
@@ -174,7 +174,7 @@ public function findBookmarks(
 		}
 
 		$tableAttributes = array('id', 'url', 'title', 'user_id', 'description',
-			'public', 'added', 'lastmodified', 'clickcount',);
+			'public', 'added', 'lastmodified', 'clickcount', 'image');
 
 		$returnTags = true;
 		
diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index ada5ecc73..93b9c262d 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -162,7 +162,7 @@ public function getBookmarks(
 		}
 		
 		$attributesToSelect = array('url', 'title', 'id', 'user_id', 'description', 'public',
-			'added', 'lastmodified', 'clickcount', 'tags');		
+			'added', 'lastmodified', 'clickcount', 'tags', 'image');
 
 		$bookmarks = $this->bookmarks->findBookmarks($user, $offset, $sqlSortColumn, $filterTag,
 			$tagsOnly, $limit, $publicOnly, $attributesToSelect, $conjunction);
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index d79d7bf87..82dda1e06 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -3,10 +3,20 @@ import Backbone from 'backbone';
 import Tags from '../models/Tags';
 import TagsNavigationView from './TagsNavigation';
 import templateString from '../templates/BookmarkCard.html';
+import colorPalettes from 'nice-color-palettes';
 
 const Marionette = Backbone.Marionette;
 const Radio = Backbone.Radio;
 
+const COLORS = colorPalettes.reduce((p1, p2) => p1.concat(p2), [])
+const simpleHash = (str) => {
+	var hash = 0;
+	for (var i = 0; i<str.length; i++){
+		hash = str.charCodeAt(i) + (hash << 6) + (hash << 16) - hash;
+	}
+	return hash
+}
+
 export default Marionette.View.extend({
 	template: _.template(templateString),
 	className: 'bookmark-card',
@@ -32,7 +42,11 @@ export default Marionette.View.extend({
 	},
 	onRender: function() {
 	  var that = this;
-		this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)');
+		if (this.model.get('image')) {
+		 this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)');
+		} else {
+			this.$el.css('background-color', COLORS[simpleHash(this.model.get('url')) & 63] + 'aa')
+		}
 		var tags = new Tags(this.model.get('tags').map(function(id) {
 			return that.app.tags.findWhere({name: id});
 		}));
diff --git a/package.json b/package.json
index 273fa061d..fc76d35fc 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "backbone": "^1.3.3",
     "backbone.marionette": "^3.5.1",
     "jquery": "^3.3.1",
+    "nice-color-palettes": "^2.0.0",
     "select2": "^4.0.6-rc.1",
     "underscore": "^1.8.3"
   }

From 84bb54b89ef224fb3ad74d68acfa1db52bf3e354 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 3 Mar 2018 15:58:11 +0100
Subject: [PATCH 102/110] Implement infinite scroll

+ use backbone methods for parsing responses instead of
monkey patching Backbone.sync
---
 controller/rest/bookmarkcontroller.php        |  7 +++--
 .../rest/internalbookmarkcontroller.php       |  6 ++--
 css/bookmarks.css                             |  3 +-
 js/Application.js                             |  1 +
 js/Router.js                                  | 20 ++++++-------
 js/index.js                                   | 12 --------
 js/models/Bookmark.js                         |  2 +-
 js/models/Bookmarks.js                        | 28 +++++++++++++++++++
 js/models/Tags.js                             |  5 +++-
 js/templates/App.html                         |  1 -
 js/views/App.js                               |  2 +-
 js/views/Content.js                           | 10 +++++++
 12 files changed, 63 insertions(+), 34 deletions(-)

diff --git a/controller/rest/bookmarkcontroller.php b/controller/rest/bookmarkcontroller.php
index 93b9c262d..e43e515e4 100644
--- a/controller/rest/bookmarkcontroller.php
+++ b/controller/rest/bookmarkcontroller.php
@@ -95,6 +95,7 @@ public function getSingleBookmark($id, $user = null) {
 	 * @param string conjunction
 	 * @param string sortby
 	 * @param array search
+	 * @param int limit
 	 * @return JSONResponse
 	 *
 	 * @NoAdminRequired
@@ -110,7 +111,8 @@ public function getBookmarks(
 		$tags = null,
 		$conjunction = "or",
 		$sortby = "",
-		$search = array()
+		$search = array(),
+    $limit = 10
 	) {
 		if ($user === null) {
 			$user = $this->userId;
@@ -146,8 +148,7 @@ public function getBookmarks(
 			$tagsOnly = false;
 		}
 
-		$limit = 10;
-		$offset = $page * 10;
+		$offset = $page * $limit;
 		if ($page == -1) {
 			$limit = -1;
 			$offset = 0;
diff --git a/controller/rest/internalbookmarkcontroller.php b/controller/rest/internalbookmarkcontroller.php
index 6254f783c..00434ca8b 100644
--- a/controller/rest/internalbookmarkcontroller.php
+++ b/controller/rest/internalbookmarkcontroller.php
@@ -65,6 +65,7 @@ public function __construct(
 	 * @param string conjunction
 	 * @param string sortby
 	 * @param array search
+	 * @param int limit
 	 * @return JSONResponse
 	 *
 	 * @NoAdminRequired
@@ -78,9 +79,10 @@ public function getBookmarks(
 		$tags = array(),
 		$conjunction = "or",
 		$sortby = "",
-		$search = array()
+		$search = array(),
+		$limit = 10
 	) {
-		return $this->publicController->getBookmarks($type, $tag, $page, $sort, $user, $tags, $conjunction, $sortby, $search);
+		return $this->publicController->getBookmarks($type, $tag, $page, $sort, $user, $tags, $conjunction, $sortby, $search, $limit);
 	}
 	
   /**
diff --git a/css/bookmarks.css b/css/bookmarks.css
index 73958c9a8..4e8d3b0d7 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -1,5 +1,6 @@
 #content > div {
 	height: 100%;
+  overflow: auto;
 }
 
 #app-navigation {
@@ -175,7 +176,7 @@ button span,
 	display: flex;
 	flex-wrap: wrap;
 	overflow: hidden;
-	padding-right: .6cm;
+	padding: 0 .6cm .6cm 0;
 }
 
 .bookmark-card {
diff --git a/js/Application.js b/js/Application.js
index e046426ad..3ca2dff3a 100644
--- a/js/Application.js
+++ b/js/Application.js
@@ -9,6 +9,7 @@ const Marionette = Backbone.Marionette;
 
 export default Marionette.Application.extend({
 	region: '#content',
+	page: 1,
 	onBeforeStart: function() {
 		var that = this;
 		this.bookmarks = new Bookmarks;
diff --git a/js/Router.js b/js/Router.js
index e15c9c371..a317f415f 100644
--- a/js/Router.js
+++ b/js/Router.js
@@ -11,31 +11,27 @@ export default Marionette.AppRouter.extend({
 			}, 1);
 		},
 		all: function() {
-			this.app.bookmarks.fetch({ 
-				data: {page: -1}
-			});
+			this.app.bookmarks.setFetchQuery({})
+			this.app.bookmarks.fetchPage();
 			Radio.channel('nav').trigger('navigate', 'all');
 		},
 		favorites: function() {
 			Radio.channel('nav').trigger('navigate', 'favorites');
 		},
 		shared: function() {
-			this.app.bookmarks.fetch({ 
-				data: {page: -1}
-			});
+			this.app.bookmarks.setFetchQuery({});
+			this.app.bookmarks.fetchPage();
 			Radio.channel('nav').trigger('navigate', 'shared');
 		},
 		tags: function(tagString) {
 			var tags = tagString? tagString.split(',').map(decodeURIComponent) : []; 
-			this.app.bookmarks.fetch({
-				data: {tags: tags, page: -1, conjunction: 'and'}
-			});
+			this.app.bookmarks.setFetchQuery({tags: tags, conjunction: 'and'});
+			this.app.bookmarks.fetchPage();
 			Radio.channel('nav').trigger('navigate', 'tags', tags);
 		},
 		search: function(query) {
-			this.app.bookmarks.fetch({
-				data: {search: decodeURIComponent(query).split(' '), page: -1}
-			});
+			this.app.bookmarks.setFetchQuery({search: decodeURIComponent(query).split(' ')});
+			this.app.bookmarks.fetchPage();
 			Radio.channel('nav').trigger('navigate', 'search', query);
 		}
 	},
diff --git a/js/index.js b/js/index.js
index 37d7b59a7..2f93b646e 100644
--- a/js/index.js
+++ b/js/index.js
@@ -9,18 +9,6 @@ import App from './Application';
 var _sync = Backbone.sync;
 Backbone.sync = function(method, model, options) {
 	var overrideOptions = {
-		success: function(json) {
-			console.log(json);
-			if (!(model instanceof Tags)) {
-				options.success(json.item || json.data);
-			} else {
-				options.success(json);
-			}
-		},
-		error: function() {
-			console.log(arguments);
-			options.error.apply(null, arguments)
-		},
 		headers: {
 			'requesttoken': oc_requesttoken
 		}
diff --git a/js/models/Bookmark.js b/js/models/Bookmark.js
index 39e279c47..c579e554a 100644
--- a/js/models/Bookmark.js
+++ b/js/models/Bookmark.js
@@ -12,5 +12,5 @@ export default Backbone.Model.extend({
 				'requesttoken': oc_requesttoken
 			}
 		})
-	}
+	},
 });
diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
index c3503627d..da3664b8c 100644
--- a/js/models/Bookmarks.js
+++ b/js/models/Bookmarks.js
@@ -1,7 +1,35 @@
+import _ from 'underscore';
 import Backbone from 'backbone';
 import Bookmark from './Bookmark';
 
+const BATCH_SIZE = 30;
+
 export default Backbone.Collection.extend({
 	model: Bookmark,
 	url: 'bookmark',
+	parse: function(json) {
+		return json.data;
+	},
+	setFetchQuery: function(data) {
+		this.fetchQuery = data;
+		this.page = 0;
+		this.fetching = false;
+		this.reachedEnd = false;
+	},
+	fetchPage: function() {
+		if (this.fetching || this.reachedEnd) return;
+		this.fetching = true;
+	    var that = this;
+		const nextPage = this.page++;
+		return this.fetch({
+			data: _.extend({}, this.fetchQuery, {page: nextPage, limit: BATCH_SIZE}),
+			reset: nextPage === 0,
+			remove: false,
+			success: function(collections, response) {
+				that.fetching = false;
+				that.reachedEnd = response.data.length < BATCH_SIZE;
+				that.trigger('fetchPage');
+			}
+		});
+	}
 });
diff --git a/js/models/Tags.js b/js/models/Tags.js
index bcdb4f026..626c7c7f9 100644
--- a/js/models/Tags.js
+++ b/js/models/Tags.js
@@ -4,7 +4,10 @@ import Tag from './Tag';
 var Tags = Backbone.Collection.extend({
 	model: Tag,
 	comparator: function(t) {return -t.get('count');},
-	url: 'tag'
+	url: 'tag',
+	parse: function(json) {
+		return json;
+	}
 });
 
 export default Tags;
diff --git a/js/templates/App.html b/js/templates/App.html
index 26d0afcc1..d2c35da2a 100644
--- a/js/templates/App.html
+++ b/js/templates/App.html
@@ -6,5 +6,4 @@ <h3><%- t('bookmarks', 'Tags') %></h3>
 	<div id="settings-slot"></div>
 </div>
 <div id="app-content">
-	<div id="content-slot"></div>
 </div>
diff --git a/js/views/App.js b/js/views/App.js
index 491217362..8a40b46ca 100644
--- a/js/views/App.js
+++ b/js/views/App.js
@@ -23,7 +23,7 @@ export default Marionette.View.extend({
 			replaceElement: true
 		},
 		'content': {
-			el: '#content-slot',
+			el: '#app-content',
 			replaceElement: true
 		},
 		'tags': {
diff --git a/js/views/Content.js b/js/views/Content.js
index 8191d2779..8143981e6 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -12,6 +12,7 @@ const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
 	template: _.template(templateString),
+	id: 'app-content',
 	regions: {
 		'mobileNav': {
 			el: '#mobile-nav-slot',
@@ -30,10 +31,14 @@ export default Marionette.View.extend({
 			replaceElement: true
 		}
 	},
+	events: {
+		'scroll': 'infiniteScroll'
+	},
 	initialize: function(options) {
 		this.app = options.app;
 		this.bookmarks = this.app.bookmarks;
 		this.selected = new Bookmarks;
+		this.listenTo(this.bookmarks, 'fetchPage', this.infiniteScroll);
 		this.listenTo(this.bookmarks, 'select', this.onSelect);
 		this.listenTo(this.bookmarks, 'unselect', this.onUnselect);
 		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate);
@@ -45,6 +50,11 @@ export default Marionette.View.extend({
 		this.showChildView('bulkActions', new BulkActionsView({selected: this.selected, app: this.app}));
 		this.showChildView('viewBookmarks', new BookmarksView({collection: this.bookmarks, app: this.app}));
 	},
+	infiniteScroll: function(e) {
+		if (this.$el.prop('scrollHeight') < this.$el.prop('scrollTop') + this.$el.height() + 500) {
+			this.bookmarks.fetchPage()
+		}
+	},
 	onSelect: function(model) {
 		if (this.selected.length == 0) {
 			this.$el.addClass('selection-active');

From 2c2688159be6c0227073f8ede715232dc8abccaf Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 3 Mar 2018 16:38:54 +0100
Subject: [PATCH 103/110] Display spinner if the user has to wait

---
 js/models/Bookmarks.js             | 40 ++++++++++++++++++++++--------
 js/templates/LoadingBookmarks.html |  1 +
 js/views/Bookmarks.js              |  3 +++
 js/views/Content.js                |  2 +-
 js/views/EmptyBookmarks.js         | 18 +++++++++++---
 5 files changed, 49 insertions(+), 15 deletions(-)
 create mode 100644 js/templates/LoadingBookmarks.html

diff --git a/js/models/Bookmarks.js b/js/models/Bookmarks.js
index da3664b8c..68b602014 100644
--- a/js/models/Bookmarks.js
+++ b/js/models/Bookmarks.js
@@ -10,25 +10,43 @@ export default Backbone.Collection.extend({
 	parse: function(json) {
 		return json.data;
 	},
+	initialize: function() {
+		this.loadingState = new Backbone.Model({
+			page: 0,
+			query: {},
+			fetching: false,
+			reachedEnd: false
+		})
+	},
 	setFetchQuery: function(data) {
-		this.fetchQuery = data;
-		this.page = 0;
-		this.fetching = false;
-		this.reachedEnd = false;
+		this.loadingState.set({
+			page: 0,
+			query: data,
+			fetching: false,
+			reachedEnd: false
+		})
 	},
 	fetchPage: function() {
-		if (this.fetching || this.reachedEnd) return;
-		this.fetching = true;
 	    var that = this;
-		const nextPage = this.page++;
+		if (this.loadingState.get('fetching') || this.loadingState.get('reachedEnd')) {
+			return;
+		}
+		const nextPage = this.loadingState.get('page');
+		this.loadingState.set({page: nextPage+1, fetching: true});
+
+		// Show spinner after 1.5s
+		const spinnerTimeout = setTimeout(() => this.reset(), 1500);
+
 		return this.fetch({
-			data: _.extend({}, this.fetchQuery, {page: nextPage, limit: BATCH_SIZE}),
+			data: _.extend({}, this.loadingState.get('query'), {page: nextPage, limit: BATCH_SIZE}),
 			reset: nextPage === 0,
 			remove: false,
 			success: function(collections, response) {
-				that.fetching = false;
-				that.reachedEnd = response.data.length < BATCH_SIZE;
-				that.trigger('fetchPage');
+				clearTimeout(spinnerTimeout);
+				that.loadingState.set({
+					fetching: false,
+					reachedEnd: response.data.length < BATCH_SIZE
+				});
 			}
 		});
 	}
diff --git a/js/templates/LoadingBookmarks.html b/js/templates/LoadingBookmarks.html
new file mode 100644
index 000000000..0f455bfc0
--- /dev/null
+++ b/js/templates/LoadingBookmarks.html
@@ -0,0 +1 @@
+<div class="icon-loading"></div>
diff --git a/js/views/Bookmarks.js b/js/views/Bookmarks.js
index 8bd7e7a7b..e527de2ee 100644
--- a/js/views/Bookmarks.js
+++ b/js/views/Bookmarks.js
@@ -14,5 +14,8 @@ export default Marionette.CollectionView.extend({
 		return {app: this.app};
 	},
 	childView: function() {return BookmarkCardView;},
+	emptyViewOptions: function() {
+		return {app: this.app};
+	},
 	emptyView: function() {return EmptyBookmarksView;}
 });
diff --git a/js/views/Content.js b/js/views/Content.js
index 8143981e6..c740fa2d6 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -38,7 +38,7 @@ export default Marionette.View.extend({
 		this.app = options.app;
 		this.bookmarks = this.app.bookmarks;
 		this.selected = new Bookmarks;
-		this.listenTo(this.bookmarks, 'fetchPage', this.infiniteScroll);
+		this.listenTo(this.bookmarks.loadingState, 'change:fetching', this.infiniteScroll);
 		this.listenTo(this.bookmarks, 'select', this.onSelect);
 		this.listenTo(this.bookmarks, 'unselect', this.onUnselect);
 		this.listenTo(Radio.channel('nav'), 'navigate', this.onNavigate);
diff --git a/js/views/EmptyBookmarks.js b/js/views/EmptyBookmarks.js
index 9f13305ef..a040e7d84 100644
--- a/js/views/EmptyBookmarks.js
+++ b/js/views/EmptyBookmarks.js
@@ -1,11 +1,23 @@
 import _ from 'underscore';
 import Backbone from 'backbone';
-import templateString from '../templates/EmptyBookmarks.html';
+import templateStringEmpty from '../templates/EmptyBookmarks.html';
+import templateStringLoading from '../templates/LoadingBookmarks.html';
 
 const Marionette = Backbone.Marionette;
 const Radio = Backbone.Radio;
 
 export default Marionette.View.extend({
-	template: _.template(templateString),
-	className: 'bookmarks-empty'
+	getTemplate: function() {
+		if (this.app.bookmarks.loadingState.get('fetching')) {
+			return _.template(templateStringLoading);
+		
+		} else {
+			return _.template(templateStringEmpty);
+		}
+	},
+	className: 'bookmarks-empty',
+	initialize: function(options) {
+		this.app = options.app;
+		this.listenTo(this.app.bookmarks.loadingState, 'change:fetching', this.render);
+	}
 });

From b45b5c425a94927813d64df81e0db0d26cdcbc9d Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 3 Mar 2018 16:43:19 +0100
Subject: [PATCH 104/110] Close Details view if user selects a bookmark

---
 js/views/Content.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/js/views/Content.js b/js/views/Content.js
index c740fa2d6..b7dbad581 100644
--- a/js/views/Content.js
+++ b/js/views/Content.js
@@ -58,6 +58,7 @@ export default Marionette.View.extend({
 	onSelect: function(model) {
 		if (this.selected.length == 0) {
 			this.$el.addClass('selection-active');
+			Radio.channel('details').trigger('close')
 		}
 		this.selected.add(model);
 	},

From 772ce084f455aae43938788004f44ca1109aa806 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Sat, 3 Mar 2018 16:54:35 +0100
Subject: [PATCH 105/110] Some style polishing

---
 css/bookmarks.css     | 6 +++++-
 js/templates/App.html | 2 +-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/css/bookmarks.css b/css/bookmarks.css
index 4e8d3b0d7..08b2cb19f 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -23,6 +23,10 @@
 	padding-left: 12px;
 	border-top: 1px solid #ededed;
 }
+#app-navigation h3 [class^=icon-] {
+	display: inline-block;
+	vertical-align: sub;
+}
 
 #app-content {
 	transition: transform .5s ease;
@@ -169,7 +173,7 @@ button span,
 
 .bookmarks-empty {
 	width: 5cm;
-	margin: 20% auto;
+	margin: 5cm auto;
 }
 
 .bookmarks {
diff --git a/js/templates/App.html b/js/templates/App.html
index d2c35da2a..80a81e33d 100644
--- a/js/templates/App.html
+++ b/js/templates/App.html
@@ -1,7 +1,7 @@
 <div id="app-navigation">
 	<div id="add-bookmark-slot"></div>
 	<div id="navigation-slot"></div>
-	<h3><%- t('bookmarks', 'Tags') %></h3>
+	<h3><span class="icon-tag"></span> <%- t('bookmarks', 'Tags') %></h3>
 	<div id="favorite-tags-slot"></div>
 	<div id="settings-slot"></div>
 </div>

From 315dac3cd47cff91e870620f202564c53f372ca3 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Wed, 7 Mar 2018 21:05:24 +0100
Subject: [PATCH 106/110] Fix export

urlencode(requesttoken)
---
 js/views/Settings.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/views/Settings.js b/js/views/Settings.js
index b147170cd..fb6d09404 100644
--- a/js/views/Settings.js
+++ b/js/views/Settings.js
@@ -91,6 +91,6 @@ export default Marionette.View.extend({
 		Backbone.history.navigate('', {trigger: true}); // reload app
 	},
 	exportTrigger: function() {
-		window.location = 'bookmark/export?requesttoken='+oc_requesttoken;
+		window.location = 'bookmark/export?requesttoken='+encodeURIComponent(oc_requesttoken);
 	}
 });

From 5bfd562a1573d53725367ef094cbf7ebda8fa4b9 Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Mar 2018 00:05:34 +0100
Subject: [PATCH 107/110] Make bookmarklet work

---
 controller/webviewcontroller.php          |   3 +-
 css/bookmarklet.css                       |  28 ++++++
 css/bookmarks.css                         |  11 +++
 js/apps/Bookmarklet.js                    |  19 ++++
 js/{Application.js => apps/Main.js}       |  11 ++-
 js/{Router.js => apps/MainRouter.js}      |   0
 js/bookmarklet.js                         |  84 +++---------------
 js/main.js                                |  15 ++++
 js/templates/Settings.html                |   6 +-
 js/{index.js => utils/FixBackboneSync.js} |  13 ---
 js/views/Bookmarklet.js                   |  54 ++++++++++++
 js/views/Settings.js                      |  10 +++
 templates/addBookmarklet.php              | 100 ++++++++++------------
 templates/main.php                        |  22 +----
 webpack.config.js                         |  41 +++++----
 15 files changed, 228 insertions(+), 189 deletions(-)
 create mode 100644 css/bookmarklet.css
 create mode 100644 js/apps/Bookmarklet.js
 rename js/{Application.js => apps/Main.js} (89%)
 rename js/{Router.js => apps/MainRouter.js} (100%)
 create mode 100644 js/main.js
 rename js/{index.js => utils/FixBackboneSync.js} (58%)
 create mode 100644 js/views/Bookmarklet.js

diff --git a/controller/webviewcontroller.php b/controller/webviewcontroller.php
index 37ca40cea..724c4fd7e 100644
--- a/controller/webviewcontroller.php
+++ b/controller/webviewcontroller.php
@@ -57,8 +57,7 @@ public function __construct($appName, IRequest $request, $userId, IURLGenerator
 	 * @NoCSRFRequired
 	 */
 	public function index() {
-		$bookmarkleturl = $this->urlgenerator->getAbsoluteURL('index.php/apps/bookmarks/bookmarklet');
-		$params = array('user' => $this->userId, 'bookmarkleturl' => $bookmarkleturl);
+		$params = array('user' => $this->userId);
 
 		$policy = new ContentSecurityPolicy();
 		$policy->addAllowedFrameDomain("'self'");
diff --git a/css/bookmarklet.css b/css/bookmarklet.css
new file mode 100644
index 000000000..2844606f2
--- /dev/null
+++ b/css/bookmarklet.css
@@ -0,0 +1,28 @@
+#bookmarklet_form {
+	padding: .2cm;
+}
+#bookmarklet_form #add_form_loading {
+	margin: .5cm;
+	float: right;
+	visibility: hidden;
+}
+#bookmarklet_form .addBm {
+	position: relative;
+}
+#bookmarklet_form h1 {
+	clear: both;
+	margin: .5cm 0;
+	font-size: .8cm;
+}
+#bookmarklet_form .bookmark-exists {
+	font-weight: bold;
+	border: 1px #ebebeb solid;
+	border-radius: 5px;
+	margin: .5cm 0;
+	padding: .2cm;
+}
+#bookmarklet_form input,
+#bookmarklet_form textarea {
+	resize: vertical;
+	width: 100%;
+}
diff --git a/css/bookmarks.css b/css/bookmarks.css
index 08b2cb19f..710f56d60 100644
--- a/css/bookmarks.css
+++ b/css/bookmarks.css
@@ -493,6 +493,17 @@ button span,
 	display: block;
 }
 
+
+#app-navigation .settings h3 {
+	padding-top: 0;
+	padding-left: 0;
+	border-top: none;
+}
+
+.settings .button {
+	display: inline-block;
+}
+
 .settings .import-form {
 	display: inline-block;
 }
diff --git a/js/apps/Bookmarklet.js b/js/apps/Bookmarklet.js
new file mode 100644
index 000000000..969e741fc
--- /dev/null
+++ b/js/apps/Bookmarklet.js
@@ -0,0 +1,19 @@
+import Backbone from 'backbone';
+import Tags from '../models/Tags';
+import BookmarkletView from '../views/Bookmarklet';
+
+const Marionette = Backbone.Marionette;
+
+export default Marionette.Application.extend({
+	region: '#bookmarklet_form',
+	onBeforeStart: function() {
+		var that = this;
+		this.tags = new Tags;
+		this.tags.fetch({
+			data: {count: true},
+		});
+	},
+	onStart: function() {
+		this.showView(new BookmarkletView({app: this}));
+	},
+});
diff --git a/js/Application.js b/js/apps/Main.js
similarity index 89%
rename from js/Application.js
rename to js/apps/Main.js
index 3ca2dff3a..2abbf0745 100644
--- a/js/Application.js
+++ b/js/apps/Main.js
@@ -1,15 +1,14 @@
 import Backbone from 'backbone';
-import Bookmarks from './models/Bookmarks';
-import Tag from './models/Tag';
-import Tags from './models/Tags';
-import Router from './Router';
-import AppView from './views/App';
+import Bookmarks from '../models/Bookmarks';
+import Tag from '../models/Tag';
+import Tags from '../models/Tags';
+import Router from './MainRouter';
+import AppView from '../views/App';
 
 const Marionette = Backbone.Marionette;
 
 export default Marionette.Application.extend({
 	region: '#content',
-	page: 1,
 	onBeforeStart: function() {
 		var that = this;
 		this.bookmarks = new Bookmarks;
diff --git a/js/Router.js b/js/apps/MainRouter.js
similarity index 100%
rename from js/Router.js
rename to js/apps/MainRouter.js
diff --git a/js/bookmarklet.js b/js/bookmarklet.js
index c3b54e154..55a183834 100644
--- a/js/bookmarklet.js
+++ b/js/bookmarklet.js
@@ -1,73 +1,13 @@
-var ajaxCallCount = 0;
-
-function increaseAjaxCallCount() {
-	ajaxCallCount++;
-	if (ajaxCallCount - 1 === 0) {
-		updateLoadingAnimation();
-	}
-}
-
-function decreaseAjaxCallCount() {
-	if (ajaxCallCount > 0) {
-		ajaxCallCount--;
-		updateLoadingAnimation();
-	}
-}
-
-function updateLoadingAnimation() {
-	if (ajaxCallCount === 0) {
-		$('#add_form_loading').css('visibility', 'hidden');
-	} else {
-		$('#add_form_loading').css('visibility', 'visible');
-	}
-}
-
-$(document).ready(function () {
-	$('.submit').click(function () {
-		increaseAjaxCallCount();
-
-		var endpoint = 'bookmark';
-		var method = 'POST';
-		var id = '';
-		if($('#bookmarkID').length > 0) {
-			endpoint += '/'+ $('#bookmarkID').val();
-			method = 'PUT';
-			id = '&record_id=' + $('#bookmarkID').val();
-		}
-
-		var tags = '';
-		$('.tagit-choice .tagit-label').each(function() {
-			tags += '&item[tags][]='+$(this).text();
-		});
-		var dataString = 'url=' + $('input#url').val() + '&description=' +
-			$('textarea#description').val() + '&title=' + $('input#title').val() + tags + id;
-		$.ajax({
-			type: method,
-			url: endpoint,
-			data: dataString,
-			complete: function () {
-				decreaseAjaxCallCount();
-			},
-			success: function (data) {
-				if (data.status === 'success') {
-					OC.dialogs.message('Bookmark added.', 'Success', undefined, [], undefined, true);
-					_.delay(function() {
-						window.close();
-					}, 1e3);
-				} else {
-					OC.dialogs.alert(t('bookmarks', 'Some Error happened.'),
-						t('bookmarks', 'Error'), null, true);
-				}
-			}
-		});
-		return false;
-	});
-
-	$.get('tag', function (data) {
-		$('.tags').tagit({
-			allowSpaces: true,
-			availableTags: data,
-			placeholderText: t('bookmark', 'Tags')
-		});
-	});
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Marionette from 'backbone.marionette';
+import select2 from 'select2';
+import App from './apps/Bookmarklet';
+import fixBackboneSync from './utils/FixBackboneSync';
+
+// init
+
+var app = new App();
+$(function() {
+	app.start();
 });
diff --git a/js/main.js b/js/main.js
new file mode 100644
index 000000000..9923874ca
--- /dev/null
+++ b/js/main.js
@@ -0,0 +1,15 @@
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Marionette from 'backbone.marionette';
+import select2 from 'select2';
+import Tag from './models/Tag';
+import Tags from './models/Tags';
+import App from './apps/Main';
+import fixBackboneSync from './utils/FixBackboneSync';
+
+// init
+
+var app = new App();
+$(function() {
+	app.start();
+});
diff --git a/js/templates/Settings.html b/js/templates/Settings.html
index 1a38cdf3c..f3dccc801 100644
--- a/js/templates/Settings.html
+++ b/js/templates/Settings.html
@@ -2,7 +2,11 @@
 	<button class="settings-button"><%- t('bookmarks', 'Settings') %></button>
 </div>
 <div id="app-settings-content">
-	<form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data">
+	<h3><%- t('bookmarks', 'Bookmarklet') %></h3>
+  <p><%- t('bookmarks', 'Drag this to your browser bookmarks and click it, when you want to bookmark a webpage quickly:') %></p>
+  <a class="button bookmarklet" href=""><%- t('bookmarks', 'Add to {instanceName} ', {instanceName: oc_defaults.name}) %></a>
+  <h3><%- t('bookmarks', 'Import & Export') %></h3>
+  <form class="import-form" action="bookmark/import" method="post" target="upload_iframe" enctype="multipart/form-data" encoding="multipart/form-data">
 		<input type="file" class="import" name="bm_import" size="5" />
 		<input type="hidden" name="requesttoken" value="<%- oc_requesttoken %>" />
 		<button class="import-facade"><span class="icon-upload"></span> <%- t('bookmarks', 'Import') %></button>
diff --git a/js/index.js b/js/utils/FixBackboneSync.js
similarity index 58%
rename from js/index.js
rename to js/utils/FixBackboneSync.js
index 2f93b646e..5dc587b33 100644
--- a/js/index.js
+++ b/js/utils/FixBackboneSync.js
@@ -1,10 +1,4 @@
-import _ from 'underscore';
 import Backbone from 'backbone';
-import Marionette from 'backbone.marionette';
-import select2 from 'select2';
-import Tag from './models/Tag';
-import Tags from './models/Tags';
-import App from './Application';
 
 var _sync = Backbone.sync;
 Backbone.sync = function(method, model, options) {
@@ -18,10 +12,3 @@ Backbone.sync = function(method, model, options) {
 	}
 	_sync(method, model, _.extend({}, options, overrideOptions));
 };
-
-// init
-
-var app = new App();
-$(function() {
-	app.start();
-});
diff --git a/js/views/Bookmarklet.js b/js/views/Bookmarklet.js
new file mode 100644
index 000000000..803caa999
--- /dev/null
+++ b/js/views/Bookmarklet.js
@@ -0,0 +1,54 @@
+import _ from 'underscore';
+import Backbone from 'backbone';
+import Bookmark from '../models/Bookmark';
+import Tags from '../models/Tags';
+import TagsSelectionView from './TagsSelection';
+
+const Marionette = Backbone.Marionette;
+const Radio = Backbone.Radio;
+
+export default Marionette.View.extend({
+	template: false,
+	el: '#bookmarklet_form',
+	regions: {
+		'tags':  {
+			el: '#tags',
+			replaceElement: true
+		},
+	},
+	events: {
+		'click .submit': 'submit'
+	},
+	initialize: function(options) {
+		this.app = options.app;
+    
+		$(window.document).click(function(e) {
+			Radio.channel('documentClicked').trigger('click', e);
+		});
+		
+		this.app.tags.once('reset sync add remove', () => {
+			this.selected = new Tags(
+				this.$('#tags li')
+				.map((e) => $(e).text())
+				.map((tagName) => this.app.tags.findWhere({name: tagName}))
+			);
+			this.showChildView('tags', new TagsSelectionView({app: this.app, selected: this.selected}));
+		});
+	},
+	submit: function(e) {
+		e.preventDefault();
+		this.$('#add_form_loading').css('visibility', 'visible');
+		var bm = new Bookmark({
+			title: this.$('.title').val(),
+			url: this.$('.url_input').val(),
+			description: this.$('.desc').val(),
+			tags: this.selected.pluck('name')
+		});
+		bm.once('sync', () => setTimeout(() => window.close(), 1e3));
+		bm.save({
+			wait: true,
+			error: () => OC.dialogs.alert(t('bookmarks', 'An error occurred while trying to save the bookmark.'),
+						t('bookmarks', 'Error'), null, true)
+		});
+	}
+});
diff --git a/js/views/Settings.js b/js/views/Settings.js
index fb6d09404..4096f2bfd 100644
--- a/js/views/Settings.js
+++ b/js/views/Settings.js
@@ -11,6 +11,7 @@ export default Marionette.View.extend({
 	template: _.template(templateString),
 	ui: {
 		'content': '#app-settings-content',
+		'bookmarklet': '.bookmarklet',
 		'import': '.import',
 		'form': '.import-form',
 		'iframe': '.upload',
@@ -18,15 +19,24 @@ export default Marionette.View.extend({
 	},
 	events: {
 		'click .settings-button': 'open',
+		'click @ui.bookmarklet': 'bookmarkletClick',
 		'click .import-facade': 'importTrigger',
 		'change @ui.import': 'importSubmit',
 		'load @ui.iframe': 'importResult',
 		'click .export': 'exportTrigger'
 	},
+	onRender: function() {
+		const bookmarkletUrl = window.location.origin + oc_webroot + '/index.php/apps/bookmarks/bookmarklet';
+		const bookmarkletSrc = `javascript:(function(){var a=window,b=document,c=encodeURIComponent,e=c(document.title),d=a.open('${bookmarkletUrl}?output=popup&url='+c(b.location)+'&title='+e,'bkmk_popup','left='+((a.screenX||a.screenLeft)+10)+',top='+((a.screenY||a.screenTop)+10)+',height=400px,width=550px,resizable=1,alwaysRaised=1');a.setTimeout(function(){d.focus()},300);})();`; 
+		this.getUI('bookmarklet').prop('href', bookmarkletSrc);
+	},
 	open: function(e) {
 		e.preventDefault();
 		this.getUI('content').slideToggle();
 	},
+	bookmarkletClick: function(e) {
+		e.preventDefault();
+	},
 	importTrigger: function(e) {
 		e.preventDefault();
 		this.getUI('import').click();
diff --git a/templates/addBookmarklet.php b/templates/addBookmarklet.php
index 356a2f989..47339632c 100644
--- a/templates/addBookmarklet.php
+++ b/templates/addBookmarklet.php
@@ -1,64 +1,54 @@
 <?php
-OCP\Util::addscript('bookmarks', '3rdparty/tag-it');
-OCP\Util::addscript('bookmarks', 'bookmarklet');
-OCP\Util::addStyle('bookmarks', 'bookmarks');
-OCP\Util::addStyle('bookmarks', '3rdparty/jquery.tagit');
+OCP\Util::addscript('bookmarks', 'dist/bookmarklet.bundle');
+OCP\Util::addStyle('bookmarks', 'bookmarklet');
+style('bookmarks', 'select2');
 
 $bookmarkExists = $_['bookmarkExists'];
 ?>
 <div id="bookmarklet_form">
     <form class="addBm" action="">
-		<script type="text/javascript" src="tag"></script>
-
-		<h1 style="display: block; float: left"><?php p($l->t('Add a bookmark')); ?></h1>
-		<span style="display: inline; float: right"><div id="add_form_loading" style="margin: 3px;"><img src="<?php print_unescaped(image_path("bookmarks", "loading.gif")); ?>"> </div></span>
-
-		<div style="color: red; clear: both; visibility: <?php
-		if ($bookmarkExists === false) {
-			print_unescaped('hidden');
-		}
-		?>">
-			<strong>
-				<?php p($l->t('This URL is already bookmarked! Overwrite?')); ?>
-			</strong>
-		</div>
-
-        <fieldset class="bm_desc">
-            <ul>
-                <li>
-					<?php if($bookmarkExists !== false) { ?>
+		<div id="add_form_loading" style=""><span class="icon-loading"></span></div>
+			<h1><?php p($l->t('Add a bookmark')); ?></h1>
+
+			<div class="bookmark-exists" style="display: <?php
+			if ($bookmarkExists === false) {
+				print_unescaped('none');
+			}
+			?>">
+					<?php p($l->t('This URL is already bookmarked! Overwrite?')); ?>
+			</div>
+			<ul class="addBm">
+					<li>
+						<?php if($bookmarkExists !== false) { ?>
 						<input id="bookmarkID" type="hidden" class="hidden" value="<?php p($bookmarkExists); ?>" />
-					<?php } ?>
-                    <input id="title" type="text" name="title" class="title" value="<?php p($_['title']); ?>"
-                           placeholder="<?php p($l->t('The title of the page')); ?>" />
-                </li>
-
-                <li>
-                    <input id="url" type="text" name="url" class="url_input" value="<?php p($_['url']); ?>"
-                           placeholder="<?php p($l->t('The address of the page')); ?>" />
-                </li>
-
-                <li>
-                    <ul id="tags" class="tags" >
-                        <?php foreach ($_['tags'] as $tag): ?>
-                            <li><?php p($tag); ?></li>
-                        <?php endforeach; ?>
-                    </ul>
-                </li>
-
-                <li>
-                    <textarea id="description" name="description" class="desc"
-                              placeholder="<?php p($l->t('Description of the page')); ?>"><?php p($_['description']); ?></textarea>
-                </li>
-
-                <li>
-                    <input type="submit" class="submit" value="<?php p($l->t("Save")); ?>" />
-                    <input type="hidden" class="record_id" value="" name="record_id" />
-                    <input type="hidden" name="requesttoken" value="<?php p($_['requesttoken']) ?>">
-                </li>
-
-            </ul>
-
-        </fieldset>
+						<?php } ?>
+						<input id="title" type="text" name="title" class="title" value="<?php p($_['title']); ?>"
+										 placeholder="<?php p($l->t('The title of the page')); ?>" />
+					</li>
+
+					<li>
+						<input id="url" type="text" name="url" class="url_input" value="<?php p($_['url']); ?>"
+										 placeholder="<?php p($l->t('The address of the page')); ?>" />
+					</li>
+
+					<li>
+						<ul id="tags" class="tags" >
+							<?php foreach ($_['tags'] as $tag): ?>
+									<li><?php p($tag); ?></li>
+							<?php endforeach; ?>
+						</ul>
+					</li>
+
+					<li>
+						<textarea id="description" name="description" class="desc"
+										placeholder="<?php p($l->t('Description of the page')); ?>"><?php p($_['description']); ?></textarea>
+					</li>
+
+					<li>
+						<input type="submit" class="submit" value="<?php p($l->t("Save")); ?>" />
+						<input type="hidden" class="record_id" value="" name="record_id" />
+						<input type="hidden" name="requesttoken" value="<?php p($_['requesttoken']) ?>">
+					</li>
+			</ul>
     </form>
 </div>
diff --git a/templates/main.php b/templates/main.php
index e717f3f60..00fd23e96 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -1,26 +1,6 @@
 <?php
-script('bookmarks', 'dist/bundle');
+script('bookmarks', 'dist/main.bundle');
 style('bookmarks', 'bookmarks');
 
 style('bookmarks', 'select2');
-/**
- * Copyright (c) 2011 Marvin Thomas Rabe <mrabe@marvinrabe.de>
- * Copyright (c) 2011 Arthur Schiwon <blizzz@arthur-schiwon.de>
- * This file is licensed under the Affero General Public License version 3 or
- * later.
- * See the COPYING-README file.
- */
-$bookmarkleturl = $_['bookmarkleturl'];
-$bookmarkletscript = bookmarklet($bookmarkleturl);
-
-function bookmarklet($bookmarkleturl) {
-	$l = \OC::$server->getL10N('bookmarks');
-	$defaults = \OC::$server->getThemingDefaults();
-	$blet = "javascript:(function(){var a=window,b=document,c=encodeURIComponent,e=c(document.title),d=a.open('";
-	$blet .= $bookmarkleturl;
-	$blet .= "?output=popup&url='+c(b.location)+'&title='+e,'bkmk_popup','left='+((a.screenX||a.screenLeft)+10)+',top='+((a.screenY||a.screenTop)+10)+',height=400px,width=550px,resizable=1,alwaysRaised=1');a.setTimeout(function(){d.focus()},300);})();";
-	$help_msg = $l->t('Drag this to your browser bookmarks and click it, when you want to bookmark a webpage quickly:');
-	$output = '<div id="bookmarklet_hint" class="bkm_hint">' . $help_msg . '</div><a class="button bookmarklet" href="' . $blet . '">' . $l->t('Add to ' . \OCP\Util::sanitizeHTML($defaults->getName())) . '</a>';
-	return $output;
-}
 ?>
diff --git a/webpack.config.js b/webpack.config.js
index 16864252a..3333f55b0 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,22 +1,25 @@
 var path = require('path')
 module.exports = {
-  entry: './js/index.js',
-  output: {
-    filename: 'bundle.js',
-    path: path.resolve(__dirname, 'js/dist')
-  },
-  module: {
-    rules: [
-      {
-        test: /\.html$/,
-        use: [ {
-          loader: 'html-loader',
-          options: {
-            minimize: true,
-            exportAsEs6Default: true
-          }
-        }],
-      }
-    ]
-  }
+	entry: {
+		main: './js/main.js',
+		bookmarklet: './js/bookmarklet.js'
+	},
+	output: {
+		filename: '[name].bundle.js',
+		path: path.resolve(__dirname, 'js/dist')
+	},
+	module: {
+		rules: [
+			{
+				test: /\.html$/,
+				use: [ {
+					loader: 'html-loader',
+					options: {
+						minimize: true,
+						exportAsEs6Default: true
+					}
+				}],
+			}
+		]
+	}
 };

From 6166945d8ac3f6c5b85781c96cdc0c392711055f Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Mar 2018 00:22:06 +0100
Subject: [PATCH 108/110] Styling: Make default card colors more pale

---
 js/bookmarklet_old.js    | 73 ++++++++++++++++++++++++++++++++++++++++
 js/views/BookmarkCard.js |  2 +-
 2 files changed, 74 insertions(+), 1 deletion(-)
 create mode 100644 js/bookmarklet_old.js

diff --git a/js/bookmarklet_old.js b/js/bookmarklet_old.js
new file mode 100644
index 000000000..c3b54e154
--- /dev/null
+++ b/js/bookmarklet_old.js
@@ -0,0 +1,73 @@
+var ajaxCallCount = 0;
+
+function increaseAjaxCallCount() {
+	ajaxCallCount++;
+	if (ajaxCallCount - 1 === 0) {
+		updateLoadingAnimation();
+	}
+}
+
+function decreaseAjaxCallCount() {
+	if (ajaxCallCount > 0) {
+		ajaxCallCount--;
+		updateLoadingAnimation();
+	}
+}
+
+function updateLoadingAnimation() {
+	if (ajaxCallCount === 0) {
+		$('#add_form_loading').css('visibility', 'hidden');
+	} else {
+		$('#add_form_loading').css('visibility', 'visible');
+	}
+}
+
+$(document).ready(function () {
+	$('.submit').click(function () {
+		increaseAjaxCallCount();
+
+		var endpoint = 'bookmark';
+		var method = 'POST';
+		var id = '';
+		if($('#bookmarkID').length > 0) {
+			endpoint += '/'+ $('#bookmarkID').val();
+			method = 'PUT';
+			id = '&record_id=' + $('#bookmarkID').val();
+		}
+
+		var tags = '';
+		$('.tagit-choice .tagit-label').each(function() {
+			tags += '&item[tags][]='+$(this).text();
+		});
+		var dataString = 'url=' + $('input#url').val() + '&description=' +
+			$('textarea#description').val() + '&title=' + $('input#title').val() + tags + id;
+		$.ajax({
+			type: method,
+			url: endpoint,
+			data: dataString,
+			complete: function () {
+				decreaseAjaxCallCount();
+			},
+			success: function (data) {
+				if (data.status === 'success') {
+					OC.dialogs.message('Bookmark added.', 'Success', undefined, [], undefined, true);
+					_.delay(function() {
+						window.close();
+					}, 1e3);
+				} else {
+					OC.dialogs.alert(t('bookmarks', 'Some Error happened.'),
+						t('bookmarks', 'Error'), null, true);
+				}
+			}
+		});
+		return false;
+	});
+
+	$.get('tag', function (data) {
+		$('.tags').tagit({
+			allowSpaces: true,
+			availableTags: data,
+			placeholderText: t('bookmark', 'Tags')
+		});
+	});
+});
diff --git a/js/views/BookmarkCard.js b/js/views/BookmarkCard.js
index 82dda1e06..178649958 100644
--- a/js/views/BookmarkCard.js
+++ b/js/views/BookmarkCard.js
@@ -45,7 +45,7 @@ export default Marionette.View.extend({
 		if (this.model.get('image')) {
 		 this.$el.css('background-image', 'url(bookmark/'+this.model.get('id')+'/image)');
 		} else {
-			this.$el.css('background-color', COLORS[simpleHash(this.model.get('url')) & 63] + 'aa')
+			this.$el.css('background-color', COLORS[simpleHash(this.model.get('url')) & 63] + '66')
 		}
 		var tags = new Tags(this.model.get('tags').map(function(id) {
 			return that.app.tags.findWhere({name: id});

From b82294eaa609fff325492eaa27a90bf2a03cb2fc Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Thu, 8 Mar 2018 19:21:49 +0100
Subject: [PATCH 109/110] Remove faulty failing test

background: If the URL contains %ba it is inherently not the same as the same URL with %25ba
thus I think it doesn't make sense to test if they are treated the same
---
 tests/bookmarkcontroller_test.php | 17 -----------------
 1 file changed, 17 deletions(-)

diff --git a/tests/bookmarkcontroller_test.php b/tests/bookmarkcontroller_test.php
index 82b28d5bf..4cd173b35 100644
--- a/tests/bookmarkcontroller_test.php
+++ b/tests/bookmarkcontroller_test.php
@@ -185,23 +185,6 @@ public function testClick() {
 		$this->assertSame(Http::STATUS_OK, $r->getStatus());
 	}
 
-	public function testClickEscapeParam() {
-		$this->cleanDB();
-		$url1 = 'https://example.com/?foo%bar';
-		$id1 = $this->libBookmarks->addBookmark($this->userid, $url1, "Example Domain 1");
-		$id2 = $this->libBookmarks->addBookmark($this->userid, "https://example.com/?foo%bier", "Example Domain 2");
-
-		$r = $this->controller->clickBookmark('https://example.com/?foo%25bar');
-		$this->assertInstanceOf(JSONResponse::class, $r);
-		$this->assertSame(Http::STATUS_OK, $r->getStatus());
-
-		$bm1 = $this->libBookmarks->findUniqueBookmark($id1, $this->userid);
-		$bm2 = $this->libBookmarks->findUniqueBookmark($id2, $this->userid);
-
-		$this->assertSame(1, intval($bm1['clickcount']));
-		$this->assertSame(0, intval($bm2['clickcount']));
-	}
-
 	function cleanDB() {
 		$query1 = \OC_DB::prepare('DELETE FROM *PREFIX*bookmarks');
 		$query1->execute();

From c54037413685f48d6b1983564a8dc9bee7020dec Mon Sep 17 00:00:00 2001
From: Marcel Klehr <mklehr@gmx.net>
Date: Fri, 9 Mar 2018 19:40:50 +0100
Subject: [PATCH 110/110] Make search more useful: interpret blank as AND

---
 js/apps/MainRouter.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/apps/MainRouter.js b/js/apps/MainRouter.js
index a317f415f..53cea684c 100644
--- a/js/apps/MainRouter.js
+++ b/js/apps/MainRouter.js
@@ -30,7 +30,7 @@ export default Marionette.AppRouter.extend({
 			Radio.channel('nav').trigger('navigate', 'tags', tags);
 		},
 		search: function(query) {
-			this.app.bookmarks.setFetchQuery({search: decodeURIComponent(query).split(' ')});
+			this.app.bookmarks.setFetchQuery({search: decodeURIComponent(query).split(' '), conjunction: 'and'});
 			this.app.bookmarks.fetchPage();
 			Radio.channel('nav').trigger('navigate', 'search', query);
 		}