Video Player: Remove non-native controls

Remove JS code, CSS style and images used by non-native controls.

Native controls have been enabled by default for a few milestones (since
M73) crbug.com/909963#c7

This CL dead code since the feature flag has been removed: CL:2018089.

Tested manually opening one video as well multiple videos and switching
between them.

Bug: 909963
Change-Id: I3478fb03cb33acff2d58e527af48a31879c37c7c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2362171Reviewed-by: Trent Apted <tapted@chromium.org>
Commit-Queue: Luciano Pacheco <lucmult@chromium.org>
Auto-Submit: Luciano Pacheco <lucmult@chromium.org>
Cr-Commit-Position: refs/heads/master@{#801695}

ui/file_manager/BUILD.gn

@@ -51,7 +51,6 @@ group("closure_compile") {
     "integration_tests:closure_compile",
     "integration_tests/file_manager:closure_compile",
     "video_player/js:closure_compile",
-    "video_player/js/cast:closure_compile",
   ]
 }
 

ui/file_manager/video_player/css/arrow_box.css

@@ -17,8 +17,8 @@
   flex-grow: 1;
 }
 
-#video-player[tools]:not([first-video]) .arrow.left,
-#video-player[tools]:not([last-video]) .arrow.right {
+#video-player:not([first-video]) .arrow.left,
+#video-player:not([last-video]) .arrow.right {
   pointer-events: auto;
 }
 

ui/file_manager/video_player/css/cast_menu.css

-/* Copyright 2014 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. */
-
-.cast-menu {
-  background-color: white;
-  border-radius: 2px;
-  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
-              0 1px 5px 0 rgba(0, 0, 0, 0.12),
-              0 3px 1px -2px rgba(0, 0, 0, 0.2);
-  margin-bottom: 3px;
-  min-width: 120px;
-  outline: none;
-  overflow: hidden;
-  padding: 0 0 7px;
-  position: absolute;
-  z-index: 1000;
-}
-
-.cast-menu:before {
-  -webkit-padding-start: 12px;
-  border-bottom: solid 1px rgb(217, 217, 217);
-  color: rgb(77, 77, 77);
-  content: attr(playon-text);
-  display: block;
-  font-size: 13px;
-  font-weight: 500;
-  margin-bottom: 7px;
-  padding-bottom: 9px;
-  padding-top: 9px;
-}
-
-/* Make the width of the horizontal border one device pixel even on HiDPI.
- * crbug.com/417113. */
-@media (-webkit-min-device-pixel-ratio: 2) {
-  .cast-menu:before {
-    border-bottom: none;
-    background-image: linear-gradient(rgba(217, 217, 217, 1),
-                                      rgba(217, 217, 217, 1),
-                                      rgba(217, 217, 217, 0),
-                                      rgba(217, 217, 217, 0));
-    background-position: bottom;
-    background-size: 100% 1px;
-    background-repeat: no-repeat;
-  }
-}
-
-.cast-menu.hidden {
-  display: none;
-}
-
-.cast-menu > :not(hr) {
-  -webkit-padding-end: 10px;
-  -webkit-padding-start: 36px;
-  color: rgb(51, 51, 51);
-  font-size: 13px;
-  height: 32px;
-  line-height: 32px;
-  text-overflow: ellipsis;
-}
-
-.cast-menu > :not(hr):hover {
-  background-color: rgb(235, 235, 235);
-}
-
-.cast-menu > [checked]:not(hr) {
-  background-image: -webkit-image-set(
-      url(../images/media/media_check.png) 1x,
-      url(../images/media/2x/media_check.png) 2x);
-  background-position: left 10px center;
-  background-repeat: no-repeat;
-}
-
-html[dir='rtl'] .cast-menu > [checked]:not(hr) {
-  background-position: right 10px center;
-}
-
-.cast-menu > [checked]:before {
-  display: none;
-}

ui/file_manager/video_player/css/media_controls.css

