From 68c6f4cd95baefe3198dca9e8bd7d1ee3732f576 Mon Sep 17 00:00:00 2001
From: Maxime Biais <maxime.biais@gmail.com>
Date: Tue, 16 Feb 2016 14:37:53 +0100
Subject: [PATCH] Squashed 'libs/editor/' changes from 69aaa8a..4832795

4832795 Merge pull request #280 from wordpress-mobile/issue/remove-analytics-dependency
dd68ccd Merge pull request #283 from wordpress-mobile/issue/282-localize-js-strings
bec42a8 moved the brackets back into the JS code
2cd15b7 fix #282: localize JS strings by using js-java interface nativeState
a64d3a7 Merge pull request #270 from wordpress-mobile/issue/242-image-container-lower-api
5339a22 Fixed some EditorFragment lint issues
ab084be Used a String constant for naming the native state JS interface
0789069 Merge branch 'develop' into issue/242-image-container-lower-api
430d3a4 Merge pull request #278 from wordpress-mobile/issue/183-accessibility
e4b9e76 s/Strike/Strikethrough/
ec9c6e9 Image thumbnail content description
cda2f22 Make editor title i18nizable
9d92717 Merge branch 'develop' into issue/242-image-container-lower-api
67dec0b Change page title for accessibility
3167e9a add contentDescription to format bar buttons in the visual and legacy editors
29cea46 Fixed issue where compatibility upload overlays would sometimes consume a tap without triggering a tap callback for the associated image
7b26aa7 Fixed a display issue on API<19 where a dark blank space would appear below an uploading or failed image
b95d94a Added a dark semi-transparent overlay for API<19 for uploading and failed images
9e1863f Revert to non-compatibility image container styling once image has begun uploading
34523c0 Hide the compatibility image upload overlay if an image upload fails and re-display it on resume
abf7260 Use block instead of inline-block for the image container on pre=KitKat Android
86a985c On pre-KitKat Android, show an 'Uploading...' overlay instead of a progress bar for uploading images
047082a Updated ZSSEditor to get the current Android API level on init

git-subtree-dir: libs/editor
git-subtree-split: 48327953c76c593daefe93a16e41323631de5b73
---
 .../android/editor/EditorFragment.java        | 48 +++++++++++++++--
 .../android/editor/RippleToggleButton.java    |  7 ++-
 .../src/main/res/layout-w360dp/format_bar.xml | 10 +++-
 .../src/main/res/layout-w380dp/format_bar.xml | 10 +++-
 .../src/main/res/layout-w600dp/format_bar.xml |  8 +++
 .../main/res/layout/dialog_image_options.xml  |  3 +-
 .../src/main/res/layout/format_bar.xml        | 10 +++-
 .../res/layout/fragment_edit_post_content.xml |  8 +++
 .../src/main/res/values/strings.xml           | 20 +++++++
 .../editor-common/assets/ZSSRichTextEditor.js | 53 ++++++++++++++++---
 libs/editor-common/assets/android-editor.html |  2 +-
 libs/editor-common/assets/editor-android.css  | 52 ++++++++++++++++++
 12 files changed, 211 insertions(+), 20 deletions(-)

diff --git a/WordPressEditor/src/main/java/org/wordpress/android/editor/EditorFragment.java b/WordPressEditor/src/main/java/org/wordpress/android/editor/EditorFragment.java
index a2f3fc54d363..ad019edb4e84 100755
--- a/WordPressEditor/src/main/java/org/wordpress/android/editor/EditorFragment.java
+++ b/WordPressEditor/src/main/java/org/wordpress/android/editor/EditorFragment.java
@@ -24,6 +24,7 @@
 import android.view.View;
 import android.view.ViewGroup;
 import android.view.inputmethod.InputMethodManager;
+import android.webkit.JavascriptInterface;
 import android.webkit.URLUtil;
 import android.webkit.WebView;
 import android.widget.ToggleButton;
@@ -59,6 +60,7 @@ public class EditorFragment extends EditorFragmentAbstract implements View.OnCli
     private static final String ARG_PARAM_CONTENT = "param_content";
 
     private static final String JS_CALLBACK_HANDLER = "nativeCallbackHandler";
+    private static final String JS_STATE_INTERFACE = "nativeState";
 
     private static final String KEY_TITLE = "title";
     private static final String KEY_CONTENT = "content";
