Add webui handler for promotions on Android NTP.

chrome/browser/resources/ntp_android/ntp_android.js

 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 // File Description:
 //     Contains all the necessary functions for rendering the NTP on mobile
 //     devices.
 
 /**
  * The event type used to determine when a touch starts.
@@ skipping 196 matching lines @@
    * @type {boolean}
    */
   var hasRecentlyClosedTabs = false;
 
   /**
    * Whether promo is not allowed or not (external to NTP).
    * @type {boolean}
    */
   var promoIsAllowed = false;
 
+  /**
+   * Whether promo should be shown on Most Visited page (externally set).
+   * @type {boolean}
+   */
+  var promoIsAllowedOnMostVisited = false;
+
+  /**
+   * Whether promo should be shown on Open Tabs page (externally set).
+   * @type {boolean}
+   */
+  var promoIsAllowedOnOpenTabs = false;
+
+  /**
+   * Whether promo should show a virtual computer on Open Tabs (externally set).
+   * @type {boolean}
+   */
+  var promoIsAllowedAsVirtualComputer = false;
+
+  /**
+   * Promo-injected title of a virtual computer on an open tabs pane.
+   * @type {string}
+   */
+  var promoInjectedComputerTitleText = '';
+
+  /**
+   * Promo-injected last synced text of a virtual computer on an open tabs pane.
+   * @type {string}
+   */
+  var promoInjectedComputerLastSyncedText = '';
+
   function setIncognitoMode(incognito) {
     isIncognito = incognito;
   }
 
   /**
    * The different sections that are displayed.
    * @enum {number}
    */
   var SectionType = {
-    BOOKMARKS: 0,
-    INCOGNITO: 1,
-    MOST_VISITED: 2,
-    RECENTLY_CLOSED: 3,
-    SYNCED_DEVICES: 4,
-    FOREIGN_SESSION: 5,
-    FOREIGN_SESSION_HEADER: 6,
-    SNAPSHOTS: 7,
-    UNKNOWN: 100,
+    BOOKMARKS: 'bookmarks',
+    MOST_VISITED: 'most_visited',
+    RECENTLY_CLOSED: 'recently_closed',

[Dan Beam, 2012/08/30 18:52:26]

nit: alpha sort now

[aruslan, 2012/08/30 21:38:17]

Done.

+    FOREIGN_SESSION: 'foreign_session',
+    FOREIGN_SESSION_HEADER: 'foreign_session_header',
+    SNAPSHOTS: 'snapshots',
+    PROMO_VC_SESSION_HEADER: 'promo_vc_session_header',
+    UNKNOWN: 'unknown',
   };
 
   /**
    * The different ids used of our custom context menu. Sent to the ChromeView
    * and sent back when a menu is selected.
    * @enum {number}
    */
   var ContextMenuItemIds = {
     BOOKMARK_EDIT: 0,
     BOOKMARK_DELETE: 1,
     BOOKMARK_OPEN_IN_NEW_TAB: 2,
     BOOKMARK_OPEN_IN_INCOGNITO_TAB: 3,
     BOOKMARK_SHORTCUT: 4,
 
     MOST_VISITED_OPEN_IN_NEW_TAB: 10,
     MOST_VISITED_OPEN_IN_INCOGNITO_TAB: 11,
     MOST_VISITED_REMOVE: 12,
 
     RECENTLY_CLOSED_OPEN_IN_NEW_TAB: 20,
     RECENTLY_CLOSED_OPEN_IN_INCOGNITO_TAB: 21,
     RECENTLY_CLOSED_REMOVE: 22,
 
     FOREIGN_SESSIONS_REMOVE: 30,
+
+    PROMO_VC_SESSION_REMOVE: 40,
   };
 
   /**
    * The URL of the element for the context menu.
    * @type {string}
    */
   var contextMenuUrl = null;
 
   var contextMenuItem = null;
 
   var currentSnapshots = null;
 
   var currentSessions = null;
 
   /**
    * The possible states of the sync section
    * @enum {number}
    */
   var SyncState = {
     INITIAL: 0,
     WAITING_FOR_DATA: 1,
     DISPLAYING_LOADING: 2,
     DISPLAYED_LOADING: 3,
-    LOADED: 3,
+    LOADED: 4,
   };
 
   /**
    * The current state of the sync section.
    */
   var syncState = SyncState.INITIAL;
 
   /**
    * Whether or not sync is enabled. It will be undefined until
    * setSyncEnabled() is called.
@@ skipping 99 matching lines @@
     // incognito NTPs have a bookmarks section.
     if (getPaneIndexFromHash() < 0)
       document.location.hash = '#bookmarks';
 
     // Initialize common widgets.
     var titleScrollers =
         document.getElementsByClassName('section-title-wrapper');
     for (var i = 0, len = titleScrollers.length; i < len; i++)
       initializeTitleScroller(titleScrollers[i]);
 
+    // Initialize virtual computers for the sync promo.
+    createPromoVirtualComputers();
+
     chrome.send('getMostVisited');
     chrome.send('getRecentlyClosedTabs');
     chrome.send('getForeignSessions');
     chrome.send('getPromotions');
 
     setCurrentBookmarkFolderData(
         localStorage.getItem(DEFAULT_BOOKMARK_FOLDER_KEY));
 
     addMainSection('incognito');
     addMainSection('most_visited');
@@ skipping 409 matching lines @@
 
     var titleContainer = createElement('span', 'title');
     sessionOuterDiv.appendChild(titleContainer);
 
     // Extra container to allow title & last-sync time to stack vertically.
     var sessionInnerDiv = createDiv(null);
     titleContainer.appendChild(sessionInnerDiv);
 
     var title = createDiv('session-name');
     title.textContent = item.title;
+    title.id = item.titleId || '';
     sessionInnerDiv.appendChild(title);
 
     var lastSynced = createDiv('session-last-synced');
     lastSynced.textContent =
         templateData.opentabslastsynced + ': ' + item.userVisibleTimestamp;
+    lastSynced.id = item.userVisibleTimestampId || '';
     sessionInnerDiv.appendChild(lastSynced);
 
     sessionOuterDiv.addEventListener('click', function(evt) {
       var clickCallback =
           opt_clickCallback ? opt_clickCallback : itemShortcutClickHandler;
       clickCallback(item, evt);
     });
     return sessionOuterDiv;
   }
 
   /**
    * Saves the number of most visited pages and updates promo visibility.
    * @param {number} n Number of most visited pages.
    */
   function setNumberOfMostVisitedPages(n) {
     numberOfMostVisitedPages = n;
-    promoSetVisibility();
+    updatePromoVisibility();
   }
 
   /**
    * Saves the recently closed tabs flag and updates promo visibility.
    * @param {boolean} anyTabs Whether there are any recently closed tabs.
    */
   function setHasRecentlyClosedTabs(anyTabs) {
     hasRecentlyClosedTabs = anyTabs;
-    promoSetVisibility();
+    updatePromoVisibility();
   }
 
   /**
    * Updates the most visited pages.
    *
    * @param {Array.<Object>} List of data for displaying the list of most
    *     visited pages (see C++ handler for model description).
    * @param {boolean} hasBlacklistedUrls Whether any blacklisted URLs are
    *     present.
    */
