Issue #517 Part 7: Remove enhanced/sponsored links styling and page code

application/palemoon/base/content/newtab/grid.js

@@ -9,7 +9,6 @@
  */
 const GRID_BOTTOM_EXTRA = 7; // title's line-height extends 7px past the margin
 const GRID_WIDTH_EXTRA = 1; // provide 1px buffer to allow for rounding error
-const SPONSORED_TAG_BUFFER = 2; // 2px buffer to clip off top of sponsored tag
 
 /**
  * This singleton represents the grid that contains all sites.
@@ -179,18 +178,15 @@ var gGrid = {
 
     // Create the site's inner HTML code.
     site.innerHTML =
-      '<span class="newtab-sponsored">' + newTabString("sponsored.button") + '</span>' +
       '<a class="newtab-link">' +
       '  <span class="newtab-thumbnail placeholder"/>' +
       '  <span class="newtab-thumbnail thumbnail"/>' +
-      '  <span class="newtab-thumbnail enhanced-content"/>' +
       '  <span class="newtab-title"/>' +
       '</a>' +
       '<input type="button" title="' + newTabString("pin") + '"' +
       '       class="newtab-control newtab-control-pin"/>' +
       '<input type="button" title="' + newTabString("block") + '"' +
-      '       class="newtab-control newtab-control-block"/>' +
+      '       class="newtab-control newtab-control-block"/>';
-      '<span class="newtab-suggested"/>';
 
     this._siteFragment = document.createDocumentFragment();
     this._siteFragment.appendChild(site);
@@ -271,6 +267,6 @@ var gGrid = {
     this._node.style.maxWidth = gGridPrefs.gridColumns * this._cellWidth +
                                 GRID_WIDTH_EXTRA + "px";
     this._node.style.height = this._computeHeight() + "px";
-    this._node.style.maxHeight = this._computeHeight(gridRows) - SPONSORED_TAG_BUFFER + "px";
+    this._node.style.maxHeight = this._computeHeight(gridRows) + "px";
   }
 };

application/palemoon/base/content/newtab/newTab.css

@@ -151,16 +151,13 @@ input[type=button] {
 }
 
 /* TITLES */