-/* Copyright (c) 2012 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. */
-
-/* Common styles for media buttons. */
-
-.media-button {
-  background-position: center;
-  background-repeat: no-repeat;
-  flex: none;
-  height: 32px;
-  position: relative;
-  width: 32px;
-}
-
-.media-button.disabled {
-  background-color: transparent;
-  opacity: 0.26;
-}
-
-.media-button.disabled,
-cr-slider.readonly {
-  pointer-events: none;
-}
-
-/* Media controls in order of appearance. */
-
-/* Play/pause button. */
-
-.media-button.play {
-  background-image: -webkit-image-set(
-    url(../images/media/media_play.png) 1x,
-    url(../images/media/2x/media_play.png) 2x);
-}
-
-.media-button.play[state='playing'] {
-  background-image: -webkit-image-set(
-    url(../images/media/media_pause.png) 1x,
-    url(../images/media/2x/media_pause.png) 2x);
-}
-
-/* Time controls: a slider and a text time display. */
-
-.time-controls {
-  display: flex;
-  flex: auto;
-  height: 100%;
-}
-
-/* Time display. */
-
-.time-controls > .time {
-  cursor: default;
-  display: flex;
-  flex: none;
-  height: 100%;
-  margin: 0 8px;
-  position: relative;
-}
-
-.time-controls > .time.disabled {
-  opacity: 0;
-}
-
-/* Invisible div used to compute the width required for the elapsed time. */
-.time-controls > .time > .spacer {
-  color: transparent;
-}
-
-.time-controls > .time > .current {
-  -webkit-box-align: center;
-  -webkit-box-orient: horizontal;
-  -webkit-box-pack: end;
-  color: rgb(51, 51, 51);
-  display: -webkit-box;
-  height: 100%;
-  position: absolute;
-  right: 0;
-}
-
-/* Progress slider. */
-
-.time-controls > .progress {
-  flex: auto;
-  height: 100%;
-  position: relative;
-}
-
-/* Volume controls: sound button and volume slider */
-
-.volume-controls {
-  display: flex;
-  flex: none;
-  height: 100%;
-  margin: 0 8px;
-}
-
-/* Sound button */
-
-.media-button.sound {
-  background-image: -webkit-image-set(
-    url(../images/media/media_volume.png) 1x,
-    url(../images/media/2x/media_volume.png) 2x);
-}
-
-.media-button.sound[level='0'] {
-  background-image: -webkit-image-set(
-    url(../images/media/media_volume_mute.png) 1x,
-    url(../images/media/2x/media_volume_mute.png) 2x);
-}
-
-/* Volume slider. */
-
-cr-slider.volume {
-  height: 100%;
-  position: relative;
-  width: 110px;
-}
-
-/* Horizontal video control bar, all controls in a row. */
-
-.video-controls {
-  background: rgb(250, 250, 250);
-  display: flex;
-  font-size: 13px;
-  height: 32px;
-  padding: 8px;
-  pointer-events: auto;
-}
-
-/* Cast button. */
-
-.media-button.cast,
-.media-button.cast-button {
-  background-image: -webkit-image-set(
-    url(../images/media/media_chromecast.png) 1x,
-    url(../images/media/2x/media_chromecast.png) 2x);
-  border-radius: 2px;
-  display: none;
-}
-
-/* Reset browser's button style. */
-.media-button.cast {
-  background-color: transparent;
-  border: none;
-  cursor: pointer;
-  outline: none;
-}
-
-#video-player[cast-available][castable] .media-button.cast,
-#video-player[mr-cast-available][castable] .media-button.cast-button {
-  display: block;
-}
-
-#video-player[casting] .media-button.cast,
-#video-player[casting] .media-button.cast-button {
-  background-image: -webkit-image-set(
-    url(../images/media/media_chromecast_casting.png) 1x,
-    url(../images/media/2x/media_chromecast_casting.png) 2x);
-}
-
-.media-button.cast:focus:not(.using-mouse) {
-  box-shadow: 0 0 0 1px rgba(66, 133, 244, 0.5);
-}
-
-/* Fullscreen button. */
-/* There is no final decision whether we need a separate icon when toggled. */
-
-.media-button.fullscreen {
-  background-image: -webkit-image-set(
-    url(../images/media/media_fullscreen.png) 1x,
-    url(../images/media/2x/media_fullscreen.png) 2x);
-}
-
-#controls[fullscreen] .media-button.fullscreen {
-  background-image: -webkit-image-set(
-    url(../images/media/media_fullscreen_exit.png) 1x,
-    url(../images/media/2x/media_fullscreen_exit.png) 2x);
-}
-
-.media-button.subtitles {
-  background-image: -webkit-image-set(
-    url(../images/media/media_subtitles.png) 1x,
-    url(../images/media/2x/media_subtitles.png) 2x);
-}
-
-.media-button.subtitles:not([showing]) {
-  opacity: 0.2;
-}
-
-.media-button.subtitles[unavailable] {
-  display: none;
-}
-
-.playback-state-icon {
-  animation: none;
-  background-position: center center;
-  background-repeat: no-repeat;
-  display: none;
-  height: 32px;
-  left: 50%;
-  margin-left: -16px;
-  margin-top: -16px;
-  opacity: 0;
-  pointer-events: none;
-  position: absolute;
-  top: 50%;
-  width: 32px;
-  z-index: 2;
-}
-
-.text-banner {
-  background-color: black;
-  border-radius: 10px;
-  color: white;
-  display: none;
-  font-size: 18px;
-  left: 50%;
-  margin-left: -250px;
-  opacity: 0;
-  padding: 10px;
-  pointer-events: none;
-  position: absolute;
-  text-align: center;
-  text-shadow: 0 0 10px black;
-  top: 20%;
-  width: 500px;
-  z-index: 2;
-}
-
-.text-banner[visible] {
-  animation: text-banner-blowup 3000ms;
-  display: block;
-}
-
-.playback-state-icon[state] {
-  display: block;
-}
-
-@keyframes blowup {
-  from {
-    opacity: 1;
-  }
-  to {
-    opacity: 0;
-    transform: scale(3);
-  }
-}
-
-@keyframes text-banner-blowup {
-  from {
-    opacity: 0;
-    transform: scale(0.5);
-  }
-  20% {
-    opacity: 0.75;
-    transform: scale(1);
-  }
-  80% {
-    opacity: 0.75;
-    transform: scale(1);
-  }
-  to {
-    opacity: 0;
-    transform: scale(3);
-  }
-}
-
-.playback-state-icon[state='play'] {
-  animation: blowup 500ms;
-  background-image: -webkit-image-set(
-    url(../images/media/media_play_onscreen.png) 1x,
-    url(../images/media/2x/media_play_onscreen.png) 2x);
-}
-
-.playback-state-icon[state='pause'] {
-  animation: blowup 500ms;
-  background-image: -webkit-image-set(
-    url(../images/media/media_pause_onscreen.png) 1x,
-    url(../images/media/2x/media_pause_onscreen.png) 2x);
-}

