[App Management] Add Metadata View
This CL sets up metadata view for chrome permission view and pwa permission view.
Bug: 906508
Change-Id: I81d4ed5b1946ede773a802809ef27e945bd3a4ef
Reviewed-on: https://chromium-review.googlesource.com/c/1390777
Commit-Queue: Cecilia Ni <ceciliani@google.com>
Reviewed-by: calamity <calamity@chromium.org>
Reviewed-by: Eric Willigers <ericwilligers@chromium.org>
Cr-Commit-Position: refs/heads/master@{#619366}diff --git a/chrome/app/app_management_strings.grdp b/chrome/app/app_management_strings.grdp
index 27fa67c..dee3d39 100644
--- a/chrome/app/app_management_strings.grdp
+++ b/chrome/app/app_management_strings.grdp
@@ -13,15 +13,18 @@
<message name="IDS_APP_MANAGEMENT_MORE_APPS" desc="Label for more apps button at bottom of app list card.">
Show <ph name="NUMBER_OF_MORE_APPS">$1<ex>4</ex></ph> more apps
</message>
- <message name="IDS_APP_MANAGEMENT_NOTIFICATIONS" desc="Label for notifications section in app settings page.">
+ <message name="IDS_APP_MANAGEMENT_NOTIFICATIONS" desc="Label for notifications section in the app settings page.">
Notifications
</message>
<message name="IDS_APP_MANAGEMENT_NOTIFICATIONS_SUBLABEL" desc="Sublabel for the Notifications item in the main App Management view">
<ph name="NUMBER_OF_MORE_APPS">$1<ex>4</ex></ph> apps
</message>
- <message name="IDS_APP_MANAGEMENT_PERMISSIONS" desc="Label for permissions section in app settings page.">
+ <message name="IDS_APP_MANAGEMENT_PERMISSIONS" desc="Label for permissions section in the app settings page.">
Permissions
</message>
+ <message name="IDS_APP_MANAGEMENT_PIN_TO_SHELF" desc="Label for the pin to shelf button in the app settings page.">
+ Pin to shelf
+ </message>
<message name="IDS_APP_MANAGEMENT_SEARCH_PROMPT" desc="Prompt in search bar of main app management page.">
Search apps
</message>
@@ -31,7 +34,13 @@
<message name="IDS_APP_MANAGEMENT_TITLE" desc="Title of the app management page.">
Apps
</message>
- <message name="IDS_APP_MANAGEMENT_UNINSTALL" desc="Label for the uninstall button in app settings page.">
+ <message name="IDS_APP_MANAGEMENT_SIZE" desc="Label for the size of an app in the app settings page.">
+ Size: <ph name="APP_SIZE">$1<ex>8.0MB</ex></ph>
+ </message>
+ <message name="IDS_APP_MANAGEMENT_UNINSTALL" desc="Label for the uninstall button in the app settings page.">
Uninstall
</message>
+ <message name="IDS_APP_MANAGEMENT_VERSION" desc="Label for version of an app in the app settings page.">
+ Version: <ph name="VERSION">$1<ex>4.0</ex></ph>
+ </message>
</grit-part>
diff --git a/chrome/browser/browser_resources.grd b/chrome/browser/browser_resources.grd
index c45dd51..a9e45ef 100644
--- a/chrome/browser/browser_resources.grd
+++ b/chrome/browser/browser_resources.grd
@@ -244,6 +244,8 @@
<include name="IDR_APP_MANAGEMENT_ITEM_JS" file="resources\app_management\item.js" type="BINDATA" />
<include name="IDR_APP_MANAGEMENT_MAIN_VIEW_HTML" file="resources\app_management\main_view.html" type="BINDATA" />
<include name="IDR_APP_MANAGEMENT_MAIN_VIEW_JS" file="resources\app_management\main_view.js" type="BINDATA" />
+ <include name="IDR_APP_MANAGEMENT_METADATA_VIEW_HTML" file="resources\app_management\metadata_view.html" type="BINDATA" />
+ <include name="IDR_APP_MANAGEMENT_METADATA_VIEW_JS" file="resources\app_management\metadata_view.js" type="BINDATA" />
<include name="IDR_APP_MANAGEMENT_PWA_PERMISSION_VIEW_HTML" file="resources\app_management\pwa_permission_view.html" type="BINDATA"/>
<include name="IDR_APP_MANAGEMENT_PWA_PERMISSION_VIEW_JS" file="resources\app_management\pwa_permission_view.js" type="BINDATA"/>
<include name="IDR_APP_MANAGEMENT_REDUCERS_HTML" file="resources\app_management\reducers.html" type="BINDATA" />
diff --git a/chrome/browser/resources/app_management/BUILD.gn b/chrome/browser/resources/app_management/BUILD.gn
index 2a664556..56d1601 100644
--- a/chrome/browser/resources/app_management/BUILD.gn
+++ b/chrome/browser/resources/app_management/BUILD.gn
@@ -15,6 +15,7 @@
":fake_page_handler",
":item",
":main_view",
+ ":metadata_view",
":pwa_permission_view",
":reducers",
":router",
@@ -46,6 +47,7 @@
":actions",
":browser_proxy",
":main_view",
+ ":metadata_view",
":pwa_permission_view",
":router",
":util",
@@ -94,9 +96,16 @@
]
}
+ js_library("metadata_view") {
+ deps = [
+ ":fake_page_handler",
+ ]
+ }
+
js_library("pwa_permission_view") {
deps = [
":fake_page_handler",
+ ":metadata_view",
]
}
diff --git a/chrome/browser/resources/app_management/chrome_app_permission_view.html b/chrome/browser/resources/app_management/chrome_app_permission_view.html
index 701349e..2c1803b 100644
--- a/chrome/browser/resources/app_management/chrome_app_permission_view.html
+++ b/chrome/browser/resources/app_management/chrome_app_permission_view.html
@@ -20,6 +20,7 @@
<img class="permission-view-header-icon" src="[[iconUrlFromId_(app_)]]">
<div class="app-title">[[app_.title]]</div>
</div>
+ <app-management-metadata-view app="[[app_]]"></app-management-metadata-view>
</template>
<script src="chrome_app_permission_view.js"></script>
</dom-module>
diff --git a/chrome/browser/resources/app_management/fake_page_handler.js b/chrome/browser/resources/app_management/fake_page_handler.js
index 742c3ad4..32bddd5 100644
--- a/chrome/browser/resources/app_management/fake_page_handler.js
+++ b/chrome/browser/resources/app_management/fake_page_handler.js
@@ -27,6 +27,8 @@
id: id,
type: apps.mojom.AppType.kUnknown,
title: 'App Title',
+ version: '5.1',
+ size: '9.0MB',
isPinned: apps.mojom.OptionalBool.kUnknown,
};
diff --git a/chrome/browser/resources/app_management/main_view.html b/chrome/browser/resources/app_management/main_view.html
index 5134fd6..77ae2a0 100644
--- a/chrome/browser/resources/app_management/main_view.html
+++ b/chrome/browser/resources/app_management/main_view.html
@@ -79,5 +79,5 @@
</div>
</div>
</template>
- <script src="chrome://apps/main_view.js"></script>
+ <script src="main_view.js"></script>
</dom-module>
diff --git a/chrome/browser/resources/app_management/metadata_view.html b/chrome/browser/resources/app_management/metadata_view.html
new file mode 100644
index 0000000..22bcecf
--- /dev/null
+++ b/chrome/browser/resources/app_management/metadata_view.html
@@ -0,0 +1,54 @@
+<link rel="import" href="chrome://resources/html/polymer.html">
+
+<link rel="import" href="browser_proxy.html">
+<link rel="import" href="shared_style.html">
+<link rel="import" href="shared_vars.html">
+
+<dom-module id="app-management-metadata-view">
+ <template>
+ <style include="app-management-shared-css">
+ #shelf-switch-row {
+ align-items: center;
+ display: flex;
+ justify-content: space-around;
+ padding-bottom: 20px;
+ }
+
+ #shelf-switch {
+ display: flex;
+ justify-content: space-between;
+ }
+
+ cr-toggle {
+ padding-inline-start: 12px;
+ }
+
+ #metadata-overview {
+ display: flex;
+ flex-direction: column;
+ }
+
+ #metadata-overview > span {
+ text-align: center;
+ }
+
+ .metadata-row {
+ display: flex;
+ justify-content: space-around;
+ }
+ </style>
+ <div id="shelf-switch-row">
+ <span id="shelf-switch" class="header-text">
+ $i18n{pinToShelf}
+ <cr-toggle></cr-toggle>
+ </span>
+ </div>
+
+ <div id="metadata-overview" class="secondary-text">
+ <span>[[versionString_(app)]]</span>
+ <span>[[sizeString_(app)]]</span>
+ <!--TODO(ceciliani): Placeholder for legal declaration-->
+ </div>
+ </template>
+ <script src="metadata_view.js"></script>
+</dom-module>
diff --git a/chrome/browser/resources/app_management/metadata_view.js b/chrome/browser/resources/app_management/metadata_view.js
new file mode 100644
index 0000000..55ca71df
--- /dev/null
+++ b/chrome/browser/resources/app_management/metadata_view.js
@@ -0,0 +1,31 @@
+// Copyright 2018 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.
+
+Polymer({
+ is: 'app-management-metadata-view',
+
+ properties: {
+ /** @type {appManagement.mojom.App} */
+ app: {
+ type: Object,
+ },
+ },
+
+ /**
+ * @return {string}
+ * @private
+ */
+ versionString_: function(app) {
+ return loadTimeData.getStringF('version', assert(app.version));
+ },
+
+ /**
+ * @return {string}
+ * @private
+ */
+ sizeString_: function(app) {
+ return loadTimeData.getStringF('size', assert(app.size));
+ },
+
+});
diff --git a/chrome/browser/resources/app_management/pwa_permission_view.html b/chrome/browser/resources/app_management/pwa_permission_view.html
index 443f16ca..93f923a 100644
--- a/chrome/browser/resources/app_management/pwa_permission_view.html
+++ b/chrome/browser/resources/app_management/pwa_permission_view.html
@@ -1,6 +1,7 @@
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="browser_proxy.html">
+<link rel="import" href="metadata_view.html">
<link rel="import" href="shared_style.html">
<link rel="import" href="shared_vars.html">
<link rel="import" href="chrome://resources/cr_elements/cr_icons_css.html">
@@ -35,7 +36,6 @@
width: 1px;
}
</style>
-
<div class="permission-view-header">
<paper-icon-button-light class="icon-arrow-back">
<button id="closeButton" aria-label="$i18n{back}">
@@ -57,8 +57,7 @@
<div id="permission-list" class="card-container">
<span class="permission-row">
<div class="header-text">$i18n{notifications}</div>
- <cr-toggle aria-pressed="false" role="button" tabindex="0">
- </cr-toggle>
+ <cr-toggle></cr-toggle>
</span>
<span class="permission-row"
on-click="toggleListExpanded_">
@@ -71,12 +70,11 @@
</button>
</paper-icon-button-light>
<div class="control-divider"></div>
- <cr-toggle aria-pressed="false" role="button" tabindex="0"
- class="left-separated-control">
- </cr-toggle>
+ <cr-toggle class="left-separated-control"></cr-toggle>
</span>
</span>
</div>
+ <app-management-metadata-view app="[[app_]]"></app-management-metadata-view>
</template>
<script src="pwa_permission_view.js"></script>
</dom-module>
diff --git a/chrome/browser/ui/webui/app_management/app_management_ui.cc b/chrome/browser/ui/webui/app_management/app_management_ui.cc
index d61bce4..0a3537da 100644
--- a/chrome/browser/ui/webui/app_management/app_management_ui.cc
+++ b/chrome/browser/ui/webui/app_management/app_management_ui.cc
@@ -37,9 +37,12 @@
source->AddLocalizedString("openSiteSettings",
IDS_APP_MANAGEMENT_SITE_SETTING);
source->AddLocalizedString("permissions", IDS_APP_MANAGEMENT_PERMISSIONS);
+ source->AddLocalizedString("pinToShelf", IDS_APP_MANAGEMENT_PIN_TO_SHELF);
source->AddLocalizedString("searchPrompt", IDS_APP_MANAGEMENT_SEARCH_PROMPT);
+ source->AddLocalizedString("size", IDS_APP_MANAGEMENT_SIZE);
source->AddLocalizedString("title", IDS_APP_MANAGEMENT_TITLE);
source->AddLocalizedString("uninstall", IDS_APP_MANAGEMENT_UNINSTALL);
+ source->AddLocalizedString("version", IDS_APP_MANAGEMENT_VERSION);
source->AddResourcePath("app_management.mojom-lite.js",
IDR_APP_MANAGEMENT_MOJO_LITE_JS);
@@ -78,6 +81,10 @@
source->AddResourcePath("item.js", IDR_APP_MANAGEMENT_ITEM_JS);
source->AddResourcePath("main_view.html", IDR_APP_MANAGEMENT_MAIN_VIEW_HTML);
source->AddResourcePath("main_view.js", IDR_APP_MANAGEMENT_MAIN_VIEW_JS);
+ source->AddResourcePath("metadata_view.html",
+ IDR_APP_MANAGEMENT_METADATA_VIEW_HTML);
+ source->AddResourcePath("metadata_view.js",
+ IDR_APP_MANAGEMENT_METADATA_VIEW_JS);
source->AddResourcePath("pwa_permission_view.html",
IDR_APP_MANAGEMENT_PWA_PERMISSION_VIEW_HTML);
source->AddResourcePath("pwa_permission_view.js",