@@ skipping 89 matching lines @@
 
     // update the shadows on the  breadcrumb bar
     computeDynamicLayout();
   }
 
   /**
    * Checks if promo is allowed and MostVisited requirements are satisfied.
    * @return {boolean} Whether the promo should be shown on most_visited.
    */
   function shouldPromoBeShownOnMostVisited() {
-    return promoIsAllowed &&
-        (numberOfMostVisitedPages >= 2) &&
-        (!hasRecentlyClosedTabs);
+    return promoIsAllowed && promoIsAllowedOnMostVisited &&
+        numberOfMostVisitedPages >= 2 && !hasRecentlyClosedTabs;
   }
 
   /**
    * Checks if promo is allowed and OpenTabs requirements are satisfied.
    * @return {boolean} Whether the promo should be shown on open_tabs.
    */
   function shouldPromoBeShownOnOpenTabs() {
     var snapshotsCount =
         currentSnapshots == null ? 0 : currentSnapshots.length;
     var sessionsCount = currentSessions == null ? 0 : currentSessions.length;
-    return promoIsAllowed &&
+    return promoIsAllowed && promoIsAllowedOnOpenTabs &&
         (snapshotsCount + sessionsCount != 0);
   }
 
   /**
    * Checks if promo is allowed and SyncPromo requirements are satisfied.
    * @return {boolean} Whether the promo should be shown on sync_promo.
    */
