Commit 2e4ccff8 authored by Yue Li's avatar Yue Li Committed by Commit Bot

Replace voice match video with lottie animation

The cl replaces the use of webm video with lottie animation in Assistant
opt-in flow.

Bug: 1001713
Test: Manual Test
Change-Id: I54162809464cdcb16e749dd74ec35122842f5237
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1804693Reviewed-by: default avatarXiaohui Chen <xiaohuic@chromium.org>
Reviewed-by: default avatarSteven Bennetts <stevenjb@chromium.org>
Reviewed-by: default avatarXiyuan Xia <xiyuan@chromium.org>
Commit-Queue: Yue Li <updowndota@chromium.org>
Cr-Commit-Position: refs/heads/master@{#696956}
parent d519d8c3
...@@ -19,15 +19,17 @@ ...@@ -19,15 +19,17 @@
color: #757575; color: #757575;
} }
#voice-match-video-container { #voice-match-animation-container {
flex-grow: 1; flex-grow: 1;
} }
#voice-match-video { #voice-match-animation {
height: 170px;
left: 50%; left: 50%;
position: relative; position: relative;
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
width: 255px;
} }
#already-setup-video-container { #already-setup-video-container {
......
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html"> <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
<link rel="import" href="chrome://resources/cr_elements/icons.html"> <link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/cr_elements/chromeos/cr_lottie/cr_lottie.html">
<dom-module id="assistant-voice-match"> <dom-module id="assistant-voice-match">
<template> <template>
<link rel="stylesheet" href="../login/oobe_flex_layout.css"> <link rel="stylesheet" href="../login/oobe_flex_layout.css">
...@@ -24,10 +25,11 @@ ...@@ -24,10 +25,11 @@
<div class="content" id="no-dsp-message" <div class="content" id="no-dsp-message"
i18n-content="assistantVoiceMatchNoDspMessage"> i18n-content="assistantVoiceMatchNoDspMessage">
</div> </div>
<div id="voice-match-video-container"> <div id="voice-match-animation-container">
<video id="voice-match-video" muted autoplay loop> <div id="voice-match-animation">
<source src="voice_laptop_1x.webm" type="video/webm"> <cr-lottie animation-url="voice_match_animation.json">
</video> </cr-lottie>
</div>
</div> </div>
</div> </div>
<div id="recording-container"> <div id="recording-container">
......
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
#include "content/public/browser/web_ui_data_source.h" #include "content/public/browser/web_ui_data_source.h"
#include "content/public/common/content_features.h" #include "content/public/common/content_features.h"
#include "net/base/url_util.h" #include "net/base/url_util.h"
#include "ui/chromeos/resources/grit/ui_chromeos_resources.h"
#include "ui/views/widget/widget.h" #include "ui/views/widget/widget.h"
#include "ui/wm/core/window_animations.h" #include "ui/wm/core/window_animations.h"
...@@ -80,6 +81,9 @@ AssistantOptInUI::AssistantOptInUI(content::WebUI* web_ui) ...@@ -80,6 +81,9 @@ AssistantOptInUI::AssistantOptInUI(content::WebUI* web_ui)
source->AddResourcePath("assistant_logo.png", IDR_ASSISTANT_LOGO_PNG); source->AddResourcePath("assistant_logo.png", IDR_ASSISTANT_LOGO_PNG);
source->AddBoolean("hotwordDspAvailable", chromeos::IsHotwordDspAvailable()); source->AddBoolean("hotwordDspAvailable", chromeos::IsHotwordDspAvailable());
source->SetDefaultResource(IDR_ASSISTANT_OPTIN_HTML); source->SetDefaultResource(IDR_ASSISTANT_OPTIN_HTML);
source->AddResourcePath("voice_match_animation.json",
IDR_ASSISTANT_VOICE_MATCH_ANIMATION);
source->OverrideContentSecurityPolicyWorkerSrc("worker-src blob: 'self';");
content::WebUIDataSource::Add(Profile::FromWebUI(web_ui), source); content::WebUIDataSource::Add(Profile::FromWebUI(web_ui), source);
// Do not zoom for Assistant opt-in web contents. // Do not zoom for Assistant opt-in web contents.
......
...@@ -99,6 +99,9 @@ ...@@ -99,6 +99,9 @@
<!-- Kerberos. --> <!-- Kerberos. -->
<structure type="chrome_scaled_image" name="IDR_KERBEROS_ICON_KEY" file="kerberos/vpn_key_grey600_24dp.png" /> <structure type="chrome_scaled_image" name="IDR_KERBEROS_ICON_KEY" file="kerberos/vpn_key_grey600_24dp.png" />
<!-- Assistant images. -->
<structure type="chrome_html" name="IDR_ASSISTANT_VOICE_MATCH_ANIMATION" file="vector/voice_laptop.json" compress="gzip" />
</structures> </structures>
</release> </release>
</grit> </grit>
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment