Cavemanon/piratepoet
8
Fork 0
Code Pull Requests Actions Releases 16 Activity

Merge pull request #1466 from mailpoet/drag-drop-video

Browse Source 
Editor tutorial: drag and drop [MAILPOET-1447]
This commit is contained in:
Tautvidas Sipavičius
2018-08-16 13:13:02 +03:00
committed by GitHub
parent 31411d2a06 9600917253
commit 0d28fe1464
4 changed files with 31 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/img/newsletter_editor/editor-drag-demo.mp4 Normal file
View File

Binary file not shown.

24
assets/js/src/newsletter_editor/initializer.jsx
View File

@@ -3,6 +3,7 @@ import Breadcrumb from 'newsletters/breadcrumb.jsx';
import MailPoet from 'mailpoet';
import React from 'react';
import ReactDOM from 'react-dom';
import moment from 'moment';
const renderBreadcrumb = (newsletterType) => {
const breadcrumbContainer = document.getElementById('mailpoet_editor_breadcrumb');
@@ -16,6 +17,28 @@ const renderBreadcrumb = (newsletterType) => {
ReactDOM.render(breadcrumb, breadcrumbContainer);
};
function displayTutorial() {
const key = `user_seen_editor_tutorial${window.config.currentUserId}`;
if (window.config.dragDemoUrlSettings) {
return;
}
if (moment(window.config.installedAt).isBefore(moment().subtract(7, 'days'))) {
return;
}
MailPoet.Modal.popup({
title: MailPoet.I18n.t('tutorialVideoTitle'),
template: `<video style="height:640px;" src="${window.config.dragDemoUrl}" controls autoplay></video>`,
onCancel: () => {
MailPoet.Ajax.post({
api_version: window.mailpoet_api_version,
endpoint: 'settings',
action: 'set',
data: { [key]: 1 },
});
},
});
}
const initializeEditor = (config) => {
const editorContainer = document.getElementById('mailpoet_editor');
const getUrlParam = param => (location.search.split(`${param}=`)[1] || '').split('&')[0];
@@ -33,6 +56,7 @@ const initializeEditor = (config) => {
},
})
.always(() => MailPoet.Modal.loading(false))
.always(() => displayTutorial())
.done((response) => {
const newsletter = response.data;

3
tests/_data/acceptanceDump.sql
View File

@@ -398,7 +398,8 @@ INSERT INTO `mp_mailpoet_settings` (`id`, `name`, `value`, `created_at`, `update
(20, 'cron_trigger', 'a:1:{s:6:\"method\";s:9:\"WordPress\";}', '2017-10-30 00:58:13', '2017-10-30 00:58:13'),
(21, 'tracking', 'a:1:{s:7:\"enabled\";s:1:\"1\";}', '2017-10-30 00:58:13', '2017-10-30 00:58:13'),
(22, 'analytics', 'a:1:{s:7:\"enabled\";s:0:\"\";}', '2017-10-30 00:58:13', '2017-10-30 00:58:13'),
(23, 'premium', 'a:1:{s:11:\"premium_key\";s:0:\"\";}', '2017-10-30 00:58:13', '2017-10-30 00:58:13');
(23, 'premium', 'a:1:{s:11:\"premium_key\";s:0:\"\";}', '2017-10-30 00:58:13', '2017-10-30 00:58:13'),
(24, 'user_seen_editor_tutorial1', '1', '2017-10-30 00:58:13', '2017-10-30 00:58:13');
DROP TABLE IF EXISTS `mp_mailpoet_statistics_clicks`;
CREATE TABLE `mp_mailpoet_statistics_clicks` (

5
views/newsletter/editor.html
View File

@@ -358,6 +358,7 @@
'selectColor': _x('Select', 'select color'),
'cancelColorSelection': _x('Cancel', 'cancel color selection'),
'newsletterIsPaused': __('Email sending has been paused.'),
'tutorialVideoTitle': __('Before you start, this how you drag and drop in MailPoet'),
'selectType': __('Select type'),
'events': __('Events'),
@@ -1295,6 +1296,10 @@
"newsletter_editor/image-missing.svg"
) %>',
},
dragDemoUrl: '<%= image_url("newsletter_editor/editor-drag-demo.mp4") %>',
currentUserId: '<%= current_wp_user.wp_user_id %>',
dragDemoUrlSettings: '<%= settings["user_seen_editor_tutorial" ~ current_wp_user.wp_user_id] %>',
installedAt: '<%= settings["installed_at"] %>',
};
wp.hooks.doAction('mailpoet_newsletters_editor_initialize', config);
</script>