@@ -366,13 +368,18 @@ private void setupFormatBarButtonMap(View view) {
     }
 
     protected void initJsEditor() {
-        if(!isAdded()) {
+        if (!isAdded()) {
             return;
         }
 
         String htmlEditor = Utils.getHtmlFromFile(getActivity(), "android-editor.html");
+        if (htmlEditor != null) {
+            htmlEditor = htmlEditor.replace("%%TITLE%%", getString(R.string.visual_editor));
+        }
 
         mWebView.addJavascriptInterface(new JsCallbackReceiver(this), JS_CALLBACK_HANDLER);
+        mWebView.addJavascriptInterface(new NativeStateJsInterface(getActivity().getApplicationContext()),
+                                        JS_STATE_INTERFACE);
 
         mWebView.loadDataWithBaseURL("file:///android_asset/", htmlEditor, "text/html", "utf-8", "");
 
@@ -1123,7 +1130,7 @@ private void updateVisualEditorFields() {
     private void hideActionBarIfNeeded() {
 
         ActionBar actionBar = getActionBar();
-        if (getActionBar() != null
+        if (actionBar != null
                 && !isHardwareKeyboardPresent()
                 && mHideActionBarOnSoftKeyboardUp
                 && mIsKeyboardOpen
@@ -1138,8 +1145,8 @@ private void hideActionBarIfNeeded() {
     private void showActionBarIfNeeded() {
 
         ActionBar actionBar = getActionBar();
-        if (getActionBar() != null && !actionBar.isShowing()) {
-            getActionBar().show();
+        if (actionBar != null && !actionBar.isShowing()) {
+            actionBar.show();
         }
     }
 
@@ -1261,4 +1268,37 @@ private void applyFormattingHtmlMode(ToggleButton toggleButton, String tag) {
             mSourceViewContent.setSelection(selectionEnd + endTag.length());
         }
     }
+
+    private class NativeStateJsInterface {
+        Context mContext;
+
+        NativeStateJsInterface(Context context) {
+            mContext = context;
+        }
+
+        @JavascriptInterface
+        public String getStringEdit() {
+            return mContext.getString(R.string.edit);
+        }
+
+        @JavascriptInterface
+        public String getStringTapToRetry() {
+            return mContext.getString(R.string.tap_to_try_again);
+        }
+
+        @JavascriptInterface
+        public String getStringUploading() {
+            return mContext.getString(R.string.uploading);
+        }
+
+        @JavascriptInterface
+        public String getStringUploadingGallery() {
+            return mContext.getString(R.string.uploading_gallery_placeholder);
+        }
+
+        @JavascriptInterface
+        public int getAPILevel() {
+            return Build.VERSION.SDK_INT;
+        }
+    }
 }
diff --git a/WordPressEditor/src/main/java/org/wordpress/android/editor/RippleToggleButton.java b/WordPressEditor/src/main/java/org/wordpress/android/editor/RippleToggleButton.java
index 4d932b322e0b..fd2ac6110142 100644
--- a/WordPressEditor/src/main/java/org/wordpress/android/editor/RippleToggleButton.java
+++ b/WordPressEditor/src/main/java/org/wordpress/android/editor/RippleToggleButton.java
@@ -21,12 +21,11 @@ public class RippleToggleButton extends ToggleButton {
     private Paint mStrokePaint;
 
     public RippleToggleButton(Context context) {
-        super(context);
-    }
+        this(context, null);
+   }
 
     public RippleToggleButton(Context context, AttributeSet attrs) {
-        super(context, attrs);
-        init();
+        this(context, attrs, 0);
     }
 
     public RippleToggleButton(Context context, AttributeSet attrs, int defStyle) {
diff --git a/WordPressEditor/src/main/res/layout-w360dp/format_bar.xml b/WordPressEditor/src/main/res/layout-w360dp/format_bar.xml
index 6b498fe0baee..fc2eb283e5f0 100644
--- a/WordPressEditor/src/main/res/layout-w360dp/format_bar.xml
+++ b/WordPressEditor/src/main/res/layout-w360dp/format_bar.xml
@@ -37,6 +37,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_media"
                 android:background="@drawable/format_bar_button_media_selector"/>
 
             <org.wordpress.android.editor.RippleToggleButton
@@ -44,6 +45,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_bold"
                 android:background="@drawable/format_bar_button_bold_selector"
                 android:tag="@string/format_bar_tag_bold"/>
 
@@ -52,6 +54,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_italic"
                 android:background="@drawable/format_bar_button_italic_selector"
                 android:tag="@string/format_bar_tag_italic"/>
 
@@ -60,6 +63,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_quote"
                 android:background="@drawable/format_bar_button_quote_selector"
                 android:tag="@string/format_bar_tag_blockquote"/>
 
@@ -68,6 +72,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_ul"
                 android:background="@drawable/format_bar_button_ul_selector"
                 android:tag="@string/format_bar_tag_unorderedList"/>
 
@@ -76,6 +81,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_ol"
                 android:background="@drawable/format_bar_button_ol_selector"
                 android:tag="@string/format_bar_tag_orderedList"/>
 
@@ -84,6 +90,7 @@
                 style="@style/FormatBarButton"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_link"
                 android:background="@drawable/format_bar_button_link_selector"
                 android:tag="@string/format_bar_tag_link"/>
         </LinearLayout>
@@ -100,6 +107,7 @@
             style="@style/FormatBarHtmlButton"
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
+            android:contentDescription="@string/format_bar_description_html"
             android:background="@drawable/format_bar_button_html_selector"/>
     </LinearLayout>
-</LinearLayout>
\ No newline at end of file
+</LinearLayout>
diff --git a/WordPressEditor/src/main/res/layout-w380dp/format_bar.xml b/WordPressEditor/src/main/res/layout-w380dp/format_bar.xml
index bd8e1f900644..17d9f6d26358 100644
--- a/WordPressEditor/src/main/res/layout-w380dp/format_bar.xml
+++ b/WordPressEditor/src/main/res/layout-w380dp/format_bar.xml
@@ -31,6 +31,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_media"
             android:background="@drawable/format_bar_button_media_selector"/>
 
         <org.wordpress.android.editor.RippleToggleButton
@@ -39,6 +40,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_bold"
             android:background="@drawable/format_bar_button_bold_selector"
             android:tag="@string/format_bar_tag_bold"/>
 
@@ -48,6 +50,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_italic"
             android:background="@drawable/format_bar_button_italic_selector"
             android:tag="@string/format_bar_tag_italic"/>
 
@@ -57,6 +60,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_quote"
             android:background="@drawable/format_bar_button_quote_selector"
             android:tag="@string/format_bar_tag_blockquote"/>
 
@@ -66,6 +70,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_ul"
             android:background="@drawable/format_bar_button_ul_selector"
             android:tag="@string/format_bar_tag_unorderedList"/>
 
@@ -75,6 +80,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_ol"
             android:background="@drawable/format_bar_button_ol_selector"
             android:tag="@string/format_bar_tag_orderedList"/>
 
@@ -84,6 +90,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:layout_weight="1"
+            android:contentDescription="@string/format_bar_description_link"
             android:background="@drawable/format_bar_button_link_selector"
             android:tag="@string/format_bar_tag_link"/>
 
@@ -99,6 +106,7 @@
             style="@style/FormatBarHtmlButton"
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
+            android:contentDescription="@string/format_bar_description_html"
             android:background="@drawable/format_bar_button_html_selector"/>
     </LinearLayout>
-</LinearLayout>
\ No newline at end of file
+</LinearLayout>
diff --git a/WordPressEditor/src/main/res/layout-w600dp/format_bar.xml b/WordPressEditor/src/main/res/layout-w600dp/format_bar.xml
index dcceb2ea9321..58f907084759 100644
--- a/WordPressEditor/src/main/res/layout-w600dp/format_bar.xml
+++ b/WordPressEditor/src/main/res/layout-w600dp/format_bar.xml
@@ -34,6 +34,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_media"
                 android:background="@drawable/format_bar_button_media_selector"/>
         </LinearLayout>
 
@@ -47,6 +48,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_bold"
                 android:background="@drawable/format_bar_button_bold_selector"
                 android:tag="@string/format_bar_tag_bold"/>
 
@@ -55,6 +57,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_italic"
                 android:background="@drawable/format_bar_button_italic_selector"
                 android:tag="@string/format_bar_tag_italic"/>
 
@@ -77,6 +80,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_link"
                 android:background="@drawable/format_bar_button_link_selector"
                 android:tag="@string/format_bar_tag_link"/>
         </LinearLayout>
@@ -91,6 +95,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_ul"
                 android:background="@drawable/format_bar_button_ul_selector"
                 android:tag="@string/format_bar_tag_unorderedList"/>
 
@@ -99,6 +104,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_ol"
                 android:background="@drawable/format_bar_button_ol_selector"
                 android:tag="@string/format_bar_tag_orderedList"/>
 
@@ -107,6 +113,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_quote"
                 android:background="@drawable/format_bar_button_quote_selector"
                 android:tag="@string/format_bar_tag_blockquote"/>
         </LinearLayout>
@@ -121,6 +128,7 @@
                 style="@style/FormatBarButtonTablet"
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
+                android:contentDescription="@string/format_bar_description_html"
                 android:background="@drawable/format_bar_button_html_selector"/>
         </LinearLayout>
     </LinearLayout>
diff --git a/WordPressEditor/src/main/res/layout/dialog_image_options.xml b/WordPressEditor/src/main/res/layout/dialog_image_options.xml
index 9b471f50832f..ead7e7653d37 100644
--- a/WordPressEditor/src/main/res/layout/dialog_image_options.xml
+++ b/WordPressEditor/src/main/res/layout/dialog_image_options.xml
@@ -21,6 +21,7 @@
 
             <ImageView
                 android:id="@+id/image_thumbnail"
+                android:contentDescription="@string/image_thumbnail"
                 android:layout_width="@dimen/image_settings_dialog_thumbnail_size"
                 android:layout_height="@dimen/image_settings_dialog_thumbnail_size"
                 android:layout_marginLeft="@dimen/image_settings_dialog_thumbnail_left_margin"
@@ -150,4 +151,4 @@
             android:layout_marginLeft="@dimen/image_settings_dialog_input_field_start_margin"
             android:visibility="gone"/>
     </LinearLayout>
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/WordPressEditor/src/main/res/layout/format_bar.xml b/WordPressEditor/src/main/res/layout/format_bar.xml
index a8e3e57a09af..5fb9c4fabe21 100644
--- a/WordPressEditor/src/main/res/layout/format_bar.xml
+++ b/WordPressEditor/src/main/res/layout/format_bar.xml
@@ -42,6 +42,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_media"
                     android:background="@drawable/format_bar_button_media_selector"/>
 
                 <org.wordpress.android.editor.RippleToggleButton
@@ -49,6 +50,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_bold"
                     android:background="@drawable/format_bar_button_bold_selector"
                     android:tag="@string/format_bar_tag_bold"/>
 
@@ -57,6 +59,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_italic"
                     android:background="@drawable/format_bar_button_italic_selector"
                     android:tag="@string/format_bar_tag_italic"/>
 
@@ -65,6 +68,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_quote"
                     android:background="@drawable/format_bar_button_quote_selector"
                     android:tag="@string/format_bar_tag_blockquote"/>
 
@@ -73,6 +77,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_ul"
                     android:background="@drawable/format_bar_button_ul_selector"
                     android:tag="@string/format_bar_tag_unorderedList"/>
 
@@ -81,6 +86,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_ol"
                     android:background="@drawable/format_bar_button_ol_selector"
                     android:tag="@string/format_bar_tag_orderedList"/>
 
@@ -89,6 +95,7 @@
                     style="@style/FormatBarButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_link"
                     android:background="@drawable/format_bar_button_link_selector"
                     android:tag="@string/format_bar_tag_link"/>
             </LinearLayout>
@@ -106,6 +113,7 @@
             style="@style/FormatBarHtmlButton"
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
+            android:contentDescription="@string/format_bar_description_html"
             android:background="@drawable/format_bar_button_html_selector"/>
     </LinearLayout>
-</LinearLayout>
\ No newline at end of file
+</LinearLayout>
diff --git a/WordPressEditor/src/main/res/layout/fragment_edit_post_content.xml b/WordPressEditor/src/main/res/layout/fragment_edit_post_content.xml
index 76fa09b2caa3..c94a08e5e27e 100644
--- a/WordPressEditor/src/main/res/layout/fragment_edit_post_content.xml
+++ b/WordPressEditor/src/main/res/layout/fragment_edit_post_content.xml
@@ -100,6 +100,7 @@
                     style="@style/LegacyToggleButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_bold"
                     android:background="@drawable/legacy_format_bar_button_bold_selector" />
 
                 <ToggleButton
@@ -107,6 +108,7 @@
                     style="@style/LegacyToggleButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_italic"
                     android:background="@drawable/legacy_format_bar_button_italic_selector" />
 
                 <ToggleButton
@@ -114,6 +116,7 @@
                     style="@style/LegacyToggleButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_underline"
                     android:background="@drawable/legacy_format_bar_button_underline_selector" />
 
                 <ToggleButton
@@ -121,6 +124,7 @@
                     style="@style/LegacyToggleButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_strike"
                     android:background="@drawable/legacy_format_bar_button_strike_selector" />
 
                 <ToggleButton
@@ -128,6 +132,7 @@
                     style="@style/LegacyToggleButton"
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
+                    android:contentDescription="@string/format_bar_description_quote"
                     android:background="@drawable/legacy_format_bar_button_quote_selector" />
 
                 <Button
@@ -135,6 +140,7 @@
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
                     android:minWidth="@dimen/legacy_format_bar_height"
+                    android:contentDescription="@string/format_bar_description_link"
                     android:background="@drawable/legacy_format_bar_button_link_selector" />
 
                 <Button
@@ -142,6 +148,7 @@
                     android:layout_width="wrap_content"
                     android:layout_height="fill_parent"
                     android:minWidth="@dimen/legacy_format_bar_height"
+                    android:contentDescription="@string/format_bar_description_more"
                     android:background="@drawable/legacy_format_bar_button_more_selector" />
             </LinearLayout>
         </HorizontalScrollView>
@@ -151,6 +158,7 @@
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:minWidth="@dimen/legacy_format_bar_height"
+            android:contentDescription="@string/format_bar_description_media"
             android:background="@drawable/legacy_format_bar_button_media_selector" />
     </LinearLayout>
 
diff --git a/WordPressEditor/src/main/res/values/strings.xml b/WordPressEditor/src/main/res/values/strings.xml
index 88a5130a0669..5da604328659 100644
--- a/WordPressEditor/src/main/res/values/strings.xml
+++ b/WordPressEditor/src/main/res/values/strings.xml
@@ -9,6 +9,10 @@
     <string name="delete">Delete</string>
     <string name="save">Save</string>
     <string name="discard">Discard</string>
+    <string name="edit">Edit</string>
+    <string name="tap_to_try_again">Tap to try again!</string>
+    <string name="uploading">Uploading…</string>
+    <string name="uploading_gallery_placeholder">Uploading gallery…</string>
 
     <string name="alert_insert_image_html_mode">Can\'t insert media directly in HTML mode. Please switch back to visual mode.</string>
     <string name="alert_html_toggle_uploading">You are currently uploading media. Please wait until this completes.</string>
@@ -61,4 +65,20 @@
         <item>Full Size</item>
     </string-array>
 
+    <!-- Accessibility - format bar button descriptions -->
+    <string name="format_bar_description_bold">Bold</string>
+    <string name="format_bar_description_italic">Italic</string>
+    <string name="format_bar_description_underline">Underline</string>
+    <string name="format_bar_description_strike">Strikethrough</string>
+    <string name="format_bar_description_quote">Block quote</string>
+    <string name="format_bar_description_link">Insert link</string>
+    <string name="format_bar_description_more">Insert more</string>
+    <string name="format_bar_description_media">Insert media</string>
+    <string name="format_bar_description_ul">Unordered list</string>
+    <string name="format_bar_description_ol">Ordered list</string>
+    <string name="format_bar_description_html">HTML mode</string>
+    <string name="visual_editor">Visual editor</string>
+    <string name="image_thumbnail">Image thumbnail</string>
+
+
 </resources>
diff --git a/libs/editor-common/assets/ZSSRichTextEditor.js b/libs/editor-common/assets/ZSSRichTextEditor.js
index 511240a39aa2..3e8b3109f468 100755
--- a/libs/editor-common/assets/ZSSRichTextEditor.js
+++ b/libs/editor-common/assets/ZSSRichTextEditor.js
@@ -41,6 +41,9 @@ ZSSEditor.caretInfo = { y: 0, height: 0 };
 // Is this device an iPad
 ZSSEditor.isiPad;
 
+// The API level of the native host (Android)
+ZSSEditor.androidApiLevel;
+
 // The current selection
 ZSSEditor.currentSelection;
 
@@ -76,6 +79,8 @@ ZSSEditor.init = function() {
 
     rangy.init();
 
+    ZSSEditor.androidApiLevel = nativeState.getAPILevel();
+
     // Change a few CSS values if the device is an iPad
     ZSSEditor.isiPad = (navigator.userAgent.match(/iPad/i) != null);
     if (ZSSEditor.isiPad) {
@@ -850,11 +855,22 @@ ZSSEditor.insertImage = function(url, remoteId, alt) {
 ZSSEditor.insertLocalImage = function(imageNodeIdentifier, localImageUrl) {
     var progressIdentifier = this.getImageProgressIdentifier(imageNodeIdentifier);
     var imageContainerIdentifier = this.getImageContainerIdentifier(imageNodeIdentifier);
-    var imgContainerStart = '<span id="' + imageContainerIdentifier+'" class="img_container" contenteditable="false" data-failed="Tap to try again!">';
+
+    if (ZSSEditor.androidApiLevel > 18) {
+        var imgContainerClass = 'img_container';
+        var progressElement = '<progress id="' + progressIdentifier + '" value=0 class="wp_media_indicator" contenteditable="false"></progress>';
+    } else {
+        // Before API 19, the WebView didn't support progress tags. Use an upload overlay instead of a progress bar
+        var imgContainerClass = 'img_container compat';
+        var progressElement = '<span class="upload-overlay" contenteditable="false">' + nativeState.getStringUploading()
+                              + '</span><span class="upload-overlay-bg"></span>';
+    }
+
+    var imgContainerStart = '<span id="' + imageContainerIdentifier + '" class="' + imgContainerClass
+                            + '" contenteditable="false" data-failed="' + nativeState.getStringTapToRetry() + '">';
     var imgContainerEnd = '</span>';
-    var progress = '<progress id="' + progressIdentifier+'" value=0  class="wp_media_indicator"  contenteditable="false"></progress>';
     var image = '<img data-wpid="' + imageNodeIdentifier + '" src="' + localImageUrl + '" alt="" />';
-    var html = imgContainerStart + progress+image + imgContainerEnd;
+    var html = imgContainerStart + progressElement + image + imgContainerEnd;
 
     this.insertHTML(this.wrapInParagraphTags(html));
     this.sendEnabledStyles();
@@ -941,6 +957,12 @@ ZSSEditor.setProgressOnImage = function(imageNodeIdentifier, progress) {
         imageNode.addClass("uploading");
     }
 
+    // Revert to non-compatibility image container once image upload has begun. This centers the overlays on the image
+    // (instead of the screen), while still circumventing the small container bug the compat class was added to fix
+    if (progress > 0) {
+        this.getImageContainerNodeWithIdentifier(imageNodeIdentifier).removeClass("compat");
+    }
+
     var imageProgressNode = this.getImageProgressNodeWithIdentifier(imageNodeIdentifier);
     if (imageProgressNode.length == 0){
           return;
@@ -1023,6 +1045,9 @@ ZSSEditor.markImageUploadFailed = function(imageNodeIdentifier, message) {
     if (imageProgressNode.length != 0){
         imageProgressNode.addClass('failed');
     }
+
+    // Delete the compatibility overlay if present
+    imageContainerNode.find("span.upload-overlay").addClass("failed");
 };
 
 /**
@@ -1046,6 +1071,9 @@ ZSSEditor.unmarkImageUploadFailed = function(imageNodeIdentifier, message) {
     if (imageProgressNode.length != 0){
         imageProgressNode.removeClass('failed');
     }
+
+    // Display the compatibility overlay again if present
+    imageContainerNode.find("span.upload-overlay").removeClass("failed");
 };
 
 /**
@@ -1432,7 +1460,8 @@ ZSSEditor.applyVideoPressFormattingCallback = function( match ) {
     var posterSVG = '"wpposter.svg"';
     // The empty 'onclick' is important. It prevents the cursor jumping to the end
     // of the content body when `-webkit-user-select: none` is set and the video is tapped.
-    var out = '<video data-wpvideopress="' + videopressID + '" webkit-playsinline src="" preload="metadata" poster=' + posterSVG +' onclick="" onerror="ZSSEditor.sendVideoPressInfoRequest(\'' + videopressID +'\');"></video>';
+    var out = '<video data-wpvideopress="' + videopressID + '" webkit-playsinline src="" preload="metadata" poster='
+           + posterSVG +' onclick="" onerror="ZSSEditor.sendVideoPressInfoRequest(\'' + videopressID +'\');"></video>';
 
     out = out + '<br>';
     return out;
@@ -1552,7 +1581,8 @@ ZSSEditor.applyImageSelectionFormatting = function( imageNode ) {
         sizeClass = " small";
     }
 
-    var overlay = '<span class="edit-overlay" contenteditable="false"><span class="edit-content">Edit</span></span>';
+    var overlay = '<span class="edit-overlay" contenteditable="false"><span class="edit-content">'
+                  + nativeState.getStringEdit() + '</span></span>';
 
     if (document.body.style.filter == null) {
         // CSS Filters (including blur) are not supported
@@ -1991,8 +2021,8 @@ ZSSEditor.insertGallery = function( imageIds, type, columns ) {
 }
 
 ZSSEditor.insertLocalGallery = function( placeholderId ) {
-    var container = '<span id="' + placeholderId + '" class="gallery_container">[Uploading gallery...]</span>';
-
+    var container = '<span id="' + placeholderId + '" class="gallery_container">['
+                    + nativeState.getStringUploadingGallery() + ']</span>';
     this.insertHTML(this.wrapInParagraphTags(container));
 }
 
@@ -2791,6 +2821,15 @@ ZSSField.prototype.handleTapEvent = function(e) {
             return;
         }
 
+        if (targetNode.className.indexOf('upload-overlay') != -1 ||
+            targetNode.className.indexOf('upload-overlay-bg') != -1 ) {
+            // Select the image node associated with the selected upload overlay
+            var imageNode = targetNode.parentNode.getElementsByTagName('img')[0];
+
+            this.sendImageTappedCallback( imageNode );
+            return;
+        }
+
         if ( ZSSEditor.currentEditingImage ) {
             ZSSEditor.removeImageSelectionFormatting( ZSSEditor.currentEditingImage );
             ZSSEditor.currentEditingImage = null;
diff --git a/libs/editor-common/assets/android-editor.html b/libs/editor-common/assets/android-editor.html
index 13b6281d6603..b0bb0f5e99e1 100755
--- a/libs/editor-common/assets/android-editor.html
+++ b/libs/editor-common/assets/android-editor.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>ZSSRichTextEditor</title>
+    <title>%%TITLE%%</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
     <script src="jquery-2.1.3.min.js"></script>
     <script src="js-beautifier.js"></script>
diff --git a/libs/editor-common/assets/editor-android.css b/libs/editor-common/assets/editor-android.css
index ceed82213289..e3d0aef8701a 100644
--- a/libs/editor-common/assets/editor-android.css
+++ b/libs/editor-common/assets/editor-android.css
@@ -16,6 +16,8 @@ video::-webkit-media-controls-fullscreen-button {
     display: none;
 }
 
+/* --- API<19 workarounds --- */
+
 /* Used only on older APIs (API<19), which don't support CSS filter effects (specifically, blur). */
 .edit-container .edit-overlay-bg {
     position: absolute;
@@ -25,4 +27,54 @@ video::-webkit-media-controls-fullscreen-button {
     height: 100%;
     display: block;
     background-color: rgba(0, 0, 0, 0.5);
+}
+
+/* Used only on older APIs (API<19), where using inline-block is buggy and sometimes displays a very small container */
+span.img_container.compat {
+    display: block;
+}
+
+/* Used on API<19 to darken the image so that the 'uploading' and 'retry' overlays can still be seen when the image is
+light */
+.img_container .upload-overlay-bg {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    display: block;
+    background-color: rgba(0, 0, 0, 0.5);
+}
+
+/* When the upload-overlay-bg element is present (API<19), a bug is exposed where the img_container is slightly larger
+than its containing image. The upload-overlay-bg is larger as well, leaving a dark line below the image. By setting
+display:block on the image and setting a width limit we get around this issue. */
+
+.img_container .upload-overlay-bg ~ img.uploading {
+    display:block;
+    max-width:100%;
+}
+
+.img_container .upload-overlay-bg ~ img.failed {
+    display:block;
+    max-width:100%;
+}
+
+/* Used only on older APIs (API<19) instead of a progress bar for uploading images, since the WebView at those API
+   levels does not support the progress tag */
+.img_container .upload-overlay {
+    position: absolute;
+    top: 50%;
+    -webkit-transform: translateY(-50%);
+    width:100%;
+    z-index: 100;
+    min-width: 60px;
+    font-family:OpenSans;
+    font-size:20px;
+    font-weight:600;
+    text-align: center;
+    text-shadow: 0px 1px 2px rgba(0,0,0,.06);
+    color: white;
+}
+
+.img_container .upload-overlay.failed {
+    visibility: hidden;
 }
\ No newline at end of file