Rename posts to product

[MAILPOET-1709]
This commit is contained in:
Pavel Dohnal
2019-03-19 12:53:34 +01:00
committed by M. Shull
parent abebf5ce49
commit 46416e410b
8 changed files with 209 additions and 129 deletions

View File

@@ -50,7 +50,9 @@ $two-column-wider-column-width: (($newsletter-width / 3) - $column-margin) * 2;
} }
& > .mailpoet_container_block > .mailpoet_container > .mailpoet_container_block > .mailpoet_container_horizontal, & > .mailpoet_container_block > .mailpoet_container > .mailpoet_container_block > .mailpoet_container_horizontal,
& > .mailpoet_container_block > .mailpoet_container > .mailpoet_posts_block > .mailpoet_posts_container > .mailpoet_container_block > .mailpoet_container > .mailpoet_container_block > .mailpoet_container_horizontal, & > .mailpoet_container_block > .mailpoet_container > .mailpoet_posts_block > .mailpoet_posts_container > .mailpoet_container_block > .mailpoet_container > .mailpoet_container_block > .mailpoet_container_horizontal,
& > .mailpoet_container_block > .mailpoet_container .mailpoet_automated_latest_content_block_posts .mailpoet_container_horizontal { & > .mailpoet_container_block > .mailpoet_container .mailpoet_automated_latest_content_block_posts .mailpoet_container_horizontal,
& > .mailpoet_container_block > .mailpoet_container > .mailpoet_products_block > .mailpoet_products_container > .mailpoet_container_block > .mailpoet_container > .mailpoet_container_block > .mailpoet_container_horizontal,
& > .mailpoet_container_block > .mailpoet_container .mailpoet_automated_latest_content_block_products .mailpoet_container_horizontal {
& > .mailpoet_block:first-child:nth-last-child(2), & > .mailpoet_block:first-child:nth-last-child(2),
& > .mailpoet_block:first-child:nth-last-child(2) ~ .mailpoet_block { & > .mailpoet_block:first-child:nth-last-child(2) ~ .mailpoet_block {

View File

@@ -0,0 +1,74 @@
.mailpoet_products_block {
padding-left: 0;
padding-right: 0;
}
.mailpoet_products_block_products {
overflow: auto;
& > .mailpoet_block {
width: 100%;
}
}
.mailpoet_product_selection_filter_row {
margin-top: 5px;
margin-bottom: 5px;
}
.mailpoet_products_categories_and_tags {
width: 100%;
}
.mailpoet_settings_products_display_options,
.mailpoet_settings_products_selection {
@include animation-slide-open-downwards();
overflow-x: hidden;
}
.mailpoet_settings_products_show_display_options,
.mailpoet_settings_products_show_product_selection {
display: block;
margin-top: 10px;
}
.mailpoet_product_selection_container {
margin-top: 20px;
margin-bottom: 0;
}
.mailpoet_product_scroll_container {
overflow-y: scroll;
overflow-x: hidden;
max-height: 400px;
}
.mailpoet_settings_products_single_product {
border-radius: 1px;
box-sizing: border-box;
width: 100%;
margin-top: 5px;
margin-bottom: 5px;
height: 38px;
line-height: 38px;
overflow: hidden;
border: 1px solid $content-border-color;
background-color: $white-color;
&:hover {
border-color: $primary-active-color;
}
.mailpoet_select_product_checkbox {
margin-left: 10px;
margin-right: 8px;
}
}
.mailpoet_product_selection_loading {
color: #999;
}
.mailpoet_products_container > .mailpoet_droppable_block {
width: 100%;
}

View File

@@ -23,6 +23,7 @@
@import 'components/newsletterEditor/contentBlocks/container'; @import 'components/newsletterEditor/contentBlocks/container';
@import 'components/newsletterEditor/contentBlocks/automatedLatestContent'; @import 'components/newsletterEditor/contentBlocks/automatedLatestContent';
@import 'components/newsletterEditor/contentBlocks/posts'; @import 'components/newsletterEditor/contentBlocks/posts';
@import 'components/newsletterEditor/contentBlocks/products';
@import 'components/newsletterEditor/contentBlocks/button'; @import 'components/newsletterEditor/contentBlocks/button';
@import 'components/newsletterEditor/contentBlocks/divider'; @import 'components/newsletterEditor/contentBlocks/divider';
@import 'components/newsletterEditor/contentBlocks/image'; @import 'components/newsletterEditor/contentBlocks/image';

View File

@@ -25,17 +25,17 @@ import 'select2';
var Module = {}; var Module = {};
var base = BaseBlock; var base = BaseBlock;
var PostsDisplayOptionsSettingsView; var ProductsDisplayOptionsSettingsView;
var SinglePostSelectionSettingsView; var SingleProductSelectionSettingsView;
var EmptyPostSelectionSettingsView; var EmptyProductSelectionSettingsView;
var PostSelectionSettingsView; var ProductSelectionSettingsView;
var PostsSelectionCollectionView; var ProductSelectionCollectionView;
Module.PostsBlockModel = base.BlockModel.extend({ Module.ProductsBlockModel = base.BlockModel.extend({
stale: ['_selectedPosts', '_availablePosts', '_transformedPosts'], stale: ['_selectedProducts', '_availableProducts', '_transformedProducts'],
defaults: function productsModelDefaults() { defaults: function productsModelDefaults() {
return this._getDefaults({ return this._getDefaults({
type: 'posts', type: 'products',
withLayout: true, withLayout: true,
amount: '10', amount: '10',
offset: 0, offset: 0,
@@ -64,125 +64,128 @@ Module.PostsBlockModel = base.BlockModel.extend({
sortBy: 'newest', // 'newest'|'oldest', sortBy: 'newest', // 'newest'|'oldest',
showDivider: true, // true|false showDivider: true, // true|false
divider: {}, divider: {},
_selectedPosts: [], _selectedProducts: [],
_availablePosts: [], _availableProducts: [],
_transformedPosts: new (App.getBlockTypeModel('container'))(), _transformedProducts: new (App.getBlockTypeModel('container'))(),
}, App.getConfig().get('blockDefaults.posts')); }, App.getConfig().get('blockDefaults.posts'));
}, },
relations: function relations() { relations: function relations() {
return { return {
readMoreButton: App.getBlockTypeModel('button'), readMoreButton: App.getBlockTypeModel('button'),
divider: App.getBlockTypeModel('divider'), divider: App.getBlockTypeModel('divider'),
_selectedPosts: Backbone.Collection, _selectedProducts: Backbone.Collection,
_availablePosts: Backbone.Collection, _availableProducts: Backbone.Collection,
_transformedPosts: App.getBlockTypeModel('container'), _transformedProducts: App.getBlockTypeModel('container'),
}; };
}, },
initialize: function initialize() { initialize: function initialize() {
var POST_REFRESH_DELAY_MS = 500; var PRODUCT_REFRESH_DELAY_MS = 500;
var refreshAvailablePosts = _.debounce( var refreshAvailableProducts = _.debounce(
this.fetchAvailablePosts.bind(this), this.fetchAvailableProducts.bind(this),
POST_REFRESH_DELAY_MS PRODUCT_REFRESH_DELAY_MS
); );
var refreshTransformedPosts = _.debounce( var refreshTransformedProducts = _.debounce(
this._refreshTransformedPosts.bind(this), this._refreshTransformedProducts.bind(this),
POST_REFRESH_DELAY_MS PRODUCT_REFRESH_DELAY_MS
); );
// Attach Radio.Requests API primarily for highlighting // Attach Radio.Requests API primarily for highlighting
_.extend(this, Radio.Requests); _.extend(this, Radio.Requests);
this.fetchAvailablePosts(); this.fetchAvailableProducts();
this.on('change', this._updateDefaults, this); this.on('change', this._updateDefaults, this);
this.on('change:amount change:contentType change:terms change:inclusionType change:postStatus change:search change:sortBy', refreshAvailablePosts); this.on('change:amount change:contentType change:terms change:inclusionType change:postStatus change:search change:sortBy', refreshAvailableProducts);
this.on('loadMorePosts', this._loadMorePosts, this); this.on('loadMoreProducts', this._loadMoreProducts, this);
this.listenTo(this.get('_selectedPosts'), 'add remove reset', refreshTransformedPosts); this.listenTo(this.get('_selectedProducts'), 'add remove reset', refreshTransformedProducts);
this.on('change:displayType change:titleFormat change:featuredImagePosition change:titleAlignment change:titleIsLink change:imageFullWidth change:showAuthor change:authorPrecededBy change:showCategories change:categoriesPrecededBy change:readMoreType change:readMoreText change:showDivider change:titlePosition', refreshTransformedPosts); this.on('change:displayType change:titleFormat change:featuredImagePosition change:titleAlignment change:titleIsLink change:imageFullWidth change:showAuthor change:authorPrecededBy change:showCategories change:categoriesPrecededBy change:readMoreType change:readMoreText change:showDivider change:titlePosition', refreshTransformedProducts);
this.listenTo(this.get('readMoreButton'), 'change', refreshTransformedPosts); this.listenTo(this.get('readMoreButton'), 'change', refreshTransformedProducts);
this.listenTo(this.get('divider'), 'change', refreshTransformedPosts); this.listenTo(this.get('divider'), 'change', refreshTransformedProducts);
this.on('insertSelectedPosts', this._insertSelectedPosts, this); this.on('insertSelectedProducts', this._insertSelectedProducts, this);
}, },
fetchAvailablePosts: function fetchAvailablePosts() { fetchAvailableProducts: function fetchAvailableProducts() {
var that = this; var that = this;
this.set('offset', 0); this.set('offset', 0);
CommunicationComponent.getPosts(this.toJSON()).done(function getPostsDone(posts) { CommunicationComponent.getPosts(this.toJSON()).done(function getPostsDone(products) {
that.get('_availablePosts').reset(posts); that.get('_availableProducts').reset(products);
that.get('_selectedPosts').reset(); // Empty out the collection that.get('_selectedProducts').reset(); // Empty out the collection
that.trigger('change:_availablePosts'); that.trigger('change:_availableProducts');
}).fail(function getPostsFail() { }).fail(function getProductsFail() {
MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchAvailablePosts')); MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchAvailablePosts'));
}); });
}, },
_loadMorePosts: function loadMorePosts() { _loadMoreProducts: function loadMoreProducts() {
var that = this; var that = this;
var postCount = this.get('_availablePosts').length; var productsCount = this.get('_availableProducts').length;
var nextOffset = this.get('offset') + Number(this.get('amount')); var nextOffset = this.get('offset') + Number(this.get('amount'));
if (postCount === 0 || postCount < nextOffset) { if (productsCount === 0 || productsCount < nextOffset) {
// No more posts to load // No more posts to load
return false; return false;
} }
this.set('offset', nextOffset); this.set('offset', nextOffset);
this.trigger('loadingMorePosts'); this.trigger('loadingMoreProducts');
CommunicationComponent.getPosts(this.toJSON()).done(function getPostsDone(posts) { CommunicationComponent.getPosts(this.toJSON()).done(function getPostsDone(products) {
that.get('_availablePosts').add(posts); that.get('_availableProducts').add(products);
that.trigger('change:_availablePosts'); that.trigger('change:_availableProducts');
}).fail(function getPostsFail() { }).fail(function getProductsFail() {
MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchAvailablePosts')); MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchAvailablePosts'));
}).always(function getPostsAlways() { }).always(function getProductsAlways() {
that.trigger('morePostsLoaded'); that.trigger('moreProductsLoaded');
}); });
return true; return true;
}, },
_refreshTransformedPosts: function refreshTransformedPosts() { _refreshTransformedProducts: function refreshTransformedProducts() {
var that = this; var that = this;
var data = this.toJSON(); var data = this.toJSON();
data.posts = this.get('_selectedPosts').pluck('ID'); data.posts = this.get('_selectedProducts').pluck('ID');
if (data.posts.length === 0) { if (data.posts.length === 0) {
this.get('_transformedPosts').get('blocks').reset(); this.get('_transformedProducts').get('blocks').reset();
return; return;
} }
CommunicationComponent.getTransformedPosts(data).done(function getTransformedPostsDone(posts) { CommunicationComponent.getTransformedPosts(data)
that.get('_transformedPosts').get('blocks').reset(posts, { parse: true }); .done(function getTransformedPostsDone(products) {
}).fail(function getTransformedPostsFail() { that.get('_transformedProducts').get('blocks').reset(products, { parse: true });
})
.fail(function getTransformedProductsFail() {
MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts')); MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts'));
}); });
}, },
_insertSelectedPosts: function insertSelectedPosts() { _insertSelectedProducts: function insertSelectedProducts() {
var data = this.toJSON(); var data = this.toJSON();
var index = this.collection.indexOf(this); var index = this.collection.indexOf(this);
var collection = this.collection; var collection = this.collection;
data.posts = this.get('_selectedPosts').pluck('ID'); data.posts = this.get('_selectedProducts').pluck('ID');
if (data.posts.length === 0) return; if (data.posts.length === 0) return;
CommunicationComponent.getTransformedPosts(data).done(function getTransformedPostsDone(posts) { CommunicationComponent.getTransformedPosts(data)
collection.add(JSON.parse(JSON.stringify(posts)), { at: index }); .done(function getTransformedPostsDone(proucts) {
}).fail(function getTransformedPostsFail() { collection.add(JSON.parse(JSON.stringify(proucts)), { at: index });
}).fail(function getTransformedProductsFail() {
MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts')); MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts'));
}); });
}, },
}); });
Module.PostsBlockView = base.BlockView.extend({ Module.ProductsBlockView = base.BlockView.extend({
className: 'mailpoet_block mailpoet_posts_block mailpoet_droppable_block', className: 'mailpoet_block mailpoet_products_block mailpoet_droppable_block',
getTemplate: function getTemplate() { return window.templates.productsBlock; }, getTemplate: function getTemplate() { return window.templates.productsBlock; },
modelEvents: {}, // Forcefully disable all events modelEvents: {}, // Forcefully disable all events
regions: _.extend({ regions: _.extend({
postsRegion: '.mailpoet_posts_container', productsRegion: '.mailpoet_products_container',
}, base.BlockView.prototype.regions), }, base.BlockView.prototype.regions),
onDragSubstituteBy: function onDragSubstituteBy() { return Module.PostsWidgetView; }, onDragSubstituteBy: function onDragSubstituteBy() { return Module.ProductsWidgetView; },
initialize: function initialize() { initialize: function initialize() {
base.BlockView.prototype.initialize.apply(this, arguments); base.BlockView.prototype.initialize.apply(this, arguments);
this.toolsView = new Module.PostsBlockToolsView({ model: this.model }); this.toolsView = new Module.ProductsBlockToolsView({ model: this.model });
this.model.reply('blockView', this.notifyAboutSelf, this); this.model.reply('blockView', this.notifyAboutSelf, this);
}, },
onRender: function onRender() { onRender: function onRender() {
@@ -199,7 +202,7 @@ Module.PostsBlockView = base.BlockView.extend({
disableDragAndDrop: true, disableDragAndDrop: true,
emptyContainerMessage: MailPoet.I18n.t('noPostsToDisplay'), emptyContainerMessage: MailPoet.I18n.t('noPostsToDisplay'),
}; };
this.showChildView('postsRegion', new ContainerView({ model: this.model.get('_transformedPosts'), renderOptions: renderOptions })); this.showChildView('productsRegion', new ContainerView({ model: this.model.get('_transformedProducts'), renderOptions: renderOptions }));
}, },
notifyAboutSelf: function notifyAboutSelf() { notifyAboutSelf: function notifyAboutSelf() {
return this; return this;
@@ -209,20 +212,20 @@ Module.PostsBlockView = base.BlockView.extend({
}, },
}); });
Module.PostsBlockToolsView = base.BlockToolsView.extend({ Module.ProductsBlockToolsView = base.BlockToolsView.extend({
getSettingsView: function getSettingsView() { return Module.PostsBlockSettingsView; }, getSettingsView: function getSettingsView() { return Module.ProductsBlockSettingsView; },
}); });
Module.PostsBlockSettingsView = base.BlockSettingsView.extend({ Module.ProductsBlockSettingsView = base.BlockSettingsView.extend({
getTemplate: function getTemplate() { return window.templates.productsBlockSettings; }, getTemplate: function getTemplate() { return window.templates.productsBlockSettings; },
regions: { regions: {
selectionRegion: '.mailpoet_settings_posts_selection', selectionRegion: '.mailpoet_settings_products_selection',
displayOptionsRegion: '.mailpoet_settings_posts_display_options', displayOptionsRegion: '.mailpoet_settings_products_display_options',
}, },
events: { events: {
'click .mailpoet_settings_posts_show_display_options': 'switchToDisplayOptions', 'click .mailpoet_settings_products_show_display_options': 'switchToDisplayOptions',
'click .mailpoet_settings_posts_show_post_selection': 'switchToPostSelection', 'click .mailpoet_settings_products_show_product_selection': 'switchToProductSelection',
'click .mailpoet_settings_posts_insert_selected': 'insertPosts', 'click .mailpoet_settings_products_insert_selected': 'insertProducts',
}, },
templateContext: function templateContext() { templateContext: function templateContext() {
return { return {
@@ -231,8 +234,8 @@ Module.PostsBlockSettingsView = base.BlockSettingsView.extend({
}, },
initialize: function initialize() { initialize: function initialize() {
this.model.trigger('startEditing'); this.model.trigger('startEditing');
this.selectionView = new PostSelectionSettingsView({ model: this.model }); this.selectionView = new ProductSelectionSettingsView({ model: this.model });
this.displayOptionsView = new PostsDisplayOptionsSettingsView({ model: this.model }); this.displayOptionsView = new ProductsDisplayOptionsSettingsView({ model: this.model });
}, },
onRender: function onRender() { onRender: function onRender() {
var that = this; var that = this;
@@ -258,33 +261,33 @@ Module.PostsBlockSettingsView = base.BlockSettingsView.extend({
}, },
switchToDisplayOptions: function switchToDisplayOptions() { switchToDisplayOptions: function switchToDisplayOptions() {
// Switch content view // Switch content view
this.$('.mailpoet_settings_posts_selection').addClass('mailpoet_closed'); this.$('.mailpoet_settings_products_selection').addClass('mailpoet_closed');
this.$('.mailpoet_settings_posts_display_options').removeClass('mailpoet_closed'); this.$('.mailpoet_settings_products_display_options').removeClass('mailpoet_closed');
// Switch controls // Switch controls
this.$('.mailpoet_settings_posts_show_display_options').addClass('mailpoet_hidden'); this.$('.mailpoet_settings_products_show_display_options').addClass('mailpoet_hidden');
this.$('.mailpoet_settings_posts_show_post_selection').removeClass('mailpoet_hidden'); this.$('.mailpoet_settings_products_show_product_selection').removeClass('mailpoet_hidden');
}, },
switchToPostSelection: function switchToPostSelection() { switchToProductSelection: function switchToProductSelection() {
// Switch content view // Switch content view
this.$('.mailpoet_settings_posts_display_options').addClass('mailpoet_closed'); this.$('.mailpoet_settings_products_display_options').addClass('mailpoet_closed');
this.$('.mailpoet_settings_posts_selection').removeClass('mailpoet_closed'); this.$('.mailpoet_settings_products_selection').removeClass('mailpoet_closed');
// Switch controls // Switch controls
this.$('.mailpoet_settings_posts_show_post_selection').addClass('mailpoet_hidden'); this.$('.mailpoet_settings_products_show_product_selection').addClass('mailpoet_hidden');
this.$('.mailpoet_settings_posts_show_display_options').removeClass('mailpoet_hidden'); this.$('.mailpoet_settings_products_show_display_options').removeClass('mailpoet_hidden');
}, },
insertPosts: function insertPosts() { insertProducts: function insertProducts() {
this.model.trigger('insertSelectedPosts'); this.model.trigger('insertSelectedProducts');
this.model.destroy(); this.model.destroy();
this.close(); this.close();
}, },
}); });
PostsSelectionCollectionView = Marionette.CollectionView.extend({ ProductSelectionCollectionView = Marionette.CollectionView.extend({
className: 'mailpoet_post_scroll_container', className: 'mailpoet_post_scroll_container',
childView: function childView() { return SinglePostSelectionSettingsView; }, childView: function childView() { return SingleProductSelectionSettingsView; },
emptyView: function emptyView() { return EmptyPostSelectionSettingsView; }, emptyView: function emptyView() { return EmptyProductSelectionSettingsView; },
childViewOptions: function childViewOptions() { childViewOptions: function childViewOptions() {
return { return {
blockModel: this.blockModel, blockModel: this.blockModel,
@@ -294,18 +297,18 @@ PostsSelectionCollectionView = Marionette.CollectionView.extend({
this.blockModel = options.blockModel; this.blockModel = options.blockModel;
}, },
events: { events: {
scroll: 'onPostsScroll', scroll: 'onProductsScroll',
}, },
onPostsScroll: function onPostsScroll(event) { onProductsScroll: function onProductsScroll(event) {
var $postsBox = jQuery(event.target); var $postsBox = jQuery(event.target);
if ($postsBox.scrollTop() + $postsBox.innerHeight() >= $postsBox[0].scrollHeight) { if ($postsBox.scrollTop() + $postsBox.innerHeight() >= $postsBox[0].scrollHeight) {
// Load more posts if scrolled to bottom // Load more posts if scrolled to bottom
this.blockModel.trigger('loadMorePosts'); this.blockModel.trigger('loadMoreProducts');
} }
}, },
}); });
PostSelectionSettingsView = Marionette.View.extend({ ProductSelectionSettingsView = Marionette.View.extend({
getTemplate: function getTemplate() { getTemplate: function getTemplate() {
return window.templates.postSelectionProductsBlockSettings; return window.templates.postSelectionProductsBlockSettings;
}, },
@@ -326,10 +329,10 @@ PostSelectionSettingsView = Marionette.View.extend({
this.$('.mailpoet_post_scroll_container').scrollTop(0); this.$('.mailpoet_post_scroll_container').scrollTop(0);
} }
}, },
loadingMorePosts: function loadingMorePosts() { loadingMoreProducts: function loadingMoreProducts() {
this.$('.mailpoet_post_selection_loading').css('visibility', 'visible'); this.$('.mailpoet_post_selection_loading').css('visibility', 'visible');
}, },
morePostsLoaded: function morePostsLoaded() { moreProductsLoaded: function moreProductsLoaded() {
this.$('.mailpoet_post_selection_loading').css('visibility', 'hidden'); this.$('.mailpoet_post_selection_loading').css('visibility', 'hidden');
}, },
}, },
@@ -339,15 +342,15 @@ PostSelectionSettingsView = Marionette.View.extend({
}; };
}, },
onRender: function onRender() { onRender: function onRender() {
var postsView; var productsView;
// Dynamically update available post types // Dynamically update available post types
CommunicationComponent.getPostTypes().done(_.bind(this._updateContentTypes, this)); CommunicationComponent.getPostTypes().done(_.bind(this._updateContentTypes, this));
postsView = new PostsSelectionCollectionView({ productsView = new ProductSelectionCollectionView({
collection: this.model.get('_availablePosts'), collection: this.model.get('_availableProducts'),
blockModel: this.model, blockModel: this.model,
}); });
this.showChildView('posts', postsView); this.showChildView('posts', productsView);
}, },
onAttach: function onAttach() { onAttach: function onAttach() {
var that = this; var that = this;
@@ -424,12 +427,12 @@ PostSelectionSettingsView = Marionette.View.extend({
changeField: function changeField(field, event) { changeField: function changeField(field, event) {
this.model.set(field, jQuery(event.target).val()); this.model.set(field, jQuery(event.target).val());
}, },
_updateContentTypes: function updateContentTypes(postTypes) { _updateContentTypes: function updateContentTypes(productTypes) {
var select = this.$('.mailpoet_settings_posts_content_type'); var select = this.$('.mailpoet_settings_posts_content_type');
var selectedValue = this.model.get('contentType'); var selectedValue = this.model.get('contentType');
select.find('option').remove(); select.find('option').remove();
_.each(postTypes, function postTypesMap(type) { _.each(productTypes, function productTypesMap(type) {
select.append(jQuery('<option>', { select.append(jQuery('<option>', {
value: type.name, value: type.name,
text: type.label, text: type.label,
@@ -439,15 +442,15 @@ PostSelectionSettingsView = Marionette.View.extend({
}, },
}); });
EmptyPostSelectionSettingsView = Marionette.View.extend({ EmptyProductSelectionSettingsView = Marionette.View.extend({
getTemplate: function getTemplate() { return window.templates.emptyPostProductsBlockSettings; }, getTemplate: function getTemplate() { return window.templates.emptyPostProductsBlockSettings; },
}); });
SinglePostSelectionSettingsView = Marionette.View.extend({ SingleProductSelectionSettingsView = Marionette.View.extend({
getTemplate: function getTemplate() { return window.templates.singlePostProductsBlockSettings; }, getTemplate: function getTemplate() { return window.templates.singlePostProductsBlockSettings; },
events: function events() { events: function events() {
return { return {
'change .mailpoet_select_post_checkbox': 'postSelectionChange', 'change .mailpoet_select_product_checkbox': 'productSelectionChange',
}; };
}, },
templateContext: function templateContext() { templateContext: function templateContext() {
@@ -459,18 +462,18 @@ SinglePostSelectionSettingsView = Marionette.View.extend({
initialize: function initialize(options) { initialize: function initialize(options) {
this.blockModel = options.blockModel; this.blockModel = options.blockModel;
}, },
postSelectionChange: function postSelectionChange(event) { productSelectionChange: function productSelectionChange(event) {
var checkBox = jQuery(event.target); var checkBox = jQuery(event.target);
var selectedPostsCollection = this.blockModel.get('_selectedPosts'); var selectedProductsCollection = this.blockModel.get('_selectedProducts');
if (checkBox.prop('checked')) { if (checkBox.prop('checked')) {
selectedPostsCollection.add(this.model); selectedProductsCollection.add(this.model);
} else { } else {
selectedPostsCollection.remove(this.model); selectedProductsCollection.remove(this.model);
} }
}, },
}); });
PostsDisplayOptionsSettingsView = base.BlockSettingsView.extend({ ProductsDisplayOptionsSettingsView = base.BlockSettingsView.extend({
getTemplate: function getTemplate() { getTemplate: function getTemplate() {
return window.templates.displayOptionsProductsBlockSettings; return window.templates.displayOptionsProductsBlockSettings;
}, },
@@ -578,14 +581,14 @@ PostsDisplayOptionsSettingsView = base.BlockSettingsView.extend({
}, },
}); });
Module.PostsWidgetView = base.WidgetView.extend({ Module.ProductsWidgetView = base.WidgetView.extend({
className: base.WidgetView.prototype.className + ' mailpoet_droppable_layout_block', className: base.WidgetView.prototype.className + ' mailpoet_droppable_layout_block',
getTemplate: function getTemplate() { return window.templates.productsInsertion; }, getTemplate: function getTemplate() { return window.templates.productsInsertion; },
behaviors: { behaviors: {
DraggableBehavior: { DraggableBehavior: {
cloneOriginal: true, cloneOriginal: true,
drop: function drop() { drop: function drop() {
return new Module.PostsBlockModel({}, { parse: true }); return new Module.ProductsBlockModel({}, { parse: true });
}, },
}, },
}, },
@@ -596,13 +599,13 @@ App.on('before:start', function beforeStartApp(BeforeStartApp) {
return; return;
} }
BeforeStartApp.registerBlockType('products', { BeforeStartApp.registerBlockType('products', {
blockModel: Module.PostsBlockModel, blockModel: Module.ProductsBlockModel,
blockView: Module.PostsBlockView, blockView: Module.ProductsBlockView,
}); });
BeforeStartApp.registerWidget({ BeforeStartApp.registerWidget({
name: 'products', name: 'products',
widgetView: Module.PostsWidgetView, widgetView: Module.ProductsWidgetView,
priority: 98, priority: 98,
}); });
}); });

View File

@@ -1,3 +1,3 @@
<div class="mailpoet_tools"></div> <div class="mailpoet_tools"></div>
<div class="mailpoet_posts_container"></div> <div class="mailpoet_products_container"></div>
<div class="mailpoet_block_highlight"></div> <div class="mailpoet_block_highlight"></div>

View File

@@ -1,10 +1,10 @@
<h3><%= __('Post selection') %></h3> <h3><%= __('Post selection') %></h3>
<div class="mailpoet_settings_posts_selection"></div> <div class="mailpoet_settings_products_selection"></div>
<div class="mailpoet_settings_posts_display_options mailpoet_closed"></div> <div class="mailpoet_settings_products_display_options mailpoet_closed"></div>
<div class="mailpoet_settings_posts_controls"> <div class="mailpoet_settings_products_controls">
<div class="mailpoet_form_field"> <div class="mailpoet_form_field">
<a href="javascript:;" class="mailpoet_settings_posts_show_post_selection mailpoet_hidden"><%= __('Back to selection') %></a> <a href="javascript:;" class="mailpoet_settings_products_show_product_selection mailpoet_hidden"><%= __('Back to selection') %></a>
<a href="javascript:;" class="mailpoet_settings_posts_show_display_options"><%= __('Display options') %></a> <a href="javascript:;" class="mailpoet_settings_products_show_display_options"><%= __('Display options') %></a>
</div> </div>
<input type="button" class="button button-primary mailpoet_settings_posts_insert_selected" value="<%= __('Insert selected') | escape('html_attr') %>" /> <input type="button" class="button button-primary mailpoet_settings_products_insert_selected" value="<%= __('Insert selected') | escape('html_attr') %>" />
</div> </div>

View File

@@ -1,8 +1,8 @@
<div class="mailpoet_settings_posts_selection_controls"> <div class="mailpoet_settings_products_selection_controls">
<div class="mailpoet_post_selection_filter_row"> <div class="mailpoet_product_selection_filter_row">
<input type="text" name="" class="mailpoet_input mailpoet_input_full mailpoet_posts_search_term" value="{{model.search}}" placeholder="<%= __('Search...') %>" /> <input type="text" name="" class="mailpoet_input mailpoet_input_full mailpoet_posts_search_term" value="{{model.search}}" placeholder="<%= __('Search...') %>" />
</div> </div>
<div class="mailpoet_post_selection_filter_row"><select name="mailpoet_posts_content_type" class="mailpoet_select mailpoet_select_half_width mailpoet_settings_posts_content_type"> <div class="mailpoet_product_selection_filter_row"><select name="mailpoet_posts_content_type" class="mailpoet_select mailpoet_select_half_width mailpoet_settings_posts_content_type">
<option value="post" {{#ifCond model.contentType '==' 'post'}}SELECTED{{/ifCond}}><%= __('Posts') %></option> <option value="post" {{#ifCond model.contentType '==' 'post'}}SELECTED{{/ifCond}}><%= __('Posts') %></option>
<option value="page" {{#ifCond model.contentType '==' 'page'}}SELECTED{{/ifCond}}><%= __('Pages') %></option> <option value="page" {{#ifCond model.contentType '==' 'page'}}SELECTED{{/ifCond}}><%= __('Pages') %></option>
<option value="mailpoet_page" {{#ifCond model.contentType '==' 'mailpoet_page'}}SELECTED{{/ifCond}}><%= __('MailPoet pages') %></option> <option value="mailpoet_page" {{#ifCond model.contentType '==' 'mailpoet_page'}}SELECTED{{/ifCond}}><%= __('MailPoet pages') %></option>
@@ -13,7 +13,7 @@
<option value="pending" {{#ifCond model.postStatus '==' 'pending'}}SELECTED{{/ifCond}}><%= __('Pending Review') %></option> <option value="pending" {{#ifCond model.postStatus '==' 'pending'}}SELECTED{{/ifCond}}><%= __('Pending Review') %></option>
<option value="private" {{#ifCond model.postStatus '==' 'private'}}SELECTED{{/ifCond}}><%= __('Private') %></option> <option value="private" {{#ifCond model.postStatus '==' 'private'}}SELECTED{{/ifCond}}><%= __('Private') %></option>
</select></div> </select></div>
<div class="mailpoet_post_selection_filter_row"> <div class="mailpoet_product_selection_filter_row">
<select class="mailpoet_select mailpoet_posts_categories_and_tags" multiple="multiple"> <select class="mailpoet_select mailpoet_posts_categories_and_tags" multiple="multiple">
{{#each model.terms}} {{#each model.terms}}
<option value="{{ id }}" selected="selected">{{ text }}</option> <option value="{{ id }}" selected="selected">{{ text }}</option>

View File

@@ -1,6 +1,6 @@
<div class="mailpoet_settings_posts_single_post"> <div class="mailpoet_settings_products_single_product">
<label> <label>
<input id="mailpoet_select_post_{{ index }}" class="mailpoet_select_post_checkbox" type="checkbox" class="checkbox" value="" name="post_selection"> <input id="mailpoet_select_post_{{ index }}" class="mailpoet_select_product_checkbox" type="checkbox" class="checkbox" value="" name="post_selection">
{{#ellipsis model.post_title 40 '...'}}{{/ellipsis}} {{#ellipsis model.post_title 40 '...'}}{{/ellipsis}}
</label> </label>
</div> </div>