List Deltas

by russau

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore-min.js"></script>
<div class="jumbotron">
     <h1>List Deltas</h1>

</div>
<div class="page-header">
    <div class="form-group">
        <label>Destination List</label> I want to make the list look like this
        <textarea class="form-control" id="destination" rows="10">[email protected]
[email protected]
[email protected]</textarea>
    </div>
    <div class="form-group">
        <label>Source List</label> This is the list I currently have
        <textarea class="form-control" id="source" rows="10">[email protected]
[email protected]</textarea>
    </div>
    <p>
        <button id="go" class="btn btn-default">Go</button>
    </p>
    <label>Add</label>
    <p id="add"></p>
    <label>Remove</label>
    <p id="remove"></p>
</div>

JavaScript

$(function () {
    $('#go').click(function () {
        var destination = $('#destination').val().trim().toLowerCase().split('\n');
        var source = $('#source').val().trim().toLowerCase().split('\n');

        var deletes = _.difference(source, destination);
        var adds = _.difference(destination, source);

        $('#remove').html(deletes.join(";"));
        $('#add').html(adds.join(";"));
    });
});