From 515abc3080bb9dfbe19ddb8414248f003bb02c72 Mon Sep 17 00:00:00 2001 From: Jason Williams Date: Wed, 25 Feb 2015 17:20:42 +0000 Subject: [PATCH] Simplify navigation item reordering --- .../client/controllers/settings/navigation.js | 65 +++++-------------- core/client/views/settings/navigation.js | 22 ++++--- core/server/data/default-settings.json | 2 +- 3 files changed, 32 insertions(+), 57 deletions(-) diff --git a/core/client/controllers/settings/navigation.js b/core/client/controllers/settings/navigation.js index 5ee4ce8ed0..6b634b0495 100644 --- a/core/client/controllers/settings/navigation.js +++ b/core/client/controllers/settings/navigation.js @@ -4,7 +4,6 @@ var NavigationController, NavItem = Ember.Object.extend({ label: '', url: '', - order: '', last: false, isComplete: Ember.computed('label', 'url', function () { @@ -19,13 +18,10 @@ NavigationController = Ember.Controller.extend({ return url.slice(-1) !== '/' ? url + '/' : url; }), - navigationItems: Ember.computed('model.navigation', function (key, value) { - if (arguments.length > 1) { - return value.sortBy('order'); - } - var order = 0, - navItems, + navigationItems: Ember.computed('model.navigation', function () { + var navItems, lastItem; + try { navItems = JSON.parse(this.get('model.navigation') || [{}]); } catch (e) { @@ -33,16 +29,12 @@ NavigationController = Ember.Controller.extend({ } navItems = navItems.map(function (item) { - item.order = order; - order = order + 1; return NavItem.create(item); }); - navItems.sortBy('order'); - lastItem = navItems.get('lastObject'); if (!lastItem || lastItem.get('isComplete')) { - navItems.addObject(NavItem.create()); + navItems.addObject(NavItem.create({last: true})); } return navItems; @@ -60,23 +52,13 @@ NavigationController = Ember.Controller.extend({ }); }), - // called by the view after items have been rearranged - updateOrder: function (indexes) { - var navItems = this.get('navigationItems'); - - indexes.forEach(function (index, newOrder) { - navItems.objectAt(index).set('order', newOrder); - }); - }, - actions: { addItem: function () { var navItems = this.get('navigationItems'), lastItem = navItems.get('lastObject'); if (lastItem && lastItem.get('isComplete')) { - lastItem.set('order', (navItems.length - 1)); // -1 because order is 0-index, length is 1-index - navItems.addObject(NavItem.create()); // Adds new blank navItem + navItems.addObject(NavItem.create({last: true})); // Adds new blank navItem } }, @@ -84,18 +66,18 @@ NavigationController = Ember.Controller.extend({ if (!item) { return; } - var deletedItemOrder = item.get('order'), - navItems = this.get('navigationItems'); - navItems.removeAt(navItems.indexOf(item)); + var navItems = this.get('navigationItems'); - navItems.forEach(function (item) { - if (!item.last && item.get('order') > deletedItemOrder) { - item.decrementProperty('order'); - } - }); + navItems.removeObject(item); + }, - this.set('navigationItems', navItems); + moveItem: function (index, newIndex) { + var navItems = this.get('navigationItems'), + item = navItems.objectAt(index); + + navItems.removeAt(index); + navItems.insertAt(newIndex, item); }, updateUrl: function (url, navItem) { @@ -118,23 +100,17 @@ NavigationController = Ember.Controller.extend({ blogUrl = this.get('config').blogUrl, blogUrlRegex = new RegExp('^' + blogUrl + '(.*)', 'i'), navItems = this.get('navigationItems'), - lastItem = navItems.get('lastObject'), match; + // Don't save if there's a blank label. if (navItems.find(function (item) { return !item.get('isComplete') && !item.get('last');})) { self.notifications.showErrors(['One of your navigation items has an empty label.
Please enter a new label or delete the item before saving.']); return; } - // The last item is typically ignored in ordering, give it - // the last spot in case it has a label & url and hasn't been - // added yet. - if (lastItem.get('order') !== 0 && !lastItem.get('order')) { - lastItem.set('order', navItems.length); - } + navSetting = navItems.map(function (item) { var label, - url, - order; + url; if (!item || !item.get('isComplete')) { return; @@ -142,7 +118,6 @@ NavigationController = Ember.Controller.extend({ label = item.get('label').trim(); url = item.get('url').trim(); - order = item.get('order'); // is this an internal URL? match = url.match(blogUrlRegex); @@ -159,12 +134,8 @@ NavigationController = Ember.Controller.extend({ url = '/' + url; } - return {label: label, url: url, order: order}; + return {label: label, url: url}; }).compact(); - // Sort JSON so nav items are stored in the correct order - navSetting.sort(function (a, b) { - return a.order - b.order; - }); this.set('model.navigation', JSON.stringify(navSetting)); diff --git a/core/client/views/settings/navigation.js b/core/client/views/settings/navigation.js index fb0fc014ee..a193e7b85e 100644 --- a/core/client/views/settings/navigation.js +++ b/core/client/views/settings/navigation.js @@ -3,21 +3,25 @@ import BaseView from 'ghost/views/settings/content-base'; var SettingsNavigationView = BaseView.extend({ didInsertElement: function () { - var controller = this.get('controller'), - navContainer = Ember.$('.js-settings-navigation'), - navElements = '.navigation-item:not(.navigation-item:last-child)'; + var navContainer = Ember.$('.js-settings-navigation'), + navElements = '.navigation-item:not(.navigation-item:last-child)', + self = this; navContainer.sortable({ handle: '.navigation-item-drag-handle', items: navElements, - update: function () { - var indexes = []; - navContainer.find(navElements).each(function () { - var order = Ember.$(this).data('order'); - indexes.push(order); + start: function (event, ui) { + Ember.run(function () { + ui.item.data('start-index', ui.item.index()); + }); + }, + + update: function (event, ui) { + Ember.run(function () { + self.get('controller').send('moveItem', ui.item.data('start-index'), ui.item.index()); + ui.item.remove(); }); - controller.updateOrder(indexes); } }); }, diff --git a/core/server/data/default-settings.json b/core/server/data/default-settings.json index ef6bb8d2ec..e83fe49a7c 100644 --- a/core/server/data/default-settings.json +++ b/core/server/data/default-settings.json @@ -72,7 +72,7 @@ "defaultValue": "{}" }, "navigation": { - "defaultValue": "[{\"label\":\"Home\", \"url\":\"/\", \"order\":0}]" + "defaultValue": "[{\"label\":\"Home\", \"url\":\"/\"}]" } }, "theme": {