<commit_before>var $ = require('jquery');
var Ractive = require('ractive');

/**
 * MediaBrowser class
 * Holds all functionalities of the tinyMCE media bropwser modal,
 * Like selecting, uploading or deleting files
 * @param {object} options the options object, see MediaBrowser.DEFAULTS for the defaults
 */
var MediaBrowser = function (options) {
    this.options = $.extend({}, MediaBrowser.DEFAULTS, options);

    if (this.options.modalUrl === null) {
        console.log('Please provide the relative URL to the media modal template');
        return this;
    }

    // holds the array of files
    this.items = [];

    // holds an array of possible error messages
    this.errors = [];

    // load the modal contents and bind action listeners
    this.init();

    return this;
};

/**
 * Default settings/options
 * @type {Object}
 */
MediaBrowser.DEFAULTS = {
    modalUrl: null,               // url to the media browser modal template
    callback: function () {},     // file click callback
    insertOnUpload: false,        // insert new in the tinyMCE dialog after upload
    afterInit: function () {}     // callback after the browser is loaded
};

/**
 * Initialize the modal
 */
MediaBrowser.prototype.init = function () {
    this.createElements();
    this.loadModal();
};

/**
 * Create root element and (hidden) file upload element
 */
MediaBrowser.prototype.createElements = function () {
    // div containing the modal
    this.element = document.createElement('div');
    this.element.className = 'modal';
    this.element.id = 'tg-media-modal';

    // hidden input element for file uploads
    this.fileSelect = document.createElement('input');
    this.fileSelect.type = 'file';
    this.fileSelect.multiple = true;

    // ajax file upload class
    this.client = new XMLHttpRequest();
};

/**
 * Load modal template for Ractivejs instance
 * See http://www.ractivejs.org/
 */
MediaBrowser.prototype.loadModal = function () {
    var that = this;

    $.ajax(that.options.modalUrl).then(function (template) {
        that.template = template;
        that.bindRactive();
    });
};

/**
 * Initiate Ractive
 * See http://www.ractivejs.org/
 */
MediaBrowser.prototype.bindRactive = function () {
    var that = this;

    this.ractive = new Ractive({
        el: that.element,
        template: that.template,
        data: {
            drop: false,
            load: false,
            filter: 'all',
            order: 'newest',
            errors: that.errors,
            items: that.items,
            icon: function (attribute, value) {
                if (this.get(attribute) === value) {
                    return 'fa-check-square-o';
                }
                return 'fa-square-o';
            }
        }
    });

    // store reference to content div
    this.contentElem = this.ractive.find('.modal-content');

    // bind ractive actions
    this.bindActions();
    this.bindDrop();
    this.bindUpload();

    // after init callback
    this.options.afterInit(this.element);

    // populate the modal with files
    this.loadItems();
};

