I'm trying to replicate the functionality found in this codepen example.
Primarily, I'd like to include this code:
$( function() {
var $wrap = $('#wrap');
var $textarea = $('textarea');
var $dummy = $('.dummy');
function positionTextarea() {
var h = $wrap.height();
var top = Math.max( 0, ( h - $dummy.height() ) * 0.5 );
$textarea.css({
paddingTop: top,
height: h - top
});
}
$textarea.on( 'keyup change', function( event ) {
var html = formatDummyText( $textarea.val() );
$dummy.html( html );
positionTextarea();
}).trigger('change');
// should debounce this
$( window ).on( 'resize', positionTextarea );
});
in a directive. I'll have a textarea with a dummy div nearby with 0 opacity. What's the best way to include this functionality in a directive?