MinnPost/object-sync-for-salesforce

View on GitHub
assets/js/src/03-fieldmap-rows.js

Summary

Maintainability
A
1 hr
Test Coverage

/**
 * Duplicates the fields for a new row in the fieldmap options screen.
 * this appears not to work with data() instead of attr()
 */
 function addFieldMappingRow( button ) {
    var salesforceObject = $( '#salesforce_object' ).val();
    var wordpressObject = $( '#wordpress_object' ).val();
    var newKey = new Date().getUTCMilliseconds();
    var lastRow = $( 'table.fields tbody tr' ).last();
    var oldKey = lastRow.attr( 'data-key' );
    oldKey = new RegExp( oldKey, 'g' );
    if ( '' !== wordpressObject && '' !== salesforceObject ) {
        fieldmapFields( oldKey, newKey, lastRow );
        button.parent().find( '.missing-object' ).remove();
        button.text( button.data( 'add-more' ) );
    } else {
        button.text( button.data( 'add-first' ) );
        button.parent().prepend( '<div class="error missing-object"><span>' + button.data( 'error-missing-object' ) + '</span></div>' );
    }
    return false;
}

/**
 * Clones the fieldset markup provided by the server-side template and appends it at the end.
 * this appears not to work with data() instead of attr()
 * @param {string} oldKey the data key attribute of the set that is being cloned
 * @param {string} newKey the data key attribute for the one we're appending
 * @param {object} lastRow the last set of the fieldmap
 */
function fieldmapFields( oldKey, newKey, lastRow ) {
    var nextRow = '';
    if ( jQuery.fn.select2 ) {
        nextRow = lastRow.find( 'select' ).select2( 'destroy' ).end().clone( true ).removeClass( 'fieldmap-template' );
    } else {
        nextRow = lastRow.find( 'select' ).end().clone( true ).removeClass( 'fieldmap-template' );
    }
    $( nextRow ).attr( 'data-key', newKey );
    $( nextRow ).each( function() {
        $( this ).html( function( i, h ) {
            return h.replace( oldKey, newKey );
        } );
    } );
    $( 'table.fields tbody' ).append( nextRow );
    if ( jQuery.fn.select2 ) {
        lastRow.find( 'select' ).select2();
        nextRow.find( 'select' ).select2();
    }
}

// load available options if the WordPress object changes
$( document ).on( 'change', '.column-wordpress_field select', function() {
    disableAlreadyMappedFields( 'wordpress' );
} );
// load available options if the Salesforce object changes
$( document ).on( 'change', '.column-salesforce_field select', function() {
    disableAlreadyMappedFields( 'salesforce' );
} );

/**
 * Disable fields that are already mapped from being mapped again.
 * @param {string} system whether we want WordPress or Salesforce data
 */
function disableAlreadyMappedFields( system ) {
    // load the select statements for Salesforce or WordPress.
    var select = $( '.fieldmap-disable-mapped-fields .column-' + system + '_field select' );
    var allSelected = [];
    // add each currently selected value to an array, then make it unique.
    select.each( function( i, fieldChoice ) {
        var selectedValue = $( fieldChoice ).find( 'option:selected' ).val();
        if ( null !== selectedValue && '' !== selectedValue ) {
            allSelected.push( selectedValue );
        }
    });
    allSelected = allSelected.filter((v, i, a) => a.indexOf(v) === i);
    // disable the items that are selected in another select, enable them otherwise.
    $( 'option', select ).removeProp( 'disabled' );
    $( 'option', select ).prop( 'disabled', false );
    $.each( allSelected, function( key, value ) {
        $( 'option[value=' + value + ']:not(:selected)', select ).prop( 'disabled', true );
    } );
    // reinitialize select2 if it's active.
    if ( jQuery.fn.select2 ) {
        $( '.column-' + system + '_field select' ).select2();
    }
}

/**
 * Handle click event for the Add another field mapping button.
 * It duplicates the fields for a new row in the fieldmap options screen.
 */
 $( document ).on( 'click', '#add-field-mapping', function() {
    addFieldMappingRow( $( this ) );
} );

/**
 * As the Drupal plugin does, we only allow one field to be a prematch
 */
$( document ).on( 'click', '.column-is_prematch input', function() {
    $( '.column-is_prematch input' ).not( this ).prop( 'checked', false );
} );

/**
 * As the Drupal plugin does, we only allow one field to be a key
 */
$( document ).on( 'click', '.column-is_key input', function() {
    $( '.column-is_key input' ).not( this ).prop( 'checked', false );
} );

/**
 * When the plugin loads:
 * Disable fields that are already selected
 * Select2 on select fields
 */
$( document ).ready( function() {

    // disable the option values for fields that have already been mapped.
    disableAlreadyMappedFields( 'salesforce' );
    disableAlreadyMappedFields( 'wordpress' );

    // setup the select2 fields if the library is present
    if ( jQuery.fn.select2 ) {
        $( 'select#wordpress_object' ).select2();
        $( 'select#salesforce_object' ).select2();
        $( 'select#salesforce_record_type_default' ).select2();
        $( 'select#pull_trigger_field' ).select2();
        $( '.column-wordpress_field select' ).select2();
        $( '.column-salesforce_field select' ).select2();
    }
} );