<commit_before>/*

    TODO:
        - add match
        - remove match
        - save all matches

*/

import Stapes from 'stapes';
import $ from 'jquery';

import HandlebarsRuntime from 'handlebars-runtime';
import matchTemplate from '../views/match.hbs!';

var MatchController = Stapes.subclass({

    /**
     * @param {HTMLElement} form
     */
    constructor : function ( form, overlay ) {

        this.$form = $( form );
        this.$matchesContainer = this.$form.find( '.matches' );
        this.$formSubmit = this.$form.find( 'button[type=submit]' );
        this.$formReset = this.$form.find( 'button[type=reset]' );
        this.$formAdd = this.$form.find( '.add-match' );
        this.$formSort = this.$form.find( '.sort-matches' );

        this.$alertOverlay = $( overlay );
        this.$alertOverlayButton = this.$alertOverlay.find( '.alert-overlay__close-button' );


        this.sortMatches();

        this.initialFormState = this.$form.serialize();

        this.bindHandlers();

    },

    bindHandlers: function () {

        this.$formReset.on( 'click', function () {
            setTimeout( function () {
                this.checkFormChanges();
            }.bind( this ), 1 );
        }.bind( this ) );


        this.$formAdd.on( 'click', function () {
            this.addMatch();
        }.bind( this ) );


        this.$alertOverlayButton.on( 'click', function () {
            this.$alertOverlay.addClass( 'hidden' );
        }.bind( this ) );


        this.$form.on( 'click', '.delete-match', function( e ){

            var match = $( e.currentTarget ).parent();

            this.deleteMatch( match );

        }.bind( this ) );

        this.$formSort.on( 'click', function(){
            this.sortMatches();
        }.bind( this ) );

    },

    sortMatches: function(){

        // get all matches
        var matches = this.$matchesContainer.find( '.match' );

        // create an array with objects containing match + date
        var newMatches = matches.map( function( index, match, array ){

            var date = $( match ).find( 'input[type=datetime-local]' ).val()
            return {
                date: date,
                match: match
            }
        });

        // sort by date
        newMatches.sort( function( a, b ) {
            a = new Date( a.date );
            b = new Date( b.date );
            return a < b ? -1 : a > b ? 1 : 0;
        });

        // remove matches from the DOM
        this.$matchesContainer.empty();

        // inject matches in the new order
        newMatches.each( function( i, match ){
            this.$matchesContainer.append( match.match );
        }.bind( this ));

    },

    addMatch: function () {

        this.$matchesContainer.append(

            matchTemplate({
                index: $( '.match' ).length
            })
        )
    },

    deleteMatch: function( match ){

        match.remove();

    },

    /**
     *
     * Check if the form has changed since page load
     *
     */

    checkFormChanges: function () {
        if( this.hasFormChangedSincePageLoad() ) {
            this.enableSubmit();
        } else {
            this.disableSubmit();
        }
    },

    enableSubmit: function () {
        this.$formSubmit.prop( 'disabled', false );
    },

    disableSubmit: function () {
        this.$formSubmit.prop( 'disabled', true );
    },

    hasFormChangedSincePageLoad: function () {

        return this.$form.serialize() !== this.initialFormState;
    }
});

export default MatchController;<commit_msg>cleanup<commit_after>import Stapes from 'stapes';
import $ from 'jquery';

import HandlebarsRuntime from 'handlebars-runtime';
import matchTemplate from '../views/match.hbs!';

var MatchController = Stapes.subclass({

    /**
     * @param {HTMLElement} form
     */
    constructor : function ( form, overlay ) {

        this.$form = $( form );
        this.$matchesContainer = this.$form.find( '.matches' );
        this.$formSubmit = this.$form.find( 'button[type=submit]' );
        this.$formReset = this.$form.find( 'button[type=reset]' );
        this.$formAdd = this.$form.find( '.add-match' );
        this.$formSort = this.$form.find( '.sort-matches' );

        this.$alertOverlay = $( overlay );
        this.$alertOverlayButton = this.$alertOverlay.find( '.alert-overlay__close-button' );


        this.sortMatches();

        this.initialFormState = this.$form.serialize();

        this.bindHandlers();

    },

    addMatch: function () {

        this.$matchesContainer.append(

            matchTemplate({
                index: $( '.match' ).length
            })
        )
    },

    bindHandlers: function () {

        this.$formReset.on( 'click', function () {
            setTimeout( function () {
                this.checkFormChanges();
            }.bind( this ), 1 );
        }.bind( this ) );


        this.$formAdd.on( 'click', function () {
            this.addMatch();
        }.bind( this ) );


        this.$alertOverlayButton.on( 'click', function () {
            this.$alertOverlay.addClass( 'hidden' );
        }.bind( this ) );


        this.$form.on( 'click', '.delete-match', function( e ){

            var match = $( e.currentTarget ).parent();

            this.deleteMatch( match );

        }.bind( this ) );

        this.$formSort.on( 'click', function(){
            this.sortMatches();
        }.bind( this ) );

    },

    deleteMatch: function( match ){

        match.remove();

    },

    sortMatches: function(){

        // get all matches
        var matches = this.$matchesContainer.find( '.match' );

        // create an array with objects containing match + date
        var matchObjects = matches.map( function( index, match, array ){

            var date = $( match ).find( 'input[type=datetime-local]' ).val()
            return {
                date: date,
                match: match
            }
        });

        // sort matchObjects by date
        matchObjects.sort( function( a, b ) {
            a = new Date( a.date );
            b = new Date( b.date );
            return a < b ? -1 : a > b ? 1 : 0;
        });

        // remove original matches from the DOM
        this.$matchesContainer.empty();

        // inject the ordered matchObjects
        matchObjects.each( function( i, match ){
            this.$matchesContainer.append( match.match );
        }.bind( this ));

    },


// TODO: implement this for matches as well
// disabled submit button if nothing has changed or if the form validation fails

//    /**
//     *
//     * Check if the form has changed since page load
//     *
//     */
//
//    checkFormChanges: function () {
//        if( this.hasFormChangedSincePageLoad() ) {
//            this.enableSubmit();
//        } else {
//            this.disableSubmit();
//        }
//    },
//
//    enableSubmit: function () {
//        this.$formSubmit.prop( 'disabled', false );
//    },
//
//    disableSubmit: function () {
//        this.$formSubmit.prop( 'disabled', true );
//    },
//
//    hasFormChangedSincePageLoad: function () {
//
//        return this.$form.serialize() !== this.initialFormState;
//    }

});

export default MatchController;
{'fraction_non_alphanumeric': 0.15076837878997645, 'fraction_numerical': 0.001107573030596705, 'mean_word_length': 1.783815028901734, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, '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': '5395626', 'n_tokens_mistral': 2049, 'n_tokens_neox': 1946, 'n_words': 466}