Add download button to MediaDocument on Android.

third_party/WebKit/Source/core/html/MediaDocument.cpp

 /*
  * Copyright (C) 2008 Apple Inc. All Rights Reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
@@ skipping 13 matching lines @@
  */
 
 #include "core/html/MediaDocument.h"
 
 #include "bindings/core/v8/ExceptionStatePlaceholder.h"
 #include "core/HTMLNames.h"
 #include "core/dom/ElementTraversal.h"
 #include "core/dom/RawDataDocumentParser.h"
 #include "core/events/KeyboardEvent.h"
 #include "core/frame/LocalFrame.h"
+#include "core/html/HTMLAnchorElement.h"
 #include "core/html/HTMLBodyElement.h"
+#include "core/html/HTMLDivElement.h"
 #include "core/html/HTMLHeadElement.h"
 #include "core/html/HTMLHtmlElement.h"
 #include "core/html/HTMLMetaElement.h"
 #include "core/html/HTMLSourceElement.h"
+#include "core/html/HTMLStyleElement.h"
 #include "core/html/HTMLVideoElement.h"
 #include "core/loader/DocumentLoader.h"
 #include "core/loader/FrameLoader.h"
 #include "core/loader/FrameLoaderClient.h"
 #include "platform/KeyboardCodes.h"
+#include "platform/text/PlatformLocale.h"
 
 namespace blink {
 
 using namespace HTMLNames;
 
 // FIXME: Share more code with PluginDocumentParser.
 class MediaDocumentParser : public RawDataDocumentParser {
 public:
     static PassRefPtrWillBeRawPtr<MediaDocumentParser> create(MediaDocument* document)
     {
@@ skipping 37 matching lines @@
 
     RefPtrWillBeRawPtr<HTMLSourceElement> source = HTMLSourceElement::create(*document());
     source->setSrc(document()->url());
 
     if (DocumentLoader* loader = document()->loader())
         source->setType(loader->responseMIMEType());
 
     media->appendChild(source.release());
 
     RefPtrWillBeRawPtr<HTMLBodyElement> body = HTMLBodyElement::create(*document());
-    body->appendChild(media.release());
 
+    RefPtrWillBeRawPtr<HTMLDivElement> div = HTMLDivElement::create(*document());
+    div->setAttribute(idAttr, "container");
+
+    // Style sheets for media controls are lazily loaded until a media element is encountered.
+    // As a result, elements encountered before the media element will not get the right
+    // style at first if we put the styles in mediacontrols.css. To solve this issue, set the
+    // styles inline so that they will be applied when the page loads.
+    RefPtrWillBeRawPtr<HTMLStyleElement> style = HTMLStyleElement::create(*document(), false);
+    StringBuilder styleContent;
+    // See w3c example on how to centering an element: https://www.w3.org/Style/Examples/007/center.en.html
+    styleContent.append(
+        "#container {"
+        "max-height: 100%;"
+        "max-width: 100%;"
+        "position: absolute;"
+        "top: 50%;"
+        "left: 50%;"
+        "margin-right: -50%;"
+        "transform: translate(-50%, -50%);"
+        "}\n");
+
+    if (RuntimeEnabledFeatures::mediaDocumentDownloadButtonEnabled()) {
+        // Padding is used to compensate for the height of the download button so that the media element can still be centered.
+        RefPtrWillBeRawPtr<HTMLDivElement> padding = HTMLDivElement::create(*document());
+        padding->setAttribute(heightAttr, "68px;");

[esprehn, 2016/03/22 18:11:21]

please don't add spacer divs, I think you want to add margins or padding to some
element?

[qinmin, 2016/03/24 18:51:19]

Switched to use ojan's flex trick.

+        div->appendChild(padding.release());
+    }
+
+    div->appendChild(media.release());
+
+    if (RuntimeEnabledFeatures::mediaDocumentDownloadButtonEnabled()) {
+        RefPtrWillBeRawPtr<HTMLAnchorElement> anchor = HTMLAnchorElement::create(*document());
+        anchor->setAttribute(downloadAttr, "");
+        anchor->setURL(document()->url());
+        anchor->setTextContent(document()->getCachedLocale(document()->contentLanguage()).queryString(WebLocalizedString::DownloadButtonLabel));
+        anchor->setAttribute(idAttr, "download");
+        // Using CSS style according to Android material design.
+        styleContent.append(
+            "#download {"
+            "display: block;"

[ojan, 2016/03/22 20:13:39]

Use an inline-block instead. Then you won't need to set width. It will just size
to the content.

[qinmin, 2016/03/24 18:51:19]

inline-block will append the anchor element to the right side of the video
element, instead of beneath it.
put the anchor element inside a div element and append it to the outer
container.

+            "width: 120px;"

[ojan, 2016/03/22 20:13:39]

I don't think you want to set an explicit width and height. It won't work well
for when the "Download" string is translated to different languages. Instead,
use CSS padding.

[qinmin, 2016/03/24 18:51:19]

Done.

+            "height: 36px;"
+            "background: #4285F4;"
+            "font-family: Roboto;"
+            "font-size: 14px;"
+            "border-radius: 5px;"
+            "color: white;"
+            "font-weight: bold;"
+            "text-decoration: none;"
+            "text-transform: uppercase;"

[ojan, 2016/03/22 20:13:39]

Don't use text-transform to uppercase it. It's much slower. If you want an
uppercased string, just make it uppercased before you call setTextContent.

[qinmin, 2016/03/24 18:51:19]

Done.

+            "text-align: center;"
+            "line-height: 36px;"

[ojan, 2016/03/22 20:13:39]

You shouldn't need to set line-height. 

[qinmin, 2016/03/24 18:51:19]

Android material design uses 36px for button height. Apply padding will make it
hard to control the actual button height.So use line-height here to vertically
center the button label.

+            "margin: 32px auto 0 auto;"
+            "}");
+        div->appendChild(anchor.release());
+    }
+
+    body->appendChild(div.release());
+
+    style->setTextContent(styleContent.toString());
+    head->appendChild(style.release());
     rootElement->appendChild(head.release());
     rootElement->appendChild(body.release());
 
     m_didBuildDocumentStructure = true;
 }
 
 void MediaDocumentParser::appendBytes(const char*, size_t)
 {
     if (m_didBuildDocumentStructure)
         return;
@@ skipping 32 matching lines @@
         KeyboardEvent* keyboardEvent = toKeyboardEvent(event);
         if (keyboardEvent->keyIdentifier() == "U+0020" || keyboardEvent->keyCode() == VKEY_MEDIA_PLAY_PAUSE) {
             // space or media key (play/pause)
             video->togglePlayState();
             event->setDefaultHandled();
         }
     }
 }
 
 } // namespace blink