Issue 2426 - Open block.html as a popup window

block.js

Index: block.js
diff --git a/block.js b/block.js
index 42d2d1242f862546f20e90afcf5fb35406c4ba50..71f9b6c376d5a307453a27137cf848b677b1e847 100644
--- a/block.js
+++ b/block.js
@@ -15,38 +15,7 @@
  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-function init()
-{
-  // Attach event listeners
-  window.addEventListener("keydown", onKeyDown, false);
-  window.addEventListener("dragstart", onDragStart, false);
-  window.addEventListener("dragend", onDragEnd, false);
-
-  $("#addButton").click(addFilters);
-  $("#cancelButton").click(closeDialog.bind(null, false));
-
-  // Apply jQuery UI styles
-  $("button").button();
-
-  ext.backgroundPage.sendMessage(
-  {
-    type: "forward",
-    expectsResponse: true,
-    payload:
-    {
-      type: "clickhide-init",
-      width: Math.max(document.body.offsetWidth || document.body.scrollWidth),
-      height: Math.max(document.body.offsetHeight || document.body.scrollHeight)
-    }
-  },
-  function(response)
-  {
-    document.getElementById("filters").value = response.filters.join("\n");
-  });
-
-  document.getElementById("filters").focus();
-}
-window.addEventListener("load", init, false);
+var targetPageId = null;
 
 function onKeyDown(event)
 {
@@ -65,88 +34,63 @@ function onKeyDown(event)
 function addFilters()
 {
   ext.backgroundPage.sendMessage(
-    {
-      type: "add-filters",
-      text: document.getElementById("filters").value
-    },
-
-    function(response)
-    {
-      if (response.status == "ok")
-        closeDialog(true);
-      else
-        alert(response.error);
-    }
-  );
+  {
+    type: "add-filters",
+    text: document.getElementById("filters").value
+  },
+  function(response)
+  {
+    if (response.status == "ok")
+      closeDialog(true);
+    else
+      alert(response.error);
+  });
 }
 
 function closeDialog(success)
 {
   ext.backgroundPage.sendMessage(
+  {
+    type: "forward",
+    targetPageId: targetPageId,
+    payload:
     {
-      type: "forward",
-      payload:
-      {
-        type: "clickhide-close",
-        remove: (typeof success == "boolean" ? success : false)
-      }
+      type: "blockelement-finished",
+      remove: (typeof success == "boolean" ? success : false)
     }
-  );
+  });
+  window.close();
 }
 
-var dragStartX;
-var dragStartY;
-var dragEndX = null;
-var dragEndY = null;
-
-function onDragStart(event)
+function init()
 {
-  var element = document.elementFromPoint(event.clientX, event.clientY);
-  if (element && element.localName == "textarea")
-  {
-    // Don't drag the dialog when the user has clicked into the textarea.
-    // Most likely the user just wants to focus it or select text there.
-    event.preventDefault();
-  }
-  else
-  {
-    dragStartX = event.screenX;
-    dragStartY = event.screenY;
-  }
-}
+  // Attach event listeners
+  window.addEventListener("keydown", onKeyDown, false);
 
-function onDragEnd(event)
-{
-  if (dragEndX == null)
-    dragEndX = event.screenX;
-  if (dragEndY == null)
-    dragEndY = event.screenY;
+  document.getElementById("addButton").addEventListener("click", addFilters);
+  document.getElementById("cancelButton").addEventListener(
+    "click", closeDialog.bind(null, false)
+  );
 
-  ext.backgroundPage.sendMessage({
-    type: "forward",
-    payload:
+  // Apply jQuery UI styles
+  $("button").button();
+
+  document.getElementById("filters").focus();
+
+  ext.onMessage.addListener(function(msg, sender, sendResponse)
+  {
+    switch (msg.type)
     {
-      type: "clickhide-move",
-      x: dragEndX - dragStartX,
-      y: dragEndY - dragStartY
+      case "blockelement-popup-init":
+        targetPageId = msg.sender;
+        document.getElementById("filters").value = msg.filters.join("\n");
+        break;
+      case "blockelement-close-popup":
+        window.close();
+        break;
     }
   });
 
-  dragStartX = null;
-  dragStartY = null;
-  dragEndX = null;
-  dragEndY = null;
-}
-
-// The coordinates in the dragend event are unreliable on Safari. So we
-// need to get the destination coordinates from the drag event instead.
-// However on Chrome, the coordinates in the drag event are unreliable.
-// So we need to get the coordinates from dragend event there.
-if (navigator.userAgent.indexOf(" Version/") != -1)
-{
-  window.addEventListener("drag", function(event)
-  {
-    dragEndX = event.screenX;
-    dragEndY = event.screenY;
-  }, false);
+  window.removeEventListener("load", init);
 }
+window.addEventListener("load", init, false);