Intercepting Copy-Paste

HTML

<div id="content"></div>
<textarea id="magic"></textarea>

CSS

#content {
  font-family: 'Monaco', 'Menlo', 'Monospace', sans-serif;
  font-size: 14px;
  white-space: pre;
  color: #bbb;
  padding: 10px;
  margin: 10px;
  border: 1px solid #eee;
  background-color: #333;
  text-shadow: 0 1px 1px #000;
  list-style-type: none;
}

li:hover {
  background-color: rgba(255,255,255,0.1);
}

#magic {
  height: 1px;
  width: 1px;
  border: 0 none;
  margin-left: -9999px;
}

JavaScript

var myElement = document.getElementById('content');
myElement.onpaste = function(e) {
  var pastedText = undefined;
  if (window.clipboardData && window.clipboardData.getData) { // IE
    pastedText = window.clipboardData.getData('Text');
  } else if (e.clipboardData && e.clipboardData.getData) {
    pastedText = e.clipboardData.getData('text/plain');
  }
  alert(pastedText); // Process and handle text...
  return false; // Prevent the default handler from running.
};

var window = this;
window.$(function($) {

  'use strict';

  var content = $('#content');
  var magic = $('#magic');
  
  function render(count, line) {
    content.append($('<li/>').text(line));
  }

  function update() {
    content.empty();
    var lines = magic.val().split(/[\n\r]/g);
    if(lines.length) { $.each(lines, render); }
    magic.val('');
  }

  $(document).keydown(function(e) {
    if((e.metaKey || e.ctrlKey)) {
      if(e.which === 67) {
        magic.val(content.text());
        magic.focus().select();
        //e.preventDefault();
      } else if(e.which === 86) {
        magic.val('').focus();
        setTimeout(update, 50);
      }
    }
  });

  window.console.log('ready!!');
  
  return;

});