From 0c5fb207e912bb2b2386824d75a38f2d09237130 Mon Sep 17 00:00:00 2001 From: Kane York Date: Thu, 10 Sep 2015 13:04:25 -0700 Subject: [PATCH 1/6] FIX: Fix behavior of category reorder dialog --- .../controllers/reorder-categories.js.es6 | 79 ++++++++++--------- .../templates/modal/reorder-categories.hbs | 31 ++++---- config/locales/client.en.yml | 2 + 3 files changed, 58 insertions(+), 54 deletions(-) diff --git a/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 b/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 index 0c7ab22caed..f33b5e02a11 100644 --- a/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 +++ b/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 @@ -5,6 +5,8 @@ import { popupAjaxError } from 'discourse/lib/ajax-error'; import computed from "ember-addons/ember-computed-decorators"; import Ember from 'ember'; +const SortableArrayProxy = Ember.ArrayProxy.extend(Ember.SortableMixin); + export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, { @computed("site.categories") @@ -13,24 +15,23 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, { return categories.map(c => bufProxy.create({ content: c })); }, - // uses propertyDidChange() - @computed('categoriesBuffered') - categoriesGrouped(cats) { - const map = {}; - cats.forEach((cat) => { - const p = cat.get('position') || 0; - if (!map[p]) { - map[p] = {pos: p, cats: [cat]}; - } else { - map[p].cats.push(cat); + categoriesOrdered: function() { + return SortableArrayProxy.create({ + sortProperties: ['content.position'], + content: this.get('categoriesBuffered') + }); + }.property('categoriesBuffered'), + + showFixIndices: function() { + const cats = this.get('categoriesOrdered'); + const len = cats.get('length'); + for (let i = 0; i < len; i++) { + if (cats.objectAt(i).get('position') !== i) { + return true; } - }); - const result = []; - Object.keys(map).map(p => parseInt(p)).sort((a,b) => a-b).forEach(function(pos) { - result.push(map[pos]); - }); - return result; - }, + } + return false; + }.property('categoriesOrdered.@each.position'), showApplyAll: function() { let anyChanged = false; @@ -38,29 +39,22 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, { return anyChanged; }.property('categoriesBuffered.@each.hasBufferedChanges'), - saveDisabled: Ember.computed.alias('showApplyAll'), + @computed('showApplyAll', 'showFixIndices') + saveDisabled(a, b) { + return a || b; + }, moveDir(cat, dir) { - const grouped = this.get('categoriesGrouped'), - curPos = cat.get('position'), - curGroupIdx = binarySearch(grouped, curPos, "pos"), - curGroup = grouped[curGroupIdx]; - - if (curGroup.cats.length === 1 && ((dir === -1 && curGroupIdx !== 0) || (dir === 1 && curGroupIdx !== (grouped.length - 1)))) { - const nextGroup = grouped[curGroupIdx + dir], - nextPos = nextGroup.pos; - cat.set('position', nextPos); - } else { - cat.set('position', curPos + dir); + const cats = this.get('categoriesOrdered'); + const curIdx = cats.indexOf(cat); + const curPos = cat.get('position'); + const desiredIdx = curIdx + dir; + if (desiredIdx >= 0 && desiredIdx < cats.get('length')) { + cat.set('position', cat.get('position') + dir); + const otherCat = cats.objectAt(desiredIdx); + otherCat.set('position', cat.get('position') - dir); + this.send('commit'); } - cat.applyBufferedChanges(); - Ember.run.next(this, () => { - this.propertyDidChange('categoriesGrouped'); - Ember.run.schedule('afterRender', this, () => { - this.set('scrollIntoViewId', cat.get('id')); - this.trigger('scrollIntoView'); - }); - }); }, actions: { @@ -72,13 +66,22 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, { this.moveDir(cat, 1); }, + fixIndices() { + const cats = this.get('categoriesOrdered'); + const len = cats.get('length'); + for (let i = 0; i < len; i++) { + cats.objectAt(i).set('position', i); + } + this.send('commit'); + }, + commit() { this.get('categoriesBuffered').forEach(bc => { if (bc.get('hasBufferedChanges')) { bc.applyBufferedChanges(); } }); - this.propertyDidChange('categoriesGrouped'); + this.propertyDidChange('categoriesBuffered'); }, saveOrder() { diff --git a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs index 7a5b3172b66..b23f2572923 100644 --- a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs +++ b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs @@ -6,28 +6,27 @@ Position Category - {{#each categoriesGrouped as |group|}} - - {{#each group.cats as |cat|}} - - - {{number-field number=cat.position}} - {{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}} - {{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}} - {{#if cat.hasBufferedChanges}} - {{d-button class="no-text" action="commit" icon="check"}} - {{/if}} - - {{category-badge cat allowUncategorized="true"}} - - {{/each}} - + {{#each categoriesOrdered as |cat|}} + + + {{number-field number=cat.position}} + {{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}} + {{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}} + {{#if cat.hasBufferedChanges}} + {{d-button class="no-text" action="commit" icon="check"}} + {{/if}} + + {{category-badge cat allowUncategorized="true"}} + {{/each}}
+ {{#if showFixIndices}} + {{d-button action="fixIndices" icon="random" label="categories.reorder.fix_order" title="categories.reorder.fix_order_tooltip"}} + {{/if}} {{#if showApplyAll}} {{d-button action="commit" icon="check" label="categories.reorder.apply_all"}} {{/if}} diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index 7799a825451..49a681770be 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -370,6 +370,8 @@ en: category: "Category" reorder: title: "Reorder Categories" + fix_order: "Fix Positions" + fix_order_tooltip: "Not all categories have a unique position number, which may cause unexpected results." save: "Save Order" apply_all: "Apply" posts: "Posts" From c038758f8cfbd1227e566cb4487401d5da09f45f Mon Sep 17 00:00:00 2001 From: Kane York Date: Thu, 10 Sep 2015 13:42:10 -0700 Subject: [PATCH 2/6] FIX: Several fixes related to category reorder - Move "New Category" and "Reorder Categories" into a dropdown - Always show "New Topic" on categories page, even for admins - Make category reorder modal full-height (.full-height-modal) - Move category reorder stylesheet out of admin stylesheet --- .../categories-admin-dropdown.js.es6 | 37 +++++++++++ .../components/dropdown-button.js.es6 | 4 +- .../routes/discovery-categories.js.es6 | 3 +- .../templates/modal/reorder-categories.hbs | 66 +++++++++---------- .../templates/navigation/categories.hbs | 5 +- .../common/{admin => base}/cat_reorder.scss | 3 + app/assets/stylesheets/common/base/modal.scss | 3 + config/locales/client.en.yml | 3 +- 8 files changed, 80 insertions(+), 44 deletions(-) create mode 100644 app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 rename app/assets/stylesheets/common/{admin => base}/cat_reorder.scss (92%) diff --git a/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 b/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 new file mode 100644 index 00000000000..ac53485198d --- /dev/null +++ b/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 @@ -0,0 +1,37 @@ +import { iconHTML } from 'discourse/helpers/fa-icon'; +import DropdownButton from 'discourse/components/dropdown-button'; +import computed from "ember-addons/ember-computed-decorators"; + +export default DropdownButton.extend({ + buttonExtraClasses: 'no-text', + title: '', + text: iconHTML('bars') + ' ' + iconHTML('caret-down'), + classNames: ['category-notification-menu', 'category-admin-menu'], + + @computed() + dropDownContent() { + const includeReorder = this.get('siteSettings.fixed_category_positions'); + const items = [ + { id: 'createCategory', + title: I18n.t('category.create'), + description: I18n.t('category.create_long'), + styleClasses: 'fa fa-plus' } + ]; + if (includeReorder) { + items.push({ + id: 'reorderCategories', + title: I18n.t('categories.reorder.title'), + description: I18n.t('categories.reorder.title_long'), + styleClasses: 'fa fa-random' + }); + } + return items; + }, + + // sendAction() is pretty silly if you ask me + actionFor_createCategory: 'createCategory', + actionFor_reorderCategories: 'reorderCategories', + clicked(id) { + this.sendAction('actionFor_' + id); + } +}); diff --git a/app/assets/javascripts/discourse/components/dropdown-button.js.es6 b/app/assets/javascripts/discourse/components/dropdown-button.js.es6 index 99d211bbe38..0037ec17f2a 100644 --- a/app/assets/javascripts/discourse/components/dropdown-button.js.es6 +++ b/app/assets/javascripts/discourse/components/dropdown-button.js.es6 @@ -29,9 +29,7 @@ export default Ember.Component.extend(StringBuffer, { buffer.push("

" + title + "

"); } - buffer.push(""); + buffer.push(``); buffer.push("
    "); const contents = this.get('dropDownContent'); diff --git a/app/assets/javascripts/discourse/routes/discovery-categories.js.es6 b/app/assets/javascripts/discourse/routes/discovery-categories.js.es6 index 297fc1ac1ee..47a04ae92a0 100644 --- a/app/assets/javascripts/discourse/routes/discovery-categories.js.es6 +++ b/app/assets/javascripts/discourse/routes/discovery-categories.js.es6 @@ -34,9 +34,8 @@ const DiscoveryCategoriesRoute = Discourse.Route.extend(OpenComposer, { setupController(controller, model) { controller.set("model", model); - // Only show either the Create Category or Create Topic button this.controllerFor("navigation/categories").set("canCreateCategory", model.get("can_create_category")); - this.controllerFor("navigation/categories").set("canCreateTopic", model.get("can_create_topic") && !model.get("can_create_category")); + this.controllerFor("navigation/categories").set("canCreateTopic", model.get("can_create_topic")); this.openTopicDraft(model); }, diff --git a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs index b23f2572923..b9ae576799b 100644 --- a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs +++ b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs @@ -1,35 +1,33 @@ -
    -
    -
    - - - - - - {{#each categoriesOrdered as |cat|}} - - - - - {{/each}} -
    PositionCategory
    - {{number-field number=cat.position}} - {{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}} - {{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}} - {{#if cat.hasBufferedChanges}} - {{d-button class="no-text" action="commit" icon="check"}} - {{/if}} - {{category-badge cat allowUncategorized="true"}}
    -
    -
    - -
    - {{#if showFixIndices}} - {{d-button action="fixIndices" icon="random" label="categories.reorder.fix_order" title="categories.reorder.fix_order_tooltip"}} - {{/if}} - {{#if showApplyAll}} - {{d-button action="commit" icon="check" label="categories.reorder.apply_all"}} - {{/if}} - {{d-button class="btn-primary" disabled=saveDisabled action="saveOrder" label="categories.reorder.save"}} -
    +
    +
    + + + + + + {{#each categoriesOrdered as |cat|}} + + + + + {{/each}} +
    PositionCategory
    + {{number-field number=cat.position}} + {{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}} + {{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}} + {{#if cat.hasBufferedChanges}} + {{d-button class="no-text" action="commit" icon="check"}} + {{/if}} + {{category-badge cat allowUncategorized="true"}}
    +
    +
    + +
    + {{#if showFixIndices}} + {{d-button action="fixIndices" icon="random" label="categories.reorder.fix_order" title="categories.reorder.fix_order_tooltip"}} + {{/if}} + {{#if showApplyAll}} + {{d-button action="commit" icon="check" label="categories.reorder.apply_all"}} + {{/if}} + {{d-button class="btn-primary" disabled=saveDisabled action="saveOrder" label="categories.reorder.save"}}
    diff --git a/app/assets/javascripts/discourse/templates/navigation/categories.hbs b/app/assets/javascripts/discourse/templates/navigation/categories.hbs index c6b4c1cbbc9..e6a650cfbe2 100644 --- a/app/assets/javascripts/discourse/templates/navigation/categories.hbs +++ b/app/assets/javascripts/discourse/templates/navigation/categories.hbs @@ -3,10 +3,7 @@ {{navigation-bar navItems=navItems filterMode=filterMode}} {{#if canCreateCategory}} - {{d-button action="createCategory" icon="plus" label="category.create"}} - {{#if siteSettings.fixed_category_positions}} - {{d-button action="reorderCategories" icon="random" label="category.reorder"}} - {{/if}} + {{categories-admin-dropdown}} {{/if}} {{#if canCreateTopic}} diff --git a/app/assets/stylesheets/common/admin/cat_reorder.scss b/app/assets/stylesheets/common/base/cat_reorder.scss similarity index 92% rename from app/assets/stylesheets/common/admin/cat_reorder.scss rename to app/assets/stylesheets/common/base/cat_reorder.scss index d5619e993c3..c1f1ea9943f 100644 --- a/app/assets/stylesheets/common/admin/cat_reorder.scss +++ b/app/assets/stylesheets/common/base/cat_reorder.scss @@ -26,3 +26,6 @@ padding-bottom: 150px; } } +.category-admin-menu ul { + width: 320px; +} diff --git a/app/assets/stylesheets/common/base/modal.scss b/app/assets/stylesheets/common/base/modal.scss index 7674cd42f86..74291ab406b 100644 --- a/app/assets/stylesheets/common/base/modal.scss +++ b/app/assets/stylesheets/common/base/modal.scss @@ -129,6 +129,9 @@ } .modal-body { + &.full-height-modal { + max-height: calc(100vh - 150px); + } textarea { width: 99%; height: 80px; diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index 49a681770be..e3576d80358 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -370,6 +370,7 @@ en: category: "Category" reorder: title: "Reorder Categories" + title_long: "Reorganize the category list" fix_order: "Fix Positions" fix_order_tooltip: "Not all categories have a unique position number, which may cause unexpected results." save: "Save Order" @@ -1519,6 +1520,7 @@ en: topic_template: "Topic Template" delete: 'Delete Category' create: 'New Category' + create_long: 'Create a new category' save: 'Save Category' slug: 'Category Slug' slug_placeholder: '(Optional) dashed-words for url' @@ -1554,7 +1556,6 @@ en: add_permission: "Add Permission" this_year: "this year" position: "position" - reorder: "Reorder" default_position: "Default Position" position_disabled: "Categories will be displayed in order of activity. To control the order of categories in lists, " position_disabled_click: 'enable the "fixed category positions" setting.' From f36dcb6a62b4b4ab1a4ddc5c8b525cb31cc757a1 Mon Sep 17 00:00:00 2001 From: Kane York Date: Thu, 10 Sep 2015 14:21:36 -0700 Subject: [PATCH 3/6] Fix build --- .../discourse/controllers/reorder-categories.js.es6 | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 b/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 index f33b5e02a11..877d948a6da 100644 --- a/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 +++ b/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 @@ -1,6 +1,5 @@ import ModalFunctionality from 'discourse/mixins/modal-functionality'; const BufferedProxy = window.BufferedProxy; // import BufferedProxy from 'ember-buffered-proxy/proxy'; -import binarySearch from 'discourse/lib/binary-search'; import { popupAjaxError } from 'discourse/lib/ajax-error'; import computed from "ember-addons/ember-computed-decorators"; import Ember from 'ember'; @@ -47,12 +46,12 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, { moveDir(cat, dir) { const cats = this.get('categoriesOrdered'); const curIdx = cats.indexOf(cat); - const curPos = cat.get('position'); const desiredIdx = curIdx + dir; if (desiredIdx >= 0 && desiredIdx < cats.get('length')) { - cat.set('position', cat.get('position') + dir); + const curPos = cat.get('position'); + cat.set('position', curPos + dir); const otherCat = cats.objectAt(desiredIdx); - otherCat.set('position', cat.get('position') - dir); + otherCat.set('position', curPos - dir); this.send('commit'); } }, From fc5e15739509b1a141ec697ee3348465133d7cbc Mon Sep 17 00:00:00 2001 From: Kane York Date: Fri, 11 Sep 2015 09:34:20 -0700 Subject: [PATCH 4/6] Sane sendAction() behavior --- .../components/categories-admin-dropdown.js.es6 | 14 ++++++++------ app/assets/stylesheets/admin.scss | 1 - 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 b/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 index ac53485198d..b2fea03ffdf 100644 --- a/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 +++ b/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 @@ -12,14 +12,14 @@ export default DropdownButton.extend({ dropDownContent() { const includeReorder = this.get('siteSettings.fixed_category_positions'); const items = [ - { id: 'createCategory', + { id: 'create', title: I18n.t('category.create'), description: I18n.t('category.create_long'), styleClasses: 'fa fa-plus' } ]; if (includeReorder) { items.push({ - id: 'reorderCategories', + id: 'reorder', title: I18n.t('categories.reorder.title'), description: I18n.t('categories.reorder.title_long'), styleClasses: 'fa fa-random' @@ -28,10 +28,12 @@ export default DropdownButton.extend({ return items; }, - // sendAction() is pretty silly if you ask me - actionFor_createCategory: 'createCategory', - actionFor_reorderCategories: 'reorderCategories', + actionNames: { + create: 'createCategory', + reorder: 'reorderCategories' + }, + clicked(id) { - this.sendAction('actionFor_' + id); + this.sendAction('actionNames.' + id); } }); diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index 577f9aba1c5..498dae55e24 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -1,2 +1 @@ @import "common/admin/admin_base"; -@import "common/admin/cat_reorder"; From b3913b569216ba7455169572f871f0bb44e4aac8 Mon Sep 17 00:00:00 2001 From: Kane York Date: Fri, 11 Sep 2015 09:36:03 -0700 Subject: [PATCH 5/6] doh, computed.or --- .../discourse/controllers/reorder-categories.js.es6 | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 b/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 index 877d948a6da..0debb1e7099 100644 --- a/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 +++ b/app/assets/javascripts/discourse/controllers/reorder-categories.js.es6 @@ -38,10 +38,7 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, { return anyChanged; }.property('categoriesBuffered.@each.hasBufferedChanges'), - @computed('showApplyAll', 'showFixIndices') - saveDisabled(a, b) { - return a || b; - }, + saveDisabled: Ember.computed.or('showApplyAll', 'showFixIndices'), moveDir(cat, dir) { const cats = this.get('categoriesOrdered'); From 42263ac969a756f98f75ec5b847d3a2f84b9d702 Mon Sep 17 00:00:00 2001 From: Kane York Date: Fri, 11 Sep 2015 09:46:54 -0700 Subject: [PATCH 6/6] use translations (doh) --- .../discourse/templates/modal/reorder-categories.hbs | 4 ++-- config/locales/client.en.yml | 1 + 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs index b9ae576799b..64c36b959d6 100644 --- a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs +++ b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs @@ -2,8 +2,8 @@
    - - + + {{#each categoriesOrdered as |cat|}} diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index e3576d80358..8bf64d56cb3 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -375,6 +375,7 @@ en: fix_order_tooltip: "Not all categories have a unique position number, which may cause unexpected results." save: "Save Order" apply_all: "Apply" + position: "Position" posts: "Posts" topics: "Topics" latest: "Latest"
    PositionCategory{{i18n "categories.reorder.position"}}{{i18n "categories.category"}}