<script>
    /*
    the jQuery plugin that does the magic
    */
    (function ($) {
        $.fn.parseExternalLinks = function(a){
            var args = $.extend({
                naMessage:'You are about to leave the application. Please select "Cancel" to return to the application, or "Continue" to proceed to the external link.',
                naHeading:'Accessing External Link',
                cancelTag:'Cancel',
                confirmTag:'Confirm'
            },a);
            $.fn.parseExternalLinks.isExternal = function(url) {
                var match = url.match(/^([^:\/?#]+:)?(?:\/\/([^\/?#]*))?([^?#]+)?(\?[^#]*)?(#.*)?/);
                if (typeof match[1] === "string" && match[1].length > 0 && match[1].toLowerCase() !== location.protocol) return true;
                if (typeof match[2] === "string" && match[2].length > 0 && match[2].replace(new RegExp(":("+{"http:":80,"https:":443}[location.protocol]+")?$"), "") !== location.host) return true;
                return false;
            };
            this.each(function(){
                var t = $(this);
                var l = t.attr('href');

                if($.fn.parseExternalLinks.isExternal(l)){
                    t.data('el',l).attr('href','javascript:void(0);');
                    t.append(' <span class="fa fa-external-link" title="External Link"></span>');
                    t.click(function(e){
                        $('#elModal').remove();
                        var modalHtml = ''+
                        '<div class="modal fade" id="elModal" tabindex="-1" role="dialog" aria-hidden="true">'+
                        '   <div class="modal-dialog">'+
                        '       <div class="modal-content">'+
                        '           <div class="modal-header">'+
                        '               <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>'+
                        '               <h4 class="modal-title" id="myModalLabel">'+args.naHeading+'</h4>'+
                        '           </div>'+
                        '           <div class="modal-body">'+
                        '               <p>'+args.naMessage+'</p>'+
                        '           </div>'+
                        '           <div class="modal-footer">'+
                        '               <button type="button" class="btn btn-default" data-dismiss="modal">'+args.cancelTag+'</button> <button id="naButton" type="button" class="btn btn-primary" data-el="'+$(this).data('el')+'">'+args.confirmTag+'</button>'+
                        '           </div>'+
                        '       </div>'+
                        '   </div>'+
                        '</div>';
                        $('body').append(modalHtml);
                        $('#elModal').modal('show');
                    });
                }
            });
            $('body').on('click.naButtonInstance','#naButton',function(){
                window.location.href=$(this).data('el');
            });
        };
    })(jQuery);

    /*
    parse the links available (here it's done on document ready, but you should do it whenever there are new external links added)
    */
    $(document).ready(function(){
        $('a[href]').parseExternalLinks();
    });
</script>