adgile/tasks/task-browsersync.js

An easy-to-use automated front-end setup.

'use strict'

/**
 * A module for running BrowserSync task
 * @module task.browsersync
 */
 
let     settings    = require('../settings.default'),
        helpers     = require('../helpers/index');
const   chalk       = require('chalk'),
        _           = require('lodash'),
        gulp        = require('gulp'),
        browserSync = require('browser-sync').create('Adgile Server');

/**
 * Handles BrowserSync's `init` event
 * Stores livereload state.
 * Shows logs for local and external urls.
 * Opens browser or editor, depending on settings.default.
 * @param {*} data 
 */
function init(data) {
    settings.livereload = true;

    console.log(chalk.cyan('🌐  Local access at'), chalk.magenta(data.options.get('urls').get('local')));
    console.log(chalk.cyan('🌐  Network access at'), chalk.magenta(data.options.get('urls').get('external')));

    if (settings.isOpen) {
        console.log(
            chalk.cyan('☞  Opening in'),
            chalk.magenta(config.browser)
        );
    }
    
    if (settings.isEdit) {
        helpers.openEditor();
    }
}


/**
 * Handles BrowserSync's `service:running` event.
 * Sets up a tunnel for public sharing or run Page Speed Insights, depending on settings.default
 * @param {*} data 
 */
function run (data) {
    if (data.tunnel) {
        settings.tunnelUrl = data.tunnel;
        console.log(chalk.cyan('🌐  Public access at'), chalk.magenta(settings.tunnelUrl));

        if (settings.isPSI) {
            gulp.series('psi')();
        }
    } else if (settings.isPSI) {
        console.log(chalk.red('✘  Running PSI cannot be started without a tunnel. Please restart Headstart with the `--tunnel` or `t` flag.'));
    }
}

/**
 * Run the BrowserSync task in response to Gulp, connecting browsers and serving files.
 * Binds `init` and `service:running` events to the BrowserSync event emitter.
 * @param {*} callback
 */
function runtask(cb) {
    helpers.verbose(chalk.grey('Running task "browsersync"'));
    console.log(chalk.grey('Launching server...'));

    var evt = browserSync.emitter;
    evt.on('init', this.init);
    evt.on('service:running', this.run);

    /**
     * Connect browsers and serve files.
     * Provides callback to catch any errors that passed `init`
     */
    browserSync.init({
        server:         _.isUndefined(config.proxy) ? {
                            baseDir: config.export_templates
                        } : false,
        logConnections: false,
        logLevel:       'silent', // 'debug'
        browser:        config.browser || 'default',
        open:           settings.isOpen,
        port:           config.port || 3000,
        proxy:          config.proxy || false,
        tunnel:         settings.isTunnel || null
    }, (err, data) => {

        if (err !== null) {
            console.log(
                chalk.red('✘  Setting up a local server failed... Please try again. Aborting.\n') +
                chalk.red(err)
            );
            process.exit(0);
        }
    });
    
    cb(null);
}

/**
 * Trigger a browser refresh
 * @param {boolean} bool 
 */
function refresh(bool) {
    let reload = browserSync.reload({stream:bool});
    return reload;
}

module.exports = {
    init,
    run,
    runtask,
    refresh
}