Bug 1042937 - Provide visual feedback while search results are loading. r=margaret
authorEric Edens <eedens@mozilla.com>
Fri, 25 Jul 2014 08:58:50 -0700
changeset 196327 b5ae1c999f27a9025e5beae2cdf27e0ee6b3b94d
parent 196326 ceab6297c50223ba24bd76ae246b46a24cecc945
child 196328 5853d370248d3193b18cbc8d7aa25383c9a63a87
push id46844
push usercbook@mozilla.com
push dateMon, 28 Jul 2014 14:30:47 +0000
treeherdermozilla-inbound@7dd701896de8 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmargaret
bugs1042937
milestone34.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1042937 - Provide visual feedback while search results are loading. r=margaret
mobile/android/search/java/org/mozilla/search/PostSearchFragment.java
mobile/android/search/res/drawable/progressbar.xml
mobile/android/search/res/layout/search_fragment_post_search.xml
mobile/android/search/res/values/search_dimens.xml
--- a/mobile/android/search/java/org/mozilla/search/PostSearchFragment.java
+++ b/mobile/android/search/java/org/mozilla/search/PostSearchFragment.java
@@ -10,40 +10,54 @@ import android.net.Uri;
 import android.os.Bundle;
 import android.support.v4.app.Fragment;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.webkit.WebChromeClient;
 import android.webkit.WebView;
 import android.webkit.WebViewClient;
+import android.widget.ProgressBar;
 
 public class PostSearchFragment extends Fragment {
 
     private static final String LOGTAG = "PostSearchFragment";
+
+    private ProgressBar progressBar;
     private WebView webview;
 
     private static final String HIDE_BANNER_SCRIPT = "javascript:(function(){var tag=document.createElement('style');" +
             "tag.type='text/css';document.getElementsByTagName('head')[0].appendChild(tag);tag.innerText='#nav,#header{display:none}'})();";
 
     public PostSearchFragment() {
     }
 
     @Override
     public View onCreateView(LayoutInflater inflater, ViewGroup container,
                              Bundle savedInstanceState) {
-        webview = (WebView) inflater.inflate(R.layout.search_fragment_post_search, container, false);
+        View mainView = inflater.inflate(R.layout.search_fragment_post_search, container, false);
 
+        progressBar = (ProgressBar) mainView.findViewById(R.id.progress_bar);
+
+        webview = (WebView) mainView.findViewById(R.id.webview);
+        webview.setWebChromeClient(new ChromeClient());
         webview.setWebViewClient(new LinkInterceptingClient());
-        webview.setWebChromeClient(new StyleInjectingClient());
-
         // This is required for our greasemonkey terror script.
         webview.getSettings().setJavaScriptEnabled(true);
 
-        return webview;
+        return mainView;
+    }
+
+    @Override
+    public void onDestroyView() {
+        super.onDestroyView();
+        webview.setWebChromeClient(null);
+        webview.setWebViewClient(null);
+        webview = null;
+        progressBar = null;
     }
 
     /**
      * Test if a given URL is a page of search results.
      * <p>
      * Search results pages will be shown in the embedded view.  Other pages are
      * opened in external browsers.
      *
@@ -85,17 +99,29 @@ public class PostSearchFragment extends 
     /**
      * A custom WebChromeClient that allows us to inject CSS into
      * the head of the HTML.
      *
      * We use the WebChromeClient because it provides a hook to the titleReceived
      * event. Once the title is available, the page will have started parsing the
      * head element. The script injects its CSS into the head element.
      */
-    private class StyleInjectingClient extends WebChromeClient {
+    private class ChromeClient extends WebChromeClient {
 
         @Override
         public void onReceivedTitle(WebView view, String title) {
             super.onReceivedTitle(view, title);
             view.loadUrl(HIDE_BANNER_SCRIPT);
         }
+
+        @Override
+        public void onProgressChanged(WebView view, int newProgress) {
+            if (newProgress < 100) {
+                if (progressBar.getVisibility() == View.INVISIBLE) {
+                    progressBar.setVisibility(View.VISIBLE);
+                }
+                progressBar.setProgress(newProgress);
+            } else {
+                progressBar.setVisibility(View.INVISIBLE);
+            }
+        }
     }
 }
new file mode 100644
--- /dev/null
+++ b/mobile/android/search/res/drawable/progressbar.xml
@@ -0,0 +1,9 @@
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:id="@android:id/progress">
+        <clip>
+            <shape>
+                <solid android:color="@color/highlight_orange"/>
+            </shape>
+        </clip>
+    </item>
+</layer-list>
--- a/mobile/android/search/res/layout/search_fragment_post_search.xml
+++ b/mobile/android/search/res/layout/search_fragment_post_search.xml
@@ -1,8 +1,23 @@
 <!-- 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/. -->
 
-<WebView
+<LinearLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
-    android:layout_height="match_parent"/>
+    android:layout_height="match_parent"
+    android:orientation="vertical">
+
+    <ProgressBar
+        android:id="@+id/progress_bar"
+        style="@android:style/Widget.ProgressBar.Horizontal"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/progress_bar_height"
+        android:progressDrawable="@drawable/progressbar"/>
+
+    <WebView
+        android:id="@+id/webview"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"/>
+</LinearLayout>
+
--- a/mobile/android/search/res/values/search_dimens.xml
+++ b/mobile/android/search/res/values/search_dimens.xml
@@ -1,16 +1,17 @@
 <!-- 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/. -->
 
 <resources>
     <!-- The height of the search bar is also used to offset the PreSearchFragment
          and PostSearchFragment contents -->
     <dimen name="search_bar_height">65dp</dimen>
+    <dimen name="progress_bar_height">3dp</dimen>
 
     <!-- We use background padding to create space around the cards -->
     <dimen name="card_background_padding_x">15dp</dimen>
     <dimen name="card_background_padding_y">3dp</dimen>
 
     <!-- To create the padding we see around the content of each
          card, we need to account for the padding of the background -->
     <dimen name="card_padding_x">38dp</dimen>