Add ability to pop out editor

popup.html

@@ -57,6 +57,24 @@
 		font-family: monospace, monospace;
 		font-size: 1em;
 	}
+	body.popout #publish-holder, body.popout #result-holder {
+		position: fixed;
+		bottom: 1em;
+		left: 1em;
+		right: 1em;
+	}
+	body.popout textarea {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 4em;
+		border: 0;
+		border-bottom: 1px solid #dfdfdf;
+	}
+	body.popout a#popout {
+		display: none;
+	}
     </style>
 
     <script src="H.js"></script>
@@ -70,6 +88,7 @@
         <a id="url-link" target="_blank">Open</a>
       </div>
       <div id="publish-holder">
+        <a href="#" id="popout">Pop out</a>
         <input type="radio" name="font" value="sans" id="sans" checked="checked" /><label for="sans"> Sans</label>
         <input type="radio" name="font" value="norm" id="norm" /><label for="norm"> Serif</label>
         <input type="radio" name="font" value="mono" id="mono" /><label for="mono"> Monospace</label>

popup.js

@@ -80,6 +80,13 @@ document.addEventListener('DOMContentLoaded', function() {
 	$publish = document.getElementById("publish");
 	$url = document.getElementById("url");
 	var fontRadios = document.postForm.font;
+	var isPopout = window.location.search.substring(1) == "popout";
+
+	if (isPopout) {
+		chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
+			$content.value = request.msg;
+		});
+	}
 	
 	chrome.tabs.executeScript({
 	  code: "window.getSelection().toString();"
@@ -96,6 +103,23 @@ document.addEventListener('DOMContentLoaded', function() {
 	// focus on the paste field
 	$content.focus();
 	
+	if (isPopout) {
+		document.body.className = 'popout';
+	} else {
+		document.getElementById('popout').addEventListener('click', function(e) {
+			e.preventDefault();
+			chrome.windows.create({
+				url: "popup.html?popout",
+				width: 640,
+				height: 400,
+				focused: true,
+				type: "popup"
+			}, function(window) {
+				chrome.runtime.sendMessage({msg: $content.value});
+			});
+		});
+	}
+
 	// bind publish action
 	$publish.addEventListener('click', function(e) {
 		e.preventDefault();