MediaBrowser.prototype.bindActions = function () {
    var that = this;

    // when files are selected using the file upload button
    this.fileSelect.addEventListener('change', function () {
        that.createItems(this);
    }, true);

    // when a file is clicked
    this.ractive.on('select', function (event) {
        event.original.preventDefault();
        // ignore click events on the delete confirm overlay
        if ($(event.original.target).is('.confirm-delete')) {
            return;
        }
        if (that.callback) {
            that.callback(event.node.href);
        }
    });

    // when a (new) filter is selected
    this.ractive.on('filter', function (event, filter) {
        event.original.preventDefault();
        this.set('filter', filter);
        that.loadItems();
    });

    // when a (new) sort order is selected
    this.ractive.on('order', function (event, order) {
        event.original.preventDefault();
        this.set('order', order);
        that.loadItems();
    });

    // when the trash can is clicked at the bottom left of a file block
    this.ractive.on('show-delete', function (event, id) {
        event.original.preventDefault();
        event.original.stopPropagation();
<commit_msg>Added event context to file select cb<commit_after>var $ = require('jquery');
var Ractive = require('ractive');

/**
 * MediaBrowser class
 * Holds all functionalities of the tinyMCE media bropwser modal,
 * Like selecting, uploading or deleting files
 * @param {object} options the options object, see MediaBrowser.DEFAULTS for the defaults
 */
var MediaBrowser = function (options) {
    this.options = $.extend({}, MediaBrowser.DEFAULTS, options);

    if (this.options.modalUrl === null) {
        console.log('Please provide the relative URL to the media modal template');
        return this;
    }

    // holds the array of files
    this.items = [];

    // holds an array of possible error messages
    this.errors = [];

    // load the modal contents and bind action listeners
    this.init();

    return this;
};

/**
 * Default settings/options
 * @type {Object}
 */
MediaBrowser.DEFAULTS = {
    modalUrl: null,               // url to the media browser modal template
    callback: function () {},     // file click callback
    insertOnUpload: false,        // insert new in the tinyMCE dialog after upload
    afterInit: function () {}     // callback after the browser is loaded
};

/**
 * Initialize the modal
 */
MediaBrowser.prototype.init = function () {
    this.createElements();
    this.loadModal();
};

/**
 * Create root element and (hidden) file upload element
 */
MediaBrowser.prototype.createElements = function () {
    // div containing the modal
    this.element = document.createElement('div');
    this.element.className = 'modal';
    this.element.id = 'tg-media-modal';

    // hidden input element for file uploads
    this.fileSelect = document.createElement('input');
    this.fileSelect.type = 'file';
    this.fileSelect.multiple = true;

    // ajax file upload class
    this.client = new XMLHttpRequest();
};

/**
 * Load modal template for Ractivejs instance
 * See http://www.ractivejs.org/
 */
MediaBrowser.prototype.loadModal = function () {
    var that = this;

    $.ajax(that.options.modalUrl).then(function (template) {
        that.template = template;
        that.bindRactive();
    });
};

/**
 * Initiate Ractive
 * See http://www.ractivejs.org/
 */
MediaBrowser.prototype.bindRactive = function () {
    var that = this;

    this.ractive = new Ractive({
        el: that.element,
        template: that.template,
        data: {
            drop: false,
            load: false,
            filter: 'all',
            order: 'newest',
            errors: that.errors,
            items: that.items,
            icon: function (attribute, value) {
                if (this.get(attribute) === value) {
                    return 'fa-check-square-o';
                }
                return 'fa-square-o';
            }
        }
    });

    // store reference to content div
    this.contentElem = this.ractive.find('.modal-content');

    // bind ractive actions
    this.bindActions();
    this.bindDrop();
    this.bindUpload();

    // after init callback
    this.options.afterInit(this.element);

    // populate the modal with files
    this.loadItems();
};

MediaBrowser.prototype.bindActions = function () {
    var that = this;

    // when files are selected using the file upload button
    this.fileSelect.addEventListener('change', function () {
        that.createItems(this);
    }, true);

    // when a file is clicked
    this.ractive.on('select', function (event) {
        event.original.preventDefault();
        // ignore click events on the delete confirm overlay
        if ($(event.original.target).is('.confirm-delete')) {
            return;
        }
        if (that.callback) {
            that.callback(event.node.href, event.context);
        }
    });

    // when a (new) filter is selected
    this.ractive.on('filter', function (event, filter) {
        event.original.preventDefault();
        this.set('filter', filter);
        that.loadItems();
    });

    // when a (new) sort order is selected
    this.ractive.on('order', function (event, order) {
        event.original.preventDefault();
        this.set('order', order);
        that.loadItems();
    });

    // when the trash can is clicked at the bottom left of a file block
    this.ractive.on('show-delete', function (event, id) {
        event.original.preventDefault();
        event.original.stopPropagation();

{'fraction_non_alphanumeric': 0.12613232427473914, 'fraction_numerical': 0.0, 'mean_word_length': 2.361078998073218, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 4, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7184717', 'n_tokens_mistral': 2379, 'n_tokens_neox': 2320, 'n_words': 677}