-  function shouldPromoBeShownOnSyncPromo() {
+  function shouldPromoBeShownOnSync() {
     var snapshotsCount =
         currentSnapshots == null ? 0 : currentSnapshots.length;
     var sessionsCount = currentSessions == null ? 0 : currentSessions.length;
-    return promoIsAllowed &&
+    return promoIsAllowed && promoIsAllowedOnOpenTabs &&
         (snapshotsCount + sessionsCount == 0);
   }
 
   /**
    * Records a promo impression on a given section if necessary.
    * @param {string} section Active section name to check.
    */
   function promoUpdateImpressions(section) {
-    if (section == 'most_visited' && shouldPromoBeShownOnMostVisited()) {
+    if (section == 'most_visited' && shouldPromoBeShownOnMostVisited())
       chrome.send('recordImpression', ['most_visited']);
-    } else if (section == 'open_tabs' && shouldPromoBeShownOnOpenTabs()) {
+    else if (section == 'open_tabs' && shouldPromoBeShownOnOpenTabs())
       chrome.send('recordImpression', ['open_tabs']);
-    } else if (section == 'open_tabs' && shouldPromoBeShownOnSyncPromo()) {
+    else if (section == 'open_tabs' && shouldPromoBeShownOnSync())
       chrome.send('recordImpression', ['sync_promo']);
+  }
+
+  /**
+   * Updates the visibility on all promo-related items as necessary.
+   */
+  function updatePromoVisibility() {
+    var mostVisitedEl = $('promo_message_on_most_visited');
+    var openTabsVCEl = $('promo_vc_list');
+    var syncPromoLegacyEl = $('promo_message_on_sync_promo_legacy');
+    var syncPromoReceivedEl = $('promo_message_on_sync_promo_received');
+    mostVisitedEl.style.display =
+        shouldPromoBeShownOnMostVisited() ? 'block' : 'none';
+    syncPromoReceivedEl.style.display =
+        shouldPromoBeShownOnSync() ? 'block' : 'none';
+    syncPromoLegacyEl.style.display =
+        shouldPromoBeShownOnSync() ? 'none' : 'block';
+    openTabsVCEl.style.display =
+        (shouldPromoBeShownOnOpenTabs() && promoIsAllowedAsVirtualComputer) ?
+            'block' : 'none';
+  }
+
+  /**
+   * Called from native.
+   * Clears the promotion.
+   */
+  function clearPromotions() {
+    setPromotions({});
+  }
+
+  /**
+   * Set the element to a parsed and sanitized promotion HTML string.
+   * @param {Element} el The element to set the promotion string to.
+   * @param {string} html The promotion HTML string.
+   * @throws {Error} In case of non supported markup.
+   */
+  function setPromotionHtml(el, html) {
+    if (!el) return;
+    el.innerHTML = '';
+    if (!html) return;
+    var tags = ['BR', 'DIV', 'BUTTON', 'SPAN'];
+    var attrs = {
+      class: function(node, value) { return true; },
+      style: function(node, value) { return true; },
+    };
+    try {
+      var fragment = parseHtmlSubset(html, tags, attrs);
+      el.appendChild(fragment);
+    } catch (err) {
+      console.error(err.toString());
+      // Ignore all errors while parsing or setting the element.
     }
   }
 
-  /**
-   * Sets the visibility on all promo-related items as necessary.
-   */
-  function promoSetVisibility() {
-    var mostVisited = $('promo_message_on_most_visited');
-    var openTabs = $('promo_message_on_open_tabs');
-    if (shouldPromoBeShownOnMostVisited()) {
-      mostVisited.style.display = 'block';
-    } else {
-      mostVisited.style.display = 'none';
-    }
-    if (shouldPromoBeShownOnOpenTabs()) {
-      openTabs.style.display = 'block';
-    } else {
-      openTabs.style.display = 'none';
-    }
-  }
-
   /**
    * Called from native.
    * Sets the text for all promo-related items, updates
    * promo-send-email-target items to send email on click and
    * updates the visibility of items.
    * @param {Object} promotions Dictionary used to fill-in the text.
    */
   function setPromotions(promotions) {
-    var mostVisited = $('promo_message_on_most_visited');
-    var openTabs = $('promo_message_on_open_tabs');
-    var syncPromoLegacy = $('promo_message_on_sync_promo_legacy');
-    mostVisited.innerHTML = promotions['promoMessage'];
-    openTabs.innerHTML = promotions['promoMessage'];
-    if (promotions['promoMessageLong']) {
-      syncPromoLegacy.innerHTML = promotions['promoMessageLong'];
-    }
-    promoIsAllowed = promotions['promoIsAllowed'] === true;
+    var mostVisitedEl = $('promo_message_on_most_visited');
+    var openTabsEl = $('promo_message_on_open_tabs');
+    var syncPromoReceivedEl = $('promo_message_on_sync_promo_received');
+
+    promoIsAllowed = promotions.promoIsAllowed === true;

[Dan Beam, 2012/08/30 18:52:26]

!!promotions.promoIsAllowed or Boolean(promotions.promoIsAllowed) unless you
really need to check for type (which I don't think you need to/should,
really...)

[aruslan, 2012/08/30 21:38:17]

Done.

+    promoIsAllowedOnMostVisited =
+        promotions.promoIsAllowedOnMostVisited === true;
+    promoIsAllowedOnOpenTabs = promotions.promoIsAllowedOnOpenTabs === true;
+    promoIsAllowedAsVirtualComputer = promotions.promoIsAllowedAsVC === true;
+
+    setPromotionHtml(mostVisitedEl, promotions.promoMessage);
+    setPromotionHtml(openTabsEl, promotions.promoMessage);
+    setPromotionHtml(syncPromoReceivedEl, promotions.promoMessageLong);
+
+    promoInjectedComputerTitleText = promotions.promoVCTitle || '';
+    promoInjectedComputerLastSyncedText = promotions.promoVCLastSynced || '';
+    var openTabsVCTitleEl = $('promo_vc_title');
+    if (openTabsVCTitleEl)

[Dan Beam, 2012/08/30 18:52:26]

is it valid to not have these elements? if no, I wouldn't guard them with an if,
IMO, as it just hides errors (well, at least while developing I guess...)

[aruslan, 2012/08/30 21:38:17]

Yes, it's valid not to have this element; those that must have been injected or
should be present in HTML go without the guard.

+      openTabsVCTitleEl.textContent = promoInjectedComputerTitleText;
+    var openTabsVCLastSyncEl = $('promo_vc_lastsync');
+    if (openTabsVCLastSyncEl)
+      openTabsVCLastSyncEl.textContent = promoInjectedComputerLastSyncedText;
+
     if (promoIsAllowed) {
-      var promoTargets =
-          document.getElementsByClassName('promo-action-target');
-      for (var i = 0, len = promoTargets.length; i < len; i++) {
-        promoTargets[i].href = 'javascript:void(0)';
-        promoTargets[i].onclick = promoAction;
+      var promoButtonEls =
+          document.getElementsByClassName('promo-button');

[Dan Beam, 2012/08/30 18:52:26]

nit: I prefer document.querySelectorAll('.promo-button') as it's not live (i.e.
it needs to keep track of whether a new node with this class has been added into
the whole document whenever you access this list) and/or do a relative query if
all these are going to be inside a node somewhere (i.e.
rootNode.querySelectorAll())

[aruslan, 2012/08/30 21:38:17]

Good point regarding Selector APIs (couldn't say it's non-controversial).  I
filed a bug (for this and for .hidden vs .style.display) so that we don't forget
to reconsider/fix.

+      for (var i = 0, len = promoButtonEls.length; i < len; i++) {
+        promoButtonEls[i].onclick = executePromoAction;
+        addActiveTouchListener(promoButtonEls[i], 'promo-button-active');
       }
     }
-    promoSetVisibility();
+    updatePromoVisibility();
   }
 
   /**
    * On-click handler for promo email targets.
    * Performs the promo action "send email".
    * @param {Object} evt User interface event that triggered the action.
    */
-  function promoAction(evt) {
+  function executePromoAction(evt) {
     if (evt.preventDefault)
       evt.preventDefault();
     evt.returnValue = false;
     chrome.send('promoActionTriggered');
   }
 
   /**
    * Called by the browser when a context menu has been selected.
    *
    * @param {number} itemId The id of the item that was selected, as specified
@@ skipping 40 matching lines @@
         break;
 
       case ContextMenuItemIds.FOREIGN_SESSIONS_REMOVE:
         if (contextMenuItem != null) {
           chrome.send(
               'deleteForeignSession', [contextMenuItem.sessionTag]);
           chrome.send('getForeignSessions');
         }
         break;
 
+      case ContextMenuItemIds.PROMO_VC_SESSION_REMOVE:
+        chrome.send('promoDisabled');
+        break;
+
       default:
         log.error('Unknown context menu selected id=' + itemId);
         break;
     }
   }
 
   /**
    * Generates the full bookmark folder hierarchy and populates the scrollable
    * title element.
    *
@@ skipping 207 matching lines @@
       syncEnabled = enabled;
 
       if (enabled) {
         if (!localStorage.getItem(SYNC_ENABLED_KEY)) {
           localStorage.setItem(SYNC_ENABLED_KEY, 'true');
           setCurrentBookmarkFolderData('0');
         }
       } else {
         localStorage.removeItem(SYNC_ENABLED_KEY);
       }
+      updatePromoVisibility();
 
       if (bookmarkData) {
         // Bookmark data can now be displayed (or needs to be refiltered)
         bookmarks(bookmarkData);
       }
 
       updateSyncEmptyState();
     } catch (e) {}
   }
 
@@ skipping 59 matching lines @@
     if (!syncEnabled) {
       syncEnableSync.style.display = '-webkit-box';
       centerEmptySections(syncEnableSync);
     } else if (sessionsCount + snapshotsCount == 0) {
       syncPromo.style.display = '-webkit-box';
       centerEmptySections(syncPromo);
     } else {
       openTabsList.style.display = sessionsCount == 0 ? 'none' : 'block';
       snapshotsList.style.display = snapshotsCount == 0 ? 'none' : 'block';
     }
-    promoSetVisibility();
+    updatePromoVisibility();
   }
 
   /**
    * Called externally when updated snapshot data is available.
    *
    * @param {Object} data The snapshot data
    */
   function snapshots(data) {
     var list = findList('snapshots');
     list.innerHTML = '';
@@ skipping 90 matching lines @@
         }, 0);
         expando.className = 'expando closed';
       } else {
         element.style.height = element.expandedHeight;
         expando.className = 'expando open';
       }
     }
   }
 
   /**
+   * Initializes the promo_vc_list div to look like a foreign session
+   * with a desktop.
+   */
+  function createPromoVirtualComputers() {
+    var list = findList('promo_vc');
+    list.innerHTML = '';
+
+    // Set up the container and the "virtual computer" session header.
+    var sessionEl = createDiv();
+    list.appendChild(sessionEl);
+    var sessionHeader = createDiv('session-header');
+    sessionEl.appendChild(sessionHeader);
+
+    // Set up the session children container and the promo as a child.
+    var sessionChildren = createDiv('session-children-container');
+    var promoMessage = createDiv('promo-message');
+    promoMessage.id = 'promo_message_on_open_tabs';
+    sessionChildren.appendChild(promoMessage);
+    sessionEl.appendChild(sessionChildren);
+
+    // Add support for expanding and collapsing the children.
+    var expando = createDiv();
+    var expandoFunction = createExpandoFunction(expando, sessionChildren);
+
+    // Fill-in the contents of the "virtual computer" session header.
+    var headerList = [{
+      'title': promoInjectedComputerTitleText,
+      'titleId': 'promo_vc_title',
+      'userVisibleTimestamp': promoInjectedComputerLastSyncedText,
+      'userVisibleTimestampId': 'promo_vc_lastsync',
+      'iconStyle': 'laptop'
+    }];
+
+    populateData(sessionHeader, SectionType.PROMO_VC_SESSION_HEADER, headerList,
+        makeForeignSessionListEntry, expandoFunction);
+    sessionHeader.appendChild(expando);
+  }
+
+  /**
    * Called externally when updated synced sessions data is available.
    *
    * @param {Object} data The snapshot data
    */
   function setForeignSessions(data, tabSyncEnabled) {
     var list = findList('open_tabs');
     list.innerHTML = '';
 
     currentSessions = data;
     updateSyncEmptyState();
@@ skipping 183 matching lines @@
   /**
    * Finds the list element corresponding to the given name.
    * @param {string} name The name prefix of the DOM element (<prefix>_list).
    * @return {Element} The list element corresponding with the name.
    */
   function findList(name) {
     return $(name + '_list');
   }
 
   /**
-   * Gets the SectionType String from the enum SectionType.
-   */
-  function getSectionTypeString(section) {
-    switch (section) {
-      case SectionType.BOOKMARKS:
-        return 'bookmarks';
-      case SectionType.MOST_VISITED:
-        return 'most_visited';
-      case SectionType.RECENTLY_CLOSED:
-        return 'recently_closed';
-      case SectionType.SYNCED_DEVICES:
-        return 'synced_devices';
-      case SectionType.UNKNOWN:
-      default:
-        return 'unknown';
-    }
-  }
-
-  /**
    * Render the given data into the given list, and hide or show the entire
    * container based on whether there are any elements.  The decorator function
    * is used to create the element to be inserted based on the given data
    * object.
    *
    * @param {holder} The dom element that the generated list items will be put
    *     into.
    * @param {SectionType} section The section that data is for.
    * @param {Object} data The data to be populated.
    * @param {function(Object, boolean)} decorator The function that will
    *     handle decorating each item in the data.
    * @param {function(Object, Object)} opt_clickCallback The function that is
    *     called when the item is clicked.
    */
   function populateData(holder, section, data, decorator,
       opt_clickCallback) {
     // Empty other items in the list, if present.
     holder.innerHTML = '';
     var fragment = document.createDocumentFragment();
     if (!data || data.length == 0) {
       fragment.innerHTML = '';
     } else {
       data.forEach(function(item) {
         var el = decorator(item, opt_clickCallback);
         el.setAttribute(SECTION_KEY, section);
-        el.id = getSectionTypeString(section) + fragment.childNodes.length;
+        el.id = section + fragment.childNodes.length;
         fragment.appendChild(el);
       });
     }
     holder.appendChild(fragment);
     if (holder.classList.contains(GRID_CSS_CLASS))
       centerGrid(holder);
     centerEmptySections(holder);
   }
 
   /**
@@ skipping 465 matching lines @@
       }
       if (contextMenuUrl == null) {
         contextMenuUrl = node.getAttribute(CONTEXT_MENU_URL_KEY);
         contextMenuItem = node.contextMenuItem;
         if (section != SectionType.UNKNOWN)
           break;
       }
       node = node.parentNode;
     }
 
+    var menuOptions;
+
     if (section == SectionType.BOOKMARKS &&
         !contextMenuItem.folder && !isIncognito) {
-      var menuOptions = [
-          [ContextMenuItemIds.BOOKMARK_OPEN_IN_NEW_TAB,
-              templateData.elementopeninnewtab],
-          [ContextMenuItemIds.BOOKMARK_OPEN_IN_INCOGNITO_TAB,
-              templateData.elementopeninincognitotab]];
+      menuOptions = [
+        [
+          ContextMenuItemIds.BOOKMARK_OPEN_IN_NEW_TAB,
+          templateData.elementopeninnewtab
+        ],
+        [
+          ContextMenuItemIds.BOOKMARK_OPEN_IN_INCOGNITO_TAB,
+          templateData.elementopeninincognitotab
+        ]
+      ];
       if (contextMenuItem.editable) {
         menuOptions.push(
             [ContextMenuItemIds.BOOKMARK_EDIT, templateData.bookmarkedit],
             [ContextMenuItemIds.BOOKMARK_DELETE, templateData.bookmarkdelete]);
       }
       if (contextMenuUrl.search('chrome://') == -1 &&
           contextMenuUrl.search('about://') == -1) {
-        menuOptions.push(
-            [ContextMenuItemIds.BOOKMARK_SHORTCUT,
-                templateData.bookmarkshortcut]);
+        menuOptions.push([
+          ContextMenuItemIds.BOOKMARK_SHORTCUT,
+          templateData.bookmarkshortcut
+        ]);
       }
-      chrome.send('showContextMenu', menuOptions);
     } else if (section == SectionType.BOOKMARKS &&
                !contextMenuItem.folder &&
                isIncognito) {
-      chrome.send('showContextMenu', [
-          [ContextMenuItemIds.BOOKMARK_OPEN_IN_INCOGNITO_TAB,
-              templateData.elementopeninincognitotab]
-      ]);
+      menuOptions = [
+        [
+          ContextMenuItemIds.BOOKMARK_OPEN_IN_INCOGNITO_TAB,
+          templateData.elementopeninincognitotab
+        ]
+      ];
     } else if (section == SectionType.BOOKMARKS &&
                contextMenuItem.folder &&
                contextMenuItem.editable &&
                !isIncognito) {
-      chrome.send('showContextMenu', [
-          [ContextMenuItemIds.BOOKMARK_EDIT, templateData.editfolder],
-          [ContextMenuItemIds.BOOKMARK_DELETE, templateData.deletefolder],
-      ]);
+      menuOptions = [
+        [ContextMenuItemIds.BOOKMARK_EDIT, templateData.editfolder],
+        [ContextMenuItemIds.BOOKMARK_DELETE, templateData.deletefolder]
+      ];
     } else if (section == SectionType.MOST_VISITED) {
-      chrome.send('showContextMenu', [
-          [ContextMenuItemIds.MOST_VISITED_OPEN_IN_NEW_TAB,
-              templateData.elementopeninnewtab],
-          [ContextMenuItemIds.MOST_VISITED_OPEN_IN_INCOGNITO_TAB,
-              templateData.elementopeninincognitotab],
-          [ContextMenuItemIds.MOST_VISITED_REMOVE, templateData.elementremove]
-      ]);
+      menuOptions = [
+        [
+          ContextMenuItemIds.MOST_VISITED_OPEN_IN_NEW_TAB,
+          templateData.elementopeninnewtab
+        ],
+        [
+          ContextMenuItemIds.MOST_VISITED_OPEN_IN_INCOGNITO_TAB,
+          templateData.elementopeninincognitotab
+        ],
+        [ContextMenuItemIds.MOST_VISITED_REMOVE, templateData.elementremove]
+      ];
     } else if (section == SectionType.RECENTLY_CLOSED) {
-      chrome.send('showContextMenu', [
-          [ContextMenuItemIds.RECENTLY_CLOSED_OPEN_IN_NEW_TAB,
-              templateData.elementopeninnewtab],
-          [ContextMenuItemIds.RECENTLY_CLOSED_OPEN_IN_INCOGNITO_TAB,
-              templateData.elementopeninincognitotab],
-          [ContextMenuItemIds.RECENTLY_CLOSED_REMOVE,
-              templateData.elementremove]
-      ]);
+      menuOptions = [
+        [
+          ContextMenuItemIds.RECENTLY_CLOSED_OPEN_IN_NEW_TAB,
+          templateData.elementopeninnewtab
+        ],
+        [
+          ContextMenuItemIds.RECENTLY_CLOSED_OPEN_IN_INCOGNITO_TAB,
+          templateData.elementopeninincognitotab
+        ],
+        [
+          ContextMenuItemIds.RECENTLY_CLOSED_REMOVE,
+          templateData.elementremove
+        ]
+      ];
     } else if (section == SectionType.FOREIGN_SESSION_HEADER) {
-      chrome.send('showContextMenu', [
-          [ContextMenuItemIds.FOREIGN_SESSIONS_REMOVE,
-              templateData.elementremove]
-      ]);
+      menuOptions = [
+        [
+          ContextMenuItemIds.FOREIGN_SESSIONS_REMOVE,
+          templateData.elementremove
+        ]
+      ];
+    } else if (section == SectionType.PROMO_VC_SESSION_HEADER) {
+      menuOptions = [
+        [
+          ContextMenuItemIds.PROMO_VC_SESSION_REMOVE,
+          templateData.elementremove
+        ]
+      ];
     }
+
+    if (menuOptions)
+      chrome.send('showContextMenu', menuOptions);
+
     return false;
   }
 
   // Return an object with all the exports
   return {
     bookmarks: bookmarks,
     bookmarkChanged: bookmarkChanged,
-    setForeignSessions: setForeignSessions,
+    clearPromotions: clearPromotions,
     init: init,
     onCustomMenuSelected: onCustomMenuSelected,
     openSection: openSection,
     setFaviconDominantColor: setFaviconDominantColor,
+    setForeignSessions: setForeignSessions,
     setIncognitoMode: setIncognitoMode,
     setMostVisitedPages: setMostVisitedPages,
     setPromotions: setPromotions,
     setRecentlyClosedTabs: setRecentlyClosedTabs,
     setSyncEnabled: setSyncEnabled,
     snapshots: snapshots
   };
 });
 
 /////////////////////////////////////////////////////////////////////////////
@@ skipping 125 matching lines @@
 // NTP Entry point.
 /////////////////////////////////////////////////////////////////////////////
 
 /*
  * Handles initializing the UI when the page has finished loading.
  */
 window.addEventListener('DOMContentLoaded', function(evt) {
   ntp.init();
   $('content-area').style.display = 'block';
 });