Handle background / title colors in web-apps.

Telegram/SourceFiles/payments/payments_checkout_process.cpp

@@ -246,17 +246,6 @@ CheckoutProcess::CheckoutProcess(
 	showForm();
 	_panel->toggleProgress(true);
 
-	style::PaletteChanged(
-	) | rpl::filter([=] {
-		return !_themeUpdateScheduled;
-	}) | rpl::start_with_next([=] {
-		_themeUpdateScheduled = true;
-		crl::on_main(this, [=] {
-			_themeUpdateScheduled = false;
-			_panel->updateThemeParams(Window::Theme::WebViewParams());
-		});
-	}, _panel->lifetime());
-
 	if (mode == Mode::Payment) {
 		_session->api().cloudPassword().state(
 		) | rpl::start_with_next([=](const Core::CloudPasswordState &state) {
@@ -846,4 +835,8 @@ QString CheckoutProcess::panelWebviewDataPath() {
 	return _session->domain().local().webviewDataPath();
 }
 
+Webview::ThemeParams CheckoutProcess::panelWebviewThemeParams() {
+	return Window::Theme::WebViewParams();
+}
+
 } // namespace Payments

Telegram/SourceFiles/payments/payments_checkout_process.h

@@ -150,6 +150,7 @@ private:
 	QVariant panelClickHandlerContext() override;
 
 	QString panelWebviewDataPath() override;
+	Webview::ThemeParams panelWebviewThemeParams() override;
 
 	std::optional<QDate> panelOverrideExpireDateThreshold() override;
 
@@ -163,7 +164,6 @@ private:
 	bool _sendFormPending = false;
 	bool _sendFormFailed = false;
 
-	bool _themeUpdateScheduled = false;
 	rpl::lifetime _gettingPasswordState;
 	rpl::lifetime _lifetime;
 

Telegram/SourceFiles/payments/ui/payments_panel.cpp

@@ -82,6 +82,17 @@ Panel::Panel(not_null<PanelDelegate*> delegate)
 	) | rpl::start_with_next([=] {
 		_delegate->panelCloseSure();
 	}, _widget->lifetime());
+
+	style::PaletteChanged(
+	) | rpl::filter([=] {
+		return !_themeUpdateScheduled;
+	}) | rpl::start_with_next([=] {
+		_themeUpdateScheduled = true;
+		crl::on_main(_widget.get(), [=] {
+			_themeUpdateScheduled = false;
+			updateThemeParams(_delegate->panelWebviewThemeParams());
+		});
+	}, lifetime());
 }
 
 Panel::~Panel() {
@@ -483,11 +494,13 @@ bool Panel::showWebview(
 		const QString &url,
 		bool allowBack,
 		rpl::producer<QString> bottomText) {
-	if (!_webview && !createWebview()) {
+	const auto params = _delegate->panelWebviewThemeParams();
+	if (!_webview && !createWebview(params)) {
 		return false;
 	}
 	showWebviewProgress();
 	_widget->hideLayer(anim::type::instant);
+	updateThemeParams(params);
 	_webview->window.navigate(url);
 	_widget->setBackAllowed(allowBack);
 	if (bottomText) {
@@ -511,7 +524,7 @@ bool Panel::showWebview(
 	return true;
 }
 
-bool Panel::createWebview() {
+bool Panel::createWebview(const Webview::ThemeParams &params) {
 	auto outer = base::make_unique_q<RpWidget>(_widget.get());
 	const auto container = outer.get();
 	_widget->showInner(std::move(outer));
@@ -532,8 +545,10 @@ bool Panel::createWebview() {
 	_webview = std::make_unique<WebviewWithLifetime>(
 		container,
 		Webview::WindowConfig{
+			.opaqueBg = params.opaqueBg,
 			.userDataPath = _delegate->panelWebviewDataPath(),
 		});
+
 	const auto raw = &_webview->window;
 	QObject::connect(container, &QObject::destroyed, [=] {
 		if (_webview && &_webview->window == raw) {
@@ -900,6 +915,7 @@ void Panel::updateThemeParams(const Webview::ThemeParams &params) {
 		return;
 	}
 	_webview->window.updateTheme(
+		params.opaqueBg,
 		params.scrollBg,
 		params.scrollBgOver,
 		params.scrollBarBg,

Telegram/SourceFiles/payments/ui/payments_panel.h

@@ -100,7 +100,7 @@ private:
 	struct Progress;
 	struct WebviewWithLifetime;
 
-	bool createWebview();
+	bool createWebview(const Webview::ThemeParams &params);
 	void showWebviewProgress();
 	void hideWebviewProgress();
 	void showWebviewError(
@@ -123,6 +123,7 @@ private:
 	QPointer<EditInformation> _weakEditInformation;
 	QPointer<EditCard> _weakEditCard;
 	rpl::event_stream<QString> _savedMethodChosen;
+	bool _themeUpdateScheduled = false;
 	bool _webviewProgress = false;
 	bool _testMode = false;
 

Telegram/SourceFiles/payments/ui/payments_panel_delegate.h

@@ -16,6 +16,10 @@ namespace Ui {
 class BoxContent;
 } // namespace Ui
 
+namespace Webview {
+struct ThemeParams;
+} // namespace Webview
+
 namespace Payments::Ui {
 
 using namespace ::Ui;
@@ -56,6 +60,7 @@ public:
 	virtual QVariant panelClickHandlerContext() = 0;
 
 	virtual QString panelWebviewDataPath() = 0;
+	virtual Webview::ThemeParams panelWebviewThemeParams() = 0;
 
 	virtual std::optional<QDate> panelOverrideExpireDateThreshold() = 0;
 };

Telegram/SourceFiles/ui/chat/attach/attach_bot_webview.cpp

@@ -494,7 +494,7 @@ bool Panel::showWebview(
 		const QString &url,
 		const Webview::ThemeParams &params,
 		rpl::producer<QString> bottomText) {
-	if (!_webview && !createWebview()) {
+	if (!_webview && !createWebview(params)) {
 		return false;
 	}
 	const auto allowBack = false;
@@ -555,12 +555,16 @@ bool Panel::showWebview(
 	return true;
 }
 
-bool Panel::createWebview() {
+bool Panel::createWebview(const Webview::ThemeParams &params) {
 	auto outer = base::make_unique_q<RpWidget>(_widget.get());
 	const auto container = outer.get();
 	_widget->showInner(std::move(outer));
 	_webviewParent = container;
 
+	container->paintRequest() | rpl::start_with_next([=] {
+		QPainter(container).fillRect(container->rect(), QColor(0, 128, 0, 255));
+	}, container->lifetime());
+
 	_webviewBottom = std::make_unique<RpWidget>(_widget.get());
 	const auto bottom = _webviewBottom.get();
 	bottom->show();
@@ -580,6 +584,7 @@ bool Panel::createWebview() {
 	_webview = std::make_unique<WebviewWithLifetime>(
 		container,
 		Webview::WindowConfig{
+			.opaqueBg = params.opaqueBg,
 			.userDataPath = _userDataPath,
 		});
 	const auto raw = &_webview->window;
@@ -649,6 +654,8 @@ bool Panel::createWebview() {
 			setupClosingBehaviour(arguments);
 		} else if (command == "web_app_read_text_from_clipboard") {
 			requestClipboardText(arguments);
+		} else if (command == "web_app_set_header_color") {
+			processHeaderColor(arguments);
 		}
 	});
 
@@ -1089,6 +1096,22 @@ void Panel::processBackButtonMessage(const QJsonObject &args) {
 	_widget->setBackAllowed(args["is_visible"].toBool());
 }
 
+void Panel::processHeaderColor(const QJsonObject &args) {
+	if (const auto color = ParseColor(args["color"].toString())) {
+		_widget->overrideTitleColor(color);
+		_headerColorLifetime.destroy();
+	} else if (args["color_key"].toString() == u"secondary_bg_color"_q) {
+		_widget->overrideTitleColor(st::boxDividerBg->c);
+		_headerColorLifetime = style::PaletteChanged(
+		) | rpl::start_with_next([=] {
+			_widget->overrideTitleColor(st::boxDividerBg->c);
+		});
+	} else {
+		_widget->overrideTitleColor(std::nullopt);
+		_headerColorLifetime.destroy();
+	}
+}
+
 void Panel::createMainButton() {
 	_mainButton = std::make_unique<Button>(
 		_widget.get(),
@@ -1179,6 +1202,7 @@ void Panel::updateThemeParams(const Webview::ThemeParams &params) {
 		return;
 	}
 	_webview->window.updateTheme(
+		params.opaqueBg,
 		params.scrollBg,
 		params.scrollBgOver,
 		params.scrollBarBg,

Telegram/SourceFiles/ui/chat/attach/attach_bot_webview.h

@@ -106,7 +106,7 @@ private:
 	struct Progress;
 	struct WebviewWithLifetime;
 
-	bool createWebview();
+	bool createWebview(const Webview::ThemeParams &params);
 	void showWebviewProgress();
 	void hideWebviewProgress();
 	void setTitle(rpl::producer<QString> title);
@@ -114,6 +114,7 @@ private:
 	void switchInlineQueryMessage(const QJsonObject &args);
 	void processMainButtonMessage(const QJsonObject &args);
 	void processBackButtonMessage(const QJsonObject &args);
+	void processHeaderColor(const QJsonObject &args);
 	void openTgLink(const QJsonObject &args);
 	void openExternalLink(const QJsonObject &args);
 	void openInvoice(const QJsonObject &args);
@@ -153,6 +154,7 @@ private:
 	mutable crl::time _mainButtonLastClick = 0;
 	std::unique_ptr<Progress> _progress;
 	rpl::event_stream<> _themeUpdateForced;
+	rpl::lifetime _headerColorLifetime;
 	rpl::lifetime _fgLifetime;
 	rpl::lifetime _bgLifetime;
 	bool _webviewProgress = false;

Telegram/SourceFiles/window/themes/window_theme.cpp

@@ -1512,6 +1512,7 @@ bool ReadPaletteValues(const QByteArray &content, Fn<bool(QLatin1String name, QL
 		object.insert(name, '#' + hex(r) + hex(g) + hex(b));
 	}
 	return {
+		.opaqueBg = st::windowBg->c,
 		.scrollBg = st::scrollBg->c,
 		.scrollBgOver = st::scrollBgOver->c,
 		.scrollBarBg = st::scrollBarBg->c,

Telegram/lib_webview

@@ -1 +1 @@
-Subproject commit 552d96a51fa5c8e50f9d6f631055558d99356cb4
+Subproject commit 0727eb84a67f57b2fcc8c3c29efb5072434cd29f