TurboLink.js

const $ = require("jquery");

class TurboLink {

    constructor(el, opts) {
        this.$link = $(el);
        this.opts = opts;
        this.sendRequest();
    }

    getLink() {
        return this.$link;
    }

    sendRequest() {
        const targetSelector = this.getTargetSelector();
        const requestUrl = this.getRequestUrl();

        this.$link.click((e) => {
            e.preventDefault();
            $.ajax({
                url: requestUrl,
                dataType: 'html',
                success: (data, textStatus, jqXHR) => {
                    let replaceWith = $(data).find(targetSelector);
                    if (replaceWith) {
                        $(targetSelector).replaceWith(replaceWith);
                        this.triggerEvent('success');
                    }
                },
                beforeSend: () => {
                    this.triggerEvent('start');
                },
                error: () => {
                    this.triggerEvent('error');
                },
                complete: () => {
                    this.triggerEvent('complete');
                }
            });
        });
    }

    triggerEvent(name) {
        if (this.opts['events'][name]) {
            this.opts['events'][name](this)
        }
    }

    getTargetSelector() {
        if (this.opts['target']) {
            return this.opts['target'];
        } else if (this.$link.hasData('turbolink-target')) {
            return this.$link.data('turbolink-target');
        } else {
            return undefined;
        }
    }

    getRequestUrl() {
        if (this.opts['url']) {
            return this.opts['url'];
        } else if (this.$link.attr('href')) {
            return this.$link.attr('href')
        } else {
            return undefined;
        }
    }
}

module.exports = TurboLink;