-.newtab-sponsored,
+.newtab-title {
-.newtab-title,
-.newtab-suggested {
   overflow: hidden;
   position: absolute;
   right: 0;
   text-align: center;
 }
 
-.newtab-sponsored,
 .newtab-title {
   bottom: 0;
   white-space: nowrap;
@@ -168,103 +165,11 @@ input[type=button] {
   vertical-align: middle;
 }
 
-.newtab-suggested {
-  border: 1px solid transparent;
-  border-radius: 2px;
-  font-size: 12px;
-  height: 17px;
-  line-height: 17px;
-  margin-bottom: -1px;
-  padding: 2px 8px;
-  display: none;
-  margin-left: auto;
-  margin-right: auto;
-  left: 0;
-  top: 215px;
-  -moz-user-select: none;
-}
-
-.newtab-suggested-bounds {
-  max-height: 34px; /* 34 / 17 = 2 lines maximum */
-}
-
 .newtab-title {
   left: 0;
   padding: 0 4px;
 }
 
-.newtab-sponsored {
-  background-color: #FFFFFF;
-  border: 1px solid #E2E2E2;
-  border-radius: 3px;
-  color: #4A4A4A;
-  cursor: pointer;
-  display: none;
-  font-family: Arial;
-  font-size: 9px;
-  height: 17px;
-  left: 0;
-  line-height: 6px;
-  padding: 4px;
-  right: auto;
-  top: -15px;
-}
-
-.newtab-site[suggested=true] > .newtab-sponsored {
-  background-color: #E2E2E2;
-  border: none;
-}
-
-.newtab-site > .newtab-sponsored:-moz-any(:hover, [active]) {
-  background-color: #4A90E2;
-  border: 0;
-  color: white;
-}
-
-.newtab-site > .newtab-sponsored[active] {
-  background-color: #000000;
-}
-
-.newtab-sponsored:dir(rtl) {
-  right: 0;
-  left: auto;
-}
-
-.newtab-site:-moz-any([type=enhanced], [type=sponsored], [suggested]) .newtab-sponsored {
-  display: block;
-}
-
-.newtab-site[suggested] .newtab-suggested {
-  display: table;
-}
-
-.sponsored-explain,
-.sponsored-explain a,
-.suggested-explain,
-.suggested-explain a {
-  color: white;
-}
-
-.sponsored-explain,
-.suggested-explain {
-  background-color: rgba(51, 51, 51, 0.95);
-  bottom: 30px;
-  line-height: 20px;
-  padding: 15px 10px;
-  position: absolute;
-  text-align: start;
-}
-
-.sponsored-explain input,
-.suggested-explain input {
-  background-size: 18px;
-  height: 18px;
-  opacity: 1;
-  pointer-events: none;
-  position: static;
-  width: 18px;
-}
-
 /* CONTROLS */
 .newtab-control {
   position: absolute;

application/palemoon/base/content/newtab/newTab.js

@@ -11,7 +11,6 @@ Cu.import("resource://gre/modules/XPCOMUtils.jsm");
 Cu.import("resource://gre/modules/Services.jsm");
 Cu.import("resource://gre/modules/PageThumbs.jsm");
 Cu.import("resource://gre/modules/BackgroundPageThumbs.jsm");
-// Cu.import("resource:///modules/DirectoryLinksProvider.jsm");
 Cu.import("resource://gre/modules/NewTabUtils.jsm");
 
 XPCOMUtils.defineLazyModuleGetter(this, "Rect",

application/palemoon/base/content/newtab/page.js

@@ -275,8 +275,6 @@ var gPage = {
         }
       }
     }
-
-    // DirectoryLinksProvider.reportSitesAction(sites, "view", lastIndex);
   },
 
   maybeShowAutoMigrationUndoNotification() {

application/palemoon/base/content/newtab/sites.js

@@ -62,7 +62,7 @@ Site.prototype = {
     this._updateAttributes(true);
     let changed = gPinnedLinks.pin(this._link, aIndex);
     if (changed) {
-      // render site again to remove suggested/sponsored tags
+      // render site again
       this._render();
     }
     return changed;
@@ -171,10 +171,8 @@ Site.prototype = {
     // first check for end time, as it may modify the link
     this._checkLinkEndTime();
     // setup display variables
-    let enhanced = gAllPages.enhanced; // && DirectoryLinksProvider.getEnhancedLink(this.link);
     let url = this.url;
-    let title = enhanced && enhanced.title ? enhanced.title :
+    let title = this.link.type == "history" ? this.link.baseDomain :
-                this.link.type == "history" ? this.link.baseDomain :
                 this.title;
     let tooltip = (this.title == url ? this.title : this.title + "\n" + url);
 
@@ -189,22 +187,6 @@ Site.prototype = {
       titleNode.style.backgroundColor = this.link.titleBgColor;
     }
 
-    // remove "suggested" attribute to avoid showing "suggested" tag
-    // after site was pinned or dropped
-    this.node.removeAttribute("suggested");
-
-    if (this.link.targetedSite) {
-      if (this.node.getAttribute("type") != "sponsored") {
-        this._querySelector(".newtab-sponsored").textContent =
-          newTabString("suggested.tag");
-      }
-
-      this.node.setAttribute("suggested", true);
-      let explanation = this._getSuggestedTileExplanation();
-      this._querySelector(".newtab-suggested").innerHTML =
-        `<div class='newtab-suggested-bounds'> ${explanation} </div>`;
-    }
-
     if (this.isPinned())
       this._updateAttributes(true);
     // Capture the page if the thumbnail is missing, which will cause page.js
@@ -243,9 +225,7 @@ Site.prototype = {
    * Refreshes the thumbnail for the site.
    */
   refreshThumbnail: function Site_refreshThumbnail() {
-    // Only enhance tiles if that feature is turned on
+    let link = this.link;
-    let link = gAllPages.enhanced; // && DirectoryLinksProvider.getEnhancedLink(this.link) ||
-               this.link;
 
     let thumbnail = this._querySelector(".newtab-thumbnail.thumbnail");
     if (link.bgColor) {
@@ -267,16 +247,6 @@ Site.prototype = {
       placeholder.style.backgroundColor = "hsl(" + hue + ",80%,40%)";
       placeholder.textContent = link.baseDomain.substr(0,1).toUpperCase();
     }
-
-    if (link.enhancedImageURI) {
-      let enhanced = this._querySelector(".enhanced-content");
-      enhanced.style.backgroundImage = 'url("' + link.enhancedImageURI + '")';
-
-      if (this.link.type != link.type) {
-        this.node.setAttribute("type", "enhanced");
-        this.enhancedId = link.directoryId;
-      }
-    }
   },
 
   _ignoreHoverEvents: function(element) {
@@ -296,13 +266,6 @@ Site.prototype = {
     this._node.addEventListener("dragstart", this, false);
     this._node.addEventListener("dragend", this, false);
     this._node.addEventListener("mouseover", this, false);
-
-    // Specially treat the sponsored icon & suggested explanation
-    // text to prevent regular hover effects
-    let sponsored = this._querySelector(".newtab-sponsored");
-    let suggested = this._querySelector(".newtab-suggested");
-    this._ignoreHoverEvents(sponsored);
-    this._ignoreHoverEvents(suggested);
   },
 
   /**
@@ -341,21 +304,6 @@ Site.prototype = {
 
       button.removeAttribute("active");
     }
-    else {
-      let explain = document.createElementNS(HTML_NAMESPACE, "div");
-      explain.className = explanationTextClass.slice(1); // Slice off the first character, '.'
-      this.node.appendChild(explain);
-
-      let link = '<a href="' + TILES_EXPLAIN_LINK + '">' +
-                 newTabString("learn.link") + "</a>";
-      let type = (this.node.getAttribute("suggested") && this.node.getAttribute("type") == "affiliate") ?
-                  "suggested" : this.node.getAttribute("type");
-      let icon = '<input type="button" class="newtab-control newtab-' +
-                 (type == "enhanced" ? "customize" : "control-block") + '"/>';
-      explain.innerHTML = newTabString(type + (type == "sponsored" ? ".explain2" : ".explain"), [icon, link]);
-
-      button.setAttribute("active", "true");
-    }
   },
 
   /**
@@ -376,31 +324,13 @@ Site.prototype = {
         action = "click";
       }
     }
-    // Handle sponsored explanation link click
-    else if (target.parentElement.classList.contains("sponsored-explain")) {
-      action = "sponsored_link";
-    }
-    else if (target.parentElement.classList.contains("suggested-explain")) {
-      action = "suggested_link";
-    }
     // Only handle primary clicks for the remaining targets
     else if (button == 0) {
       aEvent.preventDefault();
       if (target.classList.contains("newtab-control-block")) {
-        // Notify DirectoryLinksProvider of suggested tile block, this may
-        // affect if and how suggested tiles are recommended and needs to
-        // be reported before pages are updated inside block() call
-        if (this.link.targetedSite) {
-          // DirectoryLinksProvider.handleSuggestedTileBlock();
-        }
         this.block();
         action = "block";
       }
-      else if (target.classList.contains("sponsored-explain") ||
-               target.classList.contains("newtab-sponsored")) {
-        this._toggleLegalText(".newtab-sponsored", ".sponsored-explain");
-        action = "sponsored";
-      }
       else if (pinned && target.classList.contains("newtab-control-pin")) {
         this.unpin();
         action = "unpin";
@@ -413,11 +343,6 @@ Site.prototype = {
         action = "pin";
       }
     }
-
-    // Report all link click actions
-    if (action) {
-      // DirectoryLinksProvider.reportSitesAction(gGrid.sites, action, tileIndex);
-    }
   },
 
   /**