Fast app reinstall: Fix a bug that the scrolling shadow effect did not

show when the page is first loaded.

Bug: 835029
Change-Id: If48f9d793c23f28b76d010683f48dd4718940742
Reviewed-on: https://chromium-review.googlesource.com/1161549
Commit-Queue: Yue Cen <rsgingerrs@chromium.org>
Reviewed-by: Alexander Alekseev <alemate@chromium.org>
Reviewed-by: Wenzhao (Colin) Zang <wzang@chromium.org>
Cr-Commit-Position: refs/heads/master@{#581766}

chrome/browser/resources/chromeos/arc_support/recommend_app_list_view.css

@@ -17,6 +17,7 @@ body {
   max-height: 300px;
   overflow: auto;
   padding: 12px 64px 0 64px;
+  width: 640px;
 }
 
 .shadow {

chrome/browser/resources/chromeos/arc_support/recommend_app_list_view.js

@@ -75,18 +75,27 @@ function getSelectedPackages() {
   return selectedPackages;
 }
 
-// Add the scrolling shadow effect.
-(function() {
-const shadowThreshold = 5;
-var doc = document;
-doc.getElementById('recommend-apps-container').onscroll = function() {
+function toggleScrollShadow(container) {
+  const shadowThreshold = 5;
+  var doc = document;
   doc.getElementById('scroll-top')
-      .classList[this.scrollTop > shadowThreshold ? 'add' : 'remove']('shadow');
+      .classList.toggle('shadow', container.scrollTop > shadowThreshold);
   doc.getElementById('scroll-bottom')
-      .classList
-          [this.scrollHeight - this.clientHeight - this.scrollTop <
-                   shadowThreshold ?
-               'remove' :
-               'add']('shadow');
-};
-})();
\ No newline at end of file
+      .classList.toggle(
+          'shadow',
+          container.scrollHeight - container.clientHeight -
+                  container.scrollTop >=
+              shadowThreshold);
+}
+
+// Add the scroll shadow effect. This contains two parts. First initialize the
+// effect after all the contents have been generated. Then attach it to the
+// onscroll event.
+function addScrollShadowEffect() {
+  var doc = document;
+  var container = doc.getElementById('recommend-apps-container');
+  toggleScrollShadow(container);
+  container.onscroll = function() {
+    toggleScrollShadow(this);
+  };
+}
\ No newline at end of file

chrome/browser/resources/chromeos/login/screen_recommend_apps.js

@@ -102,6 +102,8 @@ login.createScreen('RecommendAppsScreen', 'recommend-apps', function() {
             var generateContents = {code: generateItemScript};
             appListView.executeScript(generateContents);
           });
+          var addScrollShadowEffectScript = 'addScrollShadowEffect();';
+          appListView.executeScript({code: addScrollShadowEffectScript});
 
           this.onGenerateContents();
         });