ui/file_manager/video_player/css/video_player.css

@@ -18,15 +18,6 @@ body {
   width: 100%;
 }
 
-#thumbnail {
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: contain;
-  height: 100%;
-  position: absolute;
-  width: 100%;
-}
-
 #video-container {
   height: 100%;
   left: 0;
@@ -39,31 +30,6 @@ body {
   display: none;
 }
 
-#spinner-container {
-  display: none;
-  height: 100%;
-  left: 0;
-  position: absolute;
-  top: 0;
-  width: 100%;
-}
-
-#video-player[loading] #spinner-container {
-  display: block;
-}
-
-#spinner-container > .spinner {
-  background: url(chrome://resources/images/throbber_medium.svg) center/100%
-      no-repeat;
-  height: 32px;
-  left: 50%;
-  margin-left: -16px;
-  margin-top: -16px;
-  position: absolute;
-  top: 50%;
-  width: 32px;
-}
-
 video {
   height: 100%;
   left: 0;
@@ -80,102 +46,6 @@ video {
   width: 100%;
 }
 
-#video-player:not([casting]) > #cast-container {
-  display: none;
-}
-
-#cast-container {
-  height: 100%;
-  left: 0;
-  position: absolute;
-  top: 0;
-  width: 100%;
-}
-
-#cast-container > #cast-info {
-  background-image: -webkit-image-set(
-      url(../images/100/cast_big.png) 1x,
-      url(../images/200/cast_big.png) 2x);
-  background-position: 0 0;
-  background-repeat: no-repeat;
-  bottom: 70px;
-  height: 38px;
-  left: 40px;
-  opacity: 0.8;
-  padding: 5px 56px;
-  position: absolute;
-  z-index: 10;
-}
-
-#cast-container > #cast-info > .first-line {
-  color: #fff;
-  font-size: 12px;
-  font-weight: bold;
-  line-height: 14px;
-  text-transform: uppercase;
-}
-
-#cast-container > #cast-info > .second-line {
-  color: #fff;
-  font-size: 22px;
-  font-weight: bold;
-  line-height: 24px;
-}
-
-#controls-wrapper {
-  bottom: 0;
-  display: flex;
-  left: 0;
-  position: absolute;
-  right: 0;
-}
-
-#controls {
-  flex: auto;
-}
-
-#video-player:not([tools]):not([casting]) .tool {
-  opacity: 0;
-}
-
-#video-player:not([tools]):not([casting]) {
-  cursor: none;
-}
-
 .tool {
   transition: opacity 180ms linear;
 }
-
-#error-wrapper {
-  -webkit-box-align: center;
-  -webkit-box-orient: horizontal;
-  -webkit-box-pack: center;
-  display: -webkit-box;
-  height: 100%;
-  left: 0;
-  pointer-events: none;
-  position: absolute;
-  top: 0;
-  width: 100%;
-}
-
-#error {
-  -webkit-box-align: center;
-  -webkit-box-orient: horizontal;
-  -webkit-box-pack: center;
-  background-color: rgba(24, 24, 24, 1);
-  background-image: -webkit-image-set(
-      url(../images/100/error.png) 1x,
-      url(../images/200/error.png) 2x);
-  background-position: 25px center;
-  background-repeat: no-repeat;
-  color: white;
-  display: -webkit-box;
-  height: 54px;
-  padding-left: 70px;
-  padding-right: 35px;
-}
-
-#error:not([visible]) {
-  display: none;
-}

ui/file_manager/video_player/js/BUILD.gn

