From 2d693a8c9446c08818bae52fd830252235fbfaaa Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Thu, 21 Nov 2019 16:54:30 -0800 Subject: [PATCH 01/59] add brave://flags overriding infrastructure --- chromium_src/chrome/browser/about_flags.cc | 2 ++ chromium_src/chrome/browser/flag_descriptions.cc | 9 +++++++++ chromium_src/chrome/browser/flag_descriptions.h | 14 ++++++++++++++ chromium_src/chrome/common/chrome_features.cc | 9 +++++++++ chromium_src/chrome/common/chrome_features.h | 14 ++++++++++++++ patches/chrome-browser-about_flags.cc.patch | 8 ++++++++ 6 files changed, 56 insertions(+) create mode 100644 chromium_src/chrome/browser/flag_descriptions.cc create mode 100644 chromium_src/chrome/browser/flag_descriptions.h create mode 100644 chromium_src/chrome/common/chrome_features.cc create mode 100644 chromium_src/chrome/common/chrome_features.h diff --git a/chromium_src/chrome/browser/about_flags.cc b/chromium_src/chrome/browser/about_flags.cc index e910bb11f61f..ca3e0d9fbb3d 100644 --- a/chromium_src/chrome/browser/about_flags.cc +++ b/chromium_src/chrome/browser/about_flags.cc @@ -3,6 +3,8 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this file, * You can obtain one at http://mozilla.org/MPL/2.0/. */ +#define BRAVE_FEATURE_ENTRIES ; + #define SetFeatureEntryEnabled SetFeatureEntryEnabled_ChromiumImpl #include "../../../../chrome/browser/about_flags.cc" // NOLINT #include "../../../../components/flags_ui/flags_state.cc" // NOLINT diff --git a/chromium_src/chrome/browser/flag_descriptions.cc b/chromium_src/chrome/browser/flag_descriptions.cc new file mode 100644 index 000000000000..5d973333d229 --- /dev/null +++ b/chromium_src/chrome/browser/flag_descriptions.cc @@ -0,0 +1,9 @@ +/* Copyright (c) 2019 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +#include "../../../../chrome/browser/flag_descriptions.cc" + +namespace flag_descriptions { +} diff --git a/chromium_src/chrome/browser/flag_descriptions.h b/chromium_src/chrome/browser/flag_descriptions.h new file mode 100644 index 000000000000..931ec158ddb8 --- /dev/null +++ b/chromium_src/chrome/browser/flag_descriptions.h @@ -0,0 +1,14 @@ +/* Copyright (c) 2019 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +#ifndef BRAVE_CHROMIUM_SRC_CHROME_BROWSER_FLAG_DESCRIPTIONS_H_ +#define BRAVE_CHROMIUM_SRC_CHROME_BROWSER_FLAG_DESCRIPTIONS_H_ + +#include "../../../../chrome/browser/flag_descriptions.h" + +namespace flag_descriptions { +} + +#endif // BRAVE_CHROMIUM_SRC_CHROME_BROWSER_FLAG_DESCRIPTIONS_H_ diff --git a/chromium_src/chrome/common/chrome_features.cc b/chromium_src/chrome/common/chrome_features.cc new file mode 100644 index 000000000000..785c4f10e0b6 --- /dev/null +++ b/chromium_src/chrome/common/chrome_features.cc @@ -0,0 +1,9 @@ +/* Copyright (c) 2019 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +#include "../../../../chrome/common/chrome_features.cc" + +namespace features { +} diff --git a/chromium_src/chrome/common/chrome_features.h b/chromium_src/chrome/common/chrome_features.h new file mode 100644 index 000000000000..80f657acec20 --- /dev/null +++ b/chromium_src/chrome/common/chrome_features.h @@ -0,0 +1,14 @@ +/* Copyright (c) 2019 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +#ifndef BRAVE_CHROMIUM_SRC_CHROME_COMMON_CHROME_FEATURES_H_ +#define BRAVE_CHROMIUM_SRC_CHROME_COMMON_CHROME_FEATURES_H_ + +#include "../../../../chrome/common/chrome_features.h" + +namespace features { +} + +#endif // BRAVE_CHROMIUM_SRC_CHROME_COMMON_CHROME_FEATURES_H_ diff --git a/patches/chrome-browser-about_flags.cc.patch b/patches/chrome-browser-about_flags.cc.patch index 58e60ac172d2..ad02de37cff0 100644 --- a/patches/chrome-browser-about_flags.cc.patch +++ b/patches/chrome-browser-about_flags.cc.patch @@ -21,3 +21,11 @@ index 656fd33db3f6553a409351701c9839725452df59..0a164040f1a8d76a5eeee517644af14f const FeatureEntry::Choice kPassiveListenersChoices[] = { {flags_ui::kGenericExperimentChoiceDefault, "", ""}, +@@ -4688,6 +4688,7 @@ const FeatureEntry kFeatureEntries[] = { + // "LoginCustomFlags" in tools/metrics/histograms/enums.xml. See "Flag + // Histograms" in tools/metrics/histograms/README.md (run the + // AboutFlagsHistogramTest unit test to verify this process). ++ BRAVE_FEATURE_ENTRIES + }; + + class FlagsStateSingleton { From 2f3ca18b0ad1e5886ae9f141cfda1a0ae7df6e72 Mon Sep 17 00:00:00 2001 From: Pete Miller Date: Mon, 25 Nov 2019 23:59:37 -0800 Subject: [PATCH 02/59] New Tab Page WebUI: Introduce Branded Wallpaper --- .../brave_new_tab_ui/api/brandedWallpaper.ts | 44 +++++++++++++ .../brave_new_tab_ui/api/initialData.ts | 22 +++++-- .../default/brandedWallpaper/logo.tsx | 26 ++++++++ .../components/default/grid/index.ts | 4 +- .../containers/newTab/footerInfo.tsx | 21 ++++--- .../containers/newTab/index.tsx | 59 ++++++++++++++---- .../dummy-branded-wallpaper/background.jpg | Bin 0 -> 2446819 bytes .../data/dummy-branded-wallpaper/logo.png | Bin 0 -> 15580 bytes .../reducers/new_tab_reducer.tsx | 37 ++++++++--- components/brave_new_tab_ui/storage.ts | 1 + components/definitions/newTab.d.ts | 22 ++++++- 11 files changed, 197 insertions(+), 39 deletions(-) create mode 100644 components/brave_new_tab_ui/api/brandedWallpaper.ts create mode 100644 components/brave_new_tab_ui/components/default/brandedWallpaper/logo.tsx create mode 100644 components/brave_new_tab_ui/data/dummy-branded-wallpaper/background.jpg create mode 100644 components/brave_new_tab_ui/data/dummy-branded-wallpaper/logo.png diff --git a/components/brave_new_tab_ui/api/brandedWallpaper.ts b/components/brave_new_tab_ui/api/brandedWallpaper.ts new file mode 100644 index 000000000000..6acd589ef4dd --- /dev/null +++ b/components/brave_new_tab_ui/api/brandedWallpaper.ts @@ -0,0 +1,44 @@ +// Copyright (c) 2020 The Brave Authors. All rights reserved. +// This Source Code Form is subject to the terms of the Mozilla Public +// License, v. 2.0. If a copy of the MPL was not distributed with this file, +// you can obtain one at http://mozilla.org/MPL/2.0/. + +import wallpaperImageUrl from '../data/dummy-branded-wallpaper/background.jpg' +import brandingImageUrl from '../data/dummy-branded-wallpaper/logo.png' +export function getBrandedWallpaper (): Promise { + return Promise.resolve({ + wallpaperImageUrl, + logo: { + image: brandingImageUrl, + alt: 'Technikke: For music lovers.', + destinationUrl: 'https://brave.com' + } + }) +} + +const viewsTillShouldShowStorageKey = 'NTP.BrandedWallpaper.ViewsTillShouldShow' +const maxViewCountUntilBranded = 4 + +export function getShouldShow (): boolean { + const valueRaw = localStorage.getItem(viewsTillShouldShowStorageKey) + const value = valueRaw ? parseInt(valueRaw) : NaN + if (Number.isInteger(value)) { + return value === 1 + } + return false +} + +export function registerViewCount (): void { + // TODO: keep this value as singleton in C++ since we want it to show on the + // 2nd view (after wallpapers and branded wallpapers are enabled) and then + // every 4 views + const valueRaw = localStorage.getItem(viewsTillShouldShowStorageKey) + const value = valueRaw ? parseInt(valueRaw) : NaN + let newValue = maxViewCountUntilBranded + if (Number.isInteger(value)) { + if (value > 1 && value <= maxViewCountUntilBranded) { + newValue = value - 1 + } + } + localStorage.setItem(viewsTillShouldShowStorageKey, newValue.toString()) +} diff --git a/components/brave_new_tab_ui/api/initialData.ts b/components/brave_new_tab_ui/api/initialData.ts index 630161eab46c..408e7b08e792 100644 --- a/components/brave_new_tab_ui/api/initialData.ts +++ b/components/brave_new_tab_ui/api/initialData.ts @@ -7,12 +7,15 @@ import * as preferencesAPI from './preferences' import * as statsAPI from './stats' import * as privateTabDataAPI from './privateTabData' import * as topSitesAPI from './topSites' +import * as brandedWallpaper from './brandedWallpaper' export type InitialData = { preferences: preferencesAPI.Preferences stats: statsAPI.Stats privateTabData: privateTabDataAPI.PrivateTabData - topSites: topSitesAPI.TopSitesData + topSites: topSitesAPI.TopSitesData, + brandedWallpaperData: NewTab.BrandedWallpaper, + shouldShowBrandedWallpaper: boolean } export type PreInitialRewardsData = { @@ -32,18 +35,29 @@ export type InitialRewardsData = { export async function getInitialData (): Promise { try { console.timeStamp('Getting initial data...') - const [preferences, stats, privateTabData, topSites] = await Promise.all([ + const [ + preferences, + stats, + privateTabData, + topSites, + brandedWallpaperData, + shouldShowBrandedWallpaper + ] = await Promise.all([ preferencesAPI.getPreferences(), statsAPI.getStats(), privateTabDataAPI.getPrivateTabData(), - topSitesAPI.getTopSites() + topSitesAPI.getTopSites(), + brandedWallpaper.getBrandedWallpaper(), + brandedWallpaper.getShouldShow() ]) console.timeStamp('Got all initial data.') return { preferences, stats, privateTabData, - topSites + topSites, + brandedWallpaperData, + shouldShowBrandedWallpaper } } catch (e) { console.error(e) diff --git a/components/brave_new_tab_ui/components/default/brandedWallpaper/logo.tsx b/components/brave_new_tab_ui/components/default/brandedWallpaper/logo.tsx new file mode 100644 index 000000000000..973123464c7b --- /dev/null +++ b/components/brave_new_tab_ui/components/default/brandedWallpaper/logo.tsx @@ -0,0 +1,26 @@ +// Copyright (c) 2019 The Brave Authors. All rights reserved. +// This Source Code Form is subject to the terms of the Mozilla Public +// License, v. 2.0. If a copy of the MPL was not distributed with this file, +// you can obtain one at http://mozilla.org/MPL/2.0/. + +import * as React from 'react' +import styled from 'styled-components' + +import createWidget from '../widget/index' + +interface Props { + data: NewTab.BrandedWallpaperLogo +} + +const LogoImage = styled('img')` + width: 100%; + max-width: 170px; +` + +function Logo ({data}: Props) { + return + + +} + +export default createWidget(Logo) diff --git a/components/brave_new_tab_ui/components/default/grid/index.ts b/components/brave_new_tab_ui/components/default/grid/index.ts index 16ec3338d45e..e8426f0678fe 100644 --- a/components/brave_new_tab_ui/components/default/grid/index.ts +++ b/components/brave_new_tab_ui/components/default/grid/index.ts @@ -89,11 +89,11 @@ export const Footer = styled<{}, 'footer'>('footer')` grid-gap: 0; grid-template-areas: "credits actions"; - > *:first-child { + > .credit { grid-area: credits; } - > *:nth-child(2) { + > .navigation { grid-area: actions; } diff --git a/components/brave_new_tab_ui/containers/newTab/footerInfo.tsx b/components/brave_new_tab_ui/containers/newTab/footerInfo.tsx index 3d45d9ef6027..1b2bc941bce5 100644 --- a/components/brave_new_tab_ui/containers/newTab/footerInfo.tsx +++ b/components/brave_new_tab_ui/containers/newTab/footerInfo.tsx @@ -57,16 +57,17 @@ export default class FooterInfo extends React.PureComponent { return ( <> -
- {showPhotoInfo && backgroundImageInfo && - - {`${getLocale('photoBy')} `} - - {backgroundImageInfo.author} - - } -
- + { showPhotoInfo && backgroundImageInfo && +
+ + {`${getLocale('photoBy')} `} + + {backgroundImageInfo.author} + + +
+ } + { state = { onlyAnonWallet: false, @@ -46,30 +63,33 @@ class NewTabPage extends React.Component { backgroundHasLoaded: false } + imageSource?: string = undefined + componentDidMount () { // if a notification is open at component mounting time, close it this.props.actions.onHideSiteRemovalNotification() + this.imageSource = GetBackgroundImageSrc(this.props) this.trackCachedImage() } componentDidUpdate (prevProps: Props) { - if (!prevProps.newTabData.showBackgroundImage && - this.props.newTabData.showBackgroundImage) { + const oldImageSource = GetBackgroundImageSrc(prevProps) + const newImageSource = GetBackgroundImageSrc(this.props) + this.imageSource = newImageSource + if (newImageSource && oldImageSource !== newImageSource) { this.trackCachedImage() } - if (prevProps.newTabData.showBackgroundImage && - !this.props.newTabData.showBackgroundImage) { + if (oldImageSource && + !newImageSource) { // reset loaded state this.setState({ backgroundHasLoaded: false }) } } trackCachedImage () { - if (this.props.newTabData.showBackgroundImage && - this.props.newTabData.backgroundImage && - this.props.newTabData.backgroundImage.source) { + if (this.imageSource) { const imgCache = new Image() - imgCache.src = this.props.newTabData.backgroundImage.source + imgCache.src = this.imageSource console.timeStamp('image start loading...') imgCache.onload = () => { console.timeStamp('image loaded') @@ -171,17 +191,21 @@ class NewTabPage extends React.Component { return null } + const hasImage = this.imageSource !== undefined + const isShowingBrandedWallpaper = (newTabData.shouldShowBrandedWallpaper && + newTabData.brandedWallpaperData) ? true : false + return ( - {newTabData.showBackgroundImage && newTabData.backgroundImage && - + {hasImage && + } - {newTabData.showBackgroundImage && + {hasImage && @@ -246,13 +270,22 @@ class NewTabPage extends React.Component { }