Media Remoting: Add interstitial elements to media element shadow dom.

third_party/WebKit/Source/core/html/shadow/MediaRemotingElements.cpp

+// Copyright 2017 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.
+
+#include "core/html/shadow/MediaRemotingElements.h"
+
+#include "core/InputTypeNames.h"
+#include "core/dom/ClientRect.h"
+#include "core/dom/Text.h"
+#include "core/dom/shadow/ShadowRoot.h"
+#include "core/events/MouseEvent.h"
+#include "core/html/HTMLVideoElement.h"
+#include "core/input/EventHandler.h"
+#include "platform/text/PlatformLocale.h"
+#include "public/platform/Platform.h"
+#include "public/platform/WebLocalizedString.h"
+
+namespace blink {
+
+using namespace HTMLNames;
+
+class MediaRemotingDisableButtonElement::MouseEventsListener final
+    : public EventListener {
+ public:
+  explicit MouseEventsListener(MediaRemotingDisableButtonElement& element)
+      : EventListener(CPPEventListenerType), m_element(element) {}
+
+  bool operator==(const EventListener& other) const override {
+    return this == &other;
+  }
+
+  void trace(blink::Visitor* visitor) {
+    visitor->trace(m_element);
+    EventListener::trace(visitor);
+  }
+
+ private:
+  void handleEvent(ExecutionContext* context, Event* event) override {
+    DCHECK(event->type() == EventTypeNames::click);
+
+    MouseEvent* mouseEvent = toMouseEvent(event);
+    ClientRect* clientRect = m_element->getBoundingClientRect();
+    const double x = mouseEvent->x();
+    const double y = mouseEvent->y();
+    if (x < clientRect->left() || x > clientRect->right() ||
+        y < clientRect->top() || y > clientRect->bottom())
+      return;
+
+    m_element->videoElement().disableMediaRemoting();
+    event->setDefaultHandled();
+    event->stopPropagation();
+    m_element->document().removeEventListener(EventTypeNames::click, this,
+                                              true);
+  }
+
+  Member<MediaRemotingDisableButtonElement> m_element;
+};
+
+MediaRemotingDisableButtonElement::MediaRemotingDisableButtonElement(
+    MediaRemotingInterstitialElements& interstitialElements)
+    : HTMLInputElement(interstitialElements.document(), false),
+      m_interstitialElements(interstitialElements) {
+  m_listener = new MouseEventsListener(*this);
+  ensureUserAgentShadowRoot();
+  setType(InputTypeNames::text);

[mlamouri (slow - plz ping), 2017/04/10 13:44:22]

Why text instead of button?

[xjz, 2017/04/11 04:29:44]

I did try button type at first, but the css didn't work properly for button
type. The border lines were not shown and the text was not in the center. So I
used text here because it functions and by design this button only has a text on
and no background png. Is there a difference between using button and using text
here? If not big difference, can we use text for now? And the style might get
changed later since the UX designer is waiting for this patch landed to check
for adjustments before M59. WDYT? 

[xjz, 2017/04/13 00:08:48]

After a chat with miu@, we decide to use a div element for this button instead
of a HTMLInputElement. PTAL.

+  setValue(interstitialElements.videoElement().locale().queryString(
+      WebLocalizedString::MediaRemotingDisableText));
+  setShadowPseudoId(AtomicString("-internal-media-remoting-disable-button"));
+}
+
+void MediaRemotingDisableButtonElement::onShown() {
+  document().addEventListener(EventTypeNames::click, m_listener, true);
+}
+
+void MediaRemotingDisableButtonElement::onHidden() {
+  document().removeEventListener(EventTypeNames::click, m_listener, true);
+}
+
+HTMLVideoElement& MediaRemotingDisableButtonElement::videoElement() const {
+  return m_interstitialElements->videoElement();
+}
+
+DEFINE_TRACE(MediaRemotingDisableButtonElement) {
+  visitor->trace(m_interstitialElements);
+  visitor->trace(m_listener);
+  HTMLInputElement::trace(visitor);
+}
+
+// ----------------------------
+
+MediaRemotingCastIconElement::MediaRemotingCastIconElement(
+    MediaRemotingInterstitialElements& remotingInterstitial)
+    : HTMLInputElement(remotingInterstitial.document(), false) {
+  ensureUserAgentShadowRoot();
+  setType(InputTypeNames::button);
+  setShadowPseudoId(AtomicString("-internal-media-remoting-cast-icon"));
+}
+
+// ----------------------------
+
+MediaRemotingBackgroundImageElement::MediaRemotingBackgroundImageElement(
+    MediaRemotingInterstitial& remotingInterstitial)
+    : HTMLInputElement(remotingInterstitial.document(), false),
+      m_interstitial(remotingInterstitial) {
+  ensureUserAgentShadowRoot();
+  setType(InputTypeNames::image);
+  setShadowPseudoId(AtomicString("-internal-media-remoting-background-image"));
+  const AtomicString& posterUrl =
+      m_interstitial->videoElement().getAttribute(posterAttr);
+  if (posterUrl.isEmpty())
+    hide();
+  else
+    setAttribute(srcAttr, posterUrl);
+}
+
+void MediaRemotingBackgroundImageElement::show() {
+  removeInlineStyleProperty(CSSPropertyDisplay);
+}
+
+void MediaRemotingBackgroundImageElement::hide() {
+  setInlineStyleProperty(CSSPropertyDisplay, CSSValueNone);
+}
+
+void MediaRemotingBackgroundImageElement::onPosterImageChanged() {
+  const AtomicString& posterUrl =
+      m_interstitial->videoElement().getAttribute(posterAttr);
+  if (posterUrl.isEmpty()) {
+    hide();
+  } else {
+    setAttribute(srcAttr, posterUrl);
+    if (m_interstitial->shouldShow()) {
+      hide();
+      show();

[mlamouri (slow - plz ping), 2017/04/10 13:44:22]

Did you mean to just call show()?

Though, it sounds a bit weird that the poster image is checking with
m_interstitial whether it should be visible. It's its parent so it should likely
be notified, right?

[xjz, 2017/04/11 04:29:44]

Removed. Thanks! :)

+    }
+  }
+}
+
+DEFINE_TRACE(MediaRemotingBackgroundImageElement) {
+  visitor->trace(m_interstitial);
+  HTMLInputElement::trace(visitor);
+}
+
+}  // namespace blink