@@ -11,8 +11,6 @@ js_type_check("closure_compile_module") {
     ":background",
     ":closure_compile_externs",
     ":error_util",
-    ":media_controls",
-    ":mouse_inactivity_watcher",
     ":video_player",
     ":video_player_metrics",
     ":video_player_native_controls",
@@ -25,7 +23,6 @@ js_library("closure_compile_externs") {
     "$externs_path/chrome_extensions.js",
     "$externs_path/media_player_private.js",
     "$externs_path/metrics_private.js",
-    "$externs_path/mediasession.js",
     "$externs_path/picture_in_picture.js",
     "//ui/file_manager/externs/chrome_cast.js",
     "//ui/file_manager/externs/platform.js",
@@ -43,17 +40,6 @@ js_library("background") {
 js_library("error_util") {
 }
 
-js_library("media_controls") {
-  deps = [
-    "//ui/file_manager/file_manager/common/js:util",
-    "//ui/webui/resources/cr_elements/cr_slider:cr_slider",
-    "//ui/webui/resources/js/cr/ui:menu_button",
-  ]
-}
-
-js_library("mouse_inactivity_watcher") {
-}
-
 js_library("video_player_native_controls") {
   deps = [
     "//ui/file_manager/base/js:app_util",
@@ -76,14 +62,9 @@ js_unittest("video_player_native_controls_unittest") {
 js_library("video_player") {
   deps = [
     ":error_util",
-    ":media_controls",
-    ":mouse_inactivity_watcher",
     ":video_player_metrics",
     ":video_player_native_controls",
-    "cast:cast_video_element",
-    "cast:media_manager",
     "//ui/file_manager/base/js:filtered_volume_manager",
-    "//ui/file_manager/base/js:mediasession_types",
     "//ui/file_manager/file_manager/common/js:metrics_base",
     "//ui/file_manager/file_manager/common/js:util",
     "//ui/file_manager/image_loader:image_loader_client",

ui/file_manager/video_player/js/cast/BUILD.gn

-# Copyright 2018 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.
-
-import("//third_party/closure_compiler/compile_js.gni")
-
-js_type_check("closure_compile") {
-  deps = [
-    ":cast_extension_discoverer",
-    ":cast_video_element",
-    ":caster",
-    ":closure_compile_externs",
-    ":media_manager",
-  ]
-}
-
-js_library("closure_compile_externs") {
-  sources = []
-  externs_list = [
-    "$externs_path/chrome_extensions.js",
-    "$externs_path/media_player_private.js",
-    "$externs_path/mediasession.js",
-    "//ui/file_manager/externs/background/volume_manager_factory.js",
-    "//ui/file_manager/externs/chrome_cast.js",
-    "//ui/file_manager/externs/platform.js",
-  ]
-}
-
-js_library("cast_extension_discoverer") {
-  deps = [ "//ui/file_manager/video_player/js:error_util" ]
-}
-
-js_library("cast_video_element") {
-  deps = [
-    ":media_manager",
-    "//ui/file_manager/video_player/js:error_util",
-    "//ui/file_manager/video_player/js:video_player_metrics",
-    "//ui/webui/resources/js/cr:event_target",
-  ]
-}
-
-js_library("caster") {
-  deps = [
-    ":cast_extension_discoverer",
-    "//ui/file_manager/video_player/js:video_player",
-  ]
-}
-
-js_library("media_manager") {
-}

ui/file_manager/video_player/js/cast/cast_extension_discoverer.js

-// Copyright 2014 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.
-
-// TODO(crbug.com/689773): Update to use <script>
-
-/**
- * Discover the ID of installed cast extension.
- * @constructor
- * @struct
- */
-function CastExtensionDiscoverer() {}
-
-/**
- * Tentative IDs to try.
- * @type {!Array<string>}
- * @const
- */
-CastExtensionDiscoverer.CAST_EXTENSION_IDS = [
-  'enhhojjnijigcajfphajepfemndkmdlo',  // Media Router Dev
-  'pkedcjkdefgpdelpbcmbmeomcjbeemfm'   // Media Router Stable
-];
-
-/**
- * @param {function(?string)} callback Callback called with the extension ID.
- *     The ID may be null if extension is not found.
- */
-CastExtensionDiscoverer.findInstalledExtension = function(callback) {
-  CastExtensionDiscoverer.findInstalledExtensionHelper_(0, callback);
-};
-
-/**
- * @param {number} index Current index which is tried to check.
- * @param {function(?string)} callback Callback function which will be called
- *     the extension is found.
- * @private
- */
-CastExtensionDiscoverer.findInstalledExtensionHelper_ = function(index,
-    callback) {
-  if (index === CastExtensionDiscoverer.CAST_EXTENSION_IDS.length) {
-    // no extension found.
-    callback(null);
-    return;
-  }
-
-  CastExtensionDiscoverer.isExtensionInstalled_(
-      CastExtensionDiscoverer.CAST_EXTENSION_IDS[index],
-      function(installed) {
-        if (installed) {
-          callback(CastExtensionDiscoverer.CAST_EXTENSION_IDS[index]);
-        } else {
-          CastExtensionDiscoverer.findInstalledExtensionHelper_(index + 1,
-                                                                callback);
-        }
-      });
-};
-
-/**
- * The result will be notified on |callback|. True if installed, false not.
- * @param {string} extensionId Id to be checked.
- * @param {function(boolean)} callback Callback to notify the result.
- * @private
- */
-CastExtensionDiscoverer.isExtensionInstalled_ =
-    function(extensionId, callback) {
-
-  var xhr = new XMLHttpRequest();
-  var url = 'chrome-extension://' + extensionId + '/cast_sender.js';
-  xhr.open('GET', url, true);
-  xhr.onerror = function() {
-    callback(false);
-  };
-  /** @param {*} event */
-  xhr.onreadystatechange = function(event) {
-    if (xhr.readyState == 4 && xhr.status === 200) {
-      // Cast extension found.
-      callback(true);
-    }
-  }.wrap(this);
-  xhr.send();
-};

ui/file_manager/video_player/js/cast/caster.js

-// Copyright 2014 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.
-
-// This hack prevents a bug on the cast extension.
-// TODO(yoshiki): Remove this once the cast extension supports Chrome apps.
-// Although localStorage in Chrome app is not supported, but it's used in the
-// cast extension. This line prevents an exception on using localStorage.
-Object.defineProperty(window, 'localStorage', {
-  get: function() {
-    return {};
-  }
-});
-
-/**
- * @type {string}
- * @const
- */
-var APPLICATION_ID = '4CCB98DA';
-
-if (document.readyState === 'loading') {
-  document.addEventListener('DOMContentLoaded', initialize);
-} else {
-  initialize();
-}
-
-/**
- * Starts initialization of cast-related feature.
- */
-function initialize() {
-  if (window.loadMockCastExtensionForTest) {
-    // If the test flag is set, the mock extension for test will be laoded by
-    // the test script. Sets the handler to wait for loading.
-    onLoadCastSDK(initializeApi);
-    return;
-  }
-
-  CastExtensionDiscoverer.findInstalledExtension(function(foundId) {
-    if (foundId) {
-      loadCastSDK(foundId, initializeApi);
-    } else {
-      console.info('No Google Cast extension is installed.');
-    }
-  }.wrap());
-}
-
-/**
- * Loads the Google Cast Sender SDK from the given cast extension.
- * The given callback is executes after the cast SDK is loaded.
- *
- * @param {string} extensionId ID of the extension to be loaded.
- * @param {function()} callback Callback (executed asynchronously).
- */
-function loadCastSDK(extensionId, callback) {
-  var script = document.createElement('script');
-
-  var onError = function() {
-    script.removeEventListener('error', onError);
-    document.body.removeChild(script);
-    console.error('Google Cast extension load failed.');
-  }.wrap();
-
-  // Load the Cast Sender SDK provided by the given Cast extension.
-  // Legacy Cast extension relies on the extension ID being set by bootstrap
-  // code, so set the ID here.
-  window.chrome['cast'] = window.chrome['cast'] || {};
-  window.chrome['cast']['extensionId'] = extensionId;
-  script.src = 'chrome-extension://' + extensionId + '/cast_sender.js';
-  script.addEventListener('error', onError);
-  script.addEventListener('load', onLoadCastSDK.bind(null, callback));
-  document.body.appendChild(script);
-}
-
-/**
- * Handles load event of Cast SDK and make sure the Cast API is available.
- * @param {function()} callback Callback which is called when the Caset Sender
- *     API is ready for use.
- */
-function onLoadCastSDK(callback) {
-  var executeCallback = function() {
-    setTimeout(callback, 0);  // Runs asynchronously.
-  };
-
-  if(!chrome.cast || !chrome.cast.isAvailable) {
-    var checkTimer = setTimeout(function() {
-      console.error('Either "Google Cast API" or "Google Cast" extension ' +
-                    'seems not to be installed?');
-    }.wrap(), 5000);
-
-    window['__onGCastApiAvailable'] = function(loaded, errorInfo) {
-      clearTimeout(checkTimer);
-
-      if (loaded) {
-        executeCallback();
-      } else {
-        console.error('Google Cast extension load failed.', errorInfo);
-      }
-    }.wrap();
-  } else {
-    // Just executes the callback since the API is already loaded.
-    executeCallback();
-  }
-}
-
-/**
- * Initialize Cast API.
- */
-function initializeApi() {
-  var onSession = function() {
-    // TODO(yoshiki): Implement this.
-  };
-
-  var onInitSuccess = function() {
-    // TODO(yoshiki): Implement this.
-  };
-
-  /**
-   * @param {chrome.cast.Error} error
-   */
-  var onError = function(error) {
-    console.error('Error on Cast initialization.', error);
-  };
-
-  var sessionRequest = new chrome.cast.SessionRequest(APPLICATION_ID);
-  var apiConfig = new chrome.cast.ApiConfig(sessionRequest,
-                                            onSession,
-                                            onReceiver);
-  chrome.cast.initialize(apiConfig, onInitSuccess, onError);
-}
-
-/**
- * Called when receiver availability is changed. This method is also called when
- * initialization is completed.
- *
- * @param {chrome.cast.ReceiverAvailability} availability Availability of casts.
- * @param {Array<Object>} receivers List of casts.
- */
-function onReceiver(availability, receivers) {
-  if (chrome.cast.usingPresentationApi) {
-    player.setCastAvailability(
-        availability === chrome.cast.ReceiverAvailability.AVAILABLE);
-    return;
-  }
-
-  if (availability === chrome.cast.ReceiverAvailability.AVAILABLE) {
-    if (!receivers) {
-      console.error('Receiver list is empty.');
-      receivers = [];
-    }
-
-    metrics.recordNumberOfCastDevices(receivers.length);
-    player.setCastList(receivers);
-  } else if (availability == chrome.cast.ReceiverAvailability.UNAVAILABLE) {
-    metrics.recordNumberOfCastDevices(0);
-    player.setCastList([]);
-  } else {
-    console.error('Unexpected response in onReceiver.', arguments);
-    player.setCastList([]);
-  }
-}

ui/file_manager/video_player/js/cast/media_manager.js

-// Copyright 2014 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.
-
-/**
- * Media manager class.
- * This class supports the information for the media file.
- * @param {!FileEntry} entry Entry of media file. This must be a external entry.
- * @constructor
- */
-function MediaManager(entry) {
-  this.entry_ = entry;
-
-  this.cachedDriveProp_ = null;
-  this.cachedUrl_ = null;
-  this.cachedToken_ = null;
-
-  Object.seal(this);
-}
-
-MediaManager.prototype = {};
-
-/**
- * Checks if the file is available for cast or not.
- *
- * @return {Promise} Promise which is resolved with boolean. If true, the file
- *     is available for cast. False, otherwise.
- */
-MediaManager.prototype.isAvailableForCast = function() {
-  return this.getUrl().then(function(url) {
-    return true;
-  }, function() {
-    return false;
-  });
-};
-
-/**
- * Retrieves the token for cast.
- *
- * @param {boolean} refresh If true, force to refresh a token. If false, use the
- *     cached token if available.
- * @return {Promise} Promise which is resolved with the token. Reject if failed.
- */
-MediaManager.prototype.getToken = function(refresh) {
-  if (chrome.test) {
-    return Promise.resolve('DUMMY_ACCESS_TOKEN');
-  }
-
-  if (this.cachedToken_ && !refresh) {
-    return Promise.resolve(this.cachedToken_);
-  }
-
-  return new Promise(function(fulfill, reject) {
-    // TODO(yoshiki): Creates the method to get a token and use it.
-    chrome.fileManagerPrivate.getDownloadUrl(this.entry_, fulfill);
-  }.bind(this)).then(function(url) {
-    if (chrome.runtime.lastError) {
-      return Promise.reject(
-          'Token fetch failed: ' + chrome.runtime.lastError.message);
-    }
-    if (!url) {
-      return Promise.reject('Token fetch failed.');
-    }
-    var index = url.indexOf('access_token=');
-    var token = url.substring(index + 13);
-    if (index > 0 && token) {
-      this.cachedToken_ = token;
-      return token;
-    } else {
-      return Promise.reject('Token fetch failed.');
-    }
-  }.bind(this));
-};
-
-/**
- * Retrieves the url for cast.
- *
- * @return {Promise} Promise which is resolved with the url. Reject if failed.
- */
-MediaManager.prototype.getUrl = function() {
-  if (chrome.test) {
-    return Promise.resolve('http://example.com/dummy_url.mp4');
-  }
-
-  if (this.cachedUrl_) {
-    return Promise.resolve(this.cachedUrl_);
-  }
-
-  return new Promise(function(fulfill, reject) {
-    // TODO(yoshiki): Creates the method to get a url and use it.
-    chrome.fileManagerPrivate.getDownloadUrl(this.entry_, fulfill);
-  }.bind(this)).then(function(url) {
-    if (chrome.runtime.lastError) {
-      return Promise.reject(
-          'URL fetch failed: ' + chrome.runtime.lastError.message);
-    }
-    if (!url) {
-      return Promise.reject('URL fetch failed.');
-    }
-    var accessTokenIndex = url.indexOf('access_token=');
-    if (accessTokenIndex) {
-      url = url.substring(0, accessTokenIndex - 1);
-    }
-    this.cachedUrl_ = url;
-    return url;
-  }.bind(this));
-};
-
-/**
- * Retrieves the mime of file.
- *
- * @return {Promise} Promise which is resolved with the mime. Reject if failed.
- */
-MediaManager.prototype.getMime = function() {
-  if (this.cachedDriveProp_) {
-    return Promise.resolve(this.cachedDriveProp_.contentMimeType || '');
-  }
-
-  return new Promise(function(fulfill, reject) {
-    chrome.fileManagerPrivate.getEntryProperties(
-        [this.entry_], ['contentMimeType', 'thumbnailUrl'], fulfill);
-  }.bind(this)).then(function(props) {
-    if (!props || !props[0]) {
-      return Promise.reject('Mime fetch failed.');
-    } else if (!props[0].contentMimeType) {
-      // TODO(yoshiki): Adds a logic to guess the mime.
-      this.cachedDriveProp_ = props[0];
-      return '';
-    } else {
-      this.cachedDriveProp_ = props[0];
-      return props[0].contentMimeType;
-    }
-  }.bind(this));
-};
-
-/**
- * Retrieves the thumbnail url of file.
- *
- * @return {Promise} Promise which is resolved with the url. Reject if failed.
- */
-MediaManager.prototype.getThumbnail = function() {
-  if (this.cachedDriveProp_) {
-    return Promise.resolve(this.cachedDriveProp_.thumbnailUrl || '');
-  }
-
-  return new Promise(function(fulfill, reject) {
-    chrome.fileManagerPrivate.getEntryProperties(
-        [this.entry_], ['contentMimeType', 'thumbnailUrl'], fulfill);
-  }.bind(this)).then(function(props) {
-    if (!props || !props[0]) {
-      return Promise.reject('Thumbnail fetch failed.');
-    } else {
-      this.cachedDriveProp_ = props[0];
-      return props[0].thumbnailUrl || '';
-    }
-  }.bind(this));
-};

ui/file_manager/video_player/js/mouse_inactivity_watcher.js

-// Copyright (c) 2014 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.
-
-/**
- * A controller class detects mouse inactivity and hides "tool" elements.
- *
- * @param {Element} container The main DOM container.
- * @param {number=} opt_timeout Hide timeout in ms.
- * @param {function():boolean=} opt_toolsActive Function that returns |true|
- *     if the tools are active and should not be hidden.
- * @constructor
- */
-function MouseInactivityWatcher(container, opt_timeout, opt_toolsActive) {
-  this.container_ = container;
-  this.timeout_ = opt_timeout || MouseInactivityWatcher.DEFAULT_TIMEOUT;
-  this.toolsActive_ = opt_toolsActive || function() {
-    return false;
-  };
-
-  this.onTimeoutBound_ = this.onTimeout_.bind(this);
-  this.timeoutID_ = null;
-  this.mouseOverTool_ = false;
-
-  this.clientX_ = 0;
-  this.clientY_ = 0;
-
-  /**
-   * Indicates if the inactivity watcher is enabled or disabled. Use getters
-   * and setters.
-   * @type {boolean}
-   * @private
-   */
-  this.disabled_ = false;
-
-  this.container_.addEventListener('mousemove', this.onMouseMove_.bind(this));
-  var tools = this.container_.querySelector('.tool');
-  for (var i = 0; i < tools.length; i++) {
-    tools[i].addEventListener('mouseover', this.onToolMouseOver_.bind(this));
-    tools[i].addEventListener('mouseout', this.onToolMouseOut_.bind(this));
-  }
-
-  // Show tools when the user touches the screen.
-  this.container_.addEventListener(
-      'touchstart', this.activityStarted_.bind(this));
-  var initiateFading = this.activityStopped_.bind(this, this.timeout_);
-  this.container_.addEventListener('touchend', initiateFading);
-  this.container_.addEventListener('touchcancel', initiateFading);
-  this.container_.addEventListener('focusin', function() {
-    this.activityStarted_();
-    this.activityStopped_();
-  }.bind(this));
-  // If pointer goes outside the app window, tools should be hidden immediately.
-  document.addEventListener('mouseout', function(event) {
-    if (event.relatedTarget === null) {
-      this.forceTimeout_();
-    }
-  }.bind(this));
-}
-
-/**
- * Default inactivity timeout.
- */
-MouseInactivityWatcher.DEFAULT_TIMEOUT = 3000;
-
-/**
- * Defines getter/setter for disabled property to update inactivity state.
- */
-MouseInactivityWatcher.prototype = {
-  /**
-   * @return {boolean}
-   */
-  get disabled() {
-    return this.disabled_;
-  },
-
-  /**
-   * @param {boolean} value
-   */
-  set disabled(value) {
-    this.disabled_ = value;
-    if (value) {
-      this.kick();
-    } else {
-      this.check();
-    }
-  }
-};
-
-/**
- * @param {boolean} on True if show, false if hide.
- */
-MouseInactivityWatcher.prototype.showTools = function(on) {
-  if (on) {
-    this.container_.setAttribute('tools', 'true');
-  } else {
-    this.container_.removeAttribute('tools');
-  }
-};
-
-/**
- * To be called when the user started activity. Shows the tools
- * and cancels the countdown.
- * @private
- */
-MouseInactivityWatcher.prototype.activityStarted_ = function() {
-  this.showTools(true);
-
-  if (this.timeoutID_) {
-    clearTimeout(this.timeoutID_);
-    this.timeoutID_ = null;
-  }
-};
-
-/**
- * Called when user activity has stopped. Re-starts the countdown.
- * @param {number=} opt_timeout Timeout.
- * @private
- */
-MouseInactivityWatcher.prototype.activityStopped_ = function(opt_timeout) {
-  if (this.disabled_ || this.mouseOverTool_ || this.toolsActive_()) {
-    return;
-  }
-
-  if (this.timeoutID_) {
-    clearTimeout(this.timeoutID_);
-  }
-
-  this.timeoutID_ =
-      setTimeout(this.onTimeoutBound_, opt_timeout || this.timeout_);
-};
-
-/**
- * Called when a user performed a short action (such as a click or a key press)
- * that should show the tools if they are not visible.
- * @param {number=} opt_timeout Timeout.
- */
-MouseInactivityWatcher.prototype.kick = function(opt_timeout) {
-  this.activityStarted_();
-  this.activityStopped_(opt_timeout);
-};
-
-/**
- * Check if the tools are active and update the tools visibility accordingly.
- */
-MouseInactivityWatcher.prototype.check = function() {
-  if (this.toolsActive_()) {
-    this.activityStarted_();
-  } else {
-    this.activityStopped_();
-  }
-};
-
-/**
- * Mouse move handler.
- *
- * @param {Event} e Event.
- * @private
- */
-MouseInactivityWatcher.prototype.onMouseMove_ = function(e) {
-  if (this.clientX_ == e.clientX && this.clientY_ == e.clientY) {
-    // The mouse has not moved, must be the cursor change triggered by
-    // some of the attributes on the root container. Ignore the event.
-    return;
-  }
-  this.clientX_ = e.clientX;
-  this.clientY_ = e.clientY;
-
-  if (this.disabled_) {
-    return;
-  }
-
-  this.kick();
-};
-
-/**
- * Mouse over handler on a tool element.
- *
- * @param {Event} e Event.
- * @private
- */
-MouseInactivityWatcher.prototype.onToolMouseOver_ = function(e) {
-  this.mouseOverTool_ = true;
-  if (!this.disabled_) {
-    this.kick();
-  }
-};
-
-/**
- * Mouse out handler on a tool element.
- *
- * @param {Event} e Event.
- * @private
- */
-MouseInactivityWatcher.prototype.onToolMouseOut_ = function(e) {
-  this.mouseOverTool_ = false;
-  if (!this.disabled_) {
-    this.kick();
-  }
-};
-
-/**
- * Timeout handler.
- * @private
- */
-MouseInactivityWatcher.prototype.onTimeout_ = function() {
-  this.timeoutID_ = null;
-  if (!this.disabled_ && !this.toolsActive_()) {
-    this.showTools(false);
-  }
-};
-
-/**
- * Force the timer to be timed out immediately.
- * @private
- */
-MouseInactivityWatcher.prototype.forceTimeout_ = function() {
-  if (this.timeoutID_) {
-    clearTimeout(this.timeoutID_);
-    this.onTimeout_();
-  }
-};

ui/file_manager/video_player/js/video_player_native_controls.js

@@ -44,13 +44,6 @@ class NativeControlsVideoPlayer {
     this.videoElement_.style.pointerEvents = 'auto';
     getRequiredElement('video-container').appendChild(this.videoElement_);
 
-    // TODO: remove the element in html when remove the feature flag
-    getRequiredElement('controls-wrapper').style.display = 'none';
-    getRequiredElement('spinner-container').style.display = 'none';
-    getRequiredElement('error-wrapper').style.display = 'none';
-    getRequiredElement('thumbnail').style.display = 'none';
-    getRequiredElement('cast-container').style.display = 'none';
-
     this.videoElement_.addEventListener('pause', this.onPause_.bind(this));
 
     // Restore playback position when duration change.

ui/file_manager/video_player/js/video_player_scripts.js

@@ -27,12 +27,6 @@
 // <include src="../../../webui/resources/js/cr/event_target.js">
 
 // <include src="../../../webui/resources/js/cr/ui/array_data_model.js">
-// <include src="../../../webui/resources/js/cr/ui/position_util.js">
-// <include src="../../../webui/resources/js/cr/ui/menu_item.js">
-// <include src="../../../webui/resources/js/cr/ui/menu.js">
-// <include src="../../../webui/resources/js/cr/ui/menu_button.js">
-// <include src="../../../webui/resources/js/cr/ui/context_menu_handler.js">
-
 (function() {
 'use strict';
 
@@ -46,18 +40,9 @@
 /* TODO(tapted): Remove the util.js dependency */
 // <include src="../../file_manager/common/js/util.js">
 
-// <include src="../../base/js/mediasession_types.js">
 // <include src="../../base/js/volume_manager_types.js">
 // <include src="../../base/js/filtered_volume_manager.js">
 
-// <include src="cast/cast_extension_discoverer.js">
-// <include src="cast/cast_video_element.js">
-// <include src="cast/media_manager.js">
-// <include src="cast/caster.js">
-
-// <include src="media_controls.js">
-// <include src="mouse_inactivity_watcher.js">
-
 // <include src="video_player_native_controls.js">
 // <include src="video_player.js">
 

ui/file_manager/video_player/video_player.html

@@ -9,15 +9,10 @@
   <title>#xFEFF;</title>
   <script src="chrome://resources/polymer/v1_0/html-imports/html-imports.min.js"></script>
   <link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
-  <link rel="stylesheet" type="text/css" href="css/media_controls.css">
-  <link rel="stylesheet" href="chrome://resources/css/menu.css">
 
   <link rel="stylesheet" type="text/css" href="css/video_player.css">
   <link rel="stylesheet" type="text/css" href="css/arrow_box.css">
-  <link rel="stylesheet" type="text/css" href="css/cast_menu.css">
 
-  <link rel="import" href="chrome-extension://hhaomjibdihmijegdhdafkllkbggdgoj/foreground/elements/files_icon_button.html">
-  <link rel="import" href="chrome://resources/cr_elements/cr_slider/cr_slider.html">
   <link rel="import" href="chrome://resources/cr_elements/cr_toast/cr_toast.html">
 
   <script src="js/video_player_scripts.js"></script>
@@ -25,18 +20,6 @@
 <body>
   <custom-style>
     <style>
-      files-icon-button {
-        --files-ripple-bg-color: black;
-        --files-toggle-ripple-bg-color: black;
-        --files-toggle-ripple-activated-bg-color: black;
-      }
-
-      cr-slider {
-        cursor: pointer;
-
-        --cr-slider-knob-color-rgb: 64, 138, 241;
-        --cr-slider-active-color: rgb(66, 133, 244);
-      }
 
       /* Let cr-toast appear at top left corner */
       cr-toast {
@@ -51,36 +34,17 @@
 
     </style>
   </custom-style>
-  <div id="video-player" tools>
+  <div id="video-player">
     <cr-toast id="toast" duration="3000">
       <div id="toast-content"></div>
     </cr-toast>
-    <cr-menu id='cast-menu' class='cast-menu tool'
-          i18n-values="playon-text:VIDEO_PLAYER_PLAY_ON"></cr-menu>
-    <div id="cast-container">
-      <div id="cast-info">
-        <div class="first-line" id='cast-name-label'
-             i18n-content="VIDEO_PLAYER_PLAYING_ON"></div>
-        <div class="second-line" id="cast-name"></div>
-      </div>
-    </div>
-    <div id="thumbnail"></div>
     <div id="video-container">
     </div>
-    <div id="spinner-container">
-      <div class="spinner"></div>
-    </div>
-    <div id="controls-wrapper">
-      <div id="controls" class="tool"></div>
-    </div>
     <div class="arrow-box">
       <div class="arrow left tool"><div></div></div>
       <div class="arrow-spacer"></div>
       <div class="arrow right tool"><div></div></div>
     </div>
-    <div id="error-wrapper">
-      <div id="error"></div>
-    </div>
   </div>
 </body>
 </html>