chrome/browser/resources/security_warnings/interstitial_v2_mobile.js

   1 // Copyright 2015 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 var mobileNav = false;
   6
   7 /**
   8  * For small screen mobile the navigation buttons are moved
   9  * below the advanced text.
  10  */
  11 function onResize() {
  12   var helpOuterBox = document.querySelector('#details');
  13   var mainContent = document.querySelector('#main-content');
  14   var mediaQuery = '(min-width: 240px) and (max-width: 420px) and ' +
  15       '(max-height: 736px) and (min-height: 401px) and ' +
  16       '(orientation: portrait), (max-width: 736px) and ' +
  17       '(max-height: 420px) and (min-height: 240px) and ' +
  18       '(min-width: 421px) and (orientation: landscape)';
  19
  20   var detailsHidden = helpOuterBox.classList.contains('hidden');
  21   var runnerContainer = document.querySelector('.runner-container');
  22
  23   // Check for change in nav status.
  24   if (mobileNav != window.matchMedia(mediaQuery).matches) {
  25     mobileNav = !mobileNav;
  26
  27     // Handle showing the top content / details sections according to state.
  28     if (mobileNav) {
  29       mainContent.classList.toggle('hidden', !detailsHidden);
  30       helpOuterBox.classList.toggle('hidden', detailsHidden);
  31       if (runnerContainer) {
  32         runnerContainer.classList.toggle('hidden', !detailsHidden);
  33       }
  34     } else if (!detailsHidden) {
  35       // Non mobile nav with visible details.
  36       mainContent.classList.remove('hidden');
  37       helpOuterBox.classList.remove('hidden');
  38       if (runnerContainer) {
  39         runnerContainer.classList.remove('hidden');
  40       }
  41     }
  42   }
  43 }
  44
  45 function setupMobileNav() {
  46   window.addEventListener('resize', onResize);
  47   onResize();
  48 }
  49
  50 document.addEventListener('DOMContentLoaded', setupMobileNav);