diff --git a/TODO b/TODO index 4089b68b..416ba6bd 100644 --- a/TODO +++ b/TODO @@ -29,9 +29,6 @@ everything related to tags: - automatic removal of unused tags in backend - tags.json refresh when editing post - basic tags - - listing - - sort alphabetically - - sort by time of addition - mass tag - merging - tag editing diff --git a/public_html/css/tag-list.css b/public_html/css/tag-list.css new file mode 100644 index 00000000..cdaa0858 --- /dev/null +++ b/public_html/css/tag-list.css @@ -0,0 +1,28 @@ +#tag-list { + text-align: center; +} + +#tag-list ul { + list-style-type: none; + padding: 0; + margin: 0; +} + +#ta-list ul.order { + margin: -0.5em -0.5em 0.5em -0.5em; +} +#tag-list ul.order li { + display: inline-block; + margin: 0 0.5em; +} +#tag-list ul.order a { + cursor: pointer; + display: inline-block; + padding: 0.2em 0.5em; +} + +#tag-list table { + min-width: 20em; + text-align: left; + margin: 1em auto; +} diff --git a/public_html/index.html b/public_html/index.html index 1755e82a..fd4dd036 100644 --- a/public_html/index.html +++ b/public_html/index.html @@ -39,6 +39,7 @@ + diff --git a/public_html/js/Presenters/TagListPresenter.js b/public_html/js/Presenters/TagListPresenter.js index 9f4dcfaf..f4a5ca52 100644 --- a/public_html/js/Presenters/TagListPresenter.js +++ b/public_html/js/Presenters/TagListPresenter.js @@ -2,27 +2,94 @@ var App = App || {}; App.Presenters = App.Presenters || {}; App.Presenters.TagListPresenter = function( + _, jQuery, + util, + promise, + pagerPresenter, topNavigationPresenter) { var $el = jQuery('#content'); + var templates = {}; function init(args, loaded) { topNavigationPresenter.select('tags'); topNavigationPresenter.changeTitle('Tags'); - render(); + + promise.wait( + util.promiseTemplate('tag-list'), + util.promiseTemplate('tag-list-item')) + .then(function(listTemplate, listItemTemplate) { + templates.list = listTemplate; + templates.listItem = listItemTemplate; + + render(); + loaded(); + + pagerPresenter.init({ + baseUri: '#/tags', + backendUri: '/tags', + $target: $el.find('.pagination-target'), + updateCallback: function(data, clear) { + renderTags(data.entities, clear); + }, + }, + function() { + reinit(args, function() {}); + }); + }); + } + + function reinit(args, loaded) { loaded(); + + var searchArgs = util.parseComplexRouteArgs(args.searchArgs); + searchArgs.order = searchArgs.order || 'name,asc'; + searchArgs.page = parseInt(searchArgs.page) || 1; + updateActiveOrder(searchArgs.order); + + pagerPresenter.reinit({ + page: searchArgs.page, + searchParams: { + order: searchArgs.order}}); + } + + function deinit() { + pagerPresenter.deinit(); } function render() { - $el.html('Tag list placeholder'); + $el.html(templates.list()); + } + + function updateActiveOrder(activeOrder) { + $el.find('.order li a').removeClass('active'); + $el.find('.order [href*="' + activeOrder + '"]').addClass('active'); + } + + function renderTags(tags, clear) { + var $target = $el.find('.tags'); + + if (clear) { + $target.empty(); + } + + _.each(tags, function(tag) { + var $item = jQuery(templates.listItem({ + tag: tag, + formatRelativeTime: util.formatRelativeTime, + })); + $target.append($item); + }); } return { init: init, + reinit: reinit, + deinit: deinit, render: render, }; }; -App.DI.register('tagListPresenter', ['jQuery', 'topNavigationPresenter'], App.Presenters.TagListPresenter); +App.DI.register('tagListPresenter', ['_', 'jQuery', 'util', 'promise', 'pagerPresenter', 'topNavigationPresenter'], App.Presenters.TagListPresenter); diff --git a/public_html/js/Presenters/UserPresenter.js b/public_html/js/Presenters/UserPresenter.js index 4035d933..e4593138 100644 --- a/public_html/js/Presenters/UserPresenter.js +++ b/public_html/js/Presenters/UserPresenter.js @@ -24,7 +24,7 @@ App.Presenters.UserPresenter = function( function init(args, loaded) { promise.wait(util.promiseTemplate('user')) - .then(function(template, response) { + .then(function(template) { $messages = $el.find('.messages'); templates.user = template; reinit(args, loaded); diff --git a/public_html/templates/tag-list-item.tpl b/public_html/templates/tag-list-item.tpl new file mode 100644 index 00000000..c9238ea8 --- /dev/null +++ b/public_html/templates/tag-list-item.tpl @@ -0,0 +1,5 @@ +