From af849e1503aa9b345f332319252a5ececdf49ba6 Mon Sep 17 00:00:00 2001 From: Dariusz Szut Date: Mon, 3 Oct 2016 14:46:48 +0200 Subject: [PATCH] EZS-998: Landing page -> delete draft -> deletes the complete object --- .../js/views/actions/ezs-draftactionitemview.js | 29 +++++++++++++++- .../public/js/views/actions/ezs-draftactionview.js | 39 ++++++++++++++++++++-- Resources/public/js/views/ezs-topactionbarview.js | 7 +++- .../assets/ezs-draftactionitemview-tests.js | 18 ++++++++++ .../actions/assets/ezs-draftactionview-tests.js | 35 +++++++++++++++++++ .../js/views/assets/ezs-topactionbarview-tests.js | 12 ++++++- 6 files changed, 134 insertions(+), 6 deletions(-) diff --git a/Resources/public/js/views/actions/ezs-draftactionitemview.js b/Resources/public/js/views/actions/ezs-draftactionitemview.js index b2d4aa7..13f274a 100644 --- a/Resources/public/js/views/actions/ezs-draftactionitemview.js +++ b/Resources/public/js/views/actions/ezs-draftactionitemview.js @@ -12,7 +12,8 @@ YUI.add('ezs-draftactionitemview', function (Y) { */ Y.namespace('eZS'); - var CLASS_SELECTED = 'is-selected'; + var CLASS_SELECTED = 'is-selected', + CLASS_HIDDEN = 'ezs-is-hidden'; /** * Draft Action View @@ -26,6 +27,8 @@ YUI.add('ezs-draftactionitemview', function (Y) { containerTemplate: '
  • ', initializer: function () { + this.on('displayedChange', this._toggleItemVisibility, this); + this.after('selectedChange', this._makeSelection, this); }, @@ -68,6 +71,19 @@ YUI.add('ezs-draftactionitemview', function (Y) { var methodName = this.get('selected') ? 'addClass' : 'removeClass'; this.get('container')[methodName](CLASS_SELECTED); + }, + + /** + * Toggles visibility of item + * + * @method _toggleItemVisibility + * @protected + * @param event {Object} event facade + */ + _toggleItemVisibility: function (event) { + var methodName = event.newVal ? 'removeClass' : 'addClass'; + + this.get('container')[methodName](CLASS_HIDDEN); } }, { ATTRS: { @@ -116,6 +132,17 @@ YUI.add('ezs-draftactionitemview', function (Y) { cssClassName: { value: '', writeOnce: 'initOnly' + }, + + /** + * Should be visible? + * + * @attribute displayed + * @type {Boolean} + * @default true + */ + displayed: { + value: true } } }); diff --git a/Resources/public/js/views/actions/ezs-draftactionview.js b/Resources/public/js/views/actions/ezs-draftactionview.js index d42d8cc..8aa3d1a 100644 --- a/Resources/public/js/views/actions/ezs-draftactionview.js +++ b/Resources/public/js/views/actions/ezs-draftactionview.js @@ -35,7 +35,9 @@ YUI.add('ezs-draftactionview', function (Y) { TEXT_PUBLISH = 'Publish', TEXT_DISCARD = 'Discard', TEXT_SAVE_DRAFT = 'Save draft', - TEXT_DELETE_DRAFT = 'Delete draft'; + TEXT_DELETE_DRAFT = 'Delete draft', + DELETE_ACTION_ID = 'delete', + CONTENT_STATUS_DRAFT = 'DRAFT'; /** * Draft Action View @@ -74,6 +76,7 @@ YUI.add('ezs-draftactionview', function (Y) { this.on('*:draftAction', this._hideDraftOptionsList, this); this.on('isDisabledChange', this._toggleButtonState); + this.after('contentStatusChange', this._toggleDeleteDraftItemVisibility, this); this.after('contentTypeGroupsChange', this._renderContentTypeSelector); this.after('contentTypeSelectorExpandedChange', this._setClickOutsideContentTypesListEventHandler); this.after('contentCreateOptionsVisibleChange', this._setClickOutsideCreateContentOptionsEventHandler); @@ -106,6 +109,7 @@ YUI.add('ezs-draftactionview', function (Y) { this._addButtonActionViewClassName(); this._updateViewState(); + this._toggleDeleteDraftItemVisibility(); return this; }, @@ -127,6 +131,10 @@ YUI.add('ezs-draftactionview', function (Y) { btn.setAttribute(ATTR_SELECTED_OPTION, label.toLowerCase()); btn.one(SELECTOR_BTN_LABEL_TEXT).setHTML(label); + + if (!isEditMode) { + this.set('contentStatus'); + } }, /** @@ -428,6 +436,23 @@ YUI.add('ezs-draftactionview', function (Y) { }, + /** + * Toggles the visibility of delete draft item. + * + * @method _toggleDeleteDraftItemVisibility + * @protected + */ + _toggleDeleteDraftItemVisibility: function (event) { + var displayed = event && event.newVal === CONTENT_STATUS_DRAFT ? true : false, + deleteDraftView = this.get('options').filter(function (option) { + return option.get('action') === DELETE_ACTION_ID; + })[0]; + + if (deleteDraftView) { + deleteDraftView.set('displayed', displayed); + } + }, + destructor: function () { var contentTypeSelector = this.get('contentTypeSelectorView'), options = this.get('options'); @@ -556,7 +581,7 @@ YUI.add('ezs-draftactionview', function (Y) { items.push((new Item({ label: TEXT_DELETE_DRAFT, - action: 'delete', + action: DELETE_ACTION_ID, cssClassName: CLASS_LIST_ITEM, priority: 1000, bubbleTargets: this @@ -597,7 +622,15 @@ YUI.add('ezs-draftactionview', function (Y) { */ isDisabled: { value: false - } + }, + + /** + * The current content status. + * + * @attribute contentStatus + * @type String + */ + contentStatus: {} } }); }); diff --git a/Resources/public/js/views/ezs-topactionbarview.js b/Resources/public/js/views/ezs-topactionbarview.js index b4a6ed2..2d11882 100644 --- a/Resources/public/js/views/ezs-topactionbarview.js +++ b/Resources/public/js/views/ezs-topactionbarview.js @@ -118,12 +118,17 @@ YUI.add('ezs-topactionbarview', function (Y) { */ _configActiveView: function (params) { var prevTargetView = this.get('activeTargetView'), - activeView = params.activeView; + activeView = params.activeView, + version = activeView.get('version'); if (prevTargetView) { this.removeTarget(prevTargetView); } + if (version) { + this.get('draftActionView').set('contentStatus', version.get('status')); + } + this.addTarget(activeView); this.set('contentState', params.state); this.set('activeTargetView', activeView); diff --git a/Tests/js/views/actions/assets/ezs-draftactionitemview-tests.js b/Tests/js/views/actions/assets/ezs-draftactionitemview-tests.js index cb5e5a1..25d35be 100644 --- a/Tests/js/views/actions/assets/ezs-draftactionitemview-tests.js +++ b/Tests/js/views/actions/assets/ezs-draftactionitemview-tests.js @@ -10,6 +10,7 @@ YUI.add('ezs-draftactionitemview-tests', function (Y) { cssClassName: 'sample-css-class' }, CLASS_SELECTED = 'is-selected', + CLASS_HIDDEN = 'ezs-is-hidden', viewTest; viewTest = new Y.Test.Case({ @@ -72,6 +73,23 @@ YUI.add('ezs-draftactionitemview-tests', function (Y) { this.wait(); Y.Assert.isTrue(isEventFired, 'Should fire the `' + eventName + '` event'); + }, + + 'Should hide item when displayed is set to false': function () { + var view = this.view.render(); + + view.set('displayed', false); + + Y.Assert.isTrue(view.get('container').hasClass(CLASS_HIDDEN), 'Should add `' + CLASS_HIDDEN + '` CSS class to the container'); + }, + + 'Should hide item when displayed is set to true': function () { + var view = this.view.render(); + + view.set('displayed', false); + view.set('displayed', true); + + Y.Assert.isFalse(view.get('container').hasClass(CLASS_HIDDEN), 'Should remove `' + CLASS_HIDDEN + '` CSS class from the container'); } }); diff --git a/Tests/js/views/actions/assets/ezs-draftactionview-tests.js b/Tests/js/views/actions/assets/ezs-draftactionview-tests.js index d2dbd5c..762aa9a 100644 --- a/Tests/js/views/actions/assets/ezs-draftactionview-tests.js +++ b/Tests/js/views/actions/assets/ezs-draftactionview-tests.js @@ -11,6 +11,7 @@ YUI.add('ezs-draftactionview-tests', function (Y) { CLASS_VISIBLE = 'is-visible', CLASS_LOADED = 'is-loaded', CLASS_DISABLED = 'is-disabled', + CLASS_HIDDEN = 'ezs-is-hidden', SELECTOR_CONTAINER = '.container', SELECTOR_OUTSIDE = '.outside', SELECTOR_TOGGLE_BTN = '.ez-view-studiodraftactionview__btn__toggle', @@ -19,6 +20,9 @@ YUI.add('ezs-draftactionview-tests', function (Y) { SELECTOR_LANDING_PAGE_OPTION = '[data-create-select="landing-page"]', SELECTOR_CONTENT_OPTION = '[data-create-select="content"]', VIEW_CONFIG = {}, + TEXT_DELETE_OPTION = 'delete', + STATUS_PUBLISHED = 'PUBLISHED', + STATUS_DRAFT = 'DRAFT', viewTests, editModeEventsTests, viewModeEventsTests, @@ -77,6 +81,12 @@ YUI.add('ezs-draftactionview-tests', function (Y) { delete this.view; }, + _findOptionByActionText: function (action) { + return this.view.get('options').filter(function (option) { + return option.get('action') === action; + })[0]; + }, + 'Clicking on toggle button should expand the options list': function () { var container = this.view.render().get('container'); @@ -134,6 +144,31 @@ YUI.add('ezs-draftactionview-tests', function (Y) { Y.Assert.isTrue(isValueChanged, 'Should hide the draft options menu'); }, + + 'Should hide `delete draft` option when content is not a draft': function () { + var view = this.view.render(), + deleteDraftOption = this._findOptionByActionText(TEXT_DELETE_OPTION); + + view.set('contentStatus', STATUS_PUBLISHED); + + Y.Assert.isFalse( + deleteDraftOption.get('displayed'), + 'Should change `displayed` attr to `delete draft` to false' + ); + }, + + 'Should show `delete draft` option when content is a draft': function () { + var view = this.view.render(), + deleteDraftOption = this._findOptionByActionText(TEXT_DELETE_OPTION); + + view.set('contentStatus', STATUS_PUBLISHED); + view.set('contentStatus', STATUS_DRAFT); + + Y.Assert.isTrue( + deleteDraftOption.get('displayed'), + 'Should change `displayed` attr to `delete draft` to true' + ); + }, }); viewModeEventsTests = new Y.Test.Case({ diff --git a/Tests/js/views/assets/ezs-topactionbarview-tests.js b/Tests/js/views/assets/ezs-topactionbarview-tests.js index 09252af..1083302 100644 --- a/Tests/js/views/assets/ezs-topactionbarview-tests.js +++ b/Tests/js/views/assets/ezs-topactionbarview-tests.js @@ -89,9 +89,12 @@ YUI.add('ezs-topactionbarview-tests', function (Y) { 'Should configure the active view and toolbar': function () { var view = this.view, + versionMock = new Y.Mock(), + expectedStatus = 'DRAFT', activeView = new Y.eZ.View({ id: 'activeView', - actionbar: {} + actionbar: {}, + version: versionMock }), params = { activeView: activeView, @@ -99,6 +102,12 @@ YUI.add('ezs-topactionbarview-tests', function (Y) { }, targets; + Y.Mock.expect(versionMock, { + method: 'get', + args: ['status'], + returns: expectedStatus + }); + view.get('draftActionView')._updateViewState = function () {}; view.render(); @@ -113,6 +122,7 @@ YUI.add('ezs-topactionbarview-tests', function (Y) { Y.Assert.areEqual(params.state, view.get('contentState'), 'The content view state should be set correctly'); Y.Assert.areEqual(params.activeView, view.get('activeTargetView'), 'The active view should be set correctly'); Y.Assert.areEqual(view, activeView.get('actionbar'), 'The reference to actionbar should be set correctly'); + Y.Assert.areEqual(expectedStatus, view.get('draftActionView').get('contentStatus'), 'Should set correct content status'); }, 'Should remove the previous view from being target of the bar, then configure the active view and toolbar': function () {