var model = this.data.model,
record = this.data.record,
meta = model.getRecordMetadata(this.data.recordId),
id = model.getRecordId(record);

// create a private scope where $ is set to apex.jQuery
(function($) {
    function updateRecordHighlights(model, record, id) {
        var fields,
            meta = model.getRecordMetadata(id),
            fType = model.getValue(record, "TYPE").v === "NEW";
        fields = meta.fields;
        if (!fields) {
            fields = meta.fields = {};
        }
        if (!fields.TYPE) {
            fields.TYPE= {};
        }
        fields.TYPE.highlight = fType ? "hlType" : null;
        // should call metadataChanged but don't bother because currently the grid doesn't respond to highlight changes
    }
    function updateHighlights(model, offset, ids) {
        var i, id, record;
        if ( offset >= 0 ) {
            // model doesn't have a way to loop over a range of the data so use
            // forEach and check the index relative to the given offset
            model.forEach(function(record, index, id) {
                if ( index >= offset ) {
                    updateRecordHighlights(model, record, id);
                }
            });
        }
        if ( ids ) {
            for (i = 0; i < ids.length; i++) {
                id = ids[i];
                record = model.getRecord(id);
                updateRecordHighlights(model, record, id);
            }
        }
    }
    // do this after the page loads but before the IG is initialized to catch the initial events
    $(function() {
        //
        // This is the general pattern for subscribing to model notifications
        //
        // listen for model created events so that we can subscribe to model notifications
        $("#r111").on("interactivegridviewmodelcreate", function(event, ui) {
            var sid, view,
                model = ui.model;
            if ( ui.viewId === "grid" ) {
                view = apex.region("r111").widget().interactiveGrid("getViews", "grid");
                sid = model.subscribe( {
                    onChange: function(type, change) {
                        console.log(">> model changed ", type, change);
                        if ( type === "set" ) {
                            // don't bother to recalculate if other columns change
                            if (change.field === "TYPE" ) {
                                updateHighlights( model, -1, [change.recordId] );
                                // a veiw refresh is needed
                                view.view$.grid("refresh");
                            }
                        } else if (type === "addData") {
                            updateHighlights( model, change.offset, change.replacedIds );
                            // no veiw refresh needed because event happens before view is rendered
                        } else if (type === "refreshRecords" || type === "revert") {
                            updateHighlights( model, -1, change.recordIds );
                            // a veiw refresh is needed
                            view.view$.grid("refresh");
                        }
                    }
                } );
            }
            // if model is not lazy loaded there is no initial notification that
            // the model has data so update highlights for any initial data

            updateHighlights( model, 0 );
        });
    });
})(apex.jQuery);