diff --git a/public/less/admin/manage/categories.less b/public/less/admin/manage/categories.less index 7a2082877d..020e618382 100644 --- a/public/less/admin/manage/categories.less +++ b/public/less/admin/manage/categories.less @@ -18,15 +18,11 @@ div.categories { li { min-height: @acp-line-height; margin: @acp-base-line 0; - } - > ul > li + li:before { - content: ""; - display: block; - height: 1px; - width: 100%; - margin: @acp-base-line; - background: #F5F5F5; + &.placeholder { + border: 1px dashed #2196F3; + background-color: #E1F5FE; + } } .disabled { @@ -50,10 +46,11 @@ div.categories { background-size: cover; float: left; margin-right: @acp-margin; + cursor: move; } .information { - float:left; + float: left; } .header { diff --git a/public/src/admin/manage/categories.js b/public/src/admin/manage/categories.js index ff110540d1..0eef50ec0e 100644 --- a/public/src/admin/manage/categories.js +++ b/public/src/admin/manage/categories.js @@ -2,7 +2,7 @@ /*global define, socket, app, bootbox, templates, ajaxify, RELATIVE_PATH*/ define('admin/manage/categories', function() { - var Categories = {}; + var Categories = {}, newCategoryId = -1, sortables; Categories.init = function() { socket.emit('admin.categories.getAll', function(error, payload){ @@ -13,21 +13,6 @@ define('admin/manage/categories', function() { Categories.render(payload); }); - function updateCategoryOrders(evt, ui) { - var categories = $(evt.target).children(), - modified = {}, - cid; - - for(var i=0;i'), marginLeft = 48, listItem; + function itemDidAdd(e){ + newCategoryId = e.to.dataset.cid; + } + + function itemDragDidEnd(e){ + var isCategoryUpdate = (newCategoryId != -1); + //Update needed? + if((e.newIndex != undefined && e.oldIndex != e.newIndex) || isCategoryUpdate){ + var parentCategory = isCategoryUpdate ? sortables[newCategoryId] : sortables[e.from.dataset.cid], + modified = {}, i = 0, list = parentCategory.toArray(), len = list.length; + + for(i; i < len; ++i) { + modified[list[i]] = { + order: (i + 1) + } + } + + if(isCategoryUpdate){ + modified[e.item.dataset.cid]['parentCid'] = newCategoryId; + } + + newCategoryId = -1 + socket.emit('admin.categories.update', modified); + } + } + + /** + * Render categories - recursively + * + * @param categories {array} categories tree + * @param level {number} current sub-level of rendering + * @param container {object} parent jquery element for the list + * @param parentId {number} parent category identifier + */ + function renderList(categories, level, container, parentId){ + var i = 0, len = categories.length, category, marginLeft = 48, listItem; + var list = $('