mjmlhelper 2.3.0 → 2.3.2

package/mjmlhelper.js

@@ -1,576 +1,576 @@
-class mjmlhelper {
-    static config() {
-        return require(process.cwd() + '/mjmlhelper.json');
-    }
-
-    static runMjml(type) {
-        const { execSync } = require('child_process'),
-            fs = require('fs');
-        let path = '.';
-        if (!fs.existsSync('./node_modules')) {
-            path = '..';
-        }
-        execSync('node ' + path + '/node_modules/mjml/bin/mjml index.mjml -o index.html');
-    }
-
-    static runMjmlAfterwork(type) {
-        let data = fs.readFileSync(process.cwd() + '/index.html', 'utf-8');
-        data = this.modifyHtml(data, type);
-        fs.writeFileSync(process.cwd() + '/index.html', data, 'utf-8');
-    }
-
-    static generateZip(type) {
-        fs.copySync(process.cwd() + '/index.html', process.cwd() + '/index-original.html', {
-            overwrite: true
-        });
-
-        let data = fs.readFileSync(process.cwd() + '/index.html', 'utf-8');
-        if (type === 'cleverreach') {
-            data = this.addCleverReachStyles(data);
-        }
-        if (type === 'mailchimp') {
-            data = this.addMailchimpStyles(data);
-        }
-        data = this.moveImagesFolder(data);
-        fs.writeFileSync(process.cwd() + '/index.html', data, 'utf-8');
-
-        fs.copySync(process.cwd() + '/index.html', process.cwd() + '/index-converted.html', {
-            overwrite: true
-        });
-        this.zipFolder(() => {
-            fs.moveSync(process.cwd() + '/index-original.html', process.cwd() + '/index.html', {
-                overwrite: true
-            });
-            fs.removeSync(process.cwd() + '/index-original.html');
-        });
-
-        console.log('successfully created index.zip');
-    }
-
-    static zipFolder(callback) {
-        let output = fs.createWriteStream(process.cwd() + '/index.zip'),
-            archive = archiver('zip', { zlib: { level: 9 } });
-        archive.pipe(output);
-        archive.file('index.html');
-        archive.directory('_assets/', false);
-        output.on('close', callback);
-        archive.finalize();
-    }
-
-    static modifyHtml(data, type) {
-        data = this.doSomeHacks(data);
-        data = this.replaceDummyLinks(data, type === 'mail' ? true : false);
-        data = this.mergeStyleTagsIntoOne(data);
-        data = this.addHelperClasses(data);
-        return data;
-    }
-
-    static addCleverReachStyles(data) {
-        let style_tag = '<style type="text/css">',
-            pos = data.indexOf(style_tag) + style_tag.length,
-            positions = null,
-            shift = 0;
-        // set max width to container so that in cleverreach editor modules are good visible
-        data =
-            data.substring(0, pos) +
-            ' body[spellcheck="false"] > div:first-child, body[spellcheck="false"] > div:first-child + div { max-width:600px;margin:0 auto; } ' +
-            data.substring(pos);
-        // move inline wysiwyg overlay to bottom
-        data =
-            data.substring(0, pos) +
-            ' .tox-editor-header[style*="top: 0px"] { top:auto !important; bottom:0 !important; } ' +
-            data.substring(pos);
-        // hide tinymce overlay that always goes in the way
-        data =
-            data.substring(0, pos) +
-            ' .mce-tinymce-inline.mce-floatpanel { display:none !important; } ' +
-            data.substring(pos);
-        // hide modal overlay
-        data = data.substring(0, pos) + ' body.cred_modal:before { display: none !important; } ' + data.substring(pos);
-        // fix font size 0 problem (https://github.com/vielhuber/mjmlhelper/issues/1)
-        data = data.substring(0, pos) + ' .mce-content-body { font-size: 13px; } ' + data.substring(pos);
-        // fix problem where img sizes get overwritten
-        data =
-            data.substring(0, pos) +
-            ' .preserve-cr-full-size { width:100% !important; height:auto !important; } ' +
-            data.substring(pos);
-        positions = this.findAllPositions('<img', data);
-        shift = 0;
-        positions.forEach(positions__value => {
-            let begin = positions__value + shift,
-                end = data.indexOf('>', begin) + '>'.length,
-                tag = data.substring(begin, end);
-            if (tag.indexOf('width:100%') > -1) {
-                if (tag.indexOf('class="') > -1) {
-                    data =
-                        data.substring(0, begin) +
-                        tag.replace('class="', 'class="preserve-cr-full-size ') +
-                        data.substring(end);
-                    shift += 'class="preserve-cr-full-size '.length - 'class="'.length;
-                } else {
-                    data =
-                        data.substring(0, begin) +
-                        tag.replace('<img ', '<img class="preserve-cr-full-size" ') +
-                        data.substring(end);
-                    shift += '<img class="preserve-cr-full-size" '.length - '<img '.length;
-                }
-            }
-        });
-
-        // placeholders
-        data = this.replaceAll(data, '%UNSUBSCRIBE%', '{UNSUBSCRIBE}');
-        data = this.replaceAll(data, '%WEBVERSION%', '{ONLINE_VERSION}');
-        data = this.replaceAll(data, '%PREVIEWTEXT%', '{CAMPAIGN}');
-
-        // loop items
-        data = this.replaceFirst(data, '<!-- flexibles -->', '<!--#loop#--><!--#loopitem#-->');
-        data = this.replaceLast(data, '<!-- /flexibles -->', '<!--#/loopitem#--><!--#/loop#-->');
-        positions = this.findAllPositions('<!-- flexible', data);
-        shift = 0;
-        positions.forEach((positions__value, positions__key) => {
-            if (positions__key === 0) {
-                return;
-            }
-            let begin = positions__value + shift,
-                end = data.indexOf('-->', begin) + '-->'.length,
-                tag = '<!--#/loopitem#--><!--#loopitem#-->';
-            data = data.substring(0, begin) + tag + data.substring(end);
-            shift += tag.length - (end - begin);
-        });
-
-        // first and last tag
-        positions = this.findAllPositions(' mj-outlook-group-fix', data).concat(
-            this.findAllPositions('mj-hero-content', data).concat([])
-        );
-        positions.sort((a, b) => {
-            return a - b;
-        });
-        shift = 0;
-        positions.forEach(positions__value => {
-            let begin = data.indexOf('>', positions__value + shift) + '>'.length,
-                pointer = begin,
-                level = 1;
-            while (level != 0) {
-                if (data.substring(pointer, pointer + '<div'.length) === '<div') {
-                    level++;
-                }
-                if (data.substring(pointer, pointer + '</div>'.length) === '</div>') {
-                    level--;
-                }
-                pointer++;
-            }
-            let end = pointer - 1;
-            data = data.substring(0, begin) + '<!--#html #-->' + data.substring(begin);
-            end += '<!--#html #-->'.length;
-            data = data.substring(0, end) + '<!--#/html#-->' + data.substring(end);
-            shift += '<!--#html #-->'.length + '<!--#/html#-->'.length;
-        });
-        // prevent nested html tags (cleverreach has problems with that)
-        data = data.replace(/(<!--#html #-->)(((?!<!--#\/html#-->).)*(<!--#html #-->))/gs, '$2');
-        data = data.replace(/((<!--#\/html#-->)((?!<!--#html #-->).)*)(<!--#\/html#-->)/gs, '$1');
-
-        return data;
-    }
-
-    static addMailchimpStyles(data) {
-        let positions,
-            shift,
-            style_tag = '<style type="text/css">',
-            pos = null;
-
-        // mailchimp has problems with external fonts: when embedding google fonts, we get the error
-        // "An error occurred parsing your template CSS: Cannot find a CSS file at: https://fonts.googleapis.com/css?family=Tinos:400"
-        // see: https://github.com/sendwithus/templates/issues/21
-        // we strip out all occurences of @import (<link href="https://fonts.googleapis.com/..."> is still left behind)
-        pos = data.indexOf(style_tag) + style_tag.length;
-        data = data.replace(/@import url\(https:\/\/fonts\.googleapis\.com.*?\);/g, '');
-
-        // when replacing images in mailchimp, style="width:" is set to a fixed size. we prevent this with
-        pos = data.indexOf(style_tag) + style_tag.length;
-        data = data.substring(0, pos) + ' img { max-width:100%; height:auto !important; } ' + data.substring(pos);
-
-        // increase ordering icon
-        // also there is a bug in mailchimp: when adding a new module and changing it's type, the ID is lost and the element cannot be moved; we fix this also here (we simply hide the move icon when the ID is missing)
-        pos = data.indexOf(style_tag) + style_tag.length;
-        data =
-            data.substring(0, pos) +
-            `
-            .extra-controls .tpl-repeatwrap {
-                transform: translateX(-100%) translateY(-50px) !important;
-                border: 2px solid grey !important;
-            }
-            .tpl-repeatmovewrap > .tpl-repeatmove {
-                background-color: #fff !important;
-                width: 100px !important;
-                height: 50px !important;
-                border: 2px solid grey !important;
-                background-position: center !important;
-                transform: translateX(-95px) translateY(-20px) !important;
-                display: none !important;
-            }
-            div[mcrepeatable][id] .tpl-repeatmovewrap > .tpl-repeatmove {
-                display: block !important;
-            }
-            ` +
-            data.substring(pos);
-
-        // remove hide icon
-        pos = data.indexOf(style_tag) + style_tag.length;
-        data =
-            data.substring(0, pos) +
-            ' .tpl-repeatwrap.can-hide .tpl-hidetoggle { display:none !important; } ' +
-            data.substring(pos);
-
-        // placeholders
-        data = this.replaceAll(data, '%UNSUBSCRIBE%', '*|UNSUB|*');
-        data = this.replaceAll(data, '%WEBVERSION%', '*|ARCHIVE|*');
-        data = this.replaceAll(data, '%PREVIEWTEXT%', '*|MC_PREVIEW_TEXT|*');
-
-        // mc:edit
-        positions = this.findAllPositions(' mj-outlook-group-fix', data);
-        shift = 0;
-        positions.forEach(positions__value => {
-            let pos = data.indexOf('"', positions__value + shift) + '"'.length,
-                tag = ' mc:edit="_' + positions__value + '"';
-            data = data.substring(0, pos) + tag + data.substring(pos);
-            shift += tag.length;
-        });
-
-        // mc:repeatable
-        data = this.replaceFirst(data, '<!-- flexibles -->', '');
-        data = this.replaceLast(data, '<!-- /flexibles -->', '</div>');
-        positions = this.findAllPositions('<!-- flexible', data);
-        shift = 0;
-        positions.forEach((positions__value, positions__key) => {
-            let begin = positions__value + shift,
-                end = data.indexOf('-->', begin) + '-->'.length,
-                begin_name = data.indexOf('"', positions__value + shift) + '"'.length,
-                end_name = data.indexOf('"', begin_name),
-                tag = '<div mc:repeatable="content" mc:variant="' + data.substring(begin_name, end_name) + '">';
-            if (positions__key > 0) {
-                tag = '</div>' + tag;
-            }
-            data = data.substring(0, begin) + tag + data.substring(end);
-            shift += tag.length - (end - begin);
-        });
-
-        return data;
-    }
-
-    static addHelperClasses(data) {
-        // these classes are important, because gmail does not support any data attributes to target iphone responsive styles
-        const jsdom = require('jsdom'),
-            { JSDOM } = jsdom;
-        let dom = new JSDOM(data);
-        dom.window.document.querySelectorAll('[style*="font-size"]').forEach(el => {
-            el.classList.add('font-size-' + el.style.fontSize);
-        });
-        dom.window.document.querySelectorAll('[style*="text-align"]').forEach(el => {
-            el.classList.add('text-align-' + el.style.textAlign);
-        });
-        dom.window.document.querySelectorAll('[class*="mj-column-per-"]').forEach(el => {
-            el.classList.add('mj-column-per-X');
-        });
-        dom.window.document.querySelectorAll('[class*="mj-column-"]').forEach(el => {
-            el.classList.add('mj-column-X');
-        });
-        return dom.serialize();
-    }
-
-    static mergeStyleTagsIntoOne(data) {
-        let css = '',
-            positions = this.findAllPositions('<style type="text/css">', data),
-            shift = 0;
-        positions.forEach(positions__value => {
-            let begin = positions__value + shift,
-                end = data.indexOf('</style>', begin) + '</style>'.length,
-                begin_inner = data.indexOf('>', begin) + '>'.length,
-                end_inner = data.indexOf('</style>', begin);
-            // if this is inside ie condition, skip
-            let pointer = begin;
-            while (data.substring(pointer - 1, pointer) == ' ') {
-                pointer--;
-            }
-            if (data.substring(pointer - 3, pointer - 1) == ']>') {
-                return;
-            }
-            css += data.substring(begin_inner, end_inner);
-            data = data.substring(0, begin) + data.substring(end);
-            shift = shift - (end - begin);
-        });
-        // minify
-        css = css.replace(/\r?\n?/g, '').trim();
-        data = data.replace('<head>', '<head><style type="text/css">' + css + '</style>');
-        return data;
-    }
-
-    static doSomeHacks(data) {
-        // gmx/web.de desktop: enable multi column layout
-        for (var i = 0; i <= 100; i++) {
-            data = data
-                .split('.mj-column-per-' + i + ' { width:' + i + '% !important; }')
-                .join('.mj-column-per-' + i + ' { width:' + i + '% !important;max-width:' + i + '%; }');
-        }
-
-        // yahoo.com has a weird bug: when using google fonts, @import gets stripped out and the follow rule is killed; circumvent that
-        if (data.indexOf('@import url(') > -1) {
-            let pos = data.indexOf(');', data.indexOf('@import url('));
-            data = data.substring(0, pos + 2) + ' .dummyclass{} ' + data.substring(pos + 2);
-        }
-
-        // prevent times new roman on outlook <2016
-        let pos = data.indexOf('font-family:');
-        if (pos > -1) {
-            let font_family = data.substring(pos + 'font-family:'.length, data.indexOf(';', pos)).trim();
-            // we have to do this exactly like this, because cleverreach merges together all styles and ignores mso
-            data = data.replace(
-                '<style type="text/css">',
-                '<style type="text/css">.outlook, .outlook table, .outlook td, .outlook h1, .outlook h2, .outlook h3, .outlook h4, .outlook h5, .outlook h6, .outlook p, .outlook span, .outlook strong, .outlook div, .outlook a { font-family: ' +
-                    font_family +
-                    ', Arial, Helvetica, sans-serif !important; }</style>\n<style type="text/css">'
-            );
-            let pos2 = data.indexOf('>', data.indexOf('<body')) + '>'.length;
-            data = data.substring(0, pos2) + '<!--[if mso]><div class="outlook"><![endif]-->' + data.substring(pos2);
-            data = data.replace('</body>', '<!--[if mso]></div><![endif]--></body>');
-        }
-
-        return data;
-    }
-
-    static replaceDummyLinks(data, with_codes = true) {
-        data = data.split('href="#"').join('href="https://test.de"');
-        if (with_codes === true) {
-            data = data
-                .split('href="%UNSUBSCRIBE%"')
-                .join('href="https://test.de"')
-                .split('href="%WEBVERSION%"')
-                .join('href="https://test.de"')
-                .split('href="%PREVIEWTEXT%"')
-                .join('href="https://test.de"');
-        }
-        return data;
-    }
-
-    static moveImagesFolder(data) {
-        return data.split('_assets/').join('');
-    }
-
-    static findAllPositions(searchStr, str) {
-        let searchStrLen = searchStr.length,
-            startIndex = 0,
-            index,
-            indices = [];
-        if (searchStrLen == 0) {
-            return [];
-        }
-        while ((index = str.indexOf(searchStr, startIndex)) > -1) {
-            indices.push(index);
-            startIndex = index + searchStrLen;
-        }
-        return indices;
-    }
-
-    static mail(type) {
-        let transporter = nodemailer.createTransport({
-                host: this.config().smtp,
-                port: this.config().port,
-                secure: this.config().ssl !== false ? true : false,
-                auth: {
-                    user: this.config().username,
-                    pass: this.config().password
-                }
-            }),
-            data = fs.readFileSync(process.cwd() + '/index.html', 'utf-8'),
-            message = {
-                from: '"' + this.config().name + '" <' + this.config().from + '>',
-                to: null, // will be set later
-                subject: this.fetchSubject(data),
-                generateTextFromHTML: true,
-                html: data,
-                attachments: []
-            };
-
-        if (this.config().images == 'inline') {
-            console.log('inlining images...');
-            message = this.inlineImages(message);
-        } else if (this.config().images == 'upload') {
-            console.log('uploading images...');
-            // this is asynchrionus but we simply do process further
-            message.html = this.uploadImages(message.html);
-        }
-
-        fs.writeFileSync(process.cwd() + '/index-converted.html', message.html, 'utf-8');
-
-        let to = this.config().to;
-        if (to instanceof Array) {
-            to = to;
-        } else if (to.indexOf('.txt') > -1) {
-            to = fs.readFileSync(to, 'utf-8');
-            to = to.replace(/\r\n/g, '\n');
-            to = to.replace(/\r/g, '\n');
-            to = to.split('\n');
-        } else {
-            to = [to];
-        }
-        if (this.config().log !== undefined) {
-            fs.writeFileSync(this.config().log, '', 'utf-8');
-        }
-        to.forEach((value, index) => {
-            setTimeout(() => {
-                message.to = value;
-                transporter.sendMail(message, (error, info) => {
-                    if (error) {
-                        return console.log(error);
-                    }
-                    console.log('successfully sent out mail to ' + info.envelope.to);
-                    info.time =
-                        ('0' + new Date().getDate()).slice(-2) +
-                        '.' +
-                        ('0' + (new Date().getMonth() + 1)).slice(-2) +
-                        '.' +
-                        new Date().getFullYear() +
-                        ' ' +
-                        ('0' + new Date().getHours()).slice(-2) +
-                        ':' +
-                        ('0' + new Date().getMinutes()).slice(-2) +
-                        ':' +
-                        ('0' + new Date().getSeconds()).slice(-2);
-                    if (this.config().log !== undefined) {
-                        fs.appendFileSync('log.txt', JSON.stringify(info) + '\n', 'utf-8');
-                    }
-                });
-            }, 1000 * index);
-        });
-    }
-
-    static uploadImages(data) {
-        let positions = this.findAllPositions('_assets/', data),
-            shift = 0,
-            filenames = [],
-            ftp = new Client();
-        if (positions.length === 0) {
-            return data;
-        }
-        positions.forEach((positions__value, positions__key) => {
-            positions__value += shift;
-            let begin =
-                Math.max(
-                    data.lastIndexOf('"', positions__value + 1),
-                    data.lastIndexOf('(', positions__value + 1),
-                    data.lastIndexOf("('", positions__value + 1) + 1
-                ) + 1;
-            let end = Math.min(
-                data.indexOf('"', positions__value) > -1 ? data.indexOf('"', positions__value) : data.length,
-                data.indexOf(')', positions__value) > -1 ? data.indexOf(')', positions__value) : data.length,
-                data.indexOf("')", positions__value) > -1 ? data.indexOf("')", positions__value) : data.length
-            );
-            let image = data.substring(begin, end);
-            filenames.push(image);
-            image = image.replace('_assets/', '');
-            let url = this.config().ftp.url + '/' + image;
-            data = data.substring(0, begin) + url + data.substring(end);
-            shift += url.length - (end - begin);
-        });
-        ftp.on('ready', () => {
-            filenames.forEach((filenames__value, filenames__key) => {
-                ftp.put(
-                    process.cwd() + '/' + filenames__value,
-                    this.config().ftp.path + filenames__value.replace('_assets/', ''),
-                    error => {
-                        if (error) {
-                            throw error;
-                        }
-                        if (filenames__key >= filenames.length - 1) {
-                            ftp.end();
-                        }
-                    }
-                );
-            });
-        });
-        ftp.connect({
-            host: this.config().ftp.host,
-            port: this.config().ftp.port,
-            user: this.config().ftp.username,
-            password: this.config().ftp.password
-        });
-        return data;
-    }
-
-    static inlineImages(message) {
-        let positions = this.findAllPositions('_assets/', message.html);
-        if (positions.length > 0) {
-            let shift = 0;
-            positions.forEach(positions__value => {
-                let cid = ~~(Math.random() * (9999 - 1000 + 1)) + 1000 + '@possible';
-                let cid_label = 'cid:' + cid;
-                positions__value += shift;
-                let begin =
-                    Math.max(
-                        message.html.lastIndexOf('"', positions__value + 1),
-                        message.html.lastIndexOf('(', positions__value + 1)
-                    ) + 1;
-                let end = Math.min(
-                    message.html.indexOf('"', positions__value) > -1
-                        ? message.html.indexOf('"', positions__value)
-                        : message.html.length,
-                    message.html.indexOf(')', positions__value) > -1
-                        ? message.html.indexOf(')', positions__value)
-                        : message.html.length
-                );
-                let url = message.html.substring(begin, end);
-                if (url.indexOf('.jpg') === -1 && url.indexOf('.gif') === -1 && url.indexOf('.png') === -1) {
-                    return;
-                }
-                message.html = message.html.substring(0, begin) + cid_label + message.html.substring(end);
-                shift += cid_label.length - (end - begin);
-                message.attachments.push({
-                    filename: url.trim(),
-                    path: process.cwd() + '/' + url.trim(),
-                    cid: cid
-                });
-            });
-        }
-        return message;
-    }
-
-    static fetchSubject(data) {
-        let begin = data.indexOf('<title>') + '<title>'.length,
-            end = data.indexOf('</title>');
-        return data.substring(begin, end);
-    }
-
-    static replaceAll(string, search, replace) {
-        return string.split(search).join(replace);
-    }
-
-    static replaceLast(string, search, replace) {
-        let n = string.lastIndexOf(search);
-        string = string.slice(0, n) + string.slice(n).replace(search, replace);
-        return string;
-    }
-
-    static replaceFirst(string, search, replace) {
-        return string.replace(search, replace);
-    }
-}
-
-const fs = require('fs-extra'),
-    archiver = require('archiver'),
-    nodemailer = require('nodemailer'),
-    Client = require('ftp'),
-    type = process.argv.slice(2)[0];
-
-if (type === 'cleverreach' || type === 'mailchimp') {
-    mjmlhelper.runMjml(type);
-    mjmlhelper.runMjmlAfterwork(type);
-    mjmlhelper.generateZip(type);
-} else if (type === 'mail') {
-    mjmlhelper.runMjml(type);
-    mjmlhelper.runMjmlAfterwork(type);
-    mjmlhelper.mail(type);
-} else if (type === 'build') {
-    mjmlhelper.runMjml(type);
-    mjmlhelper.runMjmlAfterwork(type);
-} else {
-    console.log('missing options');
-}
+class mjmlhelper {
+    static config() {
+        return require(process.cwd() + '/mjmlhelper.json');
+    }
+
+    static runMjml(type) {
+        const { execSync } = require('child_process'),
+            fs = require('fs');
+        let path = '.';
+        if (!fs.existsSync('./node_modules')) {
+            path = '..';
+        }
+        execSync('node ' + path + '/node_modules/mjml/bin/mjml index.mjml -o index.html');
+    }
+
+    static runMjmlAfterwork(type) {
+        let data = fs.readFileSync(process.cwd() + '/index.html', 'utf-8');
+        data = this.modifyHtml(data, type);
+        fs.writeFileSync(process.cwd() + '/index.html', data, 'utf-8');
+    }
+
+    static generateZip(type) {
+        fs.copySync(process.cwd() + '/index.html', process.cwd() + '/index-original.html', {
+            overwrite: true
+        });
+
+        let data = fs.readFileSync(process.cwd() + '/index.html', 'utf-8');
+        if (type === 'cleverreach') {
+            data = this.addCleverReachStyles(data);
+        }
+        if (type === 'mailchimp') {
+            data = this.addMailchimpStyles(data);
+        }
+        data = this.moveImagesFolder(data);
+        fs.writeFileSync(process.cwd() + '/index.html', data, 'utf-8');
+
+        fs.copySync(process.cwd() + '/index.html', process.cwd() + '/index-converted.html', {
+            overwrite: true
+        });
+        this.zipFolder(() => {
+            fs.moveSync(process.cwd() + '/index-original.html', process.cwd() + '/index.html', {
+                overwrite: true
+            });
+            fs.removeSync(process.cwd() + '/index-original.html');
+        });
+
+        console.log('successfully created index.zip');
+    }
+
+    static zipFolder(callback) {
+        let output = fs.createWriteStream(process.cwd() + '/index.zip'),
+            archive = archiver('zip', { zlib: { level: 9 } });
+        archive.pipe(output);
+        archive.file('index.html');
+        archive.directory('_assets/', false);
+        output.on('close', callback);
+        archive.finalize();
+    }
+
+    static modifyHtml(data, type) {
+        data = this.doSomeHacks(data);
+        data = this.replaceDummyLinks(data, type === 'mail' ? true : false);
+        data = this.mergeStyleTagsIntoOne(data);
+        data = this.addHelperClasses(data);
+        return data;
+    }
+
+    static addCleverReachStyles(data) {
+        let style_tag = '<style type="text/css">',
+            pos = data.indexOf(style_tag) + style_tag.length,
+            positions = null,
+            shift = 0;
+        // set max width to container so that in cleverreach editor modules are good visible
+        data =
+            data.substring(0, pos) +
+            ' body[spellcheck="false"] > div:first-child, body[spellcheck="false"] > div:first-child + div { max-width:600px;margin:0 auto; } ' +
+            data.substring(pos);
+        // move inline wysiwyg overlay to bottom
+        data =
+            data.substring(0, pos) +
+            ' .tox-editor-header[style*="top: 0px"] { top:auto !important; bottom:0 !important; } ' +
+            data.substring(pos);
+        // hide tinymce overlay that always goes in the way
+        data =
+            data.substring(0, pos) +
+            ' .mce-tinymce-inline.mce-floatpanel { display:none !important; } ' +
+            data.substring(pos);
+        // hide modal overlay
+        data = data.substring(0, pos) + ' body.cred_modal:before { display: none !important; } ' + data.substring(pos);
+        // fix font size 0 problem (https://github.com/vielhuber/mjmlhelper/issues/1)
+        data = data.substring(0, pos) + ' .mce-content-body { font-size: 13px; } ' + data.substring(pos);
+        // fix problem where img sizes get overwritten
+        data =
+            data.substring(0, pos) +
+            ' .preserve-cr-full-size { width:100% !important; height:auto !important; } ' +
+            data.substring(pos);
+        positions = this.findAllPositions('<img', data);
+        shift = 0;
+        positions.forEach(positions__value => {
+            let begin = positions__value + shift,
+                end = data.indexOf('>', begin) + '>'.length,
+                tag = data.substring(begin, end);
+            if (tag.indexOf('width:100%') > -1) {
+                if (tag.indexOf('class="') > -1) {
+                    data =
+                        data.substring(0, begin) +
+                        tag.replace('class="', 'class="preserve-cr-full-size ') +
+                        data.substring(end);
+                    shift += 'class="preserve-cr-full-size '.length - 'class="'.length;
+                } else {
+                    data =
+                        data.substring(0, begin) +
+                        tag.replace('<img ', '<img class="preserve-cr-full-size" ') +
+                        data.substring(end);
+                    shift += '<img class="preserve-cr-full-size" '.length - '<img '.length;
+                }
+            }
+        });
+
+        // placeholders
+        data = this.replaceAll(data, '%UNSUBSCRIBE%', '{UNSUBSCRIBE}');
+        data = this.replaceAll(data, '%WEBVERSION%', '{ONLINE_VERSION}');
+        data = this.replaceAll(data, '%PREVIEWTEXT%', '{CAMPAIGN}');
+
+        // loop items
+        data = this.replaceFirst(data, '<!-- flexibles -->', '<!--#loop#--><!--#loopitem#-->');
+        data = this.replaceLast(data, '<!-- /flexibles -->', '<!--#/loopitem#--><!--#/loop#-->');
+        positions = this.findAllPositions('<!-- flexible', data);
+        shift = 0;
+        positions.forEach((positions__value, positions__key) => {
+            if (positions__key === 0) {
+                return;
+            }
+            let begin = positions__value + shift,
+                end = data.indexOf('-->', begin) + '-->'.length,
+                tag = '<!--#/loopitem#--><!--#loopitem#-->';
+            data = data.substring(0, begin) + tag + data.substring(end);
+            shift += tag.length - (end - begin);
+        });
+
+        // first and last tag
+        positions = this.findAllPositions(' mj-outlook-group-fix', data).concat(
+            this.findAllPositions('mj-hero-content', data).concat([])
+        );
+        positions.sort((a, b) => {
+            return a - b;
+        });
+        shift = 0;
+        positions.forEach(positions__value => {
+            let begin = data.indexOf('>', positions__value + shift) + '>'.length,
+                pointer = begin,
+                level = 1;
+            while (level != 0) {
+                if (data.substring(pointer, pointer + '<div'.length) === '<div') {
+                    level++;
+                }
+                if (data.substring(pointer, pointer + '</div>'.length) === '</div>') {
+                    level--;
+                }
+                pointer++;
+            }
+            let end = pointer - 1;
+            data = data.substring(0, begin) + '<!--#html #-->' + data.substring(begin);
+            end += '<!--#html #-->'.length;
+            data = data.substring(0, end) + '<!--#/html#-->' + data.substring(end);
+            shift += '<!--#html #-->'.length + '<!--#/html#-->'.length;
+        });
+        // prevent nested html tags (cleverreach has problems with that)
+        data = data.replace(/(<!--#html #-->)(((?!<!--#\/html#-->).)*(<!--#html #-->))/gs, '$2');
+        data = data.replace(/((<!--#\/html#-->)((?!<!--#html #-->).)*)(<!--#\/html#-->)/gs, '$1');
+
+        return data;
+    }
+
+    static addMailchimpStyles(data) {
+        let positions,
+            shift,
+            style_tag = '<style type="text/css">',
+            pos = null;
+
+        // mailchimp has problems with external fonts: when embedding google fonts, we get the error
+        // "An error occurred parsing your template CSS: Cannot find a CSS file at: https://fonts.googleapis.com/css?family=Tinos:400"
+        // see: https://github.com/sendwithus/templates/issues/21
+        // we strip out all occurences of @import (<link href="https://fonts.googleapis.com/..."> is still left behind)
+        pos = data.indexOf(style_tag) + style_tag.length;
+        data = data.replace(/@import url\(https:\/\/fonts\.googleapis\.com.*?\);/g, '');
+
+        // when replacing images in mailchimp, style="width:" is set to a fixed size. we prevent this with
+        pos = data.indexOf(style_tag) + style_tag.length;
+        data = data.substring(0, pos) + ' img { max-width:100%; height:auto !important; } ' + data.substring(pos);
+
+        // increase ordering icon
+        // also there is a bug in mailchimp: when adding a new module and changing it's type, the ID is lost and the element cannot be moved; we fix this also here (we simply hide the move icon when the ID is missing)
+        pos = data.indexOf(style_tag) + style_tag.length;
+        data =
+            data.substring(0, pos) +
+            `
+            .extra-controls .tpl-repeatwrap {
+                transform: translateX(-100%) translateY(-50px) !important;
+                border: 2px solid grey !important;
+            }
+            .tpl-repeatmovewrap > .tpl-repeatmove {
+                background-color: #fff !important;
+                width: 100px !important;
+                height: 50px !important;
+                border: 2px solid grey !important;
+                background-position: center !important;
+                transform: translateX(-95px) translateY(-20px) !important;
+                display: none !important;
+            }
+            div[mcrepeatable][id] .tpl-repeatmovewrap > .tpl-repeatmove {
+                display: block !important;
+            }
+            ` +
+            data.substring(pos);
+
+        // remove hide icon
+        pos = data.indexOf(style_tag) + style_tag.length;
+        data =
+            data.substring(0, pos) +
+            ' .tpl-repeatwrap.can-hide .tpl-hidetoggle { display:none !important; } ' +
+            data.substring(pos);
+
+        // placeholders
+        data = this.replaceAll(data, '%UNSUBSCRIBE%', '*|UNSUB|*');
+        data = this.replaceAll(data, '%WEBVERSION%', '*|ARCHIVE|*');
+        data = this.replaceAll(data, '%PREVIEWTEXT%', '*|MC_PREVIEW_TEXT|*');
+
+        // mc:edit
+        positions = this.findAllPositions(' mj-outlook-group-fix', data);
+        shift = 0;
+        positions.forEach(positions__value => {
+            let pos = data.indexOf('"', positions__value + shift) + '"'.length,
+                tag = ' mc:edit="_' + positions__value + '"';
+            data = data.substring(0, pos) + tag + data.substring(pos);
+            shift += tag.length;
+        });
+
+        // mc:repeatable
+        data = this.replaceFirst(data, '<!-- flexibles -->', '');
+        data = this.replaceLast(data, '<!-- /flexibles -->', '</div>');
+        positions = this.findAllPositions('<!-- flexible', data);
+        shift = 0;
+        positions.forEach((positions__value, positions__key) => {
+            let begin = positions__value + shift,
+                end = data.indexOf('-->', begin) + '-->'.length,
+                begin_name = data.indexOf('"', positions__value + shift) + '"'.length,
+                end_name = data.indexOf('"', begin_name),
+                tag = '<div mc:repeatable="content" mc:variant="' + data.substring(begin_name, end_name) + '">';
+            if (positions__key > 0) {
+                tag = '</div>' + tag;
+            }
+            data = data.substring(0, begin) + tag + data.substring(end);
+            shift += tag.length - (end - begin);
+        });
+
+        return data;
+    }
+
+    static addHelperClasses(data) {
+        // these classes are important, because gmail does not support any data attributes to target iphone responsive styles
+        const jsdom = require('jsdom'),
+            { JSDOM } = jsdom;
+        let dom = new JSDOM(data);
+        dom.window.document.querySelectorAll('[style*="font-size"]').forEach(el => {
+            el.classList.add('font-size-' + el.style.fontSize);
+        });
+        dom.window.document.querySelectorAll('[style*="text-align"]').forEach(el => {
+            el.classList.add('text-align-' + el.style.textAlign);
+        });
+        dom.window.document.querySelectorAll('[class*="mj-column-per-"]').forEach(el => {
+            el.classList.add('mj-column-per-X');
+        });
+        dom.window.document.querySelectorAll('[class*="mj-column-"]').forEach(el => {
+            el.classList.add('mj-column-X');
+        });
+        return dom.serialize();
+    }
+
+    static mergeStyleTagsIntoOne(data) {
+        let css = '',
+            positions = this.findAllPositions('<style type="text/css">', data),
+            shift = 0;
+        positions.forEach(positions__value => {
+            let begin = positions__value + shift,
+                end = data.indexOf('</style>', begin) + '</style>'.length,
+                begin_inner = data.indexOf('>', begin) + '>'.length,
+                end_inner = data.indexOf('</style>', begin);
+            // if this is inside ie condition, skip
+            let pointer = begin;
+            while (data.substring(pointer - 1, pointer) == ' ') {
+                pointer--;
+            }
+            if (data.substring(pointer - 3, pointer - 1) == ']>') {
+                return;
+            }
+            css += data.substring(begin_inner, end_inner);
+            data = data.substring(0, begin) + data.substring(end);
+            shift = shift - (end - begin);
+        });
+        // minify
+        css = css.replace(/\r?\n?/g, '').trim();
+        data = data.replace('<head>', '<head><style type="text/css">' + css + '</style>');
+        return data;
+    }
+
+    static doSomeHacks(data) {
+        // gmx/web.de desktop: enable multi column layout
+        for (var i = 0; i <= 100; i++) {
+            data = data
+                .split('.mj-column-per-' + i + ' { width:' + i + '% !important; }')
+                .join('.mj-column-per-' + i + ' { width:' + i + '% !important;max-width:' + i + '%; }');
+        }
+
+        // yahoo.com has a weird bug: when using google fonts, @import gets stripped out and the follow rule is killed; circumvent that
+        if (data.indexOf('@import url(') > -1) {
+            let pos = data.indexOf(');', data.indexOf('@import url('));
+            data = data.substring(0, pos + 2) + ' .dummyclass{} ' + data.substring(pos + 2);
+        }
+
+        // prevent times new roman on outlook <2016
+        let pos = data.indexOf('font-family:');
+        if (pos > -1) {
+            let font_family = data.substring(pos + 'font-family:'.length, data.indexOf(';', pos)).trim();
+            // we have to do this exactly like this, because cleverreach merges together all styles and ignores mso
+            data = data.replace(
+                '<style type="text/css">',
+                '<style type="text/css">.outlook, .outlook table, .outlook td, .outlook h1, .outlook h2, .outlook h3, .outlook h4, .outlook h5, .outlook h6, .outlook p, .outlook span, .outlook strong, .outlook div, .outlook a { font-family: ' +
+                    font_family +
+                    ', Arial, Helvetica, sans-serif !important; }</style>\n<style type="text/css">'
+            );
+            let pos2 = data.indexOf('>', data.indexOf('<body')) + '>'.length;
+            data = data.substring(0, pos2) + '<!--[if mso]><div class="outlook"><![endif]-->' + data.substring(pos2);
+            data = data.replace('</body>', '<!--[if mso]></div><![endif]--></body>');
+        }
+
+        return data;
+    }
+
+    static replaceDummyLinks(data, with_codes = true) {
+        data = data.split('href="#"').join('href="https://test.de"');
+        if (with_codes === true) {
+            data = data
+                .split('href="%UNSUBSCRIBE%"')
+                .join('href="https://test.de"')
+                .split('href="%WEBVERSION%"')
+                .join('href="https://test.de"')
+                .split('href="%PREVIEWTEXT%"')
+                .join('href="https://test.de"');
+        }
+        return data;
+    }
+
+    static moveImagesFolder(data) {
+        return data.split('_assets/').join('');
+    }
+
+    static findAllPositions(searchStr, str) {
+        let searchStrLen = searchStr.length,
+            startIndex = 0,
+            index,
+            indices = [];
+        if (searchStrLen == 0) {
+            return [];
+        }
+        while ((index = str.indexOf(searchStr, startIndex)) > -1) {
+            indices.push(index);
+            startIndex = index + searchStrLen;
+        }
+        return indices;
+    }
+
+    static mail(type) {
+        let transporter = nodemailer.createTransport({
+                host: this.config().smtp,
+                port: this.config().port,
+                secure: this.config().ssl !== false ? true : false,
+                auth: {
+                    user: this.config().username,
+                    pass: this.config().password
+                }
+            }),
+            data = fs.readFileSync(process.cwd() + '/index.html', 'utf-8'),
+            message = {
+                from: '"' + this.config().name + '" <' + this.config().from + '>',
+                to: null, // will be set later
+                subject: this.fetchSubject(data),
+                generateTextFromHTML: true,
+                html: data,
+                attachments: []
+            };
+
+        if (this.config().images == 'inline') {
+            console.log('inlining images...');
+            message = this.inlineImages(message);
+        } else if (this.config().images == 'upload') {
+            console.log('uploading images...');
+            // this is asynchrionus but we simply do process further
+            message.html = this.uploadImages(message.html);
+        }
+
+        fs.writeFileSync(process.cwd() + '/index-converted.html', message.html, 'utf-8');
+
+        let to = this.config().to;
+        if (to instanceof Array) {
+            to = to;
+        } else if (to.indexOf('.txt') > -1) {
+            to = fs.readFileSync(to, 'utf-8');
+            to = to.replace(/\r\n/g, '\n');
+            to = to.replace(/\r/g, '\n');
+            to = to.split('\n');
+        } else {
+            to = [to];
+        }
+        if (this.config().log !== undefined) {
+            fs.writeFileSync(this.config().log, '', 'utf-8');
+        }
+        to.forEach((value, index) => {
+            setTimeout(() => {
+                message.to = value;
+                transporter.sendMail(message, (error, info) => {
+                    if (error) {
+                        return console.log(error);
+                    }
+                    console.log('successfully sent out mail to ' + info.envelope.to);
+                    info.time =
+                        ('0' + new Date().getDate()).slice(-2) +
+                        '.' +
+                        ('0' + (new Date().getMonth() + 1)).slice(-2) +
+                        '.' +
+                        new Date().getFullYear() +
+                        ' ' +
+                        ('0' + new Date().getHours()).slice(-2) +
+                        ':' +
+                        ('0' + new Date().getMinutes()).slice(-2) +
+                        ':' +
+                        ('0' + new Date().getSeconds()).slice(-2);
+                    if (this.config().log !== undefined) {
+                        fs.appendFileSync('log.txt', JSON.stringify(info) + '\n', 'utf-8');
+                    }
+                });
+            }, 1000 * index);
+        });
+    }
+
+    static uploadImages(data) {
+        let positions = this.findAllPositions('_assets/', data),
+            shift = 0,
+            filenames = [],
+            ftp = new Client();
+        if (positions.length === 0) {
+            return data;
+        }
+        positions.forEach((positions__value, positions__key) => {
+            positions__value += shift;
+            let begin =
+                Math.max(
+                    data.lastIndexOf('"', positions__value + 1),
+                    data.lastIndexOf('(', positions__value + 1),
+                    data.lastIndexOf("('", positions__value + 1) + 1
+                ) + 1;
+            let end = Math.min(
+                data.indexOf('"', positions__value) > -1 ? data.indexOf('"', positions__value) : data.length,
+                data.indexOf(')', positions__value) > -1 ? data.indexOf(')', positions__value) : data.length,
+                data.indexOf("')", positions__value) > -1 ? data.indexOf("')", positions__value) : data.length
+            );
+            let image = data.substring(begin, end);
+            filenames.push(image);
+            image = image.replace('_assets/', '');
+            let url = this.config().ftp.url + '/' + image;
+            data = data.substring(0, begin) + url + data.substring(end);
+            shift += url.length - (end - begin);
+        });
+        ftp.on('ready', () => {
+            filenames.forEach((filenames__value, filenames__key) => {
+                ftp.put(
+                    process.cwd() + '/' + filenames__value,
+                    this.config().ftp.path + filenames__value.replace('_assets/', ''),
+                    error => {
+                        if (error) {
+                            throw error;
+                        }
+                        if (filenames__key >= filenames.length - 1) {
+                            ftp.end();
+                        }
+                    }
+                );
+            });
+        });
+        ftp.connect({
+            host: this.config().ftp.host,
+            port: this.config().ftp.port,
+            user: this.config().ftp.username,
+            password: this.config().ftp.password
+        });
+        return data;
+    }
+
+    static inlineImages(message) {
+        let positions = this.findAllPositions('_assets/', message.html);
+        if (positions.length > 0) {
+            let shift = 0;
+            positions.forEach(positions__value => {
+                let cid = ~~(Math.random() * (9999 - 1000 + 1)) + 1000 + '@possible';
+                let cid_label = 'cid:' + cid;
+                positions__value += shift;
+                let begin =
+                    Math.max(
+                        message.html.lastIndexOf('"', positions__value + 1),
+                        message.html.lastIndexOf('(', positions__value + 1)
+                    ) + 1;
+                let end = Math.min(
+                    message.html.indexOf('"', positions__value) > -1
+                        ? message.html.indexOf('"', positions__value)
+                        : message.html.length,
+                    message.html.indexOf(')', positions__value) > -1
+                        ? message.html.indexOf(')', positions__value)
+                        : message.html.length
+                );
+                let url = message.html.substring(begin, end);
+                if (url.indexOf('.jpg') === -1 && url.indexOf('.gif') === -1 && url.indexOf('.png') === -1) {
+                    return;
+                }
+                message.html = message.html.substring(0, begin) + cid_label + message.html.substring(end);
+                shift += cid_label.length - (end - begin);
+                message.attachments.push({
+                    filename: url.trim(),
+                    path: process.cwd() + '/' + url.trim(),
+                    cid: cid
+                });
+            });
+        }
+        return message;
+    }
+
+    static fetchSubject(data) {
+        let begin = data.indexOf('<title>') + '<title>'.length,
+            end = data.indexOf('</title>');
+        return data.substring(begin, end);
+    }
+
+    static replaceAll(string, search, replace) {
+        return string.split(search).join(replace);
+    }
+
+    static replaceLast(string, search, replace) {
+        let n = string.lastIndexOf(search);
+        string = string.slice(0, n) + string.slice(n).replace(search, replace);
+        return string;
+    }
+
+    static replaceFirst(string, search, replace) {
+        return string.replace(search, replace);
+    }
+}
+
+const fs = require('fs-extra'),
+    archiver = require('archiver'),
+    nodemailer = require('nodemailer'),
+    Client = require('ftp'),
+    type = process.argv.slice(2)[0];
+
+if (type === 'cleverreach' || type === 'mailchimp') {
+    mjmlhelper.runMjml(type);
+    mjmlhelper.runMjmlAfterwork(type);
+    mjmlhelper.generateZip(type);
+} else if (type === 'mail') {
+    mjmlhelper.runMjml(type);
+    mjmlhelper.runMjmlAfterwork(type);
+    mjmlhelper.mail(type);
+} else if (type === 'build') {
+    mjmlhelper.runMjml(type);
+    mjmlhelper.runMjmlAfterwork(type);
+} else {
+    console.log('missing options');
+}