Issue 2844 - Create Microsoft Edge coming soon landing page

static/js/index.js

 (function()
 {
   function addListener(obj, type, listener, useCapture)

[saroyanm, 2015/09/22 13:15:46]

Should be redundant if we doesn't expect IE8 users to visit the page, same goes
to other IE8 related code here.

[Oleksandr, 2015/09/23 00:37:57]

We still support IE8.

[saroyanm, 2015/09/23 12:44:20]

Fare enough, just ignore the IE8 related comments.

   {
     if ("addEventListener" in obj)
     {
       obj.addEventListener(type, function(ev)
       {
         if (listener(ev) === false)
           ev.preventDefault();
       }, useCapture);
     }
     else
@@ skipping 14 matching lines @@
       else
       {
         obj[type] = listener;
       }
     }
   }
 
   function addPlaceholder(textbox)
   {
     textbox.setAttribute("class", "placeholder");
-    textbox.value = getPlaceholderText();
+    textbox.value = getPlaceholderText(textbox);
   }
 
-  function getPlaceholderText()
+  function getPlaceholderText(textbox)
   {
-    return document.getElementById("subscribe-textbox").getAttribute("placeholder");
+    return textbox.getAttribute("placeholder");
   }
 
-  function contentLoad()
+  function initSubscriptionForm(subscriptionElement)
   {
-    var emailTextbox = document.getElementById("subscribe-textbox");
+    var emailTextbox = subscriptionElement.querySelectorAll(".subscribe-textbox")[0];
 
     // IE9 + Safari iOS
     if (!("placeholder" in document.createElement("input"))
         && !emailTextbox.value)
     {
       addPlaceholder(emailTextbox);
       addListener(emailTextbox, "focus", function()
       {
-        if (emailTextbox.value == getPlaceholderText())
+        if (emailTextbox.value == getPlaceholderText(emailTextbox))
         {
           emailTextbox.value = "";
           emailTextbox.setAttribute("class", "");
         }
       }, false);
 
       addListener(emailTextbox, "blur", function()
       {
         if (!emailTextbox.value)
           addPlaceholder(emailTextbox);
       }, false);
     }
 
-    addListener(document.getElementById("subscribe-form"), "submit", function()
+    var formElement = subscriptionElement.getElementsByTagName("form")[0];
+    addListener(formElement, "submit", function()
     {
-      var formElement = document.getElementById("subscribe-form");
       if (!window.XMLHttpRequest)
       {
         formElement.submit();
         return false;
       }
 
-      var pathArray = window.location.pathname.split("/");
-      var params = emailTextbox.name + "=" + encodeURIComponent(emailTextbox.value);
-      params += "&lang=" + pathArray[1];
-      params += "&product=" + "edge";
+      var inputs = formElement.getElementsByTagName("input");
+      var params = "";
+      for (var i = 0; i < inputs.length; i++)
+      {
+        if (params)
+          params += "&";
+        params += inputs[i].name + "=" + encodeURIComponent(inputs[i].value);
+      }      
       var request = new XMLHttpRequest();
-      request.open("POST", formElement.action, true);
+      request.open("POST", "/submitEmail", true);
       request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
       addListener(request, "readystatechange", function()
       {
         if (request.readyState == 4)
         {
           if (request.status >= 200 && request.status < 300)
           {
             formElement.setAttribute("class", "success");
           }
           else if (request.status == 400)
           {
             formElement.setAttribute("class", "invalid");
           }
           else
           {
             var errorWrapper = document.getElementById("response-error");
             if ("textContent" in errorWrapper)
               errorWrapper.textContent = request.statusText;
             else // IE8
               errorWrapper.innerText = request.statusText;
 
             formElement.setAttribute("class", "error");
           }
         }
       }, false);
       request.send(params);
       return false;
     }, false);
   }
-  addListener(document, "DOMContentLoaded", contentLoad, false);

[saroyanm, 2015/09/22 13:15:46]

Script is called after the content is loaded, so this listener is redundant.

-
 
   var visibleTab;
   var container;
 
   window.toggleMore = function()
   {
     if (container.className == "hidden")
       container.className = visibleTab || getDefaultTab();
     else
       container.className = "hidden";
@@ skipping 10 matching lines @@
   {
     var content = document.getElementById("content");
     var ua = content.className.match(/ua\-([^\s]+)/);
     visibleTab = ua && ua[1] || "firefox";
     return visibleTab;
   }
 
   function init()
   {
     container = document.getElementById("more-container");
+    initSubscriptionForm(document.getElementById("edge-subscription"));
   }
 
   